View Full Version : Site Review

03-31-2004, 05:21 PM
Just wanted to throw my hat in the ring and get some folks to review my redesigned site...not much in the way of content on there yet, but...

Especially interested in MAC point of view since I have no access to one.

simondvorak.com (http://www.simondvorak.com)


03-31-2004, 06:53 PM
Looks good.
What I do not like is the fixed pixel width, why not set it in font units so that everything scales with the font size?

03-31-2004, 07:19 PM
Nice site! So far the css and xhtml looks very clean and very well done. Some may suggest moving the links to the end of the document and then placing them through css, purely for accessibility reasons (I'm not even clear on them all...). Other than that, I have but one suggestion. When the text size is increased more than once on Firebird, the headers in your links div become too big for the background image. Why not place the image at the bottom of the header and then make the header's background color the same as the starting blue on the image? That way it will look the same until text is increased, but there will still look like there is a background image when the text is bigger.

Also, as to Roy's suggestion, the only problem I have with font-sized layouts is when text is increased more than once or so, pages can extend past the horizontal limits of the browser, and that can defintly annoy me sometimes. But there are definite advantages to using font-sized layouts (i.e., your links and headers will not extend past their boundries).

[edit] I actually may stand corrected... I just looked at some examples and maybe font-sized layouts don't extend past the browser's borders? I specifically examined Roy's site, and no matter how large I sized the text, the layout didn't create horizontal scrollbars...

[edit > again] I now feel sort of foolish, they will extend past the boudries, Roy just cleverly designed his page so that the content div wasn't sized, it was just extending with the size of the content... right?

03-31-2004, 07:24 PM
set the width of the page in font units? how so?

03-31-2004, 07:31 PM
You would use ems instead of pxs. The em is a unit of measurement relative to the current height of the font. So as you increase/decrease the font size, you also increase/decrease the magnitude of one em. So declaring a width of say 50em would make your div increase and decrease with the size of the font.

You could also do as Roy did giving your content div (i think you have #features) margins using em, and then just let the whole thing expand as the text expands.

03-31-2004, 08:54 PM
Hmmm...the margins idea sounds better than the width using ems.

Thanks for the tip on the links section pardicity3. I hadn't even considered that. :thumbsup:


04-01-2004, 08:43 AM
As said, well-coded, nice layout, tasteful use of colors.
Some gripes (there's no such thing as a perfect site... :D )
I don't know what font you used (didn't look it up), but it's not the clearest, especially the somewhat smaller, bold stuff; this might also be a contrast issue (see next gripe).
The contrast between the text and the background is a bit low (this is the case for most of the colors used), something that's always a difficult issue with light text on a dark background, something to do with how monitors work, or how people's eyes work, dunno... :confused:
It's not that it can't be read, but it tends to tire the eyes fairly quickly.
Maybe you could darken the gray background a bit, but then you'd probably have to find an alternative for the black h1 headers.

04-01-2004, 09:24 AM
Good code, one small gripe:

<div style="width:760px; border:0; text-align:right">
That's your validation icon div... feeling lazy at the time were we? :D
As for your design:
1. I agree with ronald that the font is difficult to read. The font/size/style combo is causing a very jagged edge, which on the light blue makes it a real strain to read.
I think you should seriously reconsider the shade of blue you have chosen for your links. It's far too light and too cyan i.m.h.o.

2. There is little continuety from the header to the rest of the page. It might look good if you ditch the rounded corners and conitnue the thin black border down the sides, with a footer w/ yellow top and bottom borders and a black background to tie in with the banner image.

3. Instead of the unsightly "home" link in the top right, set the link's display to block and set your banner image as its background. Then your entire header will be a home link :D


P.S. Where the hell is the "tips" section? you keep referring to it in your blog posts, but it ain't on the menu.....

04-01-2004, 05:56 PM
<div style="width:760px; border:0; text-align:right">

Definitely got me there Andrew! Remnants of the design phase...changed it to id footer.

About the font...It is Century Gothic. I had the alternate listed as sans-serif. I went ahead and added Verdana and Arial to the list. maybe that will make a difference if Century is not installed.

Also, the tips section was called Reference/Tips...then Coding...now Coding/Tips.