K
Kevin J. Cheek
I've just finished my first web page using style sheets to control the
layout. It's a vanity web page so there's not much in the way of
interesting content, but it does serve as a good place for me to practice
coding web pages. The URL is http://planttel.net/~kevinc but you might
want to see http://planttel.net/~kevinc/mill/ntsnblts.htm first, where I
discuss some of the issues in designing the pages.
The issues, from a newbie's point of view:
Used HTML 4.01 Transitional instead of Strict because IE 6 doesn't like
its min-width workaround in Strict mode. I thought my options were to
redesign the pages for collapsing margins, use Javascript, or insert the
word "Transitional" in the document type. I inserted "Transitional"
and let it ride. Mozilla correctly interprets the standard min-width
statement I also included regardless of Transitional or Strict.
Banner graphics seem larger on the page than I thought and may come
across as shouting. They're also bigger in file size than I'd like, even
though they're 256 color at 72 dpi resolution. I'm thinking of splitting
the graphics in two, saving the eagle in 256 colors and the text in 16
colors or 2 color black and white. I really like the font in the banner
and the only reliable way for others to see it is to present it as a
graphic. Or make the image background the same as the web page and save
it as a jpeg. Or maybe I need to do something else to allow for
collapsing margins.
Used Georgia as a serif font to stay with the 19th Century newspaper
theme. I don't think it makes it too hard to read, but I'm not sure. The
fall-back fonts are Times New Roman and serif. The only places were I
defined font sizes are in the navigation bar and the footer, and here I
expressed it in em so they'd reflect the the user's chosen size.
I'm not too happy with the link colors, but they work well against the
yellow, beige, and white backgrounds. Not sure what else I could do here.
I'm also using a clearing class to make sure wrapping DIV extend to the
bottom of internal DIV. I'm probably using it more than necessary.
A minor issue is the use of headings. W3C recommends starting with h1 and
working downward with each heading. But h1 was bigger than I liked and so
I started with h3 and worked down. Yes, I know I could have specified the
header size through the style sheet, but I didn't see the point. Am I
missing something here?
And that's about all. Any design comments would be most welcome.
Thanks in advance.
-Kevin Cheek
layout. It's a vanity web page so there's not much in the way of
interesting content, but it does serve as a good place for me to practice
coding web pages. The URL is http://planttel.net/~kevinc but you might
want to see http://planttel.net/~kevinc/mill/ntsnblts.htm first, where I
discuss some of the issues in designing the pages.
The issues, from a newbie's point of view:
Used HTML 4.01 Transitional instead of Strict because IE 6 doesn't like
its min-width workaround in Strict mode. I thought my options were to
redesign the pages for collapsing margins, use Javascript, or insert the
word "Transitional" in the document type. I inserted "Transitional"
and let it ride. Mozilla correctly interprets the standard min-width
statement I also included regardless of Transitional or Strict.
Banner graphics seem larger on the page than I thought and may come
across as shouting. They're also bigger in file size than I'd like, even
though they're 256 color at 72 dpi resolution. I'm thinking of splitting
the graphics in two, saving the eagle in 256 colors and the text in 16
colors or 2 color black and white. I really like the font in the banner
and the only reliable way for others to see it is to present it as a
graphic. Or make the image background the same as the web page and save
it as a jpeg. Or maybe I need to do something else to allow for
collapsing margins.
Used Georgia as a serif font to stay with the 19th Century newspaper
theme. I don't think it makes it too hard to read, but I'm not sure. The
fall-back fonts are Times New Roman and serif. The only places were I
defined font sizes are in the navigation bar and the footer, and here I
expressed it in em so they'd reflect the the user's chosen size.
I'm not too happy with the link colors, but they work well against the
yellow, beige, and white backgrounds. Not sure what else I could do here.
I'm also using a clearing class to make sure wrapping DIV extend to the
bottom of internal DIV. I'm probably using it more than necessary.
A minor issue is the use of headings. W3C recommends starting with h1 and
working downward with each heading. But h1 was bigger than I liked and so
I started with h3 and worked down. Yes, I know I could have specified the
header size through the style sheet, but I didn't see the point. Am I
missing something here?
And that's about all. Any design comments would be most welcome.
Thanks in advance.
-Kevin Cheek