So we have 10 seconds, and design matters

After a long period I decided that my personal homepage needed an update. And so many opinions exist on the perfect layout of a webpage. Recent studies point out that I am not the only one considering to update. A large percentage of users tend to change their webpage every two and half years. Is this dramatic? I think it is not, redesign is a big job. But when you read that already in 2010 about 42% of online shoppers base their decision on the first impression of the website it looks like the design of your landing page matters a lot. I am wondering will that be the same for personal pages?

Web design guru Jakob Nielsen states: “Users often leave Web pages in 10–20 seconds, but pages with a clear value proposition can hold people’s attention for much longer”. Ten seconds is not much. So I read more on the arguments and research results of Nielsen, for example about the F-shape in webpage reading. Reading all this you may consider not to work on your personal page any longer. Am I going to succeed in keeping my readers longer? But there is hope. Nielsen writes: “Only after people have stayed on a page for about 30 seconds does the curve become relatively flat.”

Are you still with me?

Writing for the web is different. Like with blogs we see that we need to get to the point very fast. No long introductions, but directly posing your statement, and then in short blocks telling the why and how. Knowing that people are not going to read long blocks of text on your first page you need to get their attention fast. Short paragraphs, using bold texts to point out what is important, and headline like headings.

But back to the design of the ideal page. I start of with the first question: What is the perfect width of your webpage? At least this is one of the first things to code in my CSS or body-tag. In the starting days, when I wrote my first HTML for Mosaic and Lynx there was not that much choice, monitors and resolution dictated the width. Now the range is wider and more complex. Smartphones, tablets, the mega-screens, and the average home user screen. When it comes to this subject I also refer to Nielsen who refers to StatCounter in coming to the conclusion that after 8 years this screen size has been dethroned. We should now design for 1440 pixels wide. And although 1024×768 is not any longer the standard, we should keep in mind that a website that gets wider then about 1024 pixels becomes more difficult to scan quickly. At least, if you do not divide it into columns, like newspapers do.

The Variables

So there is much to think about when it comes to the perfect landing page: the different grid systems, should the menu bar be left or right on my page, shall I use responsive web design?  Two things seemed important to me: the 960 grid, and responsive design. The blogs by Ryan Boudreaux that appeared this summer at TechRepublic to my opinion are a great starting point when it comes to responsive design. The 960 grid is perfectly explained on their own website.

All in all there are a lot of variables to deal with; ten seconds, 1440 pixels, 12 columns preferably spread over 960 pixels. And above all we are confronted with a visitor that wants to be entertained and on the other hand behaves like a tot.

I cannot come to a different conclusion: web design is challenging!

To be continued…

NB. A small note to this blog, in the first paragraph I mention the 42% for the shopping. Although this 42% gets refered to a lot, including some recent mentions, I can trace its source back to 2010, a long time ago in Internet terms. I have decided to crowdsource this question at Quora and LockerGnome. So far without results, many people read the question, and people even start to follow, but no answers yet.

Advertisements

One thought on “So we have 10 seconds, and design matters

  1. Pingback: Yes, I am new… Some light reading | Elwin's Weblog

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s