Where to Begin Learning Web Design: A 5-Step Roadmap

While there are a wide variety of areas to specialize in, being well-rounded in the basics is key to edging out the heavy competition. The following web design career roadmap will guide you through 5 important steps to becoming a proficient web designer.

Web design is an undeniably popular career choice lately—the Bureau of Labor Statistics estimates that individuals with website design experience will be in the highest demand out of all graphic design career niches*. With growing opportunity and the perks of being able to work from home or start a business with low overhead, it’s no wonder web design is attracting so much interest.

If you’ve already tossed around the idea of becoming a web designer, you probably have found more information than you know what to do with. There’s a lot to learn, but where does one start? While there are a wide variety of areas to specialize in, being well-rounded in the basics is key to edging out the heavy competition. The following web design career roadmap will guide you through 5 important steps to becoming a proficient web designer:

Interface Design

You may be surprised to see anything but HTML at the top of this list. But the fact is, even back-end coders need to know basic design principles to succeed in creating websites that users will understand and enjoy. From button size to form organization, visual elements can have a substantial impact on the success of a website. Start your web design journey by studying the visual successes and failures of other website designs, and you will have a better foundation to build on.

Free Resources: Smashing UX Design; Template Monster (a great source for visual inspiration)


Now that you have a design framework on which to build your websites, it’s time to dive into the most basic markup language: HTML. Since the web is currently in transition between the older XHTML and the new HTML5, you will have to take some extra time to learn them both. Fortunately, they both follow the same basic syntax, and once you learn one, it isn’t very difficult to learn the other. With HTML, you will learn to structure the page elements with “tags” that will later be styled by Cascading Style Sheets (CSS).

Free Resources: W3C Schools HTML Tutorial; W3C Schools HTML5 Tutorial


After the page is marked up with HTML, the next step is to “style” the page. CSS is used to tell the browser how to display the web page, so the majority of basic web design time is used in this phase. Like HTML, CSS is currently in transition between two versions, CSS2 and CSS3. The language is essentially the same, and the newer version mostly adds new functionality to the previous version (like the ability to create rounded corners). When using CSS3, be aware that not all new functions are recognizable to browsers yet, so you may have to research work-arounds to get the features to work.

Free Resources: W3C Schools CSS Tutorial; W3C Schools CSS3 Tutorial


Once you are comfortable with markup using HTML and CSS, you’ve already learned enough to build attractive, basic websites. Javascript is a scripting language that brings static websites to life, giving them interactivity and “intelligence.” If you’ve ever filled out a form and seen an error pop up as soon as you’ve written something incorrectly, or admired a rotating banner, or marveled at how a website knows you’re accessing it though a mobile device, you’ve experienced Javascript. The best part of this lightweight scripting language is that its simple syntax is meant to be understandable to non-programmers, and you don’t need to know the ins-and-outs of it to use snippits of it in your code.

Free Resource: W3C Schools Javascript Tutorial


If you’re serious about being a well-rounded web designer, PHP is the next step for you. PHP is an open-source, server-side scripting language that adds a new dynamic to web pages. With knowledge of PHP, you can create online forms and member logins, host web forums, and create theme templates—among many other possibilities. You should be comfortable in all of the previous steps before attempting PHP, as it builds on those foundations. Once you can add PHP to your arsenal of web design tools, you could be well down the road of success as a web designer.

Free Resource: W3C Schools PHP Tutorial

Or get RSS feed

Author: Lin Edwards

Lin Edwards is a content and technical writer at SmallBusiness-Domain.com, an online resource for web hosting, domain names and e-commerce offers and promo codes, such as a Yahoo web hosting coupon code. Follow Small Business Domain: http://twitter.com/sbdomain

This entry was posted on Wednesday, December 14th, 2011 at 9:47 pm and modified by WebMaster View on Friday, March 21st, 2014 at 10:18 pm. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.

Comments : 2

  1. Someone told me earlier that no college can teach you web development, you need to learn in on your own. Yes! one can easily create a basic site using W3Schools etc but for more professional approach we need to look for better web learning sites like treehouse etc.


  2. i want to create a website on my own and then host it…
    the only question is i dont know where to start.
    plz guide me or at least tell me how can i start from base or which books can help me..