I'm very interested in learning web development and have learned some basics regarding HTML and CSS a few years back from W3Schools, but I never learned how to develop websites that are up to today's standards, i.e. free-flowing sites without the use of tables to govern the design of the site.

What are some good resources that I can start with?

  • 4
    I'd suggest avoiding W3Schools as a learning tool. You can read why here: meta.stackexchange.com/questions/87678/…
    – aslum
    Commented Jan 27, 2015 at 17:31
  • 1
    I would suggest that if w3schools works for you you use it. Yes there is a chance something is not acurate, nobody its perfect. I have reported them some issues on some pages where I detected an error. A lot of people has corrected my primitive english skills on this very site. I have even participated a liiitle bit some issues years back tho the w3C itself when a new draft was launched. There is no pont in trying to "ban" a site, but to improve it.
    – Rafael
    Commented Aug 2, 2016 at 16:23

8 Answers 8


The best way to learn how to create websites and applications is to actually do it, meaning you should create projects, and to do it all the time. This short video conveys the emotions of a newcomer and gives some good advice on the subject.

I also wrote some other recommendations for people interested in learning web development that you should give a read before you start.

However, just as you can't speak languages you don't know any words in, you need a good understanding of the basics before you can build a useful project. Here are some resources to pick up some some basics and sites that let you explore for yourself.

There are great places to learn the basics of web development for free. Start here, but branch off of them to play around with things they don't directly teach. After going through a few, try making other sites/projects on your own from scratch. Doing so will reinforce the concepts, teach you implementation details, and likely teach you additional things as well. You simply can't become a good developer or designer by reading only, you must create!

I made a crash course for designers learning web development

Check it out! They're tailored for a design based audience but apply to anyone learning. They teach the basics in the slides/post/video then assign a small project at the end of each to teach real-world front-end development.

Other good tutorial websites

  • CodeAcademy - General knowledge basics of several languages.
  • Mozilla's "Learning the Web" series - This starts at the beginning level and can guide you into some more complex topics. Great resource, I highly recommend it.
  • Udacity - General web development class.
  • Tuts+ - Tutorials on more specific topics.
  • KhanAcademy - I haven't used it personally, but it seems to be getting better every day.

Don't use W3Schools, it is generally outdated and very error prone. Instead, use a tutorial website like the ones above to learn and use one of the documentation sites below when you're looking for something specific.


Looking at documentation for properties, libraries, and such is vital to becoming a good web developer. The following are among the best docs you can use:

  • W3.org - The official documentation for most everything implemented by web browsers. Learning to read these docs is very important! This is not affiliated with W3Schools in any way.
  • Mozilla Docs - A very reliable 3rd party resource from the creators of FireFox that stays up to date.
  • WHATWG.org - A sort of open source competitor to W3; some browsers implement certain suggestions from here over W3 at times.
  • DevDocs - Not official, but has a lot of languages docs on one site. Quite convenient.

Useful feeds

  • WebPlatformDaily - A list of news dealing with everything web updated daily (except weekends).
  • SitePoint - Really useful articles on various things.
  • WebDesignerDepot - Can be on the spammy side, but most of their actual articles are good.
  • Smashing Magazine - More advanced topics, but mostly all good reads.
  • A List Apart - A bit more advanced knowledge in blog form.


Small projects/playing with code

  • JSFiddle - Make little projects and keep track of them.
  • CodePen - Look at other people's code doodles and submit your own for others to see.

Full text editors

Other useful websites

Look for web developer's and designer's personal blogs that you like. They often have great, great content.

I have also written up an intro to UI design which could be very useful. I linked some additional great resources in it.

I cannot stress enough, the best way to learn is to build things that push your limits and to do so continually.

For an even larger (and perhaps overwhelming) list of helpful web related sites, checkout WebDesignRepo!

  • 1
    I would add Lynda.com. As far as editors if you're on a Mac you should get BBEdit or use the free version textmate.
    – user9447
    Commented Mar 12, 2015 at 2:14
  • 1
    I completely agree but would like to add that I would advise to shy away from frameworks in the very beginning. Learn how to crawl before you learn how to walk. This will give you a much better, solid base to continue learning form in the future and will help you create beautiful, structured and semantic webpages.
    – Summer
    Commented Jul 20, 2016 at 11:34
  • @JaneDoe1337 that depends on who you ask. At times a framework is easier to learn and assists for a quicker deployment. Also, after learning the basics of a framework you can alsways come back and tweak overtime as you should if the framework is well adopted and better options are present.
    – user9447
    Commented Jul 21, 2016 at 5:40
  • @Darth_Vader that's why I said it was my advise ;) My personal experience is that people generally don't go back and learn the basics, leaving them with a lack of knowledge in certain parts.
    – Summer
    Commented Jul 22, 2016 at 7:48

CSS Zen Garden

Check out CSS Zen Garden and flip through end various results. They're very versatile and provide a lot of difference over the same source code. You will learn much about modern CSS techniques. Even if you don't dissect them completely you will at least find a lot of inspiration and CSS abilities against normal accessible HTML. The great thing about CSS Zen Garden is semantics against style. Content is not styles whatsoever. Everything you see styles is done purely by CSS which is the correct way of doing it, because data can be consumed by many different clients, and style only by those that visualize it.


