Too many web sites are slow, clumsy, bloated and cruel.
Slow – because they require so many server calls and contain so much non-textual material;
Clumsy – because the structure of the pages and navigation is badly thought out, and poorly presented and edited;
Bloated – because material is piled on without thought of how much storage space it takes and how long it takes to download, and
Cruel – because the limitations of those who arenʼt members of the privileged élite are given little, if any, consideration when sites are developed.
There are ways to reverse this and make them work better for everyone; web sites can be nimble, handy, frugal and kind.
Nimble
Designs can work well in any context, download quickly, be small in size, easy to edit, easy to post and easy to read.
These five lines are essential to any site that is going work to on all devices and be accessible – every page should begin with them.
<!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<meta name=viewport content="width=device-width,user-scalable=yes">
Each matters because they tell the browser what it should do with this document because:
1 – it is html (!doctype html)
2 – that the primary language is english (lang=en)
3 – works with a multilanguage character set (charset=utf-8)
4 – it scales to the device it is on
(viewport content="width=device-width,user-scalable=yes)
lang=en may be changed if the site is in another language, so a text-to-speech reader would know how to pronounce the words.
Handy
A site should be easy to find your way around in and simple to search. Navigation should have good contrast with the background and be at least 14px in size.
- Long text should have:
- Line height between 1.3 and 1.6em.
- Font-size between 16px and 18px, depending on the x-height of the font.
- A text width between 30 and 35em.
- Don’t justify the text. It makes large word spaces and they disrupt reading.
Frugal
Web sites should take little time and effort to build and be easy to edit. They can be small in size, so they take few resources to store and download. Many of us are fortunate to live in high bandwidth regions, but there are large portions of the world that do not.
Text as the primary way to communicate has many advantages over images, audio and video – it takes little space, is inexpensive to produce, is easy to correct and edit, is quick to access at your own pace, and is easy to review. It also has a long history as a way to share knowledge, tradition and information across time, space and different cultures.
Kind
Sites can be designed with others in mind so they load quickly and are legible, readable and accessible.
Many people, especially, those who are old, poor, disabled, illiterate and live in rural areas, have limited access to the high speed internet and, if they do, it is often expensive.
So when you put something other than text in html up on a web site – pdfs, videos, audio files, animations, photographs, graphics – make sure:
- They add something text can not, otherwise it is a waste of peoplesʼ time, money and bandwidth.
- That content in them is accessible to those who can’t see or hear it and that it will work on different devices.
- And you feel comfortable that your site is only available to those with a broadband connection, excluding more than 80% of the people in the world, who do not.