About This Guide

About This Guide

Between 2010 and 2020, the market for web design jobs is projected to experience a 21.7% year-on-year growth. The prospects are also quite good in the short-term. While the median annual salary for web developers is $77,000, those who can create the topnotch online web experiences that keep web surfers engaged can fetch salaries north of $100,000/year. The demand is so strong that coding bootcamps have popped up around the country to train new front-end web developers, offering the ability for smart young individuals to gain valuable skills in an intense environment, often for a hefty price tag.

In tandem, there has been an explosion in the supply of websites, tutorials, ebooks, and online courses that can help you achieve the same goal for a fraction of the price. So we decided to create a guide for eager learners who don’t have $5,000 to $10,000 to spend on training. We’ve scoured the web and looked at hundreds of websites that claim to teach web development. We’ve seen the good, the bad, and the ugly. The net result is this curated collection of online learning resources that will transform you into a front-end web developer.

These websites and resources come in many shapes and sizes. Here are the types of sites that we have collected:

Tutorials & Guides
There are thousands of free web guides and ebooks. We’ve hand-picked the best.
Online Courses
Courses represent a paradigm shift from guides and tutorials. Structured curricula and use of video will keep you more engaged as well as help you absorb more learning material. The course platforms at the higher end have slick user interfaces, high quality video, community forums, and coding exercises.
Live Instruction
The best way to learn is via live interaction and personal training, which can help you break through mental barriers quicker. This is similar to the experience you might get at a bootcamp but at a fraction of the price and basically the same career boost you'll enjoy when looking for a job.
Reference Content
Our reference section includes free and searchable repositories of information, where you can get exactly what you need, when you need it.

When I first started out learning HTML and CSS, a lot of the online courses, training guides, and tutorials that exist today hadn’t been created yet. I taught myself the hard way. I just started experimenting with HTML and CSS. I would take existing web pages and deconstruct the source code, trying to figure out everything fit together. When I ran into a problem, I would do a quick search on Google. These days, there’s a wealth of knowledge for anyone who wants to put in the time to learn.

Steven Hansen, front-end developer, mrc

Every Provider

In the course of creating this comprehensive list, we reviewed more than 140 resources where one could plausibly learn how to code. However, most had outdated content or provided a poor user experience. Many more were simply redundant: offering an experience that is similar to, but certainly not better, than the resources on this list. Those of you who are curious can view the complete list, but in this guide, we only focused on the very best.

A List Apart online web design magazine

Free, Advanced

www.alistapart.com

Learning JavaScript Design Patterns

Free, Advanced

Addi Osmani

JavaScript Enlightenment cody lindley

Free, Beginner

www.jqfundamentals.com

Learn JavaScrpt Didacto.net

Free, All Levels

www.JavaScriptenlightenment.com

Getting Started with HTML5 Guide Geekchamp

Free, Beginner

www.geekchamp.com

HTML & CSS Book Errata Wiley

Paid, Beginner

www.htmlandcssbook.com

KMDC Berkley learn multimedia web design

Free, Beginner

www.berkeley.edu

Eloquent JavaScript Marijn Haverbeke

Free, Beginner

www.eloquentJavaScript.net

Dive Into HTML5 Mark Pilgrim

Free, Advanced

www.diveintohtml5.info

Shay Howe HTML CSS beginner advanced guide

Free, All Levels

learn.shayhowe.com

Web Platform Web Development for Beginners

Free, Beginner

www.webplaform.org

Team Treehouse web design HTML CSS JavaScript

Paid, All Levels

www.teamtreehouse.com

lynda.com HTML essential training

Paid, All Levels

www.lynda.com

Tuts Plus Learn HMTL CSS tutorials

Freemium, All Levels

www.tutsplus.com

Learn by Doing at Code School HTML CSS JavaScript

Paid, Advanced

www.codeschool.com

front end masters learn HTML CSS JavaScript jquery

Paid, Advanced

www.frontendmasters.com

Learnable learn web design HTML CSS

Paid, All Levels

www.learnable.com

codeacademy learn html css JavaScript

Free, Beginner

www.codeacademy.com

general assembly dash learn html css JavaScript

Free, Beginner

dash.generalassemb.ly

Code Avengers program HTML CSS JavaScript websites

Free, Beginner

www.codeavengers.com

aquent gymnasium learn web development

Free, All Levels

gymnasium.aquent.com

learnstreen JavaScript

Paid, Advanced

www.pluralsight.com

skillshare learn webdesign

Free, Beginner

www.skillshare.com

infinite skilsl learn html

Paid, Beginner

www.infiniteskills.com

don’t fear the internet html css design

Free, Beginner

www.dontfeartheinternet.com

appendto developer learning center

Free, Beginner

learn.appendto.com

mozilla channel 9 html5 css3

Free, Beginner

channel9.msdn.com

p2pu school of webcraft

Free, Beginner

www.p2pu.org

saylor university learn html css

Free, Beginner

www.saylor.org

