Design principles that matter in 2022

Joshua Clark -

Getting design right

I should do a poll to figure out how many folks start a design file to simulate the web page before coding it. I have to visualize a product before getting technical with it.

Since I'm a newer designer and developer, I spend some time verifying standard specs for what I'm building. For example, according to standards, a navigation bar and how many px X px it should be. Another example is font sizing, for instance, the size ratios between the heading, subheading, and body. These are all principles that matter. When you layout your design file implementing common design standards, it will require less time to "get it right" when coding out the page.

Five resources for breaking into design

  1. When starting your design, it's best to start with a design system to design your web page with consistency. This "...Where to start?" article is a solid intro to design systems by Shane P Williams.
  2. It's also good to design with screen size responsiveness in mind. In Shaun Anderson's post, he uncovers the top ten screen sizes to optimize for in 2022.
  3. Fonts can be tricky sometimes, especially when they need to be responsive. Erik Kennedy's approach to font guidelines fills you in on everything you need to know about fonts.
  4. One of my favorite parts of a website is the navigation bar, as it's a visual most folks see when they first land on a page. It is an excellent way to demonstrate branding while guiding folks around the site. Pieter Heyman does a hell of a job laying out nav-bar guidelines; I keep his post in my arsenal.
  5. Let's not forget about the hero (pun intended, ha!), which makes up a large part of the main page. It has to be visually appealing and flow with the rest of the design. Katrina Kirsch's Hubspot blogpost explains how to implement the previous four topics into your pages hero.

These are some of my favorite resources that I've bookmarked for quick reference whenever I'm laying out a new design. It's also okay to copy great designers as you learn. As Austin Kleon says, "Steal like an artist."