You Can Learn How to Code
Web Designer Creating a Layout

How Do I Become a Web Designer?

A female web designer checking a layout on her phoneIf you have a strong independent streak, a well-developed sense of aesthetics and don’t shy away from learning tech skills, then you might enjoy a career as a web designer. A good web designer enjoys experimenting with color, typography and layout and works to find the best combination of these elements. Web designers will also consider the best ways to optimize the content they create for search engines and social media.

Web design is a great field for those who wish to freelance or who are looking for an entry-level position in a technical field. So, if this sounds like a career you’d enjoy and are asking yourself, how do I become a web designer, you’re in the right place. I’m going to cover everything you need to know, from the skills you’ll need to learn, the right courses to help you build up or acquire those skills and the best salary information I can currently find.

Skills

The main skills you’ll need to get hired as a web designer include graphic and visual design, HTML and CSS, Responsive Design, and SEO best practices. If you haven’t heard of all of these before, no need to worry. I’m going to cover each one below.

Graphic Design Software

All designers, whether they work as graphic designers or web designers, need to have a well-developed sense of aesthetics, an understanding of layout and typography and need to be proficient in InDesign, Illustrator and Photoshop. To learn these programs, you’ll need an Adobe Creative Cloud membership, at least for a few months in order to learn the software.

If you are a student, be sure to take advantage of the cost savings they offer students. If you are out of school, then I would suggest signing up for a month-to-month membership. They offer annual discounts, but if you dedicate a 10 hours each week to learning the software, you should be able to complete a few projects in 3-4 months and save $250 or so.

A good introductory course like Lindsay Marsh’s Graphic Design Masterclass will teach you both the visual design skills and software proficiency you’ll need to succeed.

HTML and CSS

Webpage with only HTML
Webpage with only HTML

HTML and CSS are two mark-up languages that work together. HTML provides the structure and CSS provides the presentation. What does this mean exactly? When you are building a website, you need to tell the browser which pieces of content are headings, paragraphs, images, links, lists and tables. This is HTML’s job: it is responsible for dictating the structure of each webpage so that the browser “knows” if it should display a heading, a paragraph, etc. The only problem with knowing HTML by itself is that it isn’t visually interesting.

The image here with the white background shows what this very post looks like with only HTML markup. The fonts and font colors are included by default. You can differentiate the paragraphs from the headings and the image, but that’s about it.

Webpage with HTML and CSS
Webpage with HTML and CSS

This is where CSS comes in. With CSS, we can change the default fonts, choose colors for our elements, adjust the layout, add margins, apply a border to the images, and so much more. Without CSS, a website looks pedestrian and lacks a meaningful presentation. Adding CSS to a webpage that has only HTML is like adding salt and spices to a plain bowl of rice. Once CSS are added, a webpage starts to take on distinct styles and can begin to reflect a company’s brand.

In this example here, you can see that now that the webpage has some CSS styles added, it’s starting to take on a little more personality. Note the light yellow background, different fonts and colors for the headers and the paragraphs, a new layout with the text floated to the right of the image, a small margin to the right of the image and a border radius around the image. CSS makes it possible to add styles like these.

Responsive Design

Now that there are a seemingly countless number of devices ranging from desktop computers with giant screens to iPhones, web designers must be able to build websites that adjust to different browser sizes. Web designers can accomplish this with CSS. A responsive layout adjusts or responds as a browser size changes. If you’ve browsed any number of websites on your phone and noticed that the layout effortlessly shifted when you switched from portrait to landscape mode, you were watching responsive design in action. A web designer can write something called a media query to tell the browser to make adjustments to the layout at specified sizes. In general, the content of your website will help you decide where these breakpoints are.

SEO Best Practices

You do not need to become an expert on search engine optimization (SEO) to become a web designer, but employers are increasingly looking for web design personnel who also have some digital marketing skills. The reason? They want search engines to be able to find their webpages quickly and easily. If you can successfully integrate an SEO strategy into your webpages, you’ll provide more value to employers by helping them get more traffic.

As a web designer, you might also be expected to format and optimize images for social media, familiarizing yourself with the ideal image sizes for the popular social media networks like Facebook, Twitter and Instagram will also help you become job ready.

Communication Skills

If you’ve heard about “soft skills” in business, then you already know that having the right technical skills isn’t enough. As a web designer, you will also need to be able to communicate with employers, colleagues and clients. If you’re pleasant to work with and have design chops, you will be in higher demand.

Salary

Web designer negotiating her salary with a male colleagueAccording to my research, the salaries for web designers are all over the place. Some sources estimate them as high as $66,000, while other postings are looking for web designers who are willing to work for between $11 – $17 per hour.

For accurate information that is current, I turned to Indeed because they collect salary information that web designers report to them. According to Indeed, the average salary for a Junior Web Designer in the United States is just under $42,000 per year. This salary could be higher or lower depending on where you live. Freelance rates of $18 – $25 per hour are common.