learnprogram.tv html css

Free, Beginner

www.learntoprogram.tv

udemy online courses

Free, All Levels

www.udemy.com

ALISON online courses

Free, Beginner

www.ALISON.com

Thinkful learn to code with a mentor

Paid, All Levels

www.thinkful.com

o'reilly tech school html css course

Paid, Beginner

www.oreillyschool.com

codemenor expert web advice

Paid, All Levels

www.codementor.io

dochub html

Free, All Levels

www.dochub.io

stackoverflow forums

Free, All Levels

www.stackoverflow.com

HTML rocks web development

Free, Advanced

www.html5rocks.com

move the web forward

Free, All Levels

www.movethewebforward.org

htm5 boilerplate

Free, Advanced

www.html5boilerplate.com

smashing magazines web design

Free, Advanced

www.smashingmagazine.com

HTML5 doctor

Free, All Levels

www.html5doctor.com

frontend rescue

Free, All Levels

uptodate.frontendrescue.org

HTML5 please

Free, All Levels

www.html5please.com

Mozilla Developer Network

Free, All Levels

developer.mozilla.org

Web Dev Handbook 2.0

Free, All Levels

www.alvit.de

Whatwg HTML The Living Standard

Competitive, No Cost

developers.whatwg.org

Code Pen

Free, Advanced

www.codepen.io

CSS Deck

Free, Advanced

www.cssdeck.com


Picking a side project that motivates you to learn how to achieve what you want using code is a great way to force yourself to pick up techniques. The key is that the side project's subject interests you beyond the coding - for instance some of my first websites were around video games websites. As the sites grew an audience this pressed me to expand my knowledge to improve them.

Jason, Self-taught coder & Founder at Potato, a 70-Person Web Development Agency

Tutorials & Guides

Free or Low Cost
Keep your hard-earned dollars in your pocket
Text-Based
Good for those who like to learn via reading and see text code examples

Shay Howe's Guides to HTML & CSS

Shay Howe's HTML CSS guides

Shay Howe bundles HTML and CSS into one learning block that is beginner-friendly and well organized. The text-based beginner guide is cleanly formatted for optimum readability and touches on the common elements of web design and development. There are no exercises to help you practice or hone your newly learned skills, though.

Those who have the basics can continue with his advanced guide, which expands the concepts previously learned and specifically aims to help designers broaden and shore up their HTML, CSS and jQuery skills. Good content organization but — like the material that precedes it — lacks any attempt at learning reinforcement through assignments or hands-on coding.

BookmarkShay Howe's Guides to HTMLGo to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

HTML 101 at Berkeley Knight Digital Media Center

KMDC Berkeley Learn HTML CSS 101

While this resource is provided by a very credible source, its intended audience is not hardcore developers but career journalists and communication professionals. This makes the content great for non-techies and complete beginners but not so much for people passionate to learn more about web design and development.

HTML 101Go to
Subject Areas HTML
LevelBeginner
PriceFree

Web Development for Beginners from WebPlatform

Web Platform Web Development for Beginners

Web Development for Beginners is a survey of the essential skills necessary for a web developer to be able to execute code efficiently and effectively, even with little to no skill. It not only goes over a history of web development, but also highlights specifically important elements in HTML, CSS, and JavaScript.

Web Development for BeginnersGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

The HTML & CSS Book from Wiley Books

The HTML & CSS Book

The HTML and CSS Book is a comprehensive manual to all aspects about CSS3 and HTML5. Similar to any engineering manual, the HTML and CSS Book covers all topics related to web design in an encyclopedic, reference-oriented manner.

The HTML & CSS BookGo to
Subject Areas HTML, CSS
LevelBeginner
Price$23

I think understanding the flow of CSS elements is a key breakthrough moment. I think the best way to have this breakthrough is a combination of experimenting and reading tutorials, with more emphasis on experimenting.

Alex Zorach, Self-Taught Coder, Founder of RateTea.com

Getting Started with HTML5 from Geek Champ

Getting Started with HTML5 Guide Geekchamp

This online, text-based resource is easy to follow and is expertly organized into bite-sized sections. The tutorials aim to help learners master HTML 5 and have an introductory course on CSS3 on standby for users who want to learn CSS3 fundamentals.

Getting Started with HTML5Go to
Subject Areas HTML, CSS, JavaScript
LevelBeginner
PriceFree

Dive Into HTML5 by Mark Pilgrim

Dive Into HTML5 Mark Pilgrim

Mark Pilgrim's reference book, Dive Into HTML5, is a guide to the new elements unique to HTML5. The author frequently uses puns and humor to make his point, such as "Let's call it a Draw(ing surface)" on the chapter about the canvas element, and provides a witty overview of all things HTML5.

Dive Into HTML5Go to
Subject Areas HTML, CSS, JavaScript
LevelAdvanced
PriceFree

A List Apart: The Online Magazine for Web Designers

A List Apart: The Online Magazine for Web Designers

