Pretty bold statement right? Well, let’s face it. The web has evolved to a visual place where HTML and CSS have become the essential design tool kit.
In today’s blog post I’d like to show you why HTML & CSS are a must-have for UI / UX designers in 2016.
HTML & CSS, still relevant for designers.
As Leon Barnard stated in his blog post, HTML and CSS will still be relevant for web designers in 2016.
I would even say that HTML & CSS are design tools and therefore a must-have for designers in 2016.
HTML & CSS are the foundation.
If you’re a web designer starting out, you probably learn a lot on how to use Photoshop, Sketch or other more traditional design tools. That is absolutely fine.
However, web design doesn’t end with a pixel-perfect Photoshop draft. It’s just the beginning of the design journey.
In one of my earlier articles on how to get started in web development, I highlighted the importance of learning the basics of HTML & CSS. And I really meant it that way.
No matter if you’re a designer trying to get into web development or a developer starting out.
Learning the basics of HTML & CSS is an absolute must-have. There are great resources and online courses available on learning the basics.
HTML & CSS aren’t programming languages.
There’s an ongoing discussion in various developer communities that deals with the question if HTML & CSS are programming languages or not.
So, should someone call himself a programmer when only using HTML & CSS?
Knowing HTML doesn’t make you a developer… HTML IS NOT A PROGRAMMING LANGUAGE!
— Timothy Cole (@ModestTim) August 15, 2015
Well, I don’t think so. But maybe more interestingly: I do not care.
I think those ongoing discussions are a more personal matter than anything else.
Here are some facts instead:
- HTML and CSS don’t compile anything.
- HTML and CSS describe presentation, whereas programming languages describe function
- There are no if-then statements inside HTML
- HTML and CSS are rules and describe rules for styling and structuring content
- HTML is a markup language (as its name suggests ;))
So from a objective point of view:
HTML is not a programming language. HTML stands for Hypertext Markup Language. A programming language allows you to describe some sort of process of doing something, whereas HTML is a way of adding context and structure to text.
Designing inside the browser with HTML & CSS
Instead of going to Photoshop, the concept of designing inside browser suggests to start prototyping and designing inside your browser, using HTML and CSS as your primary design tools.
The big advantage of going straight to your browser, lays in the effectiveness and speed of your design and development workflow. With existing frameworks such as Bootstrap the workflow becomes even faster.
Further benefits and advantages of going straight to the browser can also be found in this blog post.
Interactive user stories vs static files
Static mockups are becoming less useful and designers have to find new workflows and tools which help them produce designs that are more accessible and interactive across all those devices we use.
One of the biggest advantage of designing in the browser, is the interactiveness of its medium. With Photoshop you can only produce static files, whereas HTML and CSS enable you to create real prototypes and mockups which make it easy for colleagues to actually grasp user stories.
Knowing CSS will make your web designer life a lot easier.
If you’re a web designer chances are pretty high that you’ll be working with other web developers on new websites or web applications.
Knowing how to use CSS and HTML as a designer will give you an easy time, collaborating with your developer colleagues.
It will not only strengthen your position within those project teams, but also enables you to get deeply involved in the development stage of a project. Adjusting styles or customizing a prototype is an easy game if you know CSS and HTML.
Prototyping tools for the win.
We believe that the current web design experience will evolve to a more user-centric and more interactive design experience than it is today.
Prototyping tools – such as Silver Flows, recently acquired by InVision – will add a new design approach to design collaboration. Shifting from file-based design drafts, to user flows and stories. Even Adobe recently joined the trend of prototyping tools in releasing their own prototyping tool Adobe Experience Design CC.
The web is way more interactive than you think.
Having great HTML and CSS skills will not only make a designer’s life easier, but also enables them to create well-thought out user experiences.
Over to you. Do you think a web designer needs to be an HTML & CSS expert? Let us know in the poll below and leave a comment in the comment section!
This article was brought to you by Usersnap – a visual bug reporting software.