Website Layout Ideas

When professional website design companies are showcasing their designs, the layout generally refers to the home page. The reason for this is that the home page is the landing page for anyone visiting by typing in your domain name.

The home page is the essense of your website. So many people are still not au fait or in touch with all the different navigation elements and clues to hyperlinks. Some never know to scroll down a page, or click to go to another page. They certainly may not understand that they can search your site by typing in the box, or they can view a site map via a footer link. But the home page tries to invite people to click to the main categories of information where more focused aside menus will help people to read more.

Landing Page Structure by Matthieu Dejardins

Landing Page Structure by Dejardins

The prime area, that which is called “above the fold” is the most important part of your website. Above the fold refers to newspapers meaning the area that you can read before the newspaper is unfolded. On websites, of course, that most important area is that 6oo-7oo px length of screen space that you can see when the website loads into the browser.

The header can often take up half of this space, especially in designer websites. This may be a big picture or a block of many small images with links to content. Blocks are often filled with advertisements. This is all understandable. This premium space may only have 5 seconds of the visitors time to grab their attention. So if they’re going to fail, then better to have a bounce click on an advertisement, than nothing at all.

The problem is that people, those actual living breathing intelligent human visitors, not the statistical bounces – they actually prefer to see some real content straight away.

Their visits bounce (click away in 5 seconds) because nothing appealed to them.

Hence the large picture,which studies have shown to incite curiosity just enough to scroll down and see what is there. The small pictures, are because people do like pictures, and therefore may click on them.

The excerpt is often used on large website home pages, because people get bored. Can you write one article that is consistently interesting to repeat visitors? A small site usually has one thing to say, and says it on the home page, so this doesn’t apply.

Traditional Website Layouts

The Internet is still very young, so young in fact that many older people have still never learned how to use a computer let alone the Internet. For those who have, like my youngest son who started using a computer when he was 2 years old,¬† this is inconceivable, because it seems so easy to them. In the between, there are people who love computers and use them constantly by choice.There are people who hate them but use them at work, and are competant on them. And those who don’t know, don’t much care, but they are useful sometimes.

Any learning experience is a set of rules.
When someone changes the rules we get upset.

Why do we get upset? Because we knew something and now we have to research to find out what the change was, and learn something new. If you think road rage is bad, just watch someone trying to use Vista or Windows 7 after “knowing” Windows XP. It’s frustrating to go looking for notepad and not find it where it was. It’s similar to when someone stays in your house and kindly does the dishes. For weeks after you can’t find the grater, or your favourite knife. It is so annoying!

Websites are no different. When website designers hide our blue hyperlinks behind black text, or tuck all our hyperlinks behind images – people are going to react in different ways. Some will explore and some just can’t be bothered. So you need to decide now, how much “non traditional design” is important to you.

Layout is about Usability first – then Design (just my opinion)

Government and company websites follow traditional layouts so that the majority of their visitors can work out what to do easily. Layout is more than just boxes and graphics though. I believe it’s about making complex navigation easy for the viewer, by bringing to the forefront that which is important and not cluttering up the page with links that are not needed there.

To get ideas for website layouts, Google that phrase “website layout ideas”. There are some really fantastic websites, on page 1 of this search result, that have well written information and multiple examples of website layout that you can scroll through to get ideas. I looked, they are great.

The best thing I find to do is to take a notepad and write out what I want, starting with the multiple pages and then sketching in the home page. After that the website develops as you literally create its articles and information  pages. After about 6 months, the home page will probably need to be redesigned, and the theme will probably need to be tweaked a bit. But if your size, initial layout, colours and navigation elements are rock steady, and your logo or identification header is perfect, few people will know your website layout has changed.

google japan older home page 2008

Google home page japan 2008 (Photo : Gen Kanai)

You need a graphic that identifies your site, maybe a sidebar or two, an article canvas space, and a footer. Why get too complicated.

Look at Google. Could you have a more simple, but effective layout? They have refined it to be more and more simple, as the contrast with this Japanese 2008 version shows. However simple, ALL the relevant links are there or easily accessible. They feature a different graphic on special days. The focus of the page is never diluted with anything that doesn’t belong there. Considering that Google links to every important website on the Internet, I reckon it’s a triumph for usable minimalist design!


Google Website Layout

Enhanced by Zemanta

Tagged with:

Filed under: Website Ideas