A List Apart is a compilation of articles and blog entries to help developers get an edge when building custom websites from scratch. With over 380 articles and counting, A List Apart combines professional web development writers and columnists with a reference-style article listing in a modern, blog-like atmosphere.

BookmarkA List ApartGo to
Subject Areas HTML, CSS, JavaScript, Design
LevelIntermediate/Advanced
PriceFree

I spent a lot of time on sites like A List Apart, Smashing Magazine, and Stack Overflow just absorbing as much information as a I could. Constantly doing tutorials was how I picked up on different skills and techniques.

Todd Hamilton, developer and founder of OpenKit.io

Learning Javacript Design Patterns by Addy Osmani

Learning JavaScript Design Patterns Addi Osmani

Learning JavaScript Design Patterns is a book with one central purpose: to enlighten the user on typical and classic methods of organizing JavaScript programming flow to facilitate the functionality of the code. The book is aimed at developers looking to organize and streamline their code development.

Learning JavaScript Design PatternsGo to
Subject Areas JavaScript
LevelIntermediate/Advanced
PriceFree

Eloquent JavaScript by Marijn Haverbeke

Eloquent JavaScript Marijn Haverbeke

A free gem of a book that's created for absolute newbies. The author surprisingly succeeds at communicating a highly technical subject into something so engagingly simple by being authoritative and casual at the same time. Marijn Haverbeke's smart choice of easy and light words is nothing less than — eloquence. Has the makings of a classic.

Eloquent JavaScriptGo to
Subject Areas JavaScript
LevelBeginner
PriceFree

JavaScript Enlightenment by Cody Lindley

JavaScript Enlightenment Cody Lindley

As opposed to a typical JavaScript book, which would go over a complete cookbook of JS recipes, JavaScript Enlightenment focuses on an examination of native JavaScript objects and nuances, such that the reader can gain a better understanding of the language as a whole. It intends to make it clear to advanced developers that library usage is not always the best or most attractive option in JS development.

JavaScript EnlightenmentGo to
Subject Areas JavaScript
LevelAll Levels
PriceFree

jQuery Fundamentals from Bocoup

jQuery Fundamentals Bocoup

jQuery Fundamentals is a site solely dedicated to the jQuery expansion of JavaScript, presenting all of the new add-ons. The reference lists useful examples within code snippets, which can be very helpful for new programmers looking for tips on how to use a certain element, and includes a built-in editor for each example. The website is great for fast and easy reference for any jQuery element.

jQuery FundamentalsGo to
Subject Areas jQuery
LevelBeginner/Intermediate
PriceFree

View Source on a web browser! - The front end code on a website is inherently open for you to view, so you can easily see how a website is built by inspecting the code. When you're starting out you can spot trends in how people are laying out their pages and what techniques are used, and later on when you've mastered the basics you can see how an innovative website has achieved an interesting effect.

Jason, Self-taught coder & Founder at Potato, a 70-Person Web Development Agency

Online Courses

Beginner friendly
Highly structured earning paths are great for newbies
The full package
Courses include instruction, exercises, and sometimes discussion forums

Team Treehouse Web Design Training

At Treehouse you can learn web development from the scratch in a number of languages. It has over a thousand video tutorials created by expert developers, quizzes, and coding challenges. On top that, there is a thriving community where you can seek and answers and have relevant discussions. There is also a strong focus on job readiness and it comes with a built-in job board. Deep Dives are available in:

HTML - Learn the critical elements that web professionals need to describe the structure and content of a web page

CSS - Study the language needed to change the visual appearance of your webpage and control color, font, spacing, and more.

JavaScript - Find out how to bring your page to life and interact with users. You’ll learn the important functions, techniques, and varieties of JS, and how to code apps.

For more details, check out our full review of Team Treehouse.

BookmarkTeam Treehouse Web Design TrainingGo to
Subject Areas HTML, CSS, JavaScript, Design, & more…
LevelAll Levels
Price$25/month-Silver; $50/month-Gold

HTML Essential Training at lynda.com

lynda offers an HTML essential training video, which covers the basics of HTML programming. The video is more than 5 hours long and consistsof a full overview of HTML programming, including fundamentals, text, images, links, lists, multimedia, HTML5, metadata and the header, and CSS integration. Once you've completed the course, lynda has hundreds more web design courses to choose from.

For more details, check out our full review of lynda.

BookmarkHTML Essential TrainingGo to
Subject Areas HTML
LevelBeginner
PriceBasic $25/month, Premium $37.50/month

Tuts+: Learn HTML & CSS in 30 Days

Tuts Plus is a network of unrivaled learning tutorials written by practicing development and design professionals. Most of the tutorials are completely free. The best tutorials and high quality structured courses are available via Tuts Plus Premium, its in-house training library. Two of the best free tutorials are:

30 Days to Learn HTML and CSS is 30-day course with lessons broken down into 10-minute videos. The course is designed such that on average the student watches one 10 minute video per day, going over topics such as establishing basic HTML coding techniques, to completing markup and verification of a finished website. The videos are ideally organized into a 4-week program, culminating in a final website project.

