Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Southerner

macrumors member
Original poster
Oct 26, 2005
68
0
The deep south of England
I'm hoping you guys may be able to help me out on this one:

Apparently a couple of clients have requested websites to be designed using CSS, I deal with very little web design as I mostly work in print however I have a pretty good knowledge of HTML but in fact none in CSS, so I am pretty stressed out and I cannot afford to lose these briefs.

I am quite happy to do these websites, if these were created from purely HTML which wouldn't be a problem otherwise, but I have zilch experience in CSS. I've been browsing around the web and researching how to learn CSS from scratch at a beginner's level, the downside is the information from various sources are contradicting - telling me to do this and some telling me to do the other - making me confused and less confident.

It annoys me when I read around the web and in magazines of savvy designers going on about getting involved with CSS like it is "oh so easy peasy" which I got the impression CSS was far easier to deal with than HTML but it was definitely not the case for other people because otherwise everybody would be doing this and there would not be much demand for web designers...

After trying out a few tutorials, I felt a bit disheartened finding I cannot design web pages using CSS very well and would like to be successful in this area. Sadly I am not a quick learner which I envy people who are.

So does anyboody know of any tutorial sites and learning materials of CSS at an extremely easy/basic level to begin with because I am a quite slow learner?

Many thanks!
 
Well with the web there is very often more than one right way to do things and is possibly why you're finding "contradictory" information. Below are some reading materials. Also be sure to check out the Sticky in this forum because it has a lot of great links.

Whether CSS is easy to learn depends on what you compare it to. Comparing to HTML it's only slightly harder to learn. Comparing to Java, it's easy peasy. In any case if you run into specific problems just post a thread here and someone will likely be able to help you out.

 
I would suggest you just go out and a buy book. $25 and bang, problem solved.

The issue with learning from web sites is that there are very few sites which really step through the basics without just jumping straight ahead. If you don't get the box model, then CSS is automatically lost on you. Yet I've rarely seen the box model adequately described.

Also, buy the program CSS Edit. It will help you get the work done but it will also help you learn.
 
If this is a business question....

Hrm, guess it depends how much your time is worth. Why not outsource the XHMTL and CSS. You can learn XHTML and CSS, but let's face it, you can't learn it overnight (I don't know everything after 3 year of learning it), or pay a firm 200 bucks to cut, xhtml and css the templates for you?? Could be a quick fix while you learn it. Just a thought. Smart people hire smarter people :)
 
I found CSS: The Missing Manual by McFarland to be very good. Great explanations and examples that you can do yourself. The author also brings up cross-browser compatibility issues.

I am still a bit of a beginner but have found that CSS is pretty easy if you are willing to take the time.

Good luck :D
 
I would like to second the books recommended by Kern. I have them both and found out I only thought I knew CSS before buying them.(bulletproof web design mostly)

I also agree with Chicoweb. As if learning CSS on the spot isn't enough you will also have to contend with 'hacks' involved in making them render correctly in IE5 and IE6. I am not sure if you have to wrestle with IE5 but without knowing CSS I can't imagine it being much fun.
 
As previously stated, W3 schools is a great free resource, but picking up a xhtml + css book will really help if you run into trouble. I recommend Designing With Web Standards by: Jeffery Zeldman if you want the how and why... if you just need examples, there are quite a few decent xhtml/css books.
 
and Eric Myer on CSS, which is a bit old school, but great fundamentals
http://www.amazon.com/Eric-Meyer-CSS-Mastering-Language/dp/073571245X/ref=pd_sim_b_img_26

I second this book - Eric Meyer is THE stylesheet go-to guy.

However, if you're just starting out, learning an encyclopedic catalogue of CSS rules won't really give you practical application - for this I recommend acquiring The Zen of CSS Design, which will give you a bit more of an application of CSS, and that'll give you a leg up in real-world use. He's got a website as well, csszengarden.com, which I'm sure you've already run into..

With these two books you'll have a pretty heady grasp of the structure of CSS ad how it's used to make snappy websites.
 
As an Amazon Associate, MacRumors earns a commission from qualifying purchases made through links in this post.
I just went through much the same process, actually. I was an HTML "expert" from way back, and I know my way around doing many things in HTML, but when I was given the opportunity to completely rebuild a website from scratch last month, I decided I was going to do it right, using XHTML and CSS (done in PHP, actually). It was a bit of a learning curve to get where we're at now, and there's still tons to learn.

The easiest thing I found to start doing in CSS was making style shortcuts. Like if I wanted my site to use Verdana for paragraphs, and play with the text size, I used to always do it in HTML, after every <p> tag I would add a <font face="Verdana" size="-1"> tag. Of course do this often enough (or automated with a tool like Dreamweaver) and your HTML code becomes an unreadable mess. So setting up a CSS style to say "let ALL <p> tags be rendered in this font and this size" was a good start.

Basically the goal is to completely decouple your content from the appearances.

The biggest challenge for me was breaking away from the model of using an invisible table to structure my pages into columns and sidebars, and using CSS <div> blocks instead.
 
I don't really like anything by Eric Meyer to be honest. The designs are generally poor and although the CSS may be good, I find his examples are not the best. I would really recommend the Zeldman orange book - maybe updated. I realize that this book is not chock full of examples, but it is an outstanding overview to why you should be using CSS and the philosophy behind it, and is great in conjunction with a more example driven book.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.