Beyond Design 3: Design Elements

by | Jun 11, 2018 | Beyond Design series, Design, Website Elements

Fonts, colors, and images are major aspects of your website design. Even if you have hired a professional to build your site, you may have the opportunity to participate in the selection of these elements. Your web designer will likely have certain colors and fonts in mind after talking to you, but you will likely have final approval. Since each decision can have a major impact on your end result, you should know a little bit more about these elements.


One of the first things your web visitors will notice is the typography, or fonts, used. The trend for fonts is starting to lean towards bigger and bolder, but this really works best if the rest of the website is kept clean with minimal text and other elements. When the homepage of a website has a lot of information, including text, video, and images, it is better to use smaller fonts to keep the page from looking too cluttered.

If working on the site yourself, take the time to play around with different types of fonts before deciding on the one or two that are perfect for you and your site. But make sure to follow these 2 rules of thumb:

  1. Try not to use more than two different fonts on any one page. Doing so will only bring confusion to the page and make it look tacky.
  2. There are professional fonts and casual fonts. Make sure to choose one that is fitting for your brand. There are instances where the casual handwritten fonts may be appropriate, although it is recommended to save these for banners, social media, and other marketing designs outside of your actual website design.

If you have hired a professional designer, they will likely include the recommended fonts as part of the original design for you to review.

Coherent color themes

Colors will bring life to your website and make certain sections pop, but you have to be careful when using them.

Typically, businesses already have a logo when they are having a site built. In these instances, your designer will likely use the logo colors to determine at least one of the primary colors of the website. Then, they will be able to select a secondary color as well as some complementary colors. Using previously-defined colors helps to ensure cohesiveness and continuity to not only the website but to the brand as a whole.

If you do not have an actual logo, you may have to start your color selection process from scratch. Although you may have certain colors you do or do not like, there are definitely other aspects to consider in this decision.

First, you don?t want to mix together too many colors. Unless it is absolutely fitting for your brand, you do not want your site looking like a rainbow. Very rarely would this be appropriate.

Second, not only do you want to make sure that the colors you do select look professional, but you want to be sure they complement each other. A designer should have the knowledge to be able to verify this and lead you in the right direction. If you are building the site on your own, definitely do some research on this topic.

Some people like to look into the meaning of different colors. There are many articles on the internet if you search for ?color meaning and symbolism? or something of that sort. Although this should not be the primary factor in selecting colors, it is good to understand which feelings each color invokes in the average population.

Including media

Study after study has proven that when users go online today, they?re attracted to media before text. In the past, this has typically meant images, with videos now taking the lead. Of course, you do not want to just throw images or videos on your site without any careful planning.

There are two rules when it comes to placing media on a website: they must be relevant, and there can?t be too many.

Deciding whether or not media is relevant is fairly easy; all you need to do is decide whether it relates to the other content on the page and if it will capture the user?s interest. For instance, if your local business has shot a commercial, you may want to display it on your homepage. But while it may relate to the other content on the page, especially if you?re trying to capture leads, it might not capture the user?s interest. No one wants to go to a website just to see advertising. A video of a company barbecue or a virtual tour might be more appealing.

You also need to be very careful when it comes to how many you?re placing on your website. Websites with a lot of large images or videos take far longer to load than websites that contain mainly text. Not only does this impact your search engine ranking, but users will lose patience with the long load time. So while integrating them is important, it?s even more important that you prioritize the media you want users to see the most. One standard is to have one relevant video placed on the home page and maybe on individual pages. Images can be used a bit more freely as long as you are certain to not negatively impact your site’s speed.

There is a lot of beautiful stock imagery available out there. It is always better if you have your own images showing your actual products and company, as long as they are professional grade. If you cannot afford to have those pictures taken, start with stock imagery and replace them as you can.

Keeping mobile in mind

The world is going mobile, and that trend isn?t going to slow down any time soon, if ever. Because of this, keeping mobile users in mind when designing a website is one of the most important things a local business owner can do. Although colors will remain the same, fonts and images may need to be adjusted for mobile devices. Some frameworks for building sites make it very simple to not only set different configurations for desktops vs. mobile devices but also to reorder or even hide complete sections on the page.

One reason this is so important is because customers don?t only search at home now. They may be out shopping and want something to eat, so they search for restaurants that are nearby. If you?re one of those restaurants and you don?t have a mobile site, your website may not appear properly on their smartphone, which could mean losing a potential customer.

Even when customers are in the comfort of their own home, many still choose to just whip out their tablet or smartphone to search rather than boot up their desktop and sit down to look. Many people don?t even own a full-size computer these days. Again, if your website isn?t optimized for mobile usage, the user may only be frustrated by the difficult navigation and will instead look for a different website that is optimized for mobile.

Making sure your website design is optimized for mobile is important for another reason that has little to do with the user. Search engines have also realized the growing trend of users going mobile and have incorporated this into their algorithms. When websites aren?t optimized for mobile users, search engines may penalize them by placing them lower in the search results, meaning that less traffic will make it to the site. Google has an actual mobile test to determine if a site will show up on on the first several pages of mobile search results.

Design approval

Whether you give your designer full creative license to make all these decisions or you supply recommendations based on your likes and dislikes, in the end, it should be approved by both parties. You want to make sure that the end design is something you are happy with; it is your company after all. On the other hand, you want to make sure your designer supports any design decisions you have made. Good designers are well versed in color schemes, font readability, and more. Trust the experts!

Join us next time as we talk about navigation and general usability.