Beyond Coding: Aesthetics & Usability in Web Design

Posted inArticle
Thumbnail for Beyond Coding: Aesthetics & Usability in Web Design

Have you created an award-worthy web design? Enter it into Print’s historical Regional Design Annual competition.


Many non-web designers mistake coding for web design. This is not to say that understanding the rules of HTML and how to properly code are not important aspect of web design, but they don’t even begin to encompass the world of web design.

While websites are interpreted and rendered by machines, the experience of a website must be accessible for people. Many coders fail to take this into consideration, and focus on the technical aspects rather than what is necessary to create a great user experience.

The implementation of design principles such as whitespace, typography, and color theory—and how these elements effect the overall experience of using a website—define the quality of a web designer, not how well he or she can code.

Designers today also need to think about how an audience engages with the website, discovers content and interacts with a brand.

NK web design

RDA Winner: Neuman’s Kitchen web design, www.neumanskitchen.com | Beardwood&Co., New York City; www.beardwood.com

Designing Great Experiences

Creating great experiences on the web usually comes down to three major considerations: interest, engagement and attention.

Interest. What is the central focus of your website? In order to spur interest in your website, you have to communicate this clearly right away. Your users should not have to guess whether they’ve arrived at the correct website, or struggle to determine whether this product, service or media was what they were looking for.

Map

RDA Winner: Yumblebee Website, www.yumblebee.com — Squires & Company, Dallas; www.squirescompany.com

Attention. Once your users have arrived at your site, it’s crucial to hold their attention. The strongest web designers focus on capturing users’ attention by catering to their values and interests. An aesthetically pleasing design, strong visuals and text legibility are essential elements of a successful website design. An illogical layout, indecipherable text and low-resolution images can prompt users to exit the site within 15 seconds.

Hinterland_WellRoundedSound_PRINT_RDA2014_20140202_03

RDA Winner: Well Rounded Sound | Hinterland, New York City; www.hinterlandstudio.com

Engagement. What’s the purpose of a website if not to prompt user engagement? Help users engage with your site using a clear call to action. What do you want your users to do on your website? Engagement can entail interaction with any number of site elements, but common calls-to-action invite users to subscribe to an email list, fill out a form, watch a video or shop. Your design and your content should be geared around facilitating the object of your call to action.

DTL_PROJ_0082-1308_NIR_IMGD

RDA Winner: NIRI 2013 Southwest Regional Conference — Origin, Houston; www.originaction.com

Web Design and Marketing

In most cases, the purpose of the website is to market or sell a product or service—or, in Print’s case, to share exceptional design news and criticism. This is the actual function of the website.

When gauging the effectiveness of a website’s functionality, developers often focus on technical considerations. However, if the client is a business owner, he or she will define functionality by how effectively it drives sales.

Designers and developers must step into the client’s shoes to understand that no matter how good a website looks, or technically-savvy the coding behind it is, a website is only as good as its impact on the bottom line for a business.

Maldonado_Luigi_ElCosmico2

RDA Winner: El Cosmico Website, www.elcosmico.com — Guerilla Suit, Austin, TX; www.guerillasuit.com

SEO and Website Discovery

Today, search engines play a critical role in the way we discover
brands, products and services. If your website is not discoverable via major search engines like Google, it has a limited capacity for success from a business perspective.

Knowing how to optimize a website for search engines is one important element of discoverability. However, this process isn’t solely on the shoulders of the designer. Having an effective content strategy and understanding how your audience behaves will determine how easy it is to find your site via search.

T7153

While static websites are easy and convenient to build very quickly, they might not be discovered by potential customers without some form of paid advertising. Sites with frequently updated dynamic content such as blogs are more likely to rank more frequently in Google searches.

In order to determine the most effective website design strategy—and what platforms and technologies should be used in the design process—designers must understand both the needs of the client and the customer.

The vastness of the Internet requires designers to create websites strategically, focusing on discoverability. In other words, how do you cut through the noise to reach your users?

If you can effectively leverage content marketing and other inbound marketing techniques such as social media, you can help ensure that your audience discovers your website.

Final Thoughts on Web Design

The idea here is not to dismiss coding and web development, but to understand that there are more considerations behind a website. It’s crucial to keep your end result in mind and use that to formulate a design strategy.

At the end of the day, websites might be delivered by machines, but they are meant to be used by and consumed by people, and people should be your priority at every phase of the design, development and marketing processes.


Coding for Designers: HTML & CSS

Are you a design-savvy individual who’s just missing a bit of technical expertise? In this course, you’ll learn HTML and CSS and develop a better understanding of these core web languages. Patrick McNeil created this class specifically for graphic designers, so you can make the print-to-web transition more easily.

umqvpwk0dgyiuq0rlvl0

You’ll study design as it relates to the web, learn some basic combinations of HTML and CSS, and start building common website layout elements. This course is also the next step for students who’ve taken Principles of HTML, CSS and JavaScript. Learn more and register.