This is a recurring questions that is discussed heavily on the web. And from time to time this pops up in a every web designer’s mind. With agile development and scrum becoming the new standard for product design teams, designers and developers need to work closer together than ever before. That is why it is really important to develop a basic understanding of what the other part does – and why!

Cons – Why designers should not code

Let’s have a look on the pros and cons regarding this discussion: Both web development and web design have become more and more professional and new roles have been developed. Instead of having the old-school web designer who runs it all, we have now multiple positions in this field such as user interface designers, user experience designers and many more. The level of professionalism becomes more and more important.

Honestly speaking, your coding skills won’t ever be on the same level with a developer as long as you try to keep focus on design AND development. Both disciplines are extremely complex and it is very time consuming to stay up to date.

As a coding designer you will bear a much greater responsibility because you are the one who cares about visual appearance, branding, interaction design, mobile-friendliness, code performance and maintenance. And this is bad for the team because not only you are going to lose your speed but also your focus. You may end up designing what you can built and the other way round. As time is usually limited, your ideas will be limited to your capabilities, too. And that’s obviously not the best for the product, is it?

Pros – Let’s have a look at the advantages

Nonetheless, being able to code comes along with a bunch of advantages. For instance (and this is already the most important one!) you can make sure that your layout looks exactly the same when it is implemented. Every designer knows the situation when he or she has handed off the screens to a developer who is not interested in design: Everything looks a bit weird because the space between elements is not exactly the same or the font-sizes differ slightly from the mockup. In a worst case, whole components look extremely different and the developer tells you that „it’s technically not possible“.

You can avoid that by keeping the constraints of coding in mind while you create new layouts: For example, Text which floats around an element might look great and is easily done in traditional print design but on the web the effort is way too high.Technically it might be feasible but the effort is way too high.

Additionally, this is extremely time-saving for both of you as it is not very productive for the developer to check every single detail with the designer when anything is not applicable. When you know how to code, you don’t fully need to rely on what the developer says because you know what can be done in HTML/CSS and what can’t. You could easily face these issues by sending him the right code snippet. Having the same vocabulary simplifies the collaboration, too!

Which languages you should learn?

Don’t worry! You don’t need to become a full-stack developer. For the beginning, it is enough if you put your hands on HTML and CSS. The languages are very easy to learn and will give you a basic understanding of what is possible on the web and what isn’t. Make sure to have a look at the latest standards which are at the moment HTML5 and CSS3. If you feel comfortable later on, you could go on with SASS and the basics of javascript.

After you know the basics, you will want to code a website yourself. This is where frameworks come into play. Frameworks are pre-built libraries that do most of the work for you. They contain styles and components that you can use to build your site as quickly as possible. You just need to edit the code to fit your screen designs.

The most important advantage for beginner is that large frameworks like Bootstrap are already optimized for responsive design. Therefore you don’t need to test every single detail yourself. Plus, the community is very active so when you have a question you’re most likely to find the answer already on the web.

Do you need to code yourself?

To know how code is working and to code yourself are two different things. If you’ve read the article to this point you know that you mustn’t code your own designs. Nonetheless you can benefit from knowing the theory.

As a designer who has already made the journey from a traditional graphic designer to a UX/UI designer with coding skills, I can tell that this improved my designs enormously! The collaboration with my development colleagues became much easier and we save a lot of feedbacks or review rounds during the design process.