Whitespace

Benjamin Surkyn — Tue, 13 Jan 2009 10:47:18 +0000

Just came across an article explaining what is white space and how to use it in modern web design. A must read!

Why not to use Flash

Benjamin Surkyn — Fri, 19 Jan 2007 09:46:30 +0000

Here’s a nice article on the demise of Flash. Like the author, I too love flash sites. But there are also a lot of reasons why not to use it:

Annoying Flash Ads
Not search engine friendly
Bad usability (each flash site has its own way of operating it)
Not accessible to people with disabilities
Downward compatibility issues
Overburdening of the developers
No or bad internationalization
Not compliant with any open standard.

Two extra reasons I want to add, though: Since you need a plug-in to be able to see a flash site (over 50% of the internet users has one installed), you’re reliable on an extra piece of software which isn’t guaranteed to be available. So people might not be able to view your site at all. So reason number 9, you can’t be 100% sure your message reaches your target audience. And secondly, there is no way to enable tracking as you can with HTML sites.

Conclusion: Flash looks good and tempting but only use it as you would use an image, not as a complete site or for critical parts, like your navigation structure.

Building accessible sites

Benjamin Surkyn — Mon, 05 Apr 2004 16:50:07 +0000

You can’t read any webstandard oriented site, without reading something about accessibility. But what makes a site accessible? Here are a few guidelines to follow:

Provide a text-alternative for all non-text items, like images, forms, objects, … This can most of the time be done with a alt="" or a title="" depending on the tag. If more than a few words are required, you can use longdesc="" for images.
Don’t use colors to make something clear and keep a good contract between your colors. If you ask for a user to click the green link, this will make not much sense to a visually impared visitor (blind, colorblind, …). Use color only for your layout, not for your content.
Use correct markup. This means if you have a paragraph, use
if you have a title, use a header (replace the * with a number from 1 to 9, depending on the importance of the header). Don’t use tags like or ~~. They don’t describe what the text means, but how it should look. Use CSS for this.~~

Set the document’s language. It a program tries to read a Dutch page in English, the listener will probably not understand what’s on the page. Therefore set your language, use lang="" in your HTML and xml:lang="" in your XML and XHTML pages. You can define these attributes in most elements. Do so for your and every tag that is in a different language than your main page. Also if you have abbreviations like HTML or CSS, provide the full text also, the first time the abbreviation or acronym occurs. Use the and tags for it.

Ensure that tables have enough and the correct markup. This means using for data cells and for header cells. You can also use the summary="" attribute for the tag. And tags like , and to group your table header, body and footer respectively. To group columns, use and .If you use new technology on your page, make sure there is also a version available without this technology. Make sure the navigation you use is not only accessible or a mouse. Events like onmouseclick(); is therefore not a good option. Also provide accesskey to your most important links using the accesskey="" attribute. The text in a hyperlink (text in the container) should be meaningfull. Use text like: “next chapter” or “download program x” and not “here”. Use a tableless layout. Tables should only be used to show tablular data, like a list of members or results,… Provide labels for your forms. Use the tag, where for refers to the name of the form-element it relates to. Also make sure that the order of your formfields is logical, so that you can use the tab key to navigate. The tabindex="" attribute can help you with that. Using W3C compliant code, will help making your page accessible more easy. If your pages have all of these points covered, your site will mostlikely be accessible. If you want to check this, try surfing to your site using Opera and disabling color, author stylesheets and images. If you page is still readable, it is accessible. Maybe a final note. Your listing in search engines will also benifit from making your site accessible.

On UX » Accessibility

Whitespace

Why not to use Flash

Building accessible sites