3 ways to improve your web design skills

close-up shot of person drawing with graphics pencil on a tracing table

Constant self improvement is one of my main philosophies in life. Getting just a little bit better at something every day is not only a way I improve myself professionally but I find it gives me a more fulfilling life.

While working as a freelancer, I found having a deep understanding of HTML, CSS and JavaScript gave me a huge advantage because I could quickly go from a vision in my head to a live functioning website my client loved.

Here’s three easy ways you can work on your front end web design skills:

1. Online courses


I can’t recommend Codecademy enough. No matter your skill level there’s going to be something you can learn. Their tutorials range from an introduction to HTML/CSS to building your own interactive solar system using JavaScript. It’s so cool.

The tutorials have step-by-step instructions, a code editor and fake web browser so everything is in one place. There’s no need to leave your browser. Even better, it’s completely free!



If you’re a visual learner you’ll love Treehouse. There are tutorials covering a huge range of web design topics to cater to any level. For each tutorial there’s a short professionally shot video, followed by a short quiz and an exercise that can be completed in the browser.

There’s a little more hand-holding here than on Codecademy so if you’re looking for something closer to a classroom environment, Treehouse is your best bet. Plans start at $25/month and there’s even a 14 day free trial available.


Code School

Code School has a similar format to Treehouse. There’s a short video followed by a coding exercise. Again, this workflow is fantastic because if you ever get stuck, you can always re watch the video to find the answer. There are free courses available and a monthly subscription of $29 to get full access.

Code School

2. Documentation

When I need to quickly look up how to use css3 rounded corners or what attributes you can set on a form element, these documentation websites are my go to.


Mozilla has a beautiful set of documentation for anything web. If I ever need to know what attributes a <video> tag has or the browser support for border-radius, this is my go to.



Similar to MDN, an in depth reference of everything HTML and CSS.

W3 Schools


HTML and CSS specifications straight from the horses mouth. W3C sets the standards which guides the implementation in web browsers. The descriptions are usually technical and verbose so I typically prefer the other two websites but it can be a good reference if you’re using bleeding edge web technology.


3. Work on projects

I find the best way of learning new web design skills is to have a project you can try new things out on. At CloudCannon we’re constantly creating small, seemingly pointless little projects as a way of trying new things out.

There’s our Solitaire app made completely in HTML, CSS and JavaScript. solitaire

Smileys.js is our little way of making websites a happier place. Smiley

Even CloudCannon started off as a bedroom project. CloudCannon

My next project is to revamp my personal website. That moustache is long gone and I want to do something even cooler than eating an apple with html5 videos.

Mike Neumegen

Now it’s your turn! Get out there, work on your web design skills and build something cool. What can you create this weekend?

You might also be interested in

SvelteKit vs Next js

SvelteKit vs. Next.js

Jaimie McMahon

4 February 2023

Read more

Static Site Generator (SSG) Visions, Roadmaps, and Trajectories: What to Watch in 2023

David Large

21 January 2023

Read more
Photo illustration of stars with SSG logos

The Top Five Static Site Generators for 2023 (and when to use them!)

David Large

14 January 2023

Read more