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.
I couldn’t agree more. Sure it’s ok if a web designer doesn’t know how to code but its a HUGE plus when they do because understanding how the two work together only makes them better at what they do.
A website designers that knows how to code definitely has its advantages. While not necessary to be a strong web designer it does help quite a bit to have some coding knowledge and experience. At our company the tasks are actually kept separate. It allows us to provide a high degree of specialization in each area (strategy, design, development, testing, etc.). That does not mean that our designers and developers don’t work closely with one another – they sure do. It just means that the truly great designers spend most if not all their time strictly on design work. The same can be said about developers. Obviously if you are not a web design company you may find yourself wearing several hats including the design and development hat simultaneously – and that can be ok too!
Alex
Isadora Design – Handcrafted Web Design Company
Writing code is not that hard… it could be fun actually. What it is, is time consuming. I’m a graphic designer so I create my own page parts so combined with coding… website could take a while.
I think a web designer should know at least the basics of code. If issues ever come up with a website, a web designer should know how to handle it.
this sounds interesting – “We’re a women-run not-for-profit group working to empower everyone to feel comfortable learning beginner-friendly technical skills in a social, collaborative way.” – https://ladieslearningcode.com/
Great article. I’m a designer at heart but your comment about getting addicted to coding really resonated with me.. So true. Good advice.
Thank you! This article could not have been more timely as I am facing the to code or not to code decision getting back into the world of design.
I would recommend web designers learning the basics of HTML and CSS. It will make you more valuable to the market place and not completely out of loop when working with front-end developers.
I always have this argument with people but based on research ive made looking into definitions and how the industry defines and standarizes things i came up to this conclusion. there are three people that are related to web design and development.
– a designer with knowledge on how to design for the web and devices.
– a web designer which is still a coder yet not a developer/programmer
– a web developer/programmer.
In my opinion this three individuals should be well informed about the web standards of accessibility and usability.
a designer that knows how to design for the web doesn’t need to know code eg HTML,Javascript,PHP etc.
a web designer needs to know markup language(HTML and CSS at least) yet not programming languages(javascript,php,etc).
If the designer dont have an idea of how code works i think its pretty hard to get a great web result. Anyway, im a web and graphic designer and i find pretty fun to code html5 and css, i think do layouts and work width spaces and colors with code were interesting.
Thanks for share!
Lynda. com has some great classes on coding. I’ve been a member for years and highly recommend it to anyone. There’s a free trial period for newcomers. After that, memberships start at around $25 a month.
i reckon web designers should at least know the basic and logic from a developer’s point of view. at least it makes things easier for developers to convert designs to a working site.
Another website that has great free and premium courses is Udemy. They actually have a very detailed free HTML5 course. You should check it out: https://www.udemy.com/learn-html5-programming-from-scratch/
Designers and developers need to collaborate. Designers need to keep pushing the envelope, making tricky and outside-the-box visuals that push the work of the developer forward. Also a designer should know how to code because coding knowledge helps designers talk the same language as the developers building the site.
Although not essential, I agree with the consensus that yes… it has it’s advantages. Just a basic understanding of key programming will also give designers and appreciation for the developer who has to convert your design into a fully functioning website.
Great article and one thats been on my mind for a few months now. For someone who has worked in the design industry for nearly 10years I recently moved into web design and I knew that both skills combined could only be beneficial to producing high standards of work, even if it is to understand what to expect from a developer when your project progresses.
My New Years revolution started the back-end of 2013 and the links to online training is going to be extremely handy, thanks.
Does anyone have any thoughts on text editors and which ones are better to use, talking to some developers it seems they are quite a personal thing. Sublime Text is one that comes to mind?
Wow I thought this was subject of yesteryear. And I’m shocked to see so many saying they don’t code. Web design in photoshop is dead in the water. The biggest, best and most beautiful sites are built right in the browser. I concede I use photoshop for some aspects of visual design, but psds are never supplied to the front end developers. Instead living, breathing, responsive prototypes. You just can’t demo/detail the interaction in a photoshop file. Please for the sake of the web as we know it learn to code.
Coding is probably going to be necessary for any person doing web work — even strict graphic designers. If the graphic designer does not understand basic HTML/CSS, that means that every small detail or fix the client asks for, the graphic designer needs to contact, rely, and wait on a subcontracted coder to get the work done. And in some cases, this means small jobs end up taking a week to do because tasks are being relayed to someone else. And if the client ever finds out the graphic designer does not understand code, I feel like that would greatly diminish the value of that graphic designer. Important: this is not the same as a graphic designer who knows code, but prefers to focus on the graphics and hires or partners with a good coder.
Let me start with this, I am a designer of all sorts. I design everything from business cards, logo’s, mobile websites, tablet catalogues, t-shirt graphics, t-shirts (construction & design), mobile apps, websites and I even paint a few canvas’s in my spare time. I have never studied at a university, online site or privately.
I do understand that the knowledge of coding is really good to have, but not that important as most have said on this thread. I have designed multiple sites using parallax (I love this) and many more with some super complicated (on my side) but ‘beautifully easy for the user’ sites too. Without code.
Please note, I am not boasting. I have worked my @ss off to get to this stage in my life, it is hard work BUT to be a great web designer doesn’t mean you NEED to know code.
I think coding will be a thing of the past in years to come. I think web design shouldn’t be limited to those who know coding. There are too many creatively brilliant brains out there for web to stop at coding.
The age of design meeting web is still to come. Web design has been around for many years.
This is just my opinion from the output and influence of my life. Hate me, love me, criticise me, hunt me.. it’s your life but I love you all.
A very timely article. My background is undergrad CompSci but I’m sick and tired of not being good at design, which I always outsource! Time to change that in 2014!
Can someone suggest an alternative to PhotoShop that’s simple & intuitive?? It just seems so huge & bloated. Mind you, I couldn’t figure my way around the damn app to design anything usefull if you pointed a gun to my head.
I do have a ‘good eye’ for design & know what I want…I just need to find the right graphics app. A PhotoShop Lite that’s not overkill.
Web designers should have a fundamental understanding of HTML and CSS. A good web designer will only become a great web designer once they know how to code and fully understand the possibilities and limitations involved in coding.
visit https://www.webfid.com for the best mobile app developers