Anup Saund

🇬🇧British Expat 🇨🇦Vancouver ❤ Gardening 💰Founder of gitSQL

Tag: Internet

Website Design Trends 2010 / 2011?

Website trends have stabilised over the years thanks to companies such google, wikipedia, amazon and facebook to name a few.

Web developers, designers and users are generally more aware of user interface design – what works and what doesn’t?

Here are a few examples of websites which I have found that seem to follow a ‘trend’.

BBC

BBC

BBC Website

ebuyer

ebuyer

ebuyer Website

xfactor

xfactor

Xfactor Website

Sunday Times

The Sunday Times

The Sunday Times Website

Royal Mail

royalmail

Royal Mail Website

Tesco Direct

tescodirect

Tesco Direct Website

BBC iPlayer

iplayer

BBC iPlayer Website

What do they have in common?

1) Oversized animated header

2) Large typography for website headings

3) Column grid design for the entire website (as used by newspaper editors such as The Sunday Times)

4) Oversized footer section which contains a sitemap

5) Search bar located at the top right

It seems to me that a lot of websites are adopting the oversized footer section of the website as their navigation area. BBC and ITV both have oversized footer sections which contain links through to internal pages. The links are displayed in columns which can be read quickly by the reader (Pacing). Is it easier for the visitor to see links on the footer?

Wikipedia recently completed a usability study which showed that the search bar located at the top right was the most intuitive place that a user would look for when searching a website. (See their explanation here). We can see that the BBC and Sunday Times websites have search bars at the top right of their websites. Does this mean that we should be putting search bars at the top right?

Oversized animated headers seem popular too – as the content of the header changes with a transiation. In a way – this shows the visitor more content during their visit without them having to click anywhere. This has got to be a plus? no? Especially if a visitor only stays for a few seconds. Are oversized, animated headers better than static headings?

Typography on websites have become extremely popular over recent years- especially with designers. I imagine this is because website developers now have the tools available to place designer typography onto websites. Text replacement seems common on some websites as a means of adopting dynamic typography driven by CMS. Is this better practice than using web fonts?

Familiarity

… do I need to say any more?

Most of my google analytics statistics show that the average website visitor will leave a website on the homepage – without ever clicking through onto other pages.

Hmm – maybe I need to make better websites? *gulp*

Saying that – I imagine this is a general issue with all websites with respects to converting visitors. There’s an old analogy I like to use.

We normally have to head out to the grocery store to get bread and milk. Supermarkets place their milk and bread at the back of the store so we have to go past everything else first. If we’re not on our guard we reach the checkout with several items along with the milk.

A good website will “Give them Milk”… – a reason to come back.

Perhaps we need to be giving users familiar design (like the supermarkets do)

What do you think?

PRE tags, the quick way to keep formatting

I get asked quite often if there is a way to show CODE on a website, with it’s formatting in place?

The short answer is <pre>

It can output free text (i.e. non server side code) in a pre-formatted way. Yep, PRE = Pre-formatted.

On top of that, Preformatted also renders the php print_r() output in a nicely nested unordered list, which is great for debug purposes;

e.g.

&nbsp; echo "
<pre>";&nbsp;&nbsp; &nbsp;print_r($arr);&nbsp; echo "</pre>
"; 

I am sure there are other uses for the <pre> tag too, I have just scratched the surface.

Give it a go – let me know if you find other uses for it.

Thanks.

Powered by WordPress & Theme by Anders Norén