Should You Design Your Website with CSS?
When it comes to web design, there is no excuse not to design your website with CSS. Regardless of whether you are a designer or have a designer working as a part of your team, you need to make sure that the websites you are involved with are being designed with CSS. I briefly mentioned the importance of using CSS in my post about factors that can sabotage your website’s success, but I wanted to expand on the topic of CSS and show you five more concrete reasons why you CSS is the way to go when it comes to web design:
Accessibility: If people can’t access your website, how are they ever going to read the amazing content that you spent so much time writing? As the W3C explained back in 1999, the reason that CSS plays such a major role in accessibility is that it separates presentation from structure. CSS allows you to clean up your the structure of HTML code, and at the same time, gives you far more control over the presentation of your website than you could ever achieve with HTML alone.
By choosing CSS, you can ensure that all of your visitors, regardless of whether they are using a mobile device, a screen reader or other type of device to access your website, are able to access your website and spend time reading and interacting with the content that you have worked so hard to create and promote.
Compatibility: As the Internet and technology in general continues to grow, the diversity of browsers and operating systems continues to grow. In order to accommodate visitors using all of these various browser and OS combinations to visit your website, it’s important to pick a web design tool that offers as much compatability. Although every aspect of CSS isn’t one hundred percent compatible with every browser and OS combination that is being used, it is far better than any other available option.
The great thing about using CSS is that you create your design to focus on visitors using specific browsers or operating systems, but at the same time, ensure that visitors with other combinations still receive an optimal browsing experience when they visit your website. For example, you may want to use a font in your design that is common in Mac computers but not Windows. Thanks to CSS, you can use this font for your Mac visitors, while simultaneously ensuring that Windows visitors are still presented with an attractive, easy to read font.
Consistency: One of the key elements of web design usability is consistency. Regardless of what page a visitor to your website is on, they should see the main navigational elements in the same location that they have seen them throughout their time on your website. Additionally, ensuring the color of elements such as links and visited links remains consistent throughout your site is key to making sure that your visitors don’t get confused and exit your website.
With plain HTML, making a change to any of the elements above would require you to open each and every page of the website and meticulously change each instance of the element. Because of the meticulous nature of this process, you will inevitably miss changing certain instances of the element, and will reduce the usability of your website. By using CSS, you can open one file and quickly change every instance of a specific element on your website.
Faster: In addition to causing potential problems for search engine crawlers, having page after page of bloated HTML can negatively impact the load time of your website. In addition to reducing your bandwidth usage and keeping your visitors happy, if you are running a Google AdWords campaign, having a website that loads quickly can help your Quality Score.
The reason that websites designed with CSS load much faster is because all of the CSS is stored in an external stylesheet. Instead of the server needing to trudge through and load every design element stored in the main HTML file, the structure portion of a CSS designed website is quickly loaded and then the presentation elements contained in the external file sheet are applied.
Printing: For those of us who use tools such as del.icio.us to organize and store all the information we need without using a single piece of paper, the idea of printing may seem outdated. However, the average internet user still uses their printer quite often. Unfortunately, if a page is designed without CSS, it may print poorly or consume a large amount of ink due to all of the design elements that are a part of the page.
By using CSS, you can create a printer friendly version of your website’s pages. Creating a print style sheet is fairly easy, and once you have made it, you can ensure that your visitors won’t hesitate to print off pages from your website. Having a printer friendly website can mean the difference between a visitor permanently leaving and visitor returning on a regular basis to print new material.