Team 955

[Karma]

Here is our team website. Myself and our teams head programmer built the site. A CSS based layout, we hoped to achieve a more design inspired layout, rather than a content based. Hopefully it's easily navigated. There is an easter egg in our CSS code, and the first person to find it wins a cookie (virtual cookie). Any feedback would be appreciated.

[theory6]

In terms of aesthetics, I'd say this website is extremely well laid out with awesome contrast between different elements in the site. However, although you mention a "more design inspired layout" content also makes up a large proprotion of the website's impact. If you add more content you will definitely be a better contender for the web award.

A tip: Your header image is really well taken. Wouldn't it be better if it changed for a different link within the website?
Also your FIRST logo seems a bit pixelated.

Other than that I say you've done yourself proud

BTW: I cant seem to find anything "unusual" about your style.css coding. Is it a syntax easter egg or are there specific words that I should be looking for?

[probizzle]

Congratulations on a job extremely well done.
Very clean and easy to navigate, I think you've accomplished your goals very well.

Adding content is important though.. and should be your next project.

[Karma]

Originally Posted by theory6

In terms of aesthetics, I'd say this website is extremely well laid out with awesome contrast between different elements in the site. However, although you mention a "more design inspired layout" content also makes up a large proprotion of the website's impact. If you add more content you will definitely be a better contender for the web award.

A tip: Your header image is really well taken. Wouldn't it be better if it changed for a different link within the website?
Also your FIRST logo seems a bit pixelated.

Other than that I say you've done yourself proud

BTW: I cant seem to find anything "unusual" about your style.css coding. Is it a syntax easter egg or are there specific words that I should be looking for?

I really appreciate the feedback. I'm the designer, so I'm not too concerned about content But there will be more added eventually. I took the picture for the banner, and it seems to be the thing every notices first, probably because it's huge.
Look at some of the values in the CSS. That's the only hint you get.

[kirish]

I really like the design; clean and eye-catching. As my team's webmaster, I struggle at making things look good, even though I am fine at the coding. Excellent job.

As for the easter egg, you used your team's number, #955, for the color of your links on hover. Good thing that color looks good, or else you would have had to re-register your team!

[lookslikeapuma]

Originally Posted by Karma

I really appreciate the feedback. I'm the designer, so I'm not too concerned about content But there will be more added eventually. I took the picture for the banner, and it seems to be the thing every notices first, probably because it's huge.
Look at some of the values in the CSS. That's the only hint you get.

well here's some abnormalities in the CSS code i've found, but haven't actually found the 'egg' yet.

(text indended -9000px, thus rendering it out of screen? I've turned off CSS Style sheets on firefox, found no secret text though.)
#first a {
text-indent: -9000px;
background: url("/first.gif") no-repeat top left;
display: block;
height: 216px;
width: 250px;
}

(The content linked to this class might contain something, and since display is set to none, it will only be visible in the code, however i haven't found anything linked to this class)
.access {
display: none;
}

[Kamikaze]

Kirish found the egg. So a cookie to him.

The weird CSS is intentional and is used to hide elements from graphical browsers. The text indent method is known as Rundle's image replacement technique. The other method is the Fahrner image replacement technique (though I'm not replacing an image).

The reason I used the first is because I dislike images in the design that serve no purpose in the content. So the FIRST logo is inside a text link that is hidden unless you are using a screen reading program or text browser.

The FIR is used to put a "Skip Navigation" option in a top menu. I ended up not using a top menu (the sidebar markup is all at the bottom of the html document), but the class got left in the CSS. The skip navigation link is only used for text browsers where a long menu at the beginning of a document can be annoying.

There is a problem with FIR where some screenreaders will actually interpret "display:none;". However, that's not really a problem with just a skip navigation link.

Here's a related article that might be helpful: http://www.stopdesign.com/articles/replace_text/

[activemx]

Good job on the website. Nice clean worpress layout. There are many WP pluigs available now. I am working on couple, like an image gallery supported by tags. Something like flickr.