What do you think?

[justinh]

Trying to come up with a design for my portfolio.

 

How does this look to you? Constructive criticism is greatly appreciated. 

 

http://wmptest.com/testing/design/

[jackpf]

Wow...it looks pretty cool. I like the way your nav links have them double borders to the sides.

 

However, it doesn't validate. 2 errors- NO ALT TAGS!!!!

 

Put alt tags on your images- that's the most rediculous thing to fail validation for.

[nrg_alpha]

• Aside from html validation, consider css validation as well.
  
• No offense, but that background is an eyesore. Perhaps one larger smooth gradient or something?
  
• I would consider injecting some more colour into there somehow, as it purely monochromatic.
  
• I would also consider adding a footer of some sort.
  
• I'm personally not a fan of the look you gave the menu. I find those dual borders distracting personally. I would think about a single divider between buttons (that don't stick out beyond the div the menu sits in.
  
• I noticed you are using javascript for your right panel roll over (I am also currently guilty of using javascript for rollovers, but I'll rectify this in my next site iteration). You can instead use css sprites instead, and have css hover rules that switch the section of the image in question instead.
  

 

 

[justinh]

Thanks for the critique!! I will fix these problems A.S.A.P

 

I also had mix feelings on the background

[jackpf]

• Aside from html validation, consider css validation as well.
  
• No offense, but that background is an eyesore. Perhaps one larger smooth gradient or something?
  
• I would consider injecting some more colour into there somehow, as it purely monochromatic.
  
• I would also consider adding a footer of some sort.
  
• I'm personally not a fan of the look you gave the menu. I find those dual borders distracting personally. I would think about a single divider between buttons (that don't stick out beyond the div the menu sits in.
  
• I noticed you are using javascript for your right panel roll over (I am also currently guilty of using javascript for rollovers, but I'll rectify this in my next site iteration). You can instead use css sprites instead, and have css hover rules that switch the section of the image in question instead.
  

 

If you use CSS to do your hover stuff, there's a high chance that IE won't support it. Javascript works in all javascript enabled browsers. Surely javascript is the better option?

[fabrydesign]

If you use CSS to do your hover stuff, there's a high chance that IE won't support it. Javascript works in all javascript enabled browsers. Surely javascript is the better option?

As far as I know, IE supports a:hover, but not :hover on any other kind of tag. So it would not be problematic.

[JonnoTheDev]

Needs colour and lose the background. Bit like a newspaper.

[nrg_alpha]

If you use CSS to do your hover stuff, there's a high chance that IE won't support it. Javascript works in all javascript enabled browsers. Surely javascript is the better option?

 

I think it largely depends on how it's done.

Consider this quick example I whipped up. It is a CSS sprite image that relys on pure CSS hovering for rollover effects (I embedded the CSS to show how it works [as a rule, I put stylesheet rules into a separate .css file, but included it in this html file for convenience's sake]). It works in IE 7 (don't have IE 8 installed to test it on that). You can right-click and view sorce to see how it all works. The one crux here is if there is no href attribute within the a tag, that will break the hover effect in IE 7. But since rollovers are typically links anyways, I think the lack of the href attribute is [more or less] a moot point.

 

Can't speak for IE 6, as I don't develop for it anymore.

 

The other additional advantage of using CSS as a rollover effect over using javascript is that even if the end user has their javascript disabled, the hover / rollover effect will still work. Perhaps one downside to all this is that the speed of CSS execution may be dependent on which browser you're using. Some might render those css changes faster than others.