Electric Type

Multimedia

About Us

News

Help

Lean and Mean Tables

Page 5 — Don't Close the Door on Your Way Out

OK, this last trick pushes the envelope a bit. It's not official HTML, and it might get you into trouble with some lesser-known browsers, so proceed with caution.

The fact is, if you don't close a few HTML tags (especially when using tables), most browsers won't care. Let's hone down the following code:

    <TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0>
    <TR ALIGN=left VALIGN=top>
    <TD WIDTH=200><P><I><FONT COLOR=red>row 1, column 1</FONT></I></P></TD>
    <TD WIDTH=100 BGCOLOR=lightgrey><P><I><FONT COLOR=purple>row 1, column 2</FONT></I></P></TD>
    </TR>
    <TR ALIGN=left VALIGN=top>
    <TD BGCOLOR=yellow><P><I><FONT COLOR=brown>row 2, column 1</FONT></I></P></TD>
    <TD><P><I><FONT COLOR=green>row 2, column 2</FONT></I></P></TD>
    </TR>
    </TABLE>
It turns out that if we remove most of the ending tags (</FONT>, </I>, </P>, and even </TD> and </TR>), the major browsers will display this table in exactly the same way:
    <TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0>
    <TR ALIGN=left VALIGN=top>
    <TD WIDTH=200><P><I><FONT COLOR=red>row 1, column 1
    <TD WIDTH=100 BGCOLOR=lightgrey><P><I><FONT COLOR=purple>row 1, column 2
    <TR ALIGN=left VALIGN=top>
    <TD BGCOLOR=yellow><P><I><FONT COLOR=brown>row 2, column 1
    <TD><P><I><FONT COLOR=green>row 2, column 2
    </TABLE>
Again, less code means a faster page!

Well, that about wraps it up. A lot of tricks, some obvious, others less so. The idea is to get us all thinking more about how we code so we can save a few bytes here and there, until all those bytes add up to a better experience for the users of our sites.

This list of tricks is certainly not complete. If you have your own tips for trimming down your HTML, email them to me at slmulder@earthlink.net and perhaps we'll add a Part 3 to this column.

Faster HTML for everybody!


Dynamic HTML  

Frames  

HTML Basics  

Stylesheets  

Tables  

XML  

Javascript  

Database Connections  

Intro To Perl  

HTML 4.0  

User Blogs

Screen Shots

Latest Updates

Contact Us

Valid HTML 4.01!
Valid CSS!

Breadcrumb

© ElectricType
Maintained by My-Hosts.com
Site map | Copyright | Disclaimer
Privacy policy | Acceptable Use Policy
Legal information.