I am always doing that which I cannot do, in order that I may learn how to do it. – Pablo Picasso.
Absolutely – building websites with at least some knowledge of HTML is far more productive than simply drawing them with Photoshop. While web-designers who know how to code still often end up sending their PSDs to the “real” developers, the truth is that most award-winning websites are designed by code-savvy web designers. You wonder why?
It’s because both HTML and CSS are very visual languages in themselves. Also, websites become increasingly interactive. User interactions though are very difficult to foresee using only Photoshop. Whereas having code in mind always helps creating designs that have interactions in mind.
Let alone cash. If you are a freelance designer such as I previously was, knowing how to code will definitely broaden your range of customers as you will become a one-stop-shop (trust me, learning how to design takes a developer much longer than vice versa). And if you are a corporate designer such as I currently am (working at ImpressPages, a user-friendly content management system), knowing at least the basics of coding will help you deliver designs that are both interaction-oriented and easier to work with as they subconsciously take developers into account. Simply speaking, you earn karma points that often translate into a better pay.
As New Year’s resolution time is looming, learning how to code could be just the right one 🙂
Is it difficult?
Contrary to the popular belief, learning how to code is very easy at the beginning, even to an extent where it becomes addictive. However, if you’re not getting addicted at the beginning or if you don’t like self-learning, most possibly programming isn’t something you should pursue…
However, if you’re already into web design, odds are that programming is for you.
Should you pick a programming language?
At first, you should decide what you want to do. In you are into web solutions, HTML5 and PHP are the most popular languages in this area. However, it becomes increasingly popular to hire developers regardless of the programming languages they are good at. Great developers always play with new technologies once they come out. Most importantly, if someone’s good at one language, they can learn new ones very fast. So you shouldn’t stick to a particular language, yet play with ones that are related to web technologies.
Also, odds are that there are plenty of web developers working (or even living) around web designers. Take one for a beer! He’ll be more than happy to tell you what languages are worth playing with in your environment and what is important to keep in mind. Let alone he’ll tell you why he would love seeing you knowing how to code.
Where should you start?
There are plenty of useful online resources that teach the basics of web development. Sadly though, there’s no single tutorial that is good for everyone at once. I have selected a couple of websites that I have been using during my pursuit of becoming familiar with coding.
Dash
Dash teaches HTML, CSS, and Javascript through fun projects you can do in your browser. The good thing about Dash is that is teaches the basics trough real-life scenarios, such as “Anna’s friend Jeff needing a custom theme for his poetry blog”. The code is written in the browser and the lessons are leved-based. Is indeed is a fun way to learn the basics for a web designer, sadly however, only four projects (lessons) are available.
Codeacademy
Codeacademy is also great when it comes to the basics of web design. It also offers interactive lessons and it has more programming languages on the table than Dash. Codeacademy starts with HTML and CSS lessons (they call them Fundamentals), which is truly the right selection for the beginners. After the Fundamentals are completed, you can choose to learn jQuery, JavaScript, PHP, Python or Ruby.
I also like Codeacademy because of two separate parts it has while teaching coding: theory and practice which is devided into web projects or APIs. This means it works both for complete newbies and for ones that want to go dig deeper.
Treehouse
While Treehouse is paid, this learning platform has a huge selection of both programming languages and systems (such as development tools or design) to choose from. Treehouse also features videos. It also has Tracks – different goals that you may set for your lessons such as Becoming a Web Developer, Becoming a Web Designer or Learning HTML and CSS. It is very useful if you’ve got a spare buck.
W3schools
This set of tutorials is a very popular one. w3schools features both tutorials and references – the latter are often being explored even by experienced web developers. The website features lessons for popular languages and technologies such as HTML, CSS, JavaScript, SQL, PHP and jQuery. It also teaches servers, databases and other vital stuff, it has more than a thousand of code examples. It’s free. While Dash is somewhat better for newbies, W3S is very handy even for the professionals.
LEARN JS
While JavaScript is somewhat advanced and I would not recommend it for you as the first technology to learn, it is very good to learn if you want to work on making web plugins or mobile apps. This is very much in demand right now, so it’s a handy programming language to know.
Learn-js.com is your first port of call should you decide to go JavaScript. It features an interactive board that allows to try the code you just wrote. The lessons are both basic and advanced.
What else?
Every developer knows stackoverflow that has millions of questions and a similar amount of answers, plus a vibrant community. It has saved billions of man-hours and it will definitely save some of your time.
Speaking of communities, Mozilla also has a great one with lessons and tutorials widely available.
And of course, you should check net tut+ with thousands of tutorials for most of issues and challenges beginners may come across.