home custom templates contact us support
MEMBER LOGIN:
  User Name:
  
  Password:
  

Join Now
View All
Web Templates
 
Home
About Templatefolio
Terms of Use
Contact Us
Site Map
Webmaster Articles
TemplateFolio Blog
Customer Feedbacks
Sample Web Template
Quick Tour
F.A.Q. Page
Payment Information
SUBSCRIBE TO CONTENT UPDATES & WEBMASTER ARTICLES AND GET 5% OFF ON SUBSCRIPTION:
 
   


The Difference Between CSS and Table Layouts

When creating a website, there are two different types of layouts that can be chosen: CSS layouts and Table layouts. These options achieve different results, as well as come with their own set of advantages and disadvantages. Accessibility issues also arise when using these two approaches.

CSS Layouts

CSS, which stands for Cascading Style Sheets used to be recognized as the most popular choice for formatting text, but in recent years, have found a place within the world of layout and positioning. When set up correctly and efficiently, this selection can prove to be quite beneficial, but one has to know that this can also be a lengthy process.

Even though CSS layouts are widely accepted by current browsers, older browsers do not support this option well. The layout is still usable because it displays the navigation and subject matter at the top of the page. Some of the positive aspects of CSS layouts are that positioning becomes more flexible, as well as increase capabilities by promoting a fluid design. CSS layouts feature a decreased load time by maintaining a low HTML/text ratio. With CSS, the main display loads first and the graphics appear after the main content has loaded.

CSS layout creates flexibility, allowing the content of a page to expand the same width as the screen. Single files within the layout can also be altered to improve screen and printing capabilities. CSS layouts is more user-friendly because the main information loads on the top of the screen, so that visitors to the website do not have to wait for the entire page to load. While they are concentrating on the information on the top of the screen, the larger items that take longer to load can load without becoming too much of a distraction.

CSS Accessibility

CSS layouts can ease accessibility dilemmas posed by table layouts because content in a CSS-based layout appears in a reasonable order without any interruptions. The layout is also favorable for disabled users by breaking down the information into easily digestible material.

Table Layouts

Tables have been a common tool used for designing websites for a while now, but since there has been the creation of many different browsers, some issues regarding compatibility and accessibility do arise. Websites that use tables are easier to apply than CSS layouts. Software like Frontpage and Dreamweaver easily work well with tables.

Some disadvantages to using tables, is that some problems with layout occur in some newer and older browsers. This option also alters the HTML/text ratio to increase the page file sizes when it isn’t necessary to do so.

Table Compatibility Issues

The majority of websites we see today use tables, from sites dealing with education to sites filled with news. One of the main issues regarding the table layouts is that users and web developers find problems with browser compatibility. There are several browsers on the market that are popular, such as Netscape and Internet Explorer, but there are also many other versions in use that should also be tested for compatibility. When browser compatibility tests are done, there are some browsers that will show gaps within the table layout. Elements appear on the layout that shouldn’t be seen, such as cells in odd positions or the presence of thicker columns. These matters take a lot of time and energy to correct.

Another reason why table layouts appear differently on various browsers is because there are many bugs within all browsers that cause problems with layout appearance. When designing a website, if Frontpage or Dreamweaver are used, there is a chance that the source code could be bombarded with pointless or worthless tags.

Table Accessibility Issues

Disabled Internet users work with various types of browsers including screen readers, speech output browsers, as well as Braille browsers. Using these browser choices with a table-based website can be a difficult and frustrating encounter. The way tables are presented and the way they are composed in the source code is quite different.

Text and speech output browsers, as well as screen readers interpret the source code in a line-by-line manner. It is then sent to the user in a way that they can understand. Problems occur when the cells of a source code are not linear. If the content does not appear in a logical order, then the material becomes hard to decipher into something a disabled user can understand. Another issue that arises is when an alternative browser detects a layout that includes tables within tables. This also causes a break in the appearance of the web page.

In conclusion, it is suggested that table layouts be used when it is a last resort. The better choice is to stick with layouts that utilize a CSS format.

Top | Back To Articles List | Print Friendly Version

 


Copyright © 2008 Templatefolio.com.
All Rights Reserved.

  Home | About Templatefolio | Privacy Policy | Terms of Use | Support | Affiliates | Contact | Site Map

  TemplateFolio:   Free Templates | Web Templates | HTML Templates | Flash Templates
Website Templates | Enchanting Web Templates | Cheap Web Templates
WordPress Themes