Why is there such a wide range? Sometimes web design gets lumped in with web development. The difference between a web designer and a front-end web developer is JavaScript. Web developers are expected to know a lot of JavaScript. While web designers should eventually acquire a working knowledge of JavaScript and jQuery, a popular JavaScript library, employers should not expect web designers to be experts in JavaScript. It’s important to make this distinction, because there are plenty of employers who post job openings with titles like web designer/web developer with salaries that are well below what a web developer should earn.

If you know HTML and CSS and have a portfolio of work, then there is no reason to work for less than $18 per hour as a web designer. If learn JavaScript and can use it to add interactivity and animation to your webpages, then you can negotiate higher rates if the job you’re applying for requires JavaScript skills. Web designers who are expected to know JavaScript can ask for at least $25 per hour as a freelance rate or $50,000 per year for a salaried job.

The more experience you have, the higher the hourly rate you can charge. As you develop your portfolio, taking on some freelance jobs for which you are paid hourly is a great way to gain experience and build your reputation. If you do a great job, you can ask employers who hired you for freelance work to serve as references for you.

Outlook

While there are still plenty of web designers who work as full-time employees, businesses — especially small businesses — are increasingly moving towards freelancers to help them meet their web design needs. If you value freedom and flexibility, this is a good thing for you, as long as you don’t mind a little extra hustle as well as the effort it takes to build your reputation.

Courses

If web design sounds like a good career for you or you’d like to use it as a starting point for an eventual career in UX design or web development, then there are a few courses you can take to learn the skills you need to land your first job or get hired for your first gig. One of the things I always look for in courses are projects that help you bring all of your skills together, and the courses below offer you the ability to do that. You should always create your own designs and write your own code, but you can use the projects in the courses as a starting point for projects to include in your portfolio.

Graphic Design Masterclass by Lindsay Marsh

This courseGraphic Design Masterclass image with Photoshop, Illustrator and InDesign logos starts with the basics of typography, color theory, layout and photo editing. You will also work on some different projects: a branding package that includes designing a logo, social media graphics and designing a magazine. The last project will help you if you are ever asked to design a web publication. The design principles for print and web magazines are very similar, and InDesign is a great tool for both. You will also learn how to use Illustrator and Photoshop in this course, which are the right software programs to use for logo design and social media graphics, respectively.

Web Design for Beginners by Brad Schiff

web design for beginners graphicI have taken many courses in HTML and CSS in an attempt to find the right one to recommend, and Brad Schiff’s course is one of the best I found.

If you are someone who appreciates knowing the why behind the concepts, then this would be a great course for you to take, especially if you want to work as a web designer and be able to converse about web design topics in an intelligent manner.

Schiff starts with HTML basics and then covers modern, semantic markup. Semantic markup gets very specific with the information HTML passes along to the browser, and if you know how to use it properly, you’ll be able to provide good services for your clients.

This course also covers beginning and intermediate CSS concepts. Not only will you learn layout principles, but you will also learn CSS animation. The course ends with a small introduction to jQuery, which is the most popular JavaScript library. You won’t learn how to write your own jQuery in this course, but you will learn how it’s used.

If you’d like to read my detailed write up about Brad Schiff’s course, then check out my review.

SEO Training Course by MOZ

SEO Training Course by Moz with Computer Screen and Search EngineMOZ was started in 2004 with the mission to help companies improve their search engine optimization (SEO) strategies. They have paid services as well as a ton of free information on their blog. When I was starting out in SEO, I referred to their guide heavily and now recommend their free introductory course on Udemy. This course will teach you the basics of search engine optimization, including how to conduct keyword research and conduct link building properly.

I hope you’ve enjoyed this guide on how to become a web designer. If you have any questions or need some clarification, please feel free to leave a comment below or contact me at laura.white@youcanlearnhowtocode.com. I wish you the best as you begin your journey on becoming a successful web designer!

Enjoy this post? Join My Awesome Community!

Sign up below and be the first to read my blog.

4 comments

  1. Wow. you have managed to get a lot of information in one post and it’s very detailed and relative.

    Are you a web designer by any chance?

    I wanted to learn web design when I was younger and built some websites as part of my studies. I’d like to get back into it now. A lot of the topics covered here are relevant for any online worker not just web designers, and I found it useful.

    Thanks for the great info.

    1. Thanks for the kind words, Michael! I think it’s great that you want to get back into web design, and I’m glad you found the post helpful. As you get started, please feel free to contact me if you have any questions.

  2. Useful info there. The graphic design course in particular looks like it would pretty useful to me. I have some familiarity with Photoshop ans Illustrator, but need to learn the design concepts.

    I am curious though, is there anything in the web design course of any value to someone who is already familiar with html, css, and javascript?

    1. Hi Eric,

      If you already know HTML, CSS and JavaScript, these courses would be a refresher at most. To deepen your JavaScript knowledge, I’d recommend Colt Steele’s Web Developer Bootcamp.

Leave a Reply

Your email address will not be published. Required fields are marked *