Topic: New Weblog Design

Hi Chaps,

Your comments would be very much appricated. There are a few things I already know about, such as the navigation bar doesn't align correctly in Safari or Konquerer but you may discover things that I have not, so I can add them on the "todo list".

URL: http://www.smithpaul.com

Thanks in Advance,

Paul Michael Smith

[This message has been edited by PaulSmith (edited 05-07-2003).]

OK, I had to study this really hard to find anything to write about, other than to say that it is a very carefully and beautifully designed site. I remember the last site you posted here, and I remember that I had a few minor quibbles with it, but I couldn't find any of those quibbles this time around. None of my pet peeves showed up either (anyone who uses proper encoding is automatically on my good side).

Um, you misspelled "language" on the comments page.

I was wondering whether or not I should suggest a different color for the links, rather than just bold text, but I honestly like the way it looks now. Very classy.

After reading through the page, I decided to dive under the hood to see if I couldn't find things for you to add to your "todo list." Here's what I came up with:

1) Get rid of the browser upgrade campaign message. For better or for worse, WASP has discontinued the campaign. See their Beyond the Browser Upgrade Campaign page for more details.

2) You might want to consider using an unordered list for your navigation bar. This is a semantic thing, really, but it seems to be a generally accepted practice these days. A List Apart has a good article on this. (You should be able to apply the ids to the list items just as you apply them to the divs, so you shouldn't have any problems with the rollovers.)

3) Use character entity references instead of the actual characters for things like curly quotes and apostrophes. This is, in fact, the only thing that keeps your page from validating. The W3C has a list of character entity references that you can refer to, but right now you only need three of them: 8217 for the apostrophe, 8220 for the opening double quote, and 8221 for the closing double quote (note: just put those numbers inside "&#xxxx;", where "xxxx" is the number").

4) Your CSS doesn't validate either, but I'll be darned if I can figure out what this means:

quote:

---

Line: 340 Context : h4
Invalid number : fonttoo few values for the property bold 12px,arial,helvetica,sans-serif : bold 12px,arial,helvetica,sans-serif

---

You'll have to mess around with that a bit to see what's wrong. At any rate, the warnings are pretty clear: always include a background color when you specify a color, and vice versa. If you don't want to specify a background color you can set it as "background: transparent" and if you don't want to specify a color you can set it as "color: inherit".

I guess that's about all I have for you at the moment. I'm sure there's something that I've missed, but I bet someone else will come along and fill in the blanks. Very nicely done overall. It was a pleasure to look at.

[Edit: fixin' stuff that was broken]




www.liminality.org

Great work!

I agree with everything Suho said, so I'll skip the comments on those things.

In Mozilla1.3 and Opera6.0 on Linux the padding beneeth the navigation buttons looks to big. Above the images there is only a couple of pixels worth of padding, while bellow the padding is almost the same height of the image. Either vertically center the images, or decrease the padding so it is equal on both sides.

You should make it so that the page you are currently on isn't a link at the menu. So for example when you're at the home-section I cannot click the home link. Making the link a little different from the others might also look good.. I noticed that you on some pages have the link to the page dissappear completely, which seems to be a bit to much since it changes the whole menu and at first it looked to me like something was missing that was supposed to be there...

The top part of the page is different between some of the pages. Some of the pages lack the 'navigation: ' text in front of the images and on some pages the link to the page dissappears completely.

_________________________
"There are 10 kinds of people; those who know binary, those who don't and those who start counting at zero"

quote:

---

but I bet someone else will come along and fill in the blanks.

---

The funny thing is that, in that sentence above, I had originally written "Veneficuz" instead of "someone else," but then I changed it so as not to scare other potential reviewers away.

And the no-clicking-on-menu-items-for-the-page-you-are-currently-on is one of my pet peeves! I can't believe I missed that! I guess I was just so blown away by the design that I wasn't thinking clearly.

Thanks for the kind words chaps. :-) You are right about everything you have said. I am in the middle of writing the CSS code for the navigation bars so that they are un-ordered lists and not just hyperlinks. I noticed the problem late last night and just whipped in a make shift navigation for the non css users by using the same code for the "crap browser message" :-)

I have just ordered linux from Amazon because in the past I have never bothered with it, but now it is really important to make sure your site works in Linux browser's too because it is being used by more and more people and not just geeks... :-)

I know what the problem is with that CSS error, I have just not declared a typeface at all for the H4 element.

Do you think I should just have a fixed navigation bar ? Meaning that all the icons will remain on the naviagtion bar at all times but if the user is in a particular area just "deactivate" that particular button ? For example: if the user is in the home area then just disable the home button.

As far as the character entity thing goes, I think there is a MovableType plugin I can download called SmartyPants that replaces such characters for their character entity's, but I forgot all about it and left it on the backburner until I got the main things out of the way.

Once again, Many thanks for your kind comments and words of wisdom. I will be looking to make the required changes and then I will post back here for you to go over them with a fine tooth comb. :-)

smithpaul - personal design journal

Ok sorted out the CSSDoc, so that is now valid. :-) Got rid of the warnings too.

smithpaul - personal design journal

quote:

---

Do you think I should just have a fixed navigation bar ? Meaning that all the icons will remain on the naviagtion bar at all times but if the user is in a particular area just "deactivate" that particular button ? For example: if the user is in the home area then just disable the home button.

---

Keep the buttons but deactivate them, and maybe loose the mouseover for buttons you can't click? Helps people know where they are, and looks more consistent too, I'd say.


home

Paul: A typical* way to do the navigation bar is to have the current area highlighted (ie, in the rollover state) to indicate the user's location. It is a very effective visual device. This highlighted icon, of course, would not react in any way to a mouseover.

* Don't shy away from my use of the word "typical" here. While some people may translate "typical" as "boring," something that is typical is something that people are used to seeing, which means they already know how the interface works, and that's always a plus.

Very nice ::: I'm trying to do one myself and yours looks very sharp. Cool.

Art is in the eye of the beholder