CSS3 Mastery is an aggregation of some of the networks best CSS tutorials, focusing on the intricacies and special features brought up by the introduction of CSS3. It covers essentials, such as "10 CSS Properties You Need to be Familiar With," to specialty cases such as "Getting Clever with CSS3 Shadows." Each portion of the session is focused into a specialized piece of CSS3 knowledge.

For more details, check out our full review of Tuts+ Premium.

BookmarkTuts+ Learn HTML & CSS in 30 DaysGo to
Subject Areas HTML, CSS, JavaScript, Design
LevelAll Levels
Price$19/month, $180/year

Learn by Doing at Code School

Code School is an interactive learning platform that specializes in HTML/CSS, JavaScript, Ruby, and iOS. The coolest thing about the platform is that each course is set up like a game and has a fun and quirky theme, complete with a theme song. Intermediate and advanced programmers will find it more useful than complete beginners, but there are eight introductory courses well suited for beginners that are completely free.

JavaScript Roadtrip covers the foundations of the language, such as values, variables, and file interactions. Each of the aspects has a corresponding video and 5 challenges with simple coding problems. And the best part is its free! It is part of a larger JavaScript path that is available to premium users

In the HTML/CSS Path you learn the fundamentals of design, front-end development, and crafting user experiences that are easy on the eyes. The path covers HTML5, CSS3, SASS, responsive design, and Compass, the CSS Authority Framework. In addition, you’ll have access to four supplemental Code TV screencasts that cover advanced topics.

For more details, check out our full review of Code School.

BookmarkLearn by Doing at Code SchoolGo to
Subject Areas HTML, CSS, JavaScript, Ruby, iOS
LevelIntermediate/Advanced
Price$29/month

Frontend Masters

Frontend Masters is geared towards web development students that already know the basics and want to take their craft to the next level. It features intensive courses in HTML5, CSS3, and newer JavaScript libraries like jQuery, AngularJS, and Backbone.JS from seasoned developers and authors. Get started with:

HTML5 & CSS3 - Learn the latest features of the evolving languages HTML and CSS from Christopher Schmidt, author of HTML5 Cookbook.

JavaScript & jQuery - Discover everything you need to know about JavaScript before diving into jQuery from Karl Swedberg, experienced developer and author.

BookmarkFrontend MastersGo to
Subject Areas HTML, CSS, JavaScript, jQuery, Design
LevelIntermediate/Advanced
Price$39/month

Build your First Website with Learnable

Learnable.com offers the course "Build Your First Website,"" which provides a comprehensive introduction to HTML and CSS, the essential languages for coding websites. The course goes through language fundamentals, developing the website, and publishing a website on the Internet. The course is based on the book Build Your Own Website The Right Way Using HTML & CSS.

For more details, check out our full review of Learnable.

BookmarkBuild your First WebsiteGo to
Subject Areas HTML, CSS
LevelAll Levels
Price$29/month, $149/year

Codecademy

learn to code html css codeacademy

Codecademy is a resource for beginning programmers with little to no experience and provides a constructive learning path for one of five languages. It presents digestible lessons in a community-based, achievement-driven atmosphere and offers courses on jQuery, JavaScript, PHP, Python, and Ruby. Beginners will like its built-in coding console.

For more details, check out our full review of Codeacademy.

BookmarkCodecademyGo to
Subject Areas HTML, CSS, JavaScript, jQuery, PHP, Python, Ruby
LevelBeginner
PriceFree

Being an environmental engineering major, I had very little exposure to web code when I first started learning. I wanted to get into web development because I love the idea of starting out with a blank canvas, writing a few lines and having a web page ready to go. I started by completing the courses on HTML/CSS/JavaScript and jQuery available on Codecademy. I finished these courses in about three weeks while holding a full time job. They give anyone learning web development a great foundation and laid the foundation for my entry into web development.

Yatit Thakker, Co-founder at Omninox Publishing

Build a Personal Website with Dash

Dash is an interactive online learning program from General Assembly that teaches you how to code via series of interactive story-based tutorials. You can expect to learn HTML, CSS, and JavaScript through tasks that are similar to what a real developer might do. It was originally an internal training platform but was so good that GA had to share it with everyone.

BookmarkBuild a Personal WebsiteGo to
Subject Areas HTML, CSS, JavaScript
LevelBeginners
PriceFree

Code Avengers

Code Avengers learn to program html css JavaScript websites

Code Avengers is a website designed by experts primarily for beginners, with courses in HTML, CSS, and JavaScript. The site is organized in different lessons for each language, which works well for both teachers and independent learners needing to learn about web programming.

Code AvengersGo to
Subject Areas HTML, CSS, JavaScript
LevelBeginner
PriceFree

Aquent Gymnasium

learn web development design aquent gymnasium

