Your First 30 Days of Learning Web Design: How to Get Started and Not Give Up

Congratulations! Web design can be one of the most useful skills to acquire in your professional career. Your first 30 days of learning are crucial because many people simply give up after a week or two. In this article, we’ll go through some useful tips and tricks to help you get started with web design and stay on track.

Web Design is a Broad Field

Saying “I want to learn web design” is like saying “I want to learn how to cook”. There are thousands of recipes out there and many different styles of cooking.

There are thousands of web design specific tools and general principles that every designer should know. Since web design is such a broad field, many people simply ask how to get started! It’s this question that stops people from even getting started at all with web design. With so many tools to choose from to start learning, they end up at not choosing anything at all. This is a well-documented psychological principle.

My Experience Getting Started with Web Design

I, too, was overwhelmed by the choices I had to make about how and where to get started with web design. Should I learn Dreamweaver first? Or Photoshop? Or maybe learn how to code in JavaScript? I could have done any of those things. The truth of the matter is, there are lots of resources for learning design, so many of us face an overload of choice and when you have plenty of choices, you often tend not to make one at all.

%tutke

Dreamweaver is basically a program that helps you code HTML and CSS faster. It’s a text editor and you can just as easily start with Notepad, but you’ll spend a lot more time coding. So Dreamweaver is basically a time saver, but not a good tool to get started learning web design. That’s what I learned the hard way.

So I chose to learn HTML and CSS first before learning any software.

Why You Should Get Started with HTML and CSS

Most of the websites (I’m guessing 99%+) are made in HTML. Just go to your favorite website and press CTRL+U (this should work on most browsers, alternatively, find the “View Source” option in your browser).

Do you see things like <p>, <a>, <strong>, <script type=’text/javascript’>, <span>, <style> and so on? Those are called HTML tags. No worries if you know nothing of this, you will soon.

HTML is the structure of almost any modern website. What about CSS?

Image Source

CSS is basically giving that structure a style. Without CSS, websites would look awful, something like a bunch of text in a Notepad file.

To truly understand and become a good web designer, I think it’s crucial to know these two simple languages. The good thing is, they are really easy to learn once you grasp the logic behind them. Don’t worry, this has nothing to do with actual programming languages like PHP, Javascript or C++. They’re entirely different universes. Learning HTML and CSS as compared to these languages is like learning how to ride a bike versus flying an airplane. Do you know how to ride a bike? Then you probably have the ability to learn HTML and CSS. Here’s how:

How to Get Started with HTML & CSS

This is where I’ve tried and failed numerous times. In my opinion, choosing the right books on learning a particular topic can be the difference between giving up and staying on track. The right book will present everything concisely in a fun and engaging way.

One such book is Head First HTML & CSS. Generally, speaking, all “Head First” books are better than other literature on the topic.

This book might be the only book on HTML and CSS that actually focuses on your learning experience. They apply a lot of research-based learning principles to help you stay motivated and, most importantly, help you feel that you have accomplished something! This is the problem with other books: they simply have no feedback mechanism to tell you that you’ve made some progress (some of them tell you “congratulations” after finishing the entire book, but that’s far from enough). You have a pretty extensive preview on Google Books if you want to see what Head First HTML & CSS is all about.

Image Source

Before accidentally stumbling upon this book, I had tried around four other books but gave up on all of them mostly because somewhere in the middle, I found myself stuck at a concept that those books failed to explain in a clear way. No matter how many times I tried to “re-read” that section of the book, it was impossible to grasp it. Yes, searching on Google helped, but after the third or the fourth time getting stuck on a concept, I started wondering “Why should I continue reading the book at all when things are explained so poorly? Why should I waste my time with it when I can pick up another book or learn from the web since I’m Googling everything they say to get a better grasp of it?”

Trust me when I say it, choosing a GREAT book to get started with ANY topic is a major deal.

Give Me Some Free Resources!

2012 was a great year for the “online education” industry. There were a lot of new startups to really help you learn web design. Some of them are:

Of course, you always have 1stWebDesigner and some of its really amazing articles, such as:

I highly recommend you read these articles but only after you have set your foundation right with a good book.

A Book is Not Enough

Consistency is the key when getting started with web design. Are you learning everyday? Are you applying whatever new concepts you learn at least three times a week? Learning a little bit everyday is way better than covering a lot of material in just one day of the week.

But how exactly do you get consistency? Are there any ways to improve your chances of taking more action regularly?

Making the Right To-Do Lists

I once read about a study where the goal was to get more students to do a specific thing like writing a report. The researchers separated the students into three groups:

  1. The first group was just told what to do, in this case, it was “write a report”
  2. The second group was told not just what to do but where to do it, in this case, “write a report in the library”
  3. The third group was told what to do, where to do it and when: “write a report on Monday at 3PM in the library”

Can you guess which group completed the task more than the two groups?

It was the third group, which was not just told what to do, but also when and where to do that thing.

Image Source

When you want to do something specific, it’s also a good idea to specify when and where you plan to do it. The “when” part doesn’t have to be at a specific time. It can be “immediately after I wake up” or any other activity you normally do, like “immediately after I get back from the gym”.

It’s also a good idea to keep track of all your daily tasks using a checklist. Tracking my goals for the day enabled me to discover the periods of the day when I am most productive (it was in the morning, immediately after I used to wake up).

Motivation is like Fuel

Motivating oneself regularly helps you accomplish more with your time.

For example, I was a lot more motivated to learn programming when I read blogs like TechCrunch talking about various small startups being bought for millions. The startups were all software-based and some were relatively simple to make — this pumped up my motivation even more!

Discovering what motivates you can be discovered mainly by observing yourself and the way you act.

What Are You Waiting For?

If you were surfing the web and stumbled on this article and got to this part, I want you to slow down and relax now. Just forget about everything for a moment. Ignore that rush of browsing to the next webpage and then the next… one of the best ways to gain self-control is to relax for a moment.

Now think: can you set up a goal tomorrow at some exact time to start learning web design? A goal such as “Read 30 minutes of Head First HTML & CSS, or some other preferred book.” Also, when will you start? 3PM? 4PM? Immediately after waking up? Decide the time.

What is the current biggest obstacle that you’re facing when learning web design? I’ll be waiting for your feedback in the comments!

1stwebdesigner