Getting Started As A Front-End Web Developer

Every so often I'm asked how someone might get started as a web designer or developer. These are my thoughts and are based on my own experience.

Urgent Matters First

First and foremost, do not fall into the trap that is Dreamweaver. If you rely on this tool (I use this term loosely), you’ll be tied to it forever. And the code it generates will make you sick to your stomach.

Common Terms & Languages

In your journey you’ll read or hear about HTML, HTML5, XHTML, CSS, CSS3, JavaScript, AJAX, MooTools, jQuery, CoffeeScript, and the list goes on.

Focus on HTML, CSS and JavaScript. Don’t bother with the rest until you’ve mastered these 3 fundamental languages.

HTML should be written with open and closing tags. Example: <p> is the opening tag for a paragraph, </p> is a closing tag for a paragraph. Opening tags start the thing, closing tags end the thing. Don’t listen when others say “closing tags is so XHTML 1.1”. Just close your tags. You’ll sleep well knowing your code is maintainable.

CSS is CSS is CSS, no matter what version you think you are using. If you use something that is declared as CSS3, it will only work in browsers that support it. It won’t break your website. (Curious to know which browsers support a CSS feature? Checkout caniuse.com)

JavaScript should never be required for your website to work. If your website requires JavaScript, you have failed. Hang your head in shame. (Business-centered Web Apps Excluded)

Getting Started

A website requires two things. A browser and a document. The document can be plain text, but that’s no fun. It can also be an HTML document full of content wrapped HTML markup. To make things a little more pleasant than black text and blue links on a white screen, you’ll want to apply style to your page. You do that with CSS.

If I were starting today I’d make a website for myself. Not one for the world to see, but one for me to play around with and explore different techniques. All you need is a web browser and a text editor.

Which Text Editor Should I Use?

I work on a Mac so I tend to enjoy working in SublimeText. It’s also available on PC.

Do I Need Photoshop?

Probably. There are other tools like GIMP, but Photoshop is the gold standard. With Creative Cloud, Photoshop is a no-brainer. Subscribe to Creative Cloud.

Should I Go To School To Become A Web Designer or Developer?

For me, I didn’t learn anything new in school that I hadn’t learned on my own that I still use today. The fact of the matter is the industry is moving too fast for schools to catch up. If you are lucky enough to find an instructor who is a practicing web developer, please let me know.

The short answer is no.

Which Web Browser Should I Use?

Google has put a ton of resources behind Google Chrome. You should use it. The developer tools are amazing. Download Chrome now. I’ll wait.

Where Can I Learn HTML, CSS & JavaScript?

Ah, great question.

Everywhere!

The beauty of the web is that all of the source code is open. Right-click on any web page and you can view the code in all its glory. Want to learn how that one site did that one amazing animation trick, it’s just a right-click away.

What Books on Web Design & Development Do You Recommend?

There are a lot of books on web design and development. Anything published before 2009 isn’t worth your time*. Just sayin’.

* Designing with Web Standards is the one exception.

Are There Websites for Learning Web Development?

Many web developers like to share what they’ve learned. GitHub has a large user-base that can be a bit intimidating to a new-comer. Check out CodePen for front-end developer specific code examples.

Treehouse is also a great lesson-based platform for learning HTML, CSS & JavaScript. Other learning sites include Code Academy, Code School, and PluralSight.

In addition, put these sites in your RSS reader of choice:

Is There Anything Else I Should Be Paying Attention To?

Yes. Podcasts.

I’ve gathered a list of podcasts for web design and development.

The most important shows in that list are as follows:

  • ShopTalk Show - Chris Coyier & Dave Rupert play sound effects and talk about the web.
  • The Big Web Show - Jeffrey Zeldman interviews guests about their experiences working on the web.
  • Happy Monday - Josh Long & Sarah Parmenter interview guests about the web and productivity.
  • Unfinished Business - Andy Clarke talks with guests about running a web design business.
  • BizCraft - Carl Smith & Gene Crawford talk about process, web design and working remotely.

Ok. Now What?

I am a firm believer in “Fake it ‘til you make it”. Before the Internet arrived in 1992, web designers and developers didn’t exist. This industry is 21 years old and is still maturing. Get some practice under your belt and then find someone who will pay you to make a really basic website. Learn as you go.

Go to Meetups

Meeting new people in the industry never hurts. Our industry has some of the most open and caring people. You’ll be pleasently suprised.

DO NOT TRY TO BE EVERYTHING TO EVERYONE

This is one of my biggest pet-peeves. Too many front-end developers try to learn too much. You know, Jack of all trades, master of none.

Find what you’re good at and do that.

Good at design but bad at code? Be a visual designer. Good and HTML/CSS, bad at JavaScript, find someone else to write the JavaScript for you.

Share What You Know

A good developer shares their thoughts and ideas. You should have a blog, even if you can’t build it yourself. Create one at WordPress.com or Tumblr. You can move it later when you have your own site.

Finding Jobs

When you’re ready, look at Authentic Jobs. Freelance jobs on Craigslist, Elance and the like have very low budgets and tend to pick developers who give the lowest bid. Respect yourself and charge a fair price.

One Last Bit of Advice

Google Search what you don’t know. You’ll find a lot of answers on Stack Overflow.

Good luck.