Aquent Gymnasium is an open course platform for front-end web designers that can bolster your understanding of HTML, CSS, UX Design, and responsive design techniques. Different courses cycle every month. The classes are geared towards those early in their career who intend to build professional websites but are still seeking to improve their skills.

Aquent GymnasiumGo to
Subject Areas HTML, CSS, JavaScript, jQuery, Design
LevelAll Levels
PriceFree

HTML Fundamentals from Pluralsight

pluralsight learn html

Pluralsight provides an introductory class on HTML Fundamentals, which covers HTML markup, the heart of any web application. The course is split up into videos, each one about a different element in the HTML specification, such as Text, Lists, and Tables.

HTML FundamentalsGo to
Subject Areas HTML
LevelBeginner/Intermediate/Advanced
Price$29/month

I would say fluency in web standard technologies is most important. When a designer has a fundamental understanding of HTML, CSS and (perhaps to a lesser degree) JavaScript, he or she will be able to realize their ideas rapidly in the browser. At that point, improvements to workflow can be made - CSS preprocessors, frameworks and libraries, markup alternatives, collaboration tools - they'll all improve a front-ender's process, but not without language fluency in the first place.

Ian Yates, Web Design Editor at Tuts+

Build an HTML and CSS Website From Scratch with Skillshare

skill share build an html CSS website

Build an HTML and CSS Website From Scratch from Skillshare is a course about creating a unique personal unique website without the use of specialized restrictive templates. In addition to learning code, the course goes over different layouts, responsive design for mobile, search engine optimization, and site planning. The course contains 56 video lessons and purchase unlocks lifetime access.

Build a HTML and CSS Website From ScratchGo to
Subject Areas HTML, CSS
LevelBeginner
Price$40

Infinite Skills: HTML5 Training Bundle

The HTML5 Training Bundle from Infinite Skills is a course that teaches a comprehensive survey of all things HTML, including the new HTML5 revision. The course is split up into different training videos, going over concepts ranging from simple HTML tags to advanced elements like mobile integration.

HTML5 Training BundleGo to
Subject Areas HTML, CSS
LevelBeginner/Intermediate
Price$100

Don't Fear The Internet: Basic HTML & CSS for Non-Web Designers

don’t fear the internet basic html css

Don't Fear the Internet is a site for learning web design specifically geared towards print designers, photographers, or other generally creative people who don't specifically want to become experts at web programming. Instead, the 7 video series demonstrates how to create a good looking website for those artistic types with poorly designed websites looking to revamp their poorly designed websites.

Basic HTML & CSS for Non-Web DesignersGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

MSDN: HTML5 & CSS3 Fundamentals - Development for Absolute Beginners

Mozilla channel 9 learn html5 css3

For those absolute beginners wanting learn web design and programming, Channel 9 on the MSDN has a course dedicated to those who have no experience whatsoever. The course is organized into 21 different videos, beginning with designing your first web page to new HTML5 concepts such as integrated video embedding.

HTML5 & CSS3 FundamentalsGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

My only advice to those looking to find a position in the world of web or front end development is to build up a portfolio-- there aren't any (good) clients that will hire you just because you claim you can produce a great design. Whether it's building/designing a website for yourself (either an interface mockup or an entire HTML/CSS website), or just doing one for fun, you have to prove your worth. I often get client work because of a pre-existing app or website I've built for myself-- the client sees your capabilities in a finished product, and will be willing to work with you.

Andrew Munsell, Founder at Wizard Apps

Web Making 101 at P2PU

P2PU Web Making 101 HTML

The School of Webcraft is a set of courses for learning web programming backed by Mozilla, the creators of Firefox. The free set of courses is distinct due to it's peer-powered system in which learning occurs in peer driven study groups and among collaboration between peers and mentors alike. Anyone can signup to learn or become a mentor, and all the courses are also offered in Spanish.

Web Making 101Go to
Subject Areas HTML
LevelBeginner
PriceFree

Saylor University: HTML and CSS for Beginners

Saylor university HTML CSS beginners

Saylor.org, a free education website which provides courses on various topics, has an HTML and CSS course which provides resources for beginner programmers. It is organized similarly to a typical university online course, requiring around 30 hours, with units of about 5-7 hours each. A 70% score is required on the final exam to pass the course.

HTML and CSS for BeginnersGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

HTML and CSS for Beginners on Learntoprogram.TV

Learntoprogram.tv HTML CSS beginners

Learntoprogram.tv's HTML & CSS for Beginners covers all the beginner elements needed to begin programming HTML webpages. The course not only covers the newer HTML 5 specification, but also goes over the legacy HTML 4.01 specification. The lessons are split up based on different elements in the HTML code, such as Lists and Links, and weaves in CSS usage into each lesson.

HTML and CSS for beginnersGo to
Subject Areas HTML, CSS
LevelBeginner
Price$50

Learn Web Design Anytime, Anywhere at Udemy

udemy web design html css

