Final Resource: CSS

CSS is worth 10 points.

Again I’m looking to see if the CSS is:

VALID:

There are no errors in the way you wrote the CSS. Web Developer Toolbar also has link to validation (if the page is uploaded) and you can get this through software like Dreamweaver.

SEMANTIC:

Here I’m mainly looking to see if your CSS class and ID names make sense. They should be general and describe the kind of content that’s being styled and as much as possible not refer to specific design things like Color, Alignment and Size. For example
WRONG: .blueTitle{color:blue;}
RIGHT: .sectionTitle{color:blue;}

This way if you make changes to the design the CSS class and ID names stil make sense.

I won’t take off a bunch of points for the following items but they are important in the long run and if someone is looking at you CSS will help differentiate the pros from the amateurs.

ORGANIZED:

Start with general styles. Usually tags like body, h1..h6, p and so forth.
Then There are ids and classes that could appear on every page such as #header, #navigation, #footer, .maincontent, .subtitle
And finally you can have sections for classes that are specific to certain pages of the site.

Use comments /* comment here */ to help organize the different areas listed above.

EFFICIENT:

Sometimes when you’re first starting it’s tempting to put classes on everything. Most of the time you can get by with giving id to divs that contain a section and then styling the section. For example if I have a sidebar where I need to style the h2 and p elements differently than the rest of the page (maybe a different color or font-size or whatever) then instead of giving classes or IDs to the h2 and p elements I can just use the ID for the section:
<div id=”sidebar”>
<h1>lorem ipsum</h1>
<p>dolor sit amet</p>
</div>

#sidebar h1{ color:#fff; }
#sidebar p { color: #eee; }

Writing CSS Selectors:
http://webdesign.blogs.peopleio.net/basics/css/css-selectors/

CSS3

CSS3 is not required but something I know you’re all interested in and so here is some information on it.
http://www.teachingmultimedia.com/mmp240/css3/

Tools that let you write/edit CSS3:
http://css3please.com/
http://css3.me/
http://www.css3generator.com/

One response to Final Resource: CSS

  1. [...] View Full Resource [...]

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright © MMP240 Fall 2012
Just another BMCC Multimedia Blogs site

Built on Notes Blog by TDH
Powered by WordPress

That's it - back to the top of page!