1. Home
  2. Computing & Technology
  3. Web Design / HTML
photo of Jennifer Kyrnin

Jennifer's Web Design / HTML Blog

By Jennifer Kyrnin, About.com Guide to Web Design / HTML since 1997

A basic layout I forgot

Wednesday January 10, 2007
I've been putting up free Web layout templates for several years now, so when Jeannette wrote asking me for help to build a variation on a 2 column layout I went to the templates page to find the template to send her. http://z.about.com/d/webdesign/1/0/V/7/1/pencil.jpg
pencil
Image courtesy vierdrie from StockXchng #656320.
And I was surprised to realize that while I had a two column layout, a two column with header layout, and many three column layouts. But I didn't have any two column layouts with a footer and a header. So, I wrote this free template for Jeannette. Thanks Jeannette!

Comments

January 10, 2007 at 10:17 am
(1) Doug says:

If I’m reading all my Friends Of Ed books correctly, I believe we’re supposed to to be avoiding all the extra divs and just using the elements themselves as containers, for example your side nav could just be with a width of 200 floated to the left. The header would be fine without a wrapped around it, etc.

What you have is probably more useable for adding/removing content but it doesn’t encourage people to think outside the DIV.

January 10, 2007 at 10:25 am
(2) doug says:

oops my html elements don’t show.

your side nav could be just a “UL” element floated to the left and your H1 header would be fine without a DIV wrapper, etc.

January 10, 2007 at 12:51 pm
(3) Jennifer Kyrnin says:

Hi Doug,

Yes, you’re correct - in fact, I wrote an article about that specifically: Divitis - The Habit of Using Divs for Everything in CSS Layouts

The reason I use DIV tags in the templates is because I don’t know what is going to live in the different sections. For example, you might put navigation in the narrow column and so a UL would be appropriate, but I might put additional content, with headers and paragraphs, etc. So a UL wouldn’t fit on my page.

Unfortunately, using DIVs in a template encourages divitis, but I can’t afford to build a custom layout for everyone who asks for one - these are free templates after all. :-)

Thanks for pointing that out, however, as you’re correct you should use the tags that are semantically correct for the site not just DIV tags.

January 10, 2007 at 2:27 pm
(4) Doug says:

Got it. Thanks Jen.

June 9, 2007 at 12:32 pm
(5) Bill says:

You guys do a wonderful job! Keep up the good work!!!

August 14, 2007 at 3:47 am
(6) Helga says:

I like it and the background and colors make it easy to read

November 28, 2007 at 2:16 am
(7) Hillary says:

Thanks for your project. I like this site. KEEP IT UP..

Leave a Comment

Line and paragraph breaks are automatic. Some HTML allowed: <a href="" title="">, <b>, <i>, <strike>

Explore Web Design / HTML

More from About.com

  1. Home
  2. Computing & Technology
  3. Web Design / HTML

©2008 About.com, a part of The New York Times Company.

All rights reserved.