Udemy is the online marketplace where students can find instruction in any subject you can think of. It offers hundreds of courses in all aspects of web development and design. Anyone can start a course on Udemy, so price and quality varies and each course must be purchased individually. Udemy offers many web design courses. Some of the most popular are:

Become a Web Developer from Scratch! - This crowd favorite from Victor Bastos not only covers HTML, CSS, JavaScript, but also PHP, JSON, AJAX, and jQuery. This extensive course has over 240 tutorials!

HTML5 Beginners Crash Course - Learn the principles of HTML5 quickly and efficiently with Robin Nixon, the author of Learning PHP, MySQL and JavaScript. It assumes no prior knowledge of HTML.

Creating Responsive Web Design - For those craving some advanced content, consider learning to code for responsive design with HTML5 and CSS3 with Chris Converse, an experienced designer, developer, speaker, and author.

Learn Web Design Anytime, AnywhereGo to
Subject Areas HTML, CSS, JavaScript, jQuery, Design
LevelAll Levels
Price$20-$200/course

Get a Free Diploma in Web Development from ALISON

ALISON web development diploma

Alison.com has a Diploma in Web Design course, organized in 9 parts covering HTML, CSS, Adobe Dreamweaver, and just building, publishing, and designing web pages in general. The free online course is mainly an introductory course that uses a step-by-step approach in teaching how to create basic web pages.

Diploma in Web DevelopmentGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

.appendTo Developer Learning Center: Introduction to JavaScript and jQuery

append to developer JavaScript

.appendTo Developer Learning Center provides courses on JavaScript and jQuery without the need for registration or signup. The course is organized into 8 distinct lessons, starting with JavaScript 101, which goes through syntax and types, and progresses through Selectors, DOM manipulation, and jQuery. Each lesson is a video from around 30-40 minutes long.

.appendTo Developer Learning CenterGo to
Subject Areas JavaScript, jQuery
LevelBeginner
PriceFree

The first project should be something that is just a basic informational website, maybe four or five pages, basic navigation, limited or no JavaScripting, etc. Just completing a website from start to finish when you have little to no coding experience is a great way of discovering all the little things that come up along the way. Making sure to choose an "easy/simple" project at the get go helps solidify the basic concepts without becoming overwhelmed with new concepts or design goals too soon in the learning process.

Dan Abbate, Entrepreneur, Investor at Robotaton

Live Instruction

Mentorship
Direct access to instructors will help you break through major hurdles
Accountability
Having a relationship with the instructor keeps you honest and on point

Mentor Training with Thinkful.com

thinkful learn to code with a mentor

Thinkful.com is an online mentorship course website with a range of topics, from front end development, to programming with Ruby and Python. Instead of an exclusive course based on videos, Thinkful presents the student with a mentor to help them when building project websites over the stretch of the course. The course is three months long, with 7-10 hours of coursework per week .

For more details, check out our full review of Thinkful.

BookmarkMentor Training with Thinkful.comGo to
Subject Areas HTML, CSS, JavaScript, Ruby, Python
LevelAll Levels
Price$300/month

O'Reilly School of Technology: Introduction to HTML and CSS

oreilly school of tech HTML CSS course

Introduction to HTML and CSS, a course by the O'Reilly School, is a mentor-based course program developed to teach the essentials and fundamentals of HTML and CSS for website design. The course works through different lessons, resulting in project websites that are submitted to mentors for review and grading. The course costs entail the construction of HTML elements and CSS tie-ins.

Introduction to HTML and CSSGo to
Subject Areas HTML, CSS
LevelBeginner
Price$400

Codementors: Instant help for Coding

codementor web development design advice

CodeMentor is a unique service which instantly connects prospective web developers who need a professional critique on website development. Unlike courses that involve mentorship, CodeMentor allows the user to sign up at any time for advisory and expert help from developers. It is very useful for advanced developers needing an outside viewpoint, and works like a ticket system, reporting parts where a developer needs help.

Codementors: Instant help for CodingGo to
Subject Areas HTML, CSS, JavaScript, jQuery, Design
LevelAll Levels
Price$4 per 15-min session

Any web project is worth taking on during the learning process. Don't aim too high to being with; stay within the boundaries of your technical capabilities, but real-world practice will always push you to solve problems and learn as you do so. From a creative standpoint, indulge in the 'boring' projects. Future employers or clients may not necessarily be impressed by how you deal with a juicy, fictional Pixar movie minisite, but you might catch their attention by creatively and professionally solving a local small business' genuine web needs.

Ian Yates, Web Design Editor at Tuts+

Reference Content

Bottom-line Support
When you don't know where else to go, reference sites have all the answers.
Crowdsourced
Get reliable advice from experienced web developers around the world

Dochub.io's' HTML Knowledge Hub

dochub html

Dochub is really a way to instantly search for HTML elements, CSS properties and JavaScript classes. For each, you get a Summary, syntax and example code, as well as notes. A great way to learn about each element properly. And a very fast, easy to use site.

