| Technology is constantly evolving and advancing and | | | | table-based layouts. This usually results in the pages |
| nothing shows this more than the (short) history of | | | | loading more quickly. Moreover, an externally linked |
| the web. Just a few years ago, the internet was full | | | | CSS file, once loaded the first time, does not have to |
| of websites with blinking, animated icons and | | | | be reloaded and re-read on every page. When using |
| background midi music and lots of people thought it | | | | CSS for layout, browsers can cache (keep in |
| was really great. Advance a few years forward and, | | | | memory) all the formatting and stylizing for your |
| although you still see those things from time to time, | | | | pages instead of having to read and interpret each |
| the web now contains much more sophisticated | | | | style tag on every page. This can also result in much |
| elements like video clips, rss feeds, detailed flash | | | | faster page loading times. |
| animations, and more. | | | | 2. Visual consistency across pages One of the |
| As the "ideas" about what a website is and what it | | | | strengths of using Cascading Style Sheets in a |
| should, or could, do for a company have also | | | | website layout is that design elements can be |
| evolved, designers have strived to streamline the | | | | defined in a single place (the css file) and will |
| process of developing websites and to make them | | | | automatically be applied to those elements on the |
| more efficient and predictable. Because different | | | | website. No longer does each individual page have to |
| browsers interpret code differently, it hasn't always | | | | be updated to reflect the new style. This makes for |
| been easy to make more complex websites look the | | | | much greater consistency throughout the site. With |
| same (or even good in some cases) across browsers | | | | CSS, you do not have to re-code every element on |
| and systems. What used to work in the early days | | | | every page (and check and double check that you |
| of the web was no longer working the way web | | | | didn't miss some pages!), styling updates are |
| designers wanted or needed it to. | | | | automatic and site-wide. |
| Cascading Style Sheets to the Rescue. | | | | 3. Accessibility and usability CSS allows for more |
| Cascading Style Sheets, also known as CSS, were | | | | interactive style elements, including font size and line |
| introduced to improve the capabilities of web | | | | heights, which can make web pages more usable for |
| presentation. Prior to CSS, almost all of the html | | | | people with disabilities. Web pages that use CSS |
| attributes that made up the "look and feel" of a web | | | | layouts are also often more compatible with more |
| page were contained within the html directly. This | | | | browsers. What's more, designers can create specific |
| made web page code heavy and often quite clunky. | | | | css files specifically for printing, or mobile devices, as |
| By using Cascading Style Sheets, designers could | | | | well as the standard computer screen, thereby |
| separate the design elements from the content of a | | | | making websites truly multimedia applications. |
| web page and thereby make the pages more | | | | 4. CSS is better for SEO Since pages load faster with |
| efficient, more streamlined, and easier to maintain. | | | | CSS Layouts, search engines can more easily crawl |
| Not all designers jumped on the CSS bandwagon, and | | | | through the site. Also, since there is often less coding |
| even today, many designers still prefer to layout their | | | | on the pages and because CSS separates the design |
| web pages using html table-based design, the way | | | | elements from the content, it is easier for search |
| just about everyone used to do it. Using CSS to | | | | engines to determine what a page is about and to |
| layout a webpage is quite different from the "old | | | | index it appropriately. Finally, search engine spiders |
| fashioned" table layout. However, the advantages to | | | | rely heavily on structural organization (heading (h1, h2, |
| using a CSS layout for a web page heavily outweigh | | | | h3, etc) tags) and CSS allows designers to design |
| any argument given for using html tables. | | | | those elements as needed and to place them within |
| Although I wouldn't expect clients to know the | | | | the page layout in a way that is most beneficial for |
| intricate details of Cascading Style Sheets (and let's | | | | search engine optimization. |
| face it, most clients don't really want to know much | | | | 5. Future redesigns will be more efficient (read, less |
| if anything about it!), I do think that clients should be | | | | expensive!) Since CSS layouts separate design |
| aware of the advantages of using CSS layouts and | | | | elements from content, once a site has been |
| how they can enhance their websites both now and | | | | designed using Cascading Style Sheets, making |
| in the future. | | | | changes to the design is often easier because fewer |
| Advantages to Using CSS for Web Layout | | | | files need to be updated (often only the css files |
| | | | rather than every page on the website!) This makes |
| 1. Web pages will load faster | | | | for faster and less expensive design changes in the |
| No one likes waiting for web pages to load and if a | | | | future. Set your site up using CSS now and you can |
| page takes too long to load, many users will often | | | | have easier, more efficient and quicker updates in |
| simply leave. Generally speaking, CSS based page | | | | the future. |
| layouts require much less html coding than | | | | |