Web Design for Beginners - What you have to know to get started

So you have been thinking, “Hmm, could I build some of that cool stuff I see online?” Or maybe you have already typed some <HTML> and .CSS in Notepad to learn the magic.

 

While that was how things were done back when I first started, now you have amazing tools like Elementor, Webflow, Framer, Figma and more at your fingertips that make coding almost optional.

In this article, I’m going to give you my honest and likely biased opinion on how you could get started with web design, what that all means and does it pay well, and what is the most valuable super skill any web designer can wield. We’ll get to that, so hold on to your tights.

For context, I’ve been building websites as a hobby since early 2000’s and professionally since 2017, using mainly WordPress and Elementor.

Table of contents

junior web designer

Understanding Web Design Fundamentals:

There are some web design terms you might have heard, but don’t have a clear picture what they mean. Let’s do a speedrun to get you acquainted with the basic ones, so you can also start including them in your vocabulary to sound pro.

 

 

  • Web design itself is the visual design, the layout and graphical structure of what users see on website. Colors, images, animations, text, grids, sections, elements, and white-space are the typical building blocks.
  • HTML is the lingua franca of websites. HyperText Markup Language creates the structure for websites and their content. While you don’t need to know much to get started, at some point learning the language will become useful and necessary to build customized thingies.
  • CSS is the beautiful little-sister of HTML that makes everything look nice and pretty. Cascading Style Sheets define the layout, how things are colored, placed, styled and animated. HTML without CSS would look like WWW in 1996.
  • JavaScript is the third language you’ll need to tackle later on your web designer career to build custom, interactive and responsive elements.
  • UX and UI gets thrown around a lot. Especially among posers. Jokes aside, user experience, and user interface are important factors in design to make things easy and pleasant to use. What is the difference between them? UX is for creating logical and simple paths for users to get from A to B, also on mobile. UI is to make the journey look nice and flow smoothly.
  • Typography is a fundamental element of design. Would you use Comic Sans font on your website? If you would, stop reading and choose another hobby. Understanding serif and sans serifs fonts helps you make average design look better instantly.
 

🎟️ Now you are armed with web design jargon superpowers and ready to jump on the arena with sweaty palms.

best web design platform

Choosing the Best Web Design Software for Beginners:

Notepad doesn’t cut it anymore. So which platform to choose?

I’d suggest you start with WordPress and Elementor.

 

Why? Well, 40% of all websites are built on WordPress, including important business website, like Sony Music, Harvard University, Time Magazine.

 

It’s battle-tested, well supported, and has thousands of plugins to add any functionality you can think of.

On top of that, you want to use Elementor that is a simple page builder and a library of drag-and-drop elements, allowing you to build and customize pages fast without touching much code.

 

Fantastic right? What are the downsides?

  1. WordPress is popular also for hackers. You need to take some steps to make it more secure.
  2. Elementor and other plugins add a lot of code on WordPress, making pages heavy for loading. Are these deal-breakers? Of course not.

 

If you want to be different to make a statement you can also go with Wix, Squarespace, Webflow or any other recent and popular platform. It’s all the same in the end, it really doesn’t matter.

 

I use WordPress, because it allows me more control over everything as I host my pages myself on OVHcloud for easier maintenance and lower annual fees.

 

What about Figma and Framer. And Spline? You don’t need those to start.

I don’t need them. I might in the future. They are popular. Moving on.

web design course optionsExploring Web Design Course Options:

How to learn WordPress and Elementor? To self-promote without shame, I have my own crash course where you learn to get your own domain, hosting, set up WordPress and build a functional Elementor website with couple of cool functions like appointment booking, video consultation, pop-up contact form and so on. 

 

It’s beginner-friendly and teaches you also how to leverage AI to build things faster. You can watch the first video for free here 🧨.

 

And then, there’s also a myriad of other courses which may be more theoretical and boring, but still worth mentioning. You can go to YouTube and see what new and comprehensive free courses are available.

 