HTML Knowledge HubGo to
Subject Areas HTML
LevelBeginner
PriceFree

Stack Overflow Forums

StackOverflow HTML questions answers

Ask any developer in the world and he will likely mention Stack Overflow as an invaluable resource for learning online. It's a question and answer site with reddit-style voting so that the best answers hit the top. Questions are also tagged to make it easier to learn about a specific topic. Stack Overflow is special because people take time to give quality answers, and it is by far the largest source of questions and answers. Deserves a bookmark for sure.

BookmarkStack Overflow ForumsGo to
Subject Areas HTML, CSS, JavaScript, jQuery, PHP, Ruby, & more
LevelAll Levels
PriceFree

The number one most valuable resource for teaching yourself any programming language including HTML/CSS/JS is stackoverflow Almost any question you can come up with has been asked and answered there before. The only challenge is to phrase the question the same way someone else might have asked it before so that the answer shows up in your Google search.

Klaus Sonnenleiter, CEO of PrintedArt

HTML5 Rocks

HTML, CSS, JavaScript

Contributors write their own tutorials about new and emerging subjects in HTML5 Rocks, a site that is well-suited for intermediate and advanced users. Recent subjects of tutorials include Antialiasing 101 or Text Compression for Web Developers. Although only one or two tutorials are added each month, the quality of these tutorials is higher than what you see in most places, as is the quality of the contributors, who include developers at top Tech companies. With new topics being added each month, HTML5 Rocks is an excellent collection

BookmarkHTML5 RocksGo to
Subject Areas HTML, CSS, JavaScript
LevelIntermediate/Advanced
PriceFree

Move the Web Forward

move the web forward learn web development

Move The Web Forward is a website that compiles many different reference and tutorial websites in a central hub, allowing users who need help or reference material to quickly find the information they need. The site provides tips for those who need help in the community as well as those looking to help fellow developers.

Move Forward the WebGo to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

HTML5 Boilerplate

HTML5 boilerplate template

HTML5 Boilerplate is a popular front-end template that helps developers build fast and responsive websites, combining the knowledge of over 100 developers on the project. The CSS and style, along with jQuery and JavaScript configuration are already pre-built. These resources make it very easy for developers to jump into the fray and make a modern website.

HTML5 BoilerplateGo to
Subject Areas HTML5
LevelIntermediate/Advanced
PriceFree

Smashing Magazine

Smashing Magazine tutorials articles

Smashing Magazine is a blog-style online magazine that highlights new developments, tips and tricks in web development. The site is a helpful and an acknowledged resource for developers suffering from the so-called "developer's block." The magazine covers a multitude of topics including UX Design, Coding, Graphics, Mobile, and Design, along with respective subcategories, to ensure that developers can easily find what they are looking for.

BookmarkSmashing Magazine MagazineGo to
Subject Areas HTML, CSS, JavaScript, jQuery, Design PHP, & more
LevelIntermediate/Advanced
PriceFree

HTML5 Doctor

HTML5 doctor

HTML5 Doctor offers two primary resources: an article archive of about 100 articles, which are good for learning HTML5 basics; and the Elements Index, which provides a short one-paragraph summary of each of the the primary HTML5 element. Whereas other resources try to give you everything, HTML5 doctor is all about being concise.

Want to know what its like to live the life of an HTML5 Doctore? Check out our interview with HTML5 Doctor Ian Devlin, seasoned web devloper and HTML5 Doctor.

BookmarkHTML5 DoctorGo to
Subject Areas HTML
LevelAll Levels
PriceFree

Front End Rescue

front-end rescue

Front End Rescue is a site specifically dedicated to making sure that fledgling web developers keep up to date in the volatile world of web development and design technologies. The website outlines 4 critical components, which are following important people, bookmarking news sites or blogs, attending design conferences, and finding your own sources. The site compiles a list of important people and sources to frequently reference.

BookmarkFront End RescueGo to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

The best way to learn client-side web technologies like HTML, CSS, and JavaScript is to look at the source of websites you visit and play around with them in Firebug. Anytime you visit a website and wonder "how did they make that button look that way?" or "how is this text box sizing to content?" just inspect the CSS or JS with Firebug and dig in.

Justin Scott, Product Manager at Mozilla

HTML5 Please

HTML5 please

So HTML5 is still relatively new and are not yet fully supported by most browsers. This website allows you to look up HTML, CSS and API features and find out they are safe to use from experience HTML5 developers. In fact, you can even see the exact browser support for each individual HTML5 feature.

HTML5 PleaseGo to
Subject Areas HTML, CSS
LevelIntermediate/Advanced
PriceFree

Mozilla Developer Network Knowledge Hub

Mozilla Developer Network

Mozilla, creators of Firefox browser, has created an open wiki-style site that allows developers to put together resources such as definitions and attributes of all the HTML and CSS elements, lists of tools and tutorials from around the web, as well as a directory of open web apps and even demos. The site is a constant work-in-progress, so some pages are more complete than others.

