For years web designers have had to deal with compatibility issues across multiple browsers and for just as many years have had to accept content being displayed in slightly different ways. This is unlikely to change soon but the differences are becoming fewer and fewer. To make the most of this you need to choose a browser in which to make your design / functionality work the way you want it to and then compromise fix it in Internet Explorer other browsers.
Let there be light!
- disabling images
- not using a mouse
- using a screen reader
- using a text-to-speech device
Now while it is near impossible to include in a design every aspect that could affect the way someone experiences a website, there are things that can be done to improve the experience where possible.
“Graceful degradation means that your Web site continues to operate even when viewed with less-than-optimal software in which advanced effects don’t work.”
– Fluid Thinking, by Peter-Paul Koch
Graceful degradation is finally being addressed as the wrong way to approach the problem – design utilising the most advanced features of a browser and where a browser is not capable of implementing those features, a compromise needs to be made. The testing of older browsers is often done towards the end of the development cycle. More often than not this results in a less pleasing site for those using older browsers. This mainly affects IE6 which is still widely adopted throughout the corporate world. Using this approach focuses on using the latest technologies and not considering the experience for people with older browsers, disabilities or with certain functionalities disabled.
So how do you add bells and whistles to a site while maintaining focus on usability and experience? The answer is in the design process. By first focusing on what ‘everyone’ will see and use, you can address the broadest issues. Bear in mind that a good experience with a site does NOT mean pretty pictures (although they can help) and a person can have a good experience on a simple site, for no other reason than being able to do what they want to do with ease and no interference.
“Progressive enhancement uses web technologies in a layered fashion that allows everyone to access the basic content and functionality of a web page, using any browser or Internet connection, while also providing those with better bandwidth or more advanced browser software an enhanced version of the page.”
There is a far more tasty explaination using an M&M that defines the same point:
Good for SEO too?
When you write rich, semantic (X)HTML you are making life easier for search engines to index your site. It is written in a predictable, organised fashion and as such means the search-bots are more likely to pick up on any extra information as well as index it in the way it is intended. If you think about a search-bot ‘seeing’ in a similar way to a screen-reader, they generally only read text and links and with progressive enhancement you have given them both the best opportunity to get the most out of your site.
It’s difficult to keep this in mind when you want to use newer technologies to make your life easier. CSS3’s rounded corner declaration or shadow facility would be great, but what happens when you meet a browser that doesn’t support it? As long as the contrast of text to background is suitable and the corners are not an integral part of the design then they will just have square boxes and normal text – something that doesn’t affect their experience too much and won’t affect the usability in any way.
White text on a white background using the shadow declaration on the other hand… well… only search engines will see that.Tweet