Web development has always encompassed a lot of different requirements, the skills that each individual, team or even company has or needs varies greatly. One thing that has persisted for quite some time though is the separation of the “functional” parts and the “pretty” parts. Often these two parts of work are completed by different teams or people with different skills or experience.
You might have heard the phrase “I’m just making it functional right now” casually thrown around your team as you work through a problem. People might say “It works, we’ll make it pretty later”. After all functional is defined as “designed to be practical and useful rather than attractive”.
This is fine if you work under the premise that Design and CSS does nothing more than make what you are working on look pretty or just “adds a bit of colour”.
CSS by it’s very nature is about how something looks, how it’s presented, it’s tightly coupled to design and it’s because of this that we can often underestimate the impact that it has on making our projects functional. The problem with this thinking is that we, as developers, can forget about the importance of Human Computer Interaction, User Experience and Design in the web development process.
The “functional” piece of code that we write might not actually be “practical and useful” without the parts that define how it’s presented, the parts that have been pushed aside for later. Maybe your button doesn’t look like a button. Perhaps you didn’t use headings, or maybe your text gets cut off, or is simply missed because it’s in a spot someone didn’t expect. Maybe nobody knows where to click, where to look, what to do with the “functional” code. All of a sudden what was supposed to be “practical and useful” isn’t so useful anymore.
It’s important to remember that Design and CSS helps make things usable and accessible. This combined with all the additional coding is what makes something functional, you need both pieces of the puzzle to get there.
It’s only when people take the time to understand the role that Design and CSS plays in web development that they can fully appreciate it.
CSS plays the very important role of translating Design, and User Experience on the web. It’s how we take all the research, planning and strategy and deliver something that people can use, but also, and more importantly, want to use.
If typography can change how you interpret content, and colours can impact your emotional response. If animations affect how you perceive things and interactions affect how people use and experience your website or product what happens to “functional” when all that is gone? Is it still functional? Is it even useful?
This isn’t to say that you should follow all the latest design trends and cram your projects with a tonne of CSS just for the sake of it — sometimes the best UI might be the ugliest, it might be the most crammed screen you have ever seen, because everything is right at the users finger tips, but someone still has to research, design and create that.
This is the thing, CSS and Design, it isn’t always meant to result in “pretty”. Because making things pretty — that is the biggest myth in web development.