Mozilla Developer Network Knowledge HubGo to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

Web Dev Handbook 2.0

Web Dev Handbook 2.0

This a giant and awesome list of resources, offering CSS showcases, color tools and sites, AJAX JavaScript and jQuery tools, as well as links to daily reading, HTML web tools, various code checkers, and links to some of the best sites that offer content about web design. This is a site where you should spend about 5 hours clicking on everything, and bookmarking what you like.

Web Dev Handbook 2.0Go to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

HTML The Living Standard

Whatwg HTML The Living Standard

Attempting to create a technical specification of HTML5 for web developers is no small task, but the community of developers at WHATWG decided to take it on. WHATWG is a working group focused on evolving the HTML standard, and their very elegantly designed specification document is like an online textbook explaining all about HTML5 -- from the elements, micro data, loading, APIs, user interaction and more. If you like reading textbook style, this is worth checking out.

HTML The Living StandardGo to
Subject Areas HTML, CSS
LevelAdvanced
PriceFree

For HTML, Definitely do not use w3schools! Please sure you check out w3fools. Instead read the the W3 Specifications.. WhatWG has published a much friendlier version.

Francisco Brito, Formerly Google and Oracle at Dark Goyle

Mozilla Thimble: A Coding Jungle Gym

Mozilla Thimble: A coding jungle gym

Mozilla Thimble is a unique website which provides a blank canvas for testing out different website designs, created by the same developers from Mozilla Firefox. The website is organized in a way that enables the user to easily enter any code needing testing or verification on one side, and get a simulated output on the other half, effectively providing live results for testing new code.

BookmarkMozilla Thimble: A coding jungle gymGo to
Subject Areas HTML, CSS, JavaScript
LevelAll Levels
PriceFree

Wikiversity Web Design Challenges

Wikiversity Web Design Challenges

Wikiversity is an online learning community similar to Wikipedia except that it is built around learning skills. The learning material is crowd sourced and validated, so much of its content comes from those with experience.. There is a good deal of information on HTML and CSS, which also comes with a series of challenges:

HTML - Expect to test your decision-making skills with challenges that cover commonly confused HTML elements and how to construct common elements like forms, tables, and images.

CSS - Get ready to flex your CSS skills with challenges that include altering fonts and colors, tweaking margins and padding, and adding white space and columns to your layout.

Wikiversity Web Design ChallengesGo to
Subject Areas HTML, CSS
LevelBeginner
PriceFree

Codepen

code pen

Codepen is a reference website aimed at advanced web developers, listing solutions for development problems created by the community and other users. It works like a showcase, where developers can show off cool, useful, or interesting web development code snippets, as well as present what they do, similar to a marketplace. There is a Pro option that allows for private "pens" and asset hosting.

BookmarkGet inspired and share at CodepenGo to
Subject Areas HTML, CSS, JavaScript
LevelIntermediate/Advanced
PriceFree

CSS Deck

CSS deck

CSS Deck is a marketplace-like website with the sole purpose of showing off examples of CSS code and designs, such as different look-and-feel aspects, organizations and layouts, and graphical oddities. The website allows the user to browse different CSS examples and pick interesting ones to use, as well as upload his or her own code to show to other developers.

BookmarkCSS DeckGo to
Subject Areas HTML, CSS, JavaScript
LevelIntermediate/Advanced
PriceFree

In my experience, the most important element is a passion for development. You can't fake this, and without it you'll never keep up. Hiring managers and other developers really respond to eagerness and a proven willingness to learn. Taking the time and initiative to complete your own projects goes a long way in the eyes of potential employers.

Anna Stout, Owner at Astute Design Studio

About SkilledUp

The creation of this guide was an exhaustive undertaking that required team effort. Special thanks to summer Skilltern, Victoria Meng, who carried out a lot of the research required for this list, Brad Zomick, Chief Content Officer, who organized and polished the text, and Nick Gidwani, CEO, who coded it up.

More Resources: Over 80,000 Courses from 400+ Providers
Use our CourseFinder to see online courses in a variety of subject areas, including more specific web design topics like Responsive Design, Wordpress, or others.
Read More: Valuable advice and tips
If you are ready to start coding you'll want to check out the best HTML editors and When you start exploring some career options, you might want to weigh the value of Web Design Certifications or live a day in the life of a front-end developer or mobile app designer. Before getting to the interview make sure to read the most popular HTML interview questions.. Finally to keep on point with the latest front-end trends, make sureto follow the top 5 Web Design Gurus.
Get Serious: Try a coding bootcamp on for size
If you are really serious about your web design career, and you are ready and willing to make a major investment of time and money, your best bet is to look at coding bootcamps, which are short, intense programs meant to give you the skills to be employable. They aren't cheap, and they aren't easy, but they have the best shot of getting you a job. Check out our exhaustive list of coding bootcamps.

Future Collections are Coming

This is just the first of many more to come. Stay tuned for more!









Go to top!