How to Learn a Web Language

Knowing how to develop websites in various languages (HTML, CSS, JavaScript/jQuery, PHP, etc.) is great. But getting that knowledge is more difficult than it sounds for a lot of us.

Take me, for example. I’m self-taught in all things webdesign, only getting help on a few things here and there to figure out HTML, CSS, and bits of PHP and JavaScript. But there’s a definite limit to what I can effectively teach myself with a few random Google searches and online tutorials. I thought I had hit that limit when I tried to learn JavaScript in full a few years back–no matter what I tried, I just couldn’t seem to piece my shards of knowledge into actual working code. It all felt way too technical and mathy for this word-loving brain of mine.

That is, it felt too tough until I started approaching it like an actual language.

JavaScript = French?

I thought back to my high school French classes (my first exposure to the French language). Well, more specifically, I focused on how my French teacher taught us:

  1. She didn’t expect us to come in there on Day 2 and be able to converse in perfect French; she taught us vocabulary and parts of speech first, a unit at a time, learning the names and labels for things (“maison” = “house,” “citron” = “lemon”, etc.). Often, she translated sentences for us to show us the connections between words.
  2. Then, after we learned a unit of vocabulary, she showed us how to use the vocabulary in basic sentences: “Je veux un citron” (I want a lemon), “Je vais a la maison” (I’m going home). Usually, this step involved us writing sentences down and checking it for correctness via homework and tests.
  3. The final step in learning the words we were taught was using them in actual conversations and/or letters with other students. We were actively using what we’d been taught, and it got us used to how the various parts of speech we had learned were put together to communicate. (There was also a lot of laughing involved as we stumbled over pronunciation or word order, but at least it was practice!)

So I wondered: would the same principles apply to learning JavaScript, or in fact any Web programming language?

Short Answer: YES! And Here’s How to Do It!

These principles do work for teaching yourself a new Web language (or learning it from a friend/along with a friend). Here’s how it works:

  • Step 1: Read all the examples of your chosen Web language that you can find. First, read tutorial websites that break down exactly what each “word” (tag, term. etc.) in the web language means (W3Schools is good for this). Then check out actual code snippet sources (see end of article), since code snippets are basically programming examples of working code. (Remember to read the comments on each of the code snippet posts, too, since programming wizards often suggest fixes or updates!)

    As you read each snippet, think: “How did they make this work?” Search up any terms you don’t recognize right away, and see if you can understand how the programming language is arranging things to work.

  • Step 2: Find a code snippet you’re interested in working into your site and start tinkering. If you find one that kinda works the way you want it to, but you want to change it up a bit, even better–that’ll give you more practice! Try implementing some simpler code tricks first so you don’t daunt yourself, and if you get stuck, ask a web developer friend for help, or post a polite question or two on code forums (see end of article). (Make sure to keep a copy of the working code in reserve at all times so that if you ROYALLY screw up, you can always copy/paste it back in place of your work and start over. Learn from my fail.)
  • Step 3: Once you’ve had success with implementing others’ designed code that you’ve tinkered with a little, try writing your own code from the ground up. Again, start simple (and I mean very simple), and ask your web developer friends for help if you get stuck or are having trouble debugging. This will give you ground-level experience with developing in the new language, and you can more easily pinpoint where you’re having problems.

Don’t Forget the “Conversation” Part!

It’s very tempting to try to learn a new Web language in isolation, but languages thrive on communication. Of course, we don’t actually speak Web languages in everyday conversation, but asking other more experienced developers about their work in a particular language can REALLY help you get over hurdles and stay updated. (For instance, a Web developer buddy of mine is teaching me JavaScript at the moment, and I am learning so much more than when I tried to learn it alone.)

You may choose to meet in person or work over the Internet, but whatever you do, cultivate helpful professional connections with other developers; it really helps to have a human touch with this rather impersonal-seeming subject matter.

Further Reading

Study Aids

Webmonkey Code Snippets (HTML, CSS, JavaScript, API)
CSSFlow (HTML5, CSS3, Sass)
CSS-Tricks (HTML, CSS, PHP, JavaScript, jQuery, WordPress, htaccess)

Code Help


Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.