HTML and CSS for newbie

Question

I wanna start HTML and CSS. Did you guys have any idea about how and where to start? Thanks

Answer 1

I don't think you can just "start", you have to have a specific project or goal in mind. What do you want to build or accomplish with HTML and CSS? Can you edit your question to provide specific examples?

Answer 2

w3schools.com has a lot of documentation, but like Jeff said you should have a specific project that you want to work towards and then learn as you go.

Answer 3

Head First HTML with CSS & XHTML is a good book to give you an overview of what you can do with HTML and CSS.

Answer 4

Like Jeff said, the best thing to do is just find (or create) a project to work on. That will give you something to start with.

When I started, I would find a website and try to duplicate its layout without looking at the implementation of the site at all. Do it all from scratch, only using the layout as a guide for construction.

W3Schools is a great learners resource to help you start out. So is QuirksMode.org once you get started since it contains a reference of what is supported and what isn't. CSS Beauty is another good resource that contains lots of miscellaneous web development tutorials. A List Apart is targeted more towards intermediate/advanced web developers but it can give you some good ideas once you get going.

An interesting project I'd recommend trying out is making a layout for css Zen Garden. It contains a basic HTML page that is structured in a way that is totally presentation agnostic, which lends itself to learning good CSS practices. You could start by downloading their barebones page and trying to create your own layout from it. Check out their gallery of creations to see what can be done using the same markup but different CSS.

Answer 5

This site is a really good resource for beginners. I've used it many times; works wonders.

Answer 6

I agree with dan css Zen Garden its great you could download some examples and check the correct way to do things. it is also very helpful to subscribe to smashing magazine RSS, they have constant tips for all kinds of things on the web.

Answer 7

There are a lot of great suggestions in here. But I know a lot of new developers that I've talked to didn't 'get it' until I showed them this article: How To: Pure CSS Design

Answer 8

W3Schools have got very good tutorials to make a start.

http://www.w3schools.com/html

http://www.w3schools.com/css/

Answer 9

I've found that when you start delving into a new language, and start trying to research it by doing google searches, it can be difficult to tell the good results from the bad. It takes awhile to separate the good resources from the bad and to spot the red flags in questionable resources.

There are several people and resources that are more trustworthy than others. Via a search, you might land on some unknown person's page giving bad advice about HTML. Or you might find top-notch, well researched wisdom being imparted by an industry thought leader.

Some 'thought leader'-type individuals in particular include Eric Meyer, Jeffrey Zeldman, and Dan Cederholm. This extremely short list leaves out a boat load of other amazingly brilliant and influential people, but you can't go wrong reading the blogs or books written (and/or co-written) by these individuals. And take notice of the other resources and individuals that these 3 gentlemen refer to in their writings - almost certain to lead to other high quality reference material.

A few other websites to bookmark include A List Apart, 24 Ways, Think Vitamin, and Scroll Magazine. Anyone who has written articles for these sites is worth paying attention to.

Also, have a look at some of the past, present, or upcoming speaker lineups from web design/development conferences such as An Event Apart and Head Conference. These folks are sure to be good sources of information as well.

For what it's worth, I posted a list of HTML and CSS learning resources as a supplement to the CSS presentation I gave at the June Sacramento Web Design Meetup (link). This is a hand picked list by a professional CSS developer and not a random pile of search engine results =)

As a general rule, I would not trust any HTML tutorials where the tags are written in all caps. And (very generally speaking) I wouldn't give much weight to resources over 4 or 5 years old (not a hard and fast rule, but worth mentioning).

As far as software goes, all you really need to get going is Notepad (PC) or TextEdit (Mac) and a web browser (Firefox with the Firebug and Web Developer Toolbar plugins). However Notepad and TextEdit are extremely limited so I'd recommend using Notepad++ on the PC (free download) or TextMate on the Mac (39 Euros). (Keep in mind, the topic of text/code editors is a highly subjective one and endlessly debated).

Answer 10

If you want to learn CSS for real, ‘CSS: The Definitive Guide’, 3rd Edition by Eric A. Meyer (0596-527330) from O’Reilly is pretty great.

O’Reilly’s ‘HTML: The Definitive Guide’ is pretty good too.