Is your web site mobile-friendly? Ask Google.
Category: Web Design
Setting up a WordPress site
Setting up a Wordpress site isn’t difficult, but there are a lot of steps. As something of an early Christmas present, iThemes has put together an extensive checklist breaking the process down into 7 easy-to-follow sections.
- Basic WordPress Development
- WordPress Security
- WordPress Backup
- WordPress SEO
- General WordPress
- WordPress Launch
- WordPress Maintenance
There are 88 items in all. Under the security section, iThemes recommends its own plugin. As we’ve written before, we would offer different advice. But otherwise, their list is terrific.
Top 10 design factors that influence credibility
A poorly designed web site undermines your credibility. The research is clear.
Three studies were conducted to ascertain how quickly people form an opinion about web page visual appeal. In the first study, participants twice rated the visual appeal of web homepages presented for 500 ms each. The second study replicated the first, but participants also rated each web page on seven specific design dimensions. Visual appeal was found to be closely related to most of these. Study 3 again replicated the 500 ms condition as well as adding a 50 ms condition using the same stimuli to determine whether the first impression may be interpreted as a ‘mere exposure effect’ (Zajonc 1980). Throughout, visual appeal ratings were highly correlated from one phase to the next as were the correlations between the 50 ms and 500 ms conditions. Thus, visual appeal can be assessed within 50 ms, suggesting that web designers have about 50 ms to make a good first impression.
50 milliseconds. That’s it. You literally have an instant to make a good first impression. But how do you make a good first impression?
The Standford University Web Credibility Project spent three years and interviewed 4,500 people to find out. The project offers a Top 10 List of design factors that influence credibility.
- Make it easy to verify the accuracy of the information on your site.
- Show that there’s a real organization behind your site.
- Highlight the expertise in your organization and in the content and services you provide.
- Show that honest and trustworthy people stand behind your site.
- Make it easy to contact you.
- Design your site so it looks professional (or is appropriate for your purpose).
- Make your site easy to use — and useful.
- Update your site’s content often (at least show it’s been reviewed recently).
- Use restraint with any promotional content (e.g., ads, offers).
- Avoid errors of all types, no matter how small they seem.
Only two — items 6 and 7 — are specifically related to visual design. But we know these two factors have an outsized influence because users tend to base their initial impressions on what they see. Fifty milliseconds is not nearly enough time to read. Quite simply, bad design (like bad photos) makes you look bad. You’re better off with nothing.
The Internet in 3D, seriously
It’s not often that something genuinely new comes to the Web. Not new new, anyway. Sure, things evolve, often slowly and usually incrementally. A few years ago the big browsers started supporting javascript in a (mostly) standardized way, and that paved the oxcart trail for point-and-shoot libraries like jQuery and Scriptaculous, which sparked a wave of awful sliders on top of every other Web site.
But times are changin’. And with more powerful Web browsers, a new generation of HTML, and killer new javascript libraries, full-on 3D is now a reality.
I use a fixed full-screen canvas and sync up scrolling with a 3D camera. The scene is mapped to CSS pixels and CSS perspective is locked to the camera. Once HTML, CSS 3D and WebGL are all in sync there’s a truckload of linear algebra and easing functions to keep you amused. The code is based on the platform I kludged together for the christmas demo, at times a mess of ad hoc demo formulas and spaghetti, though robust enough in the parts that count.
Check out the how-to. It’s jaw-dropping Wow (at least for Web design geeks).
Fonts on the web
For experienced Internet hands, the subtleties of font usage on the Web is probably old hat. But for many newcomers, it’s often a sour pill to swallow – the fonts you use on your computer every day cannot be used on your Web site.
In the earliest days of the Web, the number of fonts available to Web designers counted about five. Beautiful typography was non-existent. The source of the problem lied in the fact that when a designer specified a font – Arial, Helvetica or Times New Roman, for example – that font had to be installed on the computer of the user visiting the web site or the font simply couldn’t be displayed. It was impossible to know who might visit your Web site and what fonts he or she might have installed.
A solution was first proposed in 1998 with CSS2, but the techniques never caught on. It wasn’t until 2009 that a robust solution finally gained traction: the CSS3 Font Module, which allowed designers to send font files down the pipe just like images.
But there was a catch. A few actually, and not small ones.
For one, fonts are made by font designers who earn their living from making fonts. Many would not be able to eat if their products flourished freely across the Internet. Browser support was inconsistent, too, which made consistent display impossible at times.
By late 2010, however, most of those issues had been solved and a new era of Web typography was in full swing. Yet still the problem remained: the fonts you used on your computer every day could not be used on your Web site.
The reasons were two-fold. The first was mostly a technical issue. Many, if not all, of the fonts on your computer are optimized for print, not digital display. So they just don’t look right on the Web. They are too small, too rough. The other reason was a legal one: you only have the right to use, not distribute, the fonts on your computer.
Free public libraries
So what is the answer? Since web typography has spread, a handful of services have come along to help solve this issue. The two most notable ones are Google Fonts and Font Squirrel. The first offers a library of fonts freely available to use in all your digital projects. The second offers an easy way to package fonts you own into easily shareable web formats. And both are free.
Spend some money
It’s still likely, however, that most of the fonts you love are not available from the above services because of copyright issues. You can probably find them from paid services such as
Now that you have tons of fonts at your fingertips, take a little time and learn about font pairing and selection.
Death to the slider
If you asked us what is the number 1 trend in Web design today, this would be it.
… Either it be a simple blurred photo in the background with a heading centered in the middle, or a more elaborate one such as the illustrated hero area in the Realtii.com site above, hero areas are quickly replacing sliders as the new attention-grabbers, and they are becoming increasingly creative and elaborate.
I’ve never been a big fan of the slider, mostly because it turns the user into a passive viewer. On the web, everyone wants to drive; no one wants to be a passenger. Bigger, bolder, better artwork will leave memorable impressions. Sliders often struggle in that task.
Flash goes HTML 5
Expect to be hearing a lot about this in the future.
The latest buzz is that Flash goes HTML5 i.e. the work done in Flash can be imported to HTML5 using the new Creative Suite called Flash CS6 that will work on iPad and iPhone as well as Android and it will also support Windows 8.
A year or so ago, pundits were predicting the death of Flash. That seems unlikely to be the case now. The devil, of course, is in the details. Expect a lot of experimentation over the next few months.
Flash CS6 uses the CreateJS open source framework for the output of animations in Flash. A Flash animation can be exported to the CreateJS framework working within the Canvas element of HTML5 which is being called as the Toolkit for CreateJS. It will help to smooth the transition to the world of JavaScript from ActionScript development. It is thus being predicted that HTML5 has a great future in the world of web development and Web designing.
NYT pay what?!
The New York Times, the newspaper of all newspapers, chose St. Patrick’s Day to embark on its second attempt to charge for its online content. In Canada, the paywall went into effect March 17. For the rest of the world, the wall goes up March 28.
Times publisher Arthur Sulzberger said the new digital subscriptions were “an important step that we hope you will see as an investment in The Times, one that will strengthen our ability to provide high-quality journalism to readers around the world and on any platform.”
The Times has tried to charge for content before. That experiment, known as TimesSelect, proved a bruising lesson for The Grey Lady. Far from making money, the move largely withdrew the paper from online conversations, as bloggers and other opinion makers stopped linking to and writing about stories behind the paywall. The Times quit TimesSelect less than two years later.
If The Times is hoping that things turn out differently this time, it’s going to need an overflowing cupful of St Patrick’s blessings. Felix Salmon in Wired Magazine unpacked the whole subscription deal, and after doing some back-of-the-envelope math, pronounced the whole thing “weird.” Not to mention expensive.
The New York Times paywall cost $40 million to build.
Subscriptions are complex. Your first 20 stories per month are free. As are stories that are linked from off site, such as Facebook, blogs, etc. After that the subscription fee kicks in: $15 per month for unlimited Web access, more if you want to use the smartphone and/or iPhone apps.
“So by my back-of-the-envelope math, the paywall won’t even cover its own development costs for a good two years, and beyond that will never generate enough money to really make a difference to NYTCo revenues,” Salmon said.
But that, in a nutshell, is the fragile state of the journalism world. Even the very best of the very best must make more money from their online ventures. Even if a solid revenue model is not exactly obvious, nor particularly profitable, something must be done to battle the long-term trends, which are clear — revenue from print advertising is falling and unlikely to reverse course; something must cover the shortfalls. If not the Web, then what?
The newspaper world is watching with a sharp eye. Because like California, and the canary in the coal mine, the way of The New York Times foreshadows the direction of the industry as whole.
Design mistakes
An Oldie but Goodie from Mr Nielsen: Top Ten Mistakes in Web Design
BONUS LINK: Web Pages That Suck
DOUBLE BONUS: Worst Websites of 2010
Clients from hell
Wednesday’s site of the day: clientsfromhell.net.
It’s true. We all have our moments, designers and clients alike. Clients tend to want “unprofessional” solutions, like flying text and cutesy animated gifs, while designers often suggest overly elaborate answers to simple design challenges.
But in reading through Clients From Hell, it’s surprising that none of those anecdotes come anywhere close to the horror stories I’ve heard from clients about designers. Those tales are truly stunning.
One recent example: A friend in Thailand last year hired an expat-run Web design shop to build his company’s e-commerce site. After months — months! — of delays, the site still doesn’t work. And the company now wants to bill additional hours to “fix” the problems.
Holy Mackerel!
Or how about designers that go AWOL a week before launch date. Or call their clients vulgar names and insult them to their face.
Yet still there is no http://webdesignersfromhell.net/.
Have you had any particularly egregious run-ins with Web designers?
I can build the Web site, as long as you promise not to ask for flying text.