CSS- Where to start and is this the best way to go?

[litttlechica]

I am writing the website for our coffee company. I have actually already thrown together a site using the Dreamweaver trial that we are using until I can make something really professional and organized.

To give a bit of background, I know html to an extent and what I don't know, I usually just google. I have been going through CSS tutorials to teach myself and looked at some samples online. Is CSS the best way to go about this? It seems like the way of the future so to speak and seems really organized once you learn it.

Are there any really good resources for this? Any good places for layout ideas? I am trying to incorporate a lot on our home page - videos, pictures etc and I want it to be professional and not cluttered.

Thanks!

 

[KIAman]

http://www.w3schools.com/ is a great reference for learning CSS. And yes, you should be learning CSS if you want to continue to web develop.

The question becomes, how much CSS should you learn? Considering there are a ton of resources to build CSS templates for you, maybe you time is better spent on understanding how CSS works and debug rather than becoming a CSS guru (unless you want to).

 

[Cogman]

Second for the w3schools. CSS is really a requirement if you to do anything professional.

Almost equally required is some knowledge of a server side language.

 

[Markbnj]

For layout ideas and some impressive examples of what can be done with CSS, check out http://www.csszengarden.com/

There is just the one page, and a menu that redisplays it using different CSS treatments submitted by various designers.

 

[Ken g6]

From [post=30765660]a post I made awhile back[/post], some tools that will make learning easier:

2. Get Firebug. Firebug lets you see what's going on on any page with HTML, CSS, and Javascript; plus you can modify CSS and execute your own JavaScript, all from within the browser!
3. Get Stylish. With Stylish, you can change the CSS on any page any way you want, in real time! Also look at styles others have made and learn from them. Try out their techniques on sites you want to restyle. Try using FireBug to identify the elements you want to restyle. When you can restyle any site, you can certainly style your own site!

Oh, but don't forget that every browser is different. Make sure to test your site in all the popular browsers. IE6, IE8/9, Firefox, Chrome, and maybe Opera ought to do it, unless you need mobile device support too.

 

[Kr@n]

+1 CSS Zen Garden
+1 Firebug

I found the Mozilla Developer Network (https://developer.mozilla.org/en-US/docs) quite helpful too (well written, with a lot of examples, etc.)

 

[litttlechica]

Thanks, guys! I haven't had time to sit down and keep workin on this since I posted but I plan on looking into all these resources ASAP. If anyone has more, I will keep checking this thread and will post if I find anything else helpful.

 

[PhatoseAlpha]

Ah, Zen Garden. Where we don't talk about vertical centering.

 

[Markbnj]

Ah, Zen Garden. Where we don't talk about vertical centering.

I don't know what they don't talk about, because CSS still makes my brain hurt after ten years of futzing with it. But they do get some mighty pretty stuff out of it.

 

[Cogman]

Ah, Zen Garden. Where we don't talk about vertical centering.

Vertical centering? Horizontal centering is convoluted enough in a cross browser environment.

CSS certainly has its limitations, the biggest being peoples reluctance to update their browsers. (or in windows 2000's case, their inability to update their browsers).

There were somethings that I wish stayed in CSS 2.0. The print media support would have been nice. I would love to be able to use HTML as a straight forward PDF replacement.