Archive for August, 2007
published by Dan in Web Development | Web Technology | Website Standards
There’s a new version of HTML coming - HTML 5. It includes additional tags in structure, semantics, embedded media, and interactivity, that will make the lives of web developers easier and makes HTML more apt for use with some of the fundamental concepts of Web 2.0.
Structure
New elements in structure include section, header, footer, nav and article. Elliot Harold of the Polytechnic University gave a brief description of the basic construct that each element corresponded with.
- section: A part or chapter in a book, a section in a chapter, or essentially anything that has its own heading in HTML 4
- header: The page header shown on the page; not the same as the head element
- footer: The page footer where the fine print goes; the signature in an e-mail message
- nav: A collection of links to other pages
- article: An independent entry in a blog, magazine, compendium, and so forth
The new elements answer one of the aims of HTML 5, which is to have a more structured way of managing header levels. In the past each header like sidebars, footers, headers, navigation menus, main content sections, and individual stories needed to be marked with the div element (<div> </div>). With the new elements used the div element is no longer necessary and developers can do away with it.
Source: New Elements in HTML 5 by Prof. E. Harold
published by Dan in Web Development | Web Technology | Website Design
Remember the time when most computer screens were only able to render 256 colors accurately? At that time web designers were adviced to limit themselves to using “web safe colours” if they want their designs not to go to waste. Because of this what designers only used were 6 shades each of red, green and blue, which made a total of 216 colours belonging in the web safe colour palette. Although computer screens were capable of displaying 256 the shades of colour which operating systems usually used already were taken out of the web safe palette.
Thanks to improvements technology, which were mostly driven by the demand for better video game graphics and as well as digital photos, computer displays started supporting 16-bit colour and 24-bit colour, called TrueColor. Because of this defining “web safe colours’ is no longer needed. Web designers now have a freedom of choice as to whatever shade they may want to use for the websites being developed.
Although most users may not really notice the difference and merely think that some websites are better than others the ability to use so many hues allow web designers to give more attention to details, making the experience richer and more pleasing to users. As technology progresses forward web designers can also look forward to more choices, not just in color, but in almost all aspects affecting website design.
published by Dan in Usability | Website Design
Downloads - Avoid asking visitors to download. Whether the downloads be for files they might want to keep or to install software in order to view data/information, you should make it a priority for visitors to be able to view the information without needing to download anything. What this means is that you should provide an HTML version of your content as much as possible. You can provide other formats for download but give your visitors a choice so that they can avoid downloading anything if they don’t want to. In addition provide a big print this page button for relevant information so that they wouldn’t need to save anything but print out copies of lists or forms or any other relevant information they might want to keep a copy of.
Content - Since elderly users tend to read everything written in your site make a visit to your site less time consuming by providing concise content. If you want to you can even provide a summarized version of your content and give visitors a choice on whether they want to view the shorter or more detailed version.
Wording - When giving instructions make sure you make the instructions clear, detailed, and (again) free of technical terms.
Font Size - Use big fonts (at least size 12) and adequate spacing (between each letter, line and paragraph). Since it is inevitable that you will get visitors that will still find the default font hard to read then make sure to provide a way for these visitors to resize the font easily just by clicking on an icon(s). Make sure that the icon you use is placed in a highly visible portion of the page and that the icon’s function is very obvious. To make sure that its function is understood though accompany it with a brief description and a link to a page describing in detail what it is supposed to do.
Overall Design - Remember simplicity is the key. This goes for both text and illustrations. Use colors that are easy on the eye and wouldn’t cause too much eye strain.
published by Dan in Usability | Website Design
After analyzing the results Webcredible came up with some recommendations in order to accommodate the needs of elderly internet surfers. Here’s an expanded version of their recommendations.
Scroll bars - If possible avoid using scroll bars. Organize your content so as to fit the screen. However, since there are instances wherein scrolling is really necessary then make sure to find a way to indicate to your visitor that the page contains more information that can be accessed through scrolling. Draw attention to the scroll bar. How you plan to do this is up to you.
Technical Terms - Avoid using technical terms as much as possible. If you do have to use technical terms explain the meaning of the term and give an example when needed. Illustrations are also useful.
Links - Make each link easily identifiable by using a combination of the usual techniques such as changing its color, underlining it, emphasizing it by using a bold or italicized font, and having it change in some obvious manner when the mouse hover over it. Note though that consistency is important and the way you emphasize each link should be the same all throughout the website. Furthermore make sure the link color changes after being clicked to help visitors identify which links/pages have been visited. Aside from this make use of the advantage “attention-grabbing features” on the page such as the headings, pictures, icons, instructions and bullets pose by making the into links. After all those in the older group were found to have a tendency to assume that they are links and click on them. It would be beneficial to both your visitors and you if their assumptions were correct since it will lead them to explore more pages in your site.
published by Dan in Usability | Website Design
5. Link identification - Test results showed that people from the older age group were more likely to mistakenly click on parts of the pages that weren’t links. Everyone in the older age group also stated the importance of having visited links change in colour so as to help them remember which ones they have clicked before.
6. Attitude towards downloading - Those in the older aged group had a more negative attitude towards downloading expressing worry over viruses and any other harmful thing their computer might get. In comparison, those in the younger age group didn’t seem to mind downloading at all.
7. Search Usage - More people in the older age group used the search function to help them navigate. Despite not using the search function much, those in the younger age group was in agreement with the older age group regarding the need for a search function that will make all of the website’s content searchable.
8. Speed in reading and task completion - Not surprisingly, those in the older age group needed more than twice as much time to finish tasks. This is probably due to fact that they not only read the content more slowly but also more thoroughly.
9. Design preference - Those in the older age group showed a preference for big fonts. They had a hard time reading text displayed in anything smaller than a 12-point type. Those in the older age group also preferred a screen resolution of 800×600 over 1024×768. Aside from liking everything to be “bigger” those in the older age group also preferred simpler web designs.
published by Dan in Usability | Website Design
Last post I mentioned in passing the factors or issues wherein there was a marked difference between the older group and the younger group. Today I will discuss each factor.
1. Assigning blame - Older people were found to blame themselves more than the web design when encountering difficulty while surfing. They generally blamed their lack of technical knowledge and assumed that it was their fault as compared to the younger ones wherein most did not vocally express blame either towards themselves or the websites.
2. Emotional reaction - People of the older group also had a more emotional reaction, both in the positive and negative sense, while surfing websites as opposed to those in the younger group wherein the only incidence where strong emotions were evident was when they talked about a negative part of the website.
3. Mental models - The test showed that more people from the older group failed to grasp the concept of a scroll bar and didn’t scroll down several times when they needed to. This could be due to the fact that the older generation is more used to books and the concept of scrolling down is not something they can easily assimilate as opposed to younger folks who grew up in the computer age where scroll bars are commonplace.
4. Technical language - As expected those in the older group had a harder time understanding technical jargon. The younger group who grew up and are more exposed to words like homepage, URL, browser, minimise, and maximise of course did not need to struggle to understand them. Older folks though needed to have these words explained or to se their common sense to put them into context and figure out exactly what they had to do.
Test Results to be continued…
published by Dan in Usability | Website Design
Webcredible, a group of people that profits from doing what they love - making sure that websites are as usable and accessible to all visitors, made comparative usability tests between older users (65 yrs and above) younger users (40 years and below). Note that to even the field all users have been regular (at least once a week) users for more than a year so that any difficulties on their part while surfing can not be attributed to lack of experience in surfing the internet.
After the tests the data were analaysed and the results showed a marked difference in the needs between the two user groups. Usability factors/issues they compared and saw a marked difference included:
- Assigning blame
- Emotional reaction
- Mental models
- Technical language
- Link identification
- Attitude towards downloading
- Search usage
- Speed in reading and task completion
- Design preference - referring to simplicity, font size and screen resolution
The results, which I will discuss in detail in later posts, showed that there are plenty of seemingly small and trivial design “flaws” that can be tweaked to make website more usable to older people. In the succeeding posts you will see just what it is you can do to improve your website design to answer the needs of older visitors while at the same time still retaining the good look that will attract the younger generations. After all catering to the needs of older people doesn’t mean turning of the young ones. It just means giving your web design a little more thought to be most effective to a wider audience.
published by Dan in Usability | Website Design
The UK has an aging population with the last census showing that there are more people in the retirement age bracket than those under sixteen. For online businesses these numbers translate into a huge yet mostly untapped audience. It is common knowledge that the younger generations feel more at ease with computers and the internet while a lot of older people shy away from taking advantage of the opportunities the internet offers. What this means is that if online businesses want to be able to entice older people to spend more time on the internet and get their business then they have to make sure that websites are designed with the needs of older people in consideration. Attention to detail is a must and web designers that ignore usability concerns will simply not succeed in drawing the crowd they want to.
When it comes to the web design considerations for older people you might be surprised at some of the factors that matter a lot to them. After all some of the factors seem inconsequential to those with whom the use of computers and the internet is second nature. On my next post I will be citing some factors you should consider when designing a website if you wish to make it “age-friendly”. Till then I encourage you to egg your parents and grandparents into surfing some sites and try to observe what turns them off or gives them the most difficulty. It will be an interesting exercise and you can compare your observations with the factors to be mentioned in my succeeding posts.
published by Dan in Accessibility | Web Technology
While the top three alternative browsers are really cool they do not suit the needs of people with disabilities. Listed below are two free alternative browsers special designed to answer the needs of visually impaired people.
Simply Web – Simply Web 2000 is a software-based speech synthesizer that can be used as a stand alone “Talking Web Browser”. It can be downloaded for free at their website. The caveat though is that you would need a screen reader to make full use of it. Any screen reader would do but it is of course best used with the Simply Talker 2000 screen reader. The Simply Taker 2000 is sold for US$100 each. Language supported is English. Works best with Internet Explorer 5.0.
Emacspeak “The Complete Audio Desktop” – “Emacspeak is a speech interface that allows visually impaired users to interact independently and efficiently with the computer.” Features include a whole slew of speech-enabled applications (157 applications in all!) with everything from documentation applications to messaging and even Google clients like Blogger and Google Reader. They even have speech-enabled programming applications! Emacspeak can be downloaded for free from their website. Language supported is English. Works in Linux (Debian, Mandrake, Red Hat, Slackware, SuSE and Turbo distros).
To find out more about different alternative browsers for people with disabilities you can visit the Alternative Web Browsing page of the W3C Web Accessibility Initiative.
published by Dan in Tools & Resources | Web Technology | Website Standards
Three words - Opera, Firefox and Safari.
Each of the three major alternative browsers have a lot to boast about. To show how distinguished each one is though we can simply say that Opera is the oldest of the three, having survived since 1996 even with the web-wide dominion of the Internet Explorer; Firefox is hailed as the most successful and is plays a major role in slowly eroding IE’s market share; and Safari, which came out when OSX was first released and rocked the Mac world with its elegance and ease-of-use, is now making inroads with Windows users.
Being a Linux user, I personally use and prefer Firefox. However, for those who want to try each one of these alternative browsers here’s a quick summary to help you compare each one.
Opera
Website: http://www.opera.com/
Features: Web, Email, RSS, Chat, Skinnable, Phishing Filter, Widgets, BitTorrent
Import Capability: Bookmarks from Internet Explorer, Firefox, Safari, Netscape, or generic HTML file; Mail from Outlook Express, Netscape, Thunderbird, Apple Mail, Eudora, or generic mbox file.
Platforms: Windows, Mac and Linux. Mobile versions available (Opera Mobile and Mini)
Cost: Free
Firefox
Website: http://www.mozilla.com/en-US/firefox/
Features: Web, RSS headlines, Email and full RSS via Thunderbird, Extensions for chat, Customization, Skinnable, Phishing Filter
Import Capability: All settings from Internet Explorer, Opera, Mozilla, Netscape, bookmarks from generic HTML file.
Platforms: Windows, Mac and Linux.
Cost: Free
Safari
Website: http://www.apple.com/safari/
Features: Web, RSS
Import Capability: Bookmarks from any browser.
Platforms: Windows and Mac
Cost: Free
Resource: Alternative Browser Alliance
0845 838 7448 
