Web standards, Semantic XHTML, Cascading Style Sheets…to some this all may sound like the new hype in Internet technology, but it’s not. This is the culminated technology that will give structure, accessibility and worldwide availability to our websites. Let us first go back a little bit in history to get a better understanding of things.
The Internet, WWW & HTML.
HTML was created to create and organize text and articles. To format and share these documents among many people, HTML was used to markup these documents and structure them. It was not meant for multimedia, it was not meant for the hardcore marketing and design tasks as it is today. Since the boom of the Internet and its popularity today, the web designer has been forced to sort of work around this limitation, hack together solutions and apply band-aid after band-aid in order to “Make things work”. Doing various techniques like using Tables for layout, image slicing for design, huge amounts of unnecessary spacer gifs and font tags in order to format the content people wanted to see.
Now as you have it, many websites which do not use web standards often employ a strategy using tables for website layout. While this has worked for a long time it has its downfalls and cons. For one, usually these sites use tables to structure information, images to apply design and it boosts up the size of the website considerably.
Not only does the size remain large but the site is slower to load and the code is a complete mess and hard to maintain. A table-based layout design is not SEO, which means search engine optimized. To top it all over many browsers and different devices do not render these sites in the same fashion and often break in many. The accessibility and availability of these sites was not optimal.
Web Standards are designed to:
Deliver the greatest benefits to the greatest number of web users.
Ensure the long-term viability of any web document.
Simplify code and lower the cost of production.
Deliver sites that are accessible to more people and more types of Internet devices
Continue to function correctly as browsers evolve, and as new devices come to market.
CSS (Cascading Style Sheets) is used to separate out the design of a website from the content of the website. It then allowed the HTML to be used as it was originally designed to be used which was to semantically structure the document. You would then have the HTML file to just markup and outline the content of the website document. The CSS file would format this HTML and display the content in the way it was supposed to look. Thus keeping the code clean, simple and much better structured.
How is this good for your sites visitors?
Files will download faster (less code, no overall tables, valid code).
The content is accessible to wider range of users (normal users, blind users, vision impaired users, dyslexic users, motor skill impaired users etc).
The content is accessible to wider range of devices (screen readers, browsers, text based browsers, handhelds, search robots, printers, fridges etc)
It allows users to customize site appearance (style switchers).
Provides print friendly versions for all pages.
So what’s the benefit of Web standards based design? Well in using CSS for design and XHTML for markup things get a bit more interesting. Using this model your file size will shrink dramatically, usually by 50%. I’ve seen this many times in converting sites to conform to web standards. The load time isMUCH faster as a result of not having to process loads of table layout code, the web browser has to only load the cascading style sheet once thus speeding up the loading of the website.
How is this good for your clients?
The code is easier to maintain (Much less code, more modular).
Cheaper hosting costs (less code, less bandwidth to download).
Better search engine ranking (SEO: Search Engine Optimization).
Content can be styled different easily by editing the style sheet.
Provides users with customization.
Provides print versions without replicating content.
Improves accessibility (essential for Government clients).
Less device dependent coding (stable across wider variety of devices).
Provides a competitive edge as more of the world moves to using Web Standards.
Having the CSS file for all the design, this makes maintaining the site and changing any aspect of the design incredibly easy, it means editing (usually) just this one file and the changes take effect over the entire site. No more manually editing each page to make a change to the design or content.
Why use accessible code?
Allows your site to be accessible to a larger audience (vision impaired, motor skill impaired, cognitive impaired).
Allows your site to be accessed by wider range of devices (handhelds, screen readers, text browsers, search engines)
Is a requirement for Federal and State Government sites.
CSS is also backwards compatible so to speak, it will render in every browser under the sun almost. This means it will come up in Netscape, internet explorer, PDA devices, and text-based devices depending on the CSS support. This does not mean it will show up the same, but the CONTENT will be displayed at least in case the browser can’t understand the style sheet. From PC’s to Macs, from PDA’s to Cell phones the content can be accessed and that what websites are for.
Being that XHTML sites are completely structure and content, search engines LOVE them! Completely SEO (Search Engine Optimized). The engines see the site for what it is and the ranks are much higher with web standards compliant sites.
Are there any catches?
Somewhat steeper learning curve, you have to learn CSS.
Browser compatibility issues in older browsers.
Some layouts can be achieved much more easily using tables than CSS (with all the disadvantages).
These were just a few points I wanted to illustrate about web standards, what they are and why they could benefit you and your customers. There are many more points that could interest many people to have their sites create or converted to conform to web standards. It is a relatively simple conversion depending on the design and size of the site, but once its done it makes things tremendously easier to maintain or change. Below are some nice resource on the issue and why it would be important for you and you website. I hope this article was helpful in some way and I hope you all get a better understanding of web standards now.