CSS web design

The look and formatting of a document is an important factor to be considered if you want readers to read and not just scan what you have presented. CSS (short for Cascading Style Sheets) added to HTML give both the web designer and users more control over how pages are displayed. Designers can create style sheets and define how different elements (headers, links) should appear. These style sheets can then be applied to any webpage thus providing for more independence.

CSS was developed by the W3C which has published two major CSS recommendations: CSS1 and CSS2. CSS has now been updated to CSS 2, revision 1. However not all web browsers have been consistent on dealing with CSS. When a browser encounters flash, HTML, CSS etc on a webpage, it attempts to display the page as per the specifications. If it does not understand the specification, the page displays with the content but the presentation may suffer. In some cases the browser may crash. When using a style sheet the designer should know what works in different browsers, the result that is likely tO occur when it does not work as well the action to take if a browser ignores a CSS rule.

It improves the experience for the users with more advanced browsers. However there are some properties that are not well supported by all browsers. In some cases it may not matter - if some users miss out on a special styling as long as it improves the experience the users with more advanced browsers. Setting filters that prevent browsers from reading specific CSS rules that might cause a browser failure can be an alternative approach.

Style sheets are normally saved in external .css files. External style sheets allow you to change the appearance and layout of all the pages in a website just by editing one CSS document. With CSS you can decide how headings should appear, enter the information once and every page that is linked to the style sheet maintains the new header. This can be done for various elements across the site.

The basic purpose of a CSS is to ensure the separation of content from presentation. Since the content goes to the HTML document and the design goes to a CSS document, this separation improves accessibility of content, gives flexibility and better control for presentation, allows formatting across multiple pages, and reduces repetition in the structural content. Top

A few advantages of using style sheets are mentioned below:

CSS allows the same mark-up page to be presented in different styles for different rendering methods (on screen, print, voice). The simpler code and separate style sheets allow you to easily port pages for print, screen readers, mobile devices and other media. Because of a lower page weight, browsers can download pages quickly. Using style sheets allows for quicker redesigns and simplifies the task of maintaining websites.

When content is mixed with presentation data, the content may not load when there is excessive presentational data. This makes it difficult to have a consistent visual display across the site. This can be avoided by using style sheets.

CSS also helps search engines to read only the valuable content and not the presentational data as the entire data is separately derived from a CSS file. Using HTML tags enables more search engine accessibility. Due to separation of content, CSS allows users to view documents with their own preferred fonts, colours etc. If a particular font is not available on a user machine, CSS can render alternate fonts.

CSS also allows you to transform the way a page looks without altering the HTML code.

Since you can control the text (font, color, size..) and the layout (backgrounds, margin, padding...) of a website, in one single file, you not only save a lot of work but also create websites with good visual effects. Top