A few more notes about the new design, and then I’ll stop yakking about it; I promise. I’ve now tested the site in Internet Explorer 6, Internet Explorer 7 (rc1), Firefox 1.5, Firefox 2 (rc2), Opera 9, and Safari 1.2. It passes with flying colors in all browsers, with the exception of IE6, where it doesn’t actually look half bad—the layout itself is fine but the PNG images puke big bluish blocks all over where they should be transparent. Sometime down the road I may decide to replace all the PNGs with something else in IE6 (using conditional comments or some other such hack), but IE7 is coming this month and will be a critical automatic update, so I’m not going to sweat about it too much.
Unbeknownst to me, the new design wasn’t at first valid XHTML and CSS. I took care of that this morning by properly closing a few <li> tags, fixing a few tag IDs, properly enclosing a couple of comment form elements inside a block level element, and fixing a few malformed CSS statements.
Last but not least, I should mention that the new design uses a couple of new fonts: Cambria and Calibri. Microsoft is releasing six new fonts with Windows Vista and many people (myself included) are hoping they become widely distributed enough to use them in web pages. If you don’t have these fonts, the new design properly degrades to using Georgia and Trebuchet MS instead, which I think looks pretty good, so you’re not missing out on much. To get the full effect, however, I recommend you download the new fonts if you can. They have been released unofficially to the public in the Vista betas and can be found on the web with a little effort.
Joey,
It nice to hear good things about IE 7 compatability you are right, it probably is a record for all three of the major browsers to actual render a site the same way! Anyway, just wanted you to know I had stopped by.
Best regards,
Cory-
Joey, I’ll be blunt. I don’t like the new design–yet.
First, the header/title is too large and too busy. It has three unconnected, uncoordinated symbols: the gold innards of a watch, the word Syzygy, and a yellow kangaroo-crossing sign. They make sense to me, but perhaps not to others. In my opinion, you should pick just one symbol and explain it. If you use a word in the title, like Syzygy, I think it should have the same font/shadowing as “JoeyDay.com”.
Second, either the font on the page is too large, or the width of the page is too small, or both. Two paragraphs fill an entire screen. It feels like I’m reading a page for the visually impaired.
Love ya!
Steve, thank you for your critique. It was blunt, but fair and constructive. I had considered most of your points already, but perhaps not at great enough length. First, the logo and the blog title are in the same font, Calibri. I updated the logo to match the blog title (cf. the old logo to the new logo). In fact, they also have the same shadow, but it’s difficult to tell because the blog title is a single element with the white page background and the shadow only falls on the darker header background image. This mockup shows the header without a background image. The shadow on the blog title is clearly visible.
The obvious difference between the logo and the blog title is the absence of a stroke (border) on the blog title. I had briefly considered adding a stroke to the blog title, but thought it would look too messy. In the interest of consistency, however, I’ve created this second mockup that shows what the blog title would look like with a stroke. I’m not crazy about it, but will consider making the change, as I do agree it brings uniformity to the two symbols.
The third symbol you mention, the gold innards of a watch, is actually an ephemeral one, as I’ve hopefully demonstrated this morning by swapping out the header image with one of my own photos. I haven’t decided yet whether I will swap out that image by hand periodically or add in a bit of PHP to serve the reader a random header image on every page view. At any rate, the header image isn’t meant to be a symbol at all, but mere window dressing to liven up the page and make it more dynamic and personal.
As for the font sizes, they are deliberately large. Large fonts, at least in my experience, are gaining popularity on the web. I really like the font sizes I’ve chosen, but if you don’t like them there is hope. This is my first design that uses ems and percentages alone to control the font sizes and many aspects of the layout. You are free to shrink (or expand) the fonts in your browser and the layout should remain consistent (to an extent). Additionally, I’ve noticed that Georgia is a bit larger than Cambria, so you may wish to try my suggestion of finding the Cambria font to see if that improves the font sizes for you any.
Hey, it’s nice to see you responding to comments so quickly; makes me want to visit the page more often.
With regards to the title font/shadowing: I would like to see the title with the stroke (border), but just around the actual white lettering of “Syzygy” and not around the shadow. “Joey Day dot com” has the stroke, but the shadow still blends into the white background without an additional black border.
The image behind the title looks nicer today. I like the color, and there’s a hot girl in the picture this time…and I like that. Did you ask the subjects’ permission to use the picture, though?
My opinion (I know–who asked me?): I think the header will look nicer if the picture changes every now and then, as you have suggested, and if the title’s shadowing precisely matches the “Joey Day” shadowing. Oh, how do you plan to explain the word Syzygy and the Kangaroo Crossing sign?
Finally, perhaps I was too harsh when I viewed your site from my laptop, with a resolution of 1024 x 768. Your header filled half of the screen and so did every paragraph. From work–where I have two screens each with a resolution of 1280 x 1024–objects appear significantly smaller.
My opinion: The blog still looks too narrow, and the default size of the text too large. Several of your entry headers spill over into a second line, which looks a little sloppy to me, and it causes the header to take up a disproportionate amount of space on the screen. I have to decrease the size twice to make it all feel comfortable to me.
Feel lucky to have my opinion for free.