When it comes to learning from books this one looks very like a good start CSS: The Missing Manual.


I read Smashing Magazine on the internet that provides a lot of examples and approaches. It spans articles from the design business to great approaches in web design and alike.


Best places for me about learning about web design (layout solutions, usability, graphics and technical solution) are those:

look at all the website of the people that wrote articles in those websites:

A list apart

Or something more technical about list design, and floating http://css.maxdesign.com.au/index.htm

You have to know what are web standards. The official source is this: World Wide Web Consortium (w3c) It is a bit tricky to learn from there because it is highly technical, but it is good to check it out when you want to know on how things work on the web and why about the standards. the most useful thing it is the Validator of your HTML code.

One best way it is having a good look at the source code of good websites, and naturally the proportion of things aligned like those to learn the tricks: http://www.cssbeauty.com/

And Look at website of good web designers and what they are doing:

Jason Santa Maria
Dustin Curtis
Joshua Davis
David DeSandro

and my Delicious bookmarks (there is a variety of things, you have to dig through them and skim what you do not need) http://www.delicious.com/Littlemad/webdesign


Before you start learning all those frameworks...

I want to redirect your attention towards the design part of web design.

Of course, you can easily build a website with Bootstrap or some other framework. But that's not designing. A framework can be a basis, but if you don't put your own spin, you'll basically get a website that's just like all other websites out there.

That's why I'd advise you to learn the basics of design and try to apply those on your own.

How do you make (beautiful) websites on your own?

Now that is a question worth a book, but here are a few pointers:

  1. Read about the basic principles of design. This 7-step primer in web design should help you get started. Also, this series of articles on Smashing Magazine.
  2. Observe other people's designs. What of the basic principles did they use and how? But don't just observe, note your observations.
  3. Design with the business goal in mind. A web design exists to to help a business realize its goal and to help the user achieve their own goal. When the 2 goals converge, everyone is happy. So, that goal should be your starting point, always. You should base each design decision that you make on this goal—font choices, colour choices, layout, etc.
  4. Make sure there is harmony throughout your design. In general, this means harmony between the message you want to send, the colours, the fonts, the mood of the website and the brand. Start embedding harmony in your designs by using a modular scale to guide your sizing decisions. This mini-series explains more about harmony and using a modular scale.
  5. Read this amazing introduction to typography: Butterick’s Practical Typography or, at least, this summary of it

Try to design from scratch

Now, when you're done reading about all these things and you know HTML and CSS, you'll be able to do your own very simple design.

Try to design a single page with just text, in black and white.

Why just text? Because text is by far the most used medium to convey a message on the web. Therefore, it's fundamental for you, as a web designer, to be able to make text look good and be a pleasure to read.

Why black and white? Because choosing colours is yet another beast. Taking small steps will make you feel happy about the progress you're making and will help you learn quicker.

Apply the basic design principles you learned + use the observations of other people's designs + think about the goal of that page + size the text using a modular scale.

  • "I want to redirect your attention towards the design part of web design" Oh my god, how much wisdom in this sentece! There are not enough happy faces on this site for this :o)
    – Rafael
    Commented Aug 2, 2016 at 16:29

Best way of learning is making things so make yourself a website.

Read standards, alistapart, tutsplus.

If you need a book look at SitePoint's - HTML Utopia: Designing Without Tables Using CSS.

Some thoughts about csszengarden and W3Schools.

  • Sounds more like concepts, but it sounds like what's wanted is semantics and really simple step by step things.
    – dkuntz2
    Commented Jan 16, 2011 at 23:23

Honestly, I would start by learning how to develop WordPress sites. Yes, I can code a site using HTML, CSS, PHP, ... but I can put together a WordPress site faster and then customize as I need to.

If you are looking to start off just learning today's standards then I would recommend http://nettuts.com/. It would also be beneficial to get the premium membership and get access to some great tutorials. If going from PSD to HTML is something you are interested in, they cover that.

Nettuts is part of Envato. Envato has several of tutorial sites that cover web development, wordpress, vectors, photo and video editing and much more. It's a great place to start.

Just my 2 cents.

  • 2
    "Honestly, I would start by learning how to develop WordPress sites. Yes, I can code a site using HTML, CSS, PHP..." You'll need to work with both CSS and HTML to develop a WordPress site, surely?
    – e100
    Commented Feb 20, 2012 at 17:29
  • I disagree, the OP would tend to learn rules and basics focussed on wordpress. A clean, basic knowledge of the language will get you further in the long run, when trying to learn other languages or solving problems.
    – Summer
    Commented Jul 20, 2016 at 11:32

For beginners of Photoshop on Web design, I'd recommend this site http://psdvibe.com/


The are a lot of websites with tons of tutorials. However, the best platform to learn webdesign is http://teamtreehouse.com/. Hope it helps! Nik

  • 2
    Whilst this may theoretically answer the question, it would be preferable if you could include a few words as to why this particular site is better than others...
    – Farray
    Commented Mar 1, 2012 at 23:37

Not the answer you're looking for? Browse other questions tagged or ask your own question.