But let me tell you something honest. If you don’t invest in your education, you’re probably not taking it too seriously. Enrolling to a paid course puts you in a different mindset than assortment of YouTube videos. It’s up to you. 

 

And just to mention, you can see Teachable, Coursera, Udemy, Skillshare, LinkedIn learning or Gumroad for a WordPress course. I’m sure you’ll find a comprehensive beginner course on any of these platforms that fits your needs and learning style.

 

Is there any other method? Of course. You can find a sensei or a sifu to help you learn the way of Elementor and become a design ninja in record time.

Web Design ExamplesIllustrating Web Design Examples:

To get any paid work as a web designer, you need to learn how to build visually pleasing home pages. And then show them to your audience and website visitors.

 

 

 

How to do that? Here’s one idea: go to Dribbble, search web design, and choose a reference website that you will model.

 

Build your own version using AI image generator like playground.ai or browse Pexels for free images to add as illustrations. Pick a color palette from colormind.io and apply the 70-20-10 rule to keep things smooth. Browse Google fonts to find a decent typeface.

 

Post your stuff on social media, and on your own portfolio to show that you can deliver visually pleasing websites. At this point, you don’t need to learn animation or how to build custom elements.

They are just icing on the cake you can pick up later.

 

⚠️ Word of warning: People are becoming better at spotting mass produced AI pages, so make sure your content is high quality even on a closer look.

 

To reach wider audience, it’s also a good idea to learn how to build an E-commerce website. For WordPress, you can add WooCommerce to a demo website and style it to your liking to make it look eye-catching. Here is also a great opportunity to learn and apply user experience and user interface knowledge for a smooth sales process.

 

If you got these two down, why not create a cool content creator website, with interactive elements, dynamic grid and cool visuals that catches attention.

 

Make sure you nail also responsive design, that scales dynamically on all screen sizes without breaking the layout. Mobile-friendly design is essential as about half of all website traffic comes from smartphones.

 

Starting out, make sure you promote yourself shamelessly online and to your friends to raise awareness that you exist and you can do this stuff.

 

  • There’s no shortage of demand: about 250,000 websites are opened daily and someone needs to design them.

Ok, we’re getting ready to start and you have some ideas. Let’s create an action list how to become a freelance Web designer.

learning web designEmbarking on the Journey to Become a Web Designer:

Let’s take the cat out of the bag and compare two possible options. You can either choose to work as a freelance web designer or find a regular web designer job.

For me, I’ve been freelancing, and then running my own business since 2017 and haven’t worked in an office since. It’s a lifestyle choice, and I’m an advocate to go freelance.

Full disclosure: Learning web design is easier than ever thanks to all this great content. Getting your first clients as a freelancer is way harder, if you’re not a natural salesman with a big network.

Is it still worth it? Absolutely, but you have to be comfortable with uncertainty and fluctuating income. Or, you can also keep your existing job and start doing web design as a side hustle.

Here’s the straight into fire approach:

  1. Pick your platform and build your first page to get your feet wet, follow a tutorial or course to save time
  2. Find a reference and build a simple website for your web design business. Make it look visually pleasing, but unique. Most agencies are boring and predictable.
  3. Write your first blog post about this process, and share it social media to get some support
  4. Make everyone in your social circles know you are doing this professionally. I got my first client through a referral, too.
  5. Build a concept portfolio
  6. Join groups of web designers and online marketers to get more tips and learn more
    (Join SCRIIV Discord to chat with me)
  7. Watch more videos and tutorials to learn new tricks
  8. Find a mentor who is earning well with his own business
  9. Never stop learning more and refreshing your skills

✅ By really putting your head down and making a serious decision, you can tick the first four boxes in a month. That will get you started and on your way.

developing a web design styleDeveloping your own web design style:

One thing about learning and building your own thing, is to take inspiration and experiment, but try always to make everything look like you. Aim to develop a style.

 

Thanks to Fiverr and AI, reference book-style content and website are everywhere. Everything looks the same. Safe and boring. Be bold enough to develop your own style.

 

Perhaps you lean naturally into code more. Go ahead and learn JavaScript and some of the popular frameworks like React for building app-like features, or Three.js for 3d elements.

 

Or maybe you like writing more. Then you can improve your skills as a content and copywriter, which is arguably even more important than web design to make websites convert. Why?

 

Think it like this, you start watching a YouTube video with amazing production – lights, camera, sound, attractive person in the middle. But if what they are saying doesn’t make any sense to you, you click away instantly in disgust. 

 

Same applies to websites. Written content is always more important.

 

I’m telling you this because it makes sense to specialize into something. Otherwise you are just another web designer. And start posting content online. Get over the initial embarrassment of showing your face, and create a personal brand.  

web designer salaryHow much you can earn as a web designer:

If you start as a freelancer, it might take months and years before your side-hustle turns into a full-time business. And the rewards come scattered and rare in the beginning. But by blazing your own path you can climb into a cool $10,000 per month level in couple of years.

As a hired junior web designer, you can expect a safe $50,000 yearly salary, but that route usually favors people with stamped papers from some design or IT school.

This also varies a lot depending where you are geographically. That’s why I recommend building a personal brand that allows you to get clients from the INTERNET. It’s worth it – otherwise you’re just a faceless commodity competing on lower price.

Ok, let’s list the biggest factors that affect how much you can charge:
  1. Your beliefs – Get out of scarcity mindset, believe that you deserve to get paid well
  2. Your experience – The more websites you build the more confident you are to take on bigger projects
  3. Your skills – As you keep stacking more skills on top of web design you can charge a higher price
  4. Your testimonials – People value what others say more than what you say about you
  5. Personal brand – When you build your audience to few thousand and start getting leads online, you can slowly raise your prices thanks to your Internet fame.

Here’s the most valuable skill for any designer:

  1. Your ability to make more money – If instead of just design, you have a solution that measurably generates the business more money, then you become way more valuable. This would be around your marketing skills: lead generation, sales funnel, and conversion rate optimization.

Conclusion:

For me, working as a self-employed web designer and marketer has allowed me to live in 5 different countries in the last 7 years.

 

I get to decide when and how I do things. I’m putting effort in my own thing which has a compounding effect. Simply having the ability to do what I want is well worth the uncertainty and stress.

 

In conclusion, I hope you see that becoming a web designer is not all that hard. Learning simply takes some dedication and by sharing publicly what you do can land you your first clients. You get to choose your own path.

 

It comes with discoveries, mistakes, surprises, worries and joy. If self-determination, creativity, and freedom of expression are important values to you, maybe web design is the right fit.

 

Next, connect with me on social and send me a DM. I’d be happy to answer any question you might have.

Related links:

 

Flux Academy Web Design Course for Beginners:    • Learn Web Design For Beginners – Full…  

W3Schools Online Web Tutorials: https://w3schools.com

Mozilla Web tech for Devs: https://developer.mozilla.org/en-US/d…

How to learn JavaScript: https://www.freecodecamp.org/news/how…

OVHcloud Hosting https://us.ovhcloud.com

Reference websites: https://dribbble.com/ https://www.behance.net

AI image generators: https://playground.com https://lexica.art

Join SCRIIV Discord Server:   / discord  

maru hieta marketing

Written by

Maru Hieta

Creator – Scriiv 

My advice: “Leverage your digital skills and leap into new adventures”

I’m self-employed marketer and creator, enthusiastic about YouTube, copywriting, and conversion rate optimization to name a few. Unstoppable visionary.

→ Join the journey to elevate your online presence and grow your brand!

AI-Powered
Web Design
Free Toolkit

⚡ Join SCRIIV newsletter to get 6 best tools to leverage your output.