Pixel Thread

An article I’ve written on designing websites to work effectively at 1024×768 screen resolution is published in this month’s .Net magazine and on bbctraining.com (which also includes sample template files to download): Designing sites for 1024×768

I’ve been watching the development of Magento over the past year or so, and so far it ticks all the right boxes.
But the feature that clinches the deal for me is the one page checkout: instead of taking the user through a sequence of pages until they finally reach order confirmation, Magento does it all in one place, through the use of expandable / collapsible page sections. Neat.

Magento

This little orange rectangle with the curved radio wave lines has become ubiquitous on the web. A quick google doesn’t reveal much other than the fact that it was used by Mozilla and adopted by Microsoft in 2005 .

The symbol has made the transition from design concept to becoming part of the web’s lexicon - quite a big move. It’s used in the address bar in Firefox, on the tool bar in IE7 (slightly adapted) and all over the web beside links to RSS feeds.

I’d be interested to know who originally designed it, and what the design process was - were there earlier contenders that got ruled out?

sIFR uses javascript, CSS and Flash to replace short passages of plain text with text rendered in any typeface - regardless of whether or not your users have that font installed on their systems.

sIFR 2.0: Rich Accessible Typography for the Masses

Update: sIFR 3 is now available here , although still in beta I think…

Just continuing from the post below where I argue that in some respects there are conflicts between SEO and usability, I came to this post on A List Apart (an indispensible website about websites) via wikipedia, which gives some good examples of how making your site accessible can also make it more visible to search engines.

High Accessibility Is Effective Search Engine Optimization

The ALA post was made over a year ago, but it’s as relevant as it ever was.

SEO and usability are generally mutually compatible. Often what’s good for usability is good for SEO and what’s good for SEO is good for usability. But when it comes to the creation of written content, SEO and usability don’t get on.

Firstly here are some examples of SEO and usability being friends:

1. Readable URLs

URLs that are logical and readable are great for SEO and for usability. Users can see what they might expect in a page and search engines can see what a page might contain and rank it accordingly. E.G.

Good: bbctraining.com/televisionCourses is pretty clear as to the what the content of the page will be, but…

Bad: bbctraining.com/courseDetails.asp?tID=1179&cat=2781 is much less obvious.

Search engines have had problems with query strings (starts with a ‘?’ and uses ‘&’ to separate values) in URLs for a long time.

Query strings imply that the page is dynamically generated, i.e. it’s created from a database when a user visits the page. Dynamic pages are also considered to be less search engine friendly - it’s easier to generate lots of SEO spam dynamically.

The value of the relevant words in the URL will also be diluted because the URL is much longer, so there is less importance attributed to them.

Query strings in URLs are also not very user friendly - they don’t tell you what the URL is about.

2. Semantic Mark-Up

Semantic is code that can be understood by humans as well as machines. It’s great for SEO and for usability.

The code behind RSS feeds is generally semantic, the tag describes the content, eg Bang Your Drum.

More on writing semantic mark up here

3. Valid Code

Code that validates with the W3C Markup Validation Service, makes search engines happy and means that your code is most likely to work for as many users on as many different platforms as possible.

4. Separation of style from content

The separation of content and style, that’s replaced the ubiquitous HTML tables over the past few years has made the code of web pages infinitely more readable. CSS files control page styles and layouts while content sits in the HTML files.

Great for SEO, search engines can easily read the content of a page, and great for usability - pages are quicker to load and are more accessible on a wider range of devices e.g. mobiles, blackberries etc.

5. Logical Information Architecture

Having a broad subject area at the top of a site, moving down into a narrower topics as the user gets deeper into the site will tell search engines that the site is covering a lot of detail. In terms of usability, it’s also a logical way of structuring a site for users to find information.

A site map - a page with links to all other pages on the site - will help search engines index your site and users find content.

6. Small File Sizes

File sizes should always be under 150K, larger files don’t get fully indexed by search engines, and are slower to load. So small files = good for SEO, good for usability.

But when it comes to written content there are SEO and usability incompatibilities

In written content, SEO encourages:

• keyword repetition on a page, making text read less easily and longer than necessary
• content created for search engines rather than users - there are companies that will supply pages and pages of search engine friendly text on any subject imaginable to boost a site’s search rankings
• creation of extra pages in a site, purely for the benefit of search engines
• inclusion of extra detail, where really extra detail often isn’t needed

All this text is cluttering up the web. People are having to wade through unnecessary content to get to what they really want. The battle to rule the search engine results pages is damaging the web.

Of course it is possible to create content that’s valuable, useful and search friendly, but it’s always cheaper and easier for a company to buy in content that they know will boost their ranking.