What is CSS vs Tables
Most web browsers out on the market now have to wait to load all the tables before the content. This can make your page render slower. In some case web developers will have tables nested in tables nested in tables. This is a problem when a web browser is reading your code, not to mention a search spider.
Tables Render Slower than CSS
You can put absolute widths and heights on your tables to have them reader quicker. But doing this you will have your webpage a fixed size. In most cases this isn’t a big deal. If you are coding to a liquid base webpage, where it adjusts itself to the resolution, keep this in mind.
Accessibility & Usability
When using tables you take away the different columns of your page, making the code layout out of order. If someone is using a screen reader and they come to your website. Your navigation is on the left column, content in the middle and extra links on the right. You would want your visitor to hear all the navigation, the all the content and last the external links.
If you have a table, it is going to read the first row of the navigation, content and external links. Then the second row of the navigation, content, and external links. This is a problem. Tableless CSS everything is laid out in order and a screen reader can read the content without any confusion.
All The Different Web Browsers
When a visitor accesses your site they might be using Internet Explorer (most likely), Firefox, Google Chrome, or maybe Safari. Tables do hold their sizes on different browsers. Different web browsers render tables very similar. With CSS, browsers like to render elements differently. This is frustrating when learning CSS, margins and padding could size differently. More you code in CSS, the less this is a problem.
Clean & Organized Code
When using tables instead of CSS you find yourself filling your page full of code. In a table situation you need to have a <table><tr><td>Content</tr></td></table>. Having the same effect in CSS you only need <div class="content">Content</div>. CSS has less coding and a cleaner fill. Also with this example you have your class element, ready to be stylized.
Easy to Change and Update
Changing the design format or small elements of your web design is very simple and quick. Having a single CSS file to control all aspects of your website, gives you the ability to change one thing in one spot. For example, if you want to change your navigation to a different color. You just change the color you have controlled in your style sheet and every page is affected. This is true with about anything in CSS.
What is CSS? Easy Layouts
Both of these elements are used throughout the internet. As the internet is moving forward, there are less websites using the table layout method. There are places for both elements. You need to develop a way that you are comfortable. Keep in that CSS is moving forward with new techniques and will keep your web site accessible friendly
Post new comment