Website Design FAQ

In considering the design of your website you have several elements to consider all of which influence the tone and style of the website resulting in an emotional connection and first impression.

Examples of tone include:

• Professional
• High Tech
• Edgy
• Elegant
• Fun or Happy

Some design decisions are carried across the whole website and affect every page, while others are unique to specific pages including:

Sitewide Design Decisions

• Background color of the header at the top of the page
• Font style and font color for the main navigation, hover/selection action color
• Heading font type, color and size
• Body copy font type, color and size
• Page background (white or color, with a gradient, have texture or blended graphic elements)
• Add a custom design feature to the bullets
• Button design (size, shape, color, font type and color, border or no border)
• Footer background color, font type, color and size, and how many columns
• Size, color and placement of social icons

Individual Page Design Decisions

• Size and shape of main photo at the top of the page (single photo, collage, or photos in a slider)
• Add messaging in the main photo (font type, size and color)
• How to organize the information on the page
• Use Call-to-Action, how many and where to place them

 Audience Appreciation

In addition to all the design choices described above, the design needs to take into consideration the website visitor, are they:

• Male or female, young, middle-aged or older
• High or low income, college-educated
• Business professionals or consumers
• Likely to have a disability impacting usability

Each demographic can react differently to color, font style, and simplicity or complexity of the design.

Business Goals

The business goals of the website also influence the design.  For example, is the goal to educate with an online brochure, or is the goal to generate leads or to sell merchandise directly through the website?  All of these present unique design challenges.

It is the role of the graphic designer to bring all these website design elements together into a cohesive look and feel that gives the visitor the “first” impression you are trying to make with your brand.

Click here to view over 900 Website Design Layouts.

Your design options are limitless as will be explained in this article.

There are many popular fonts available for use on a website, but important consideration often overlooked is the reality that your website can be displayed on many types and brands of devices each using different operating systems and browsers and other variables.  For this reason, for websites, it is recommended using “Web Safe Fonts” for your design.

This article Web Safe Font Stacks by Jennifer Kyrnin provides a list of fonts that meet this criteria.

After reviewing various articles, we’ve concluded these five web safe fonts are safe for both computers and mobile devices:

• Arial
• Georgia
• Open Sans
• Times Roman
• Verdana

View Serif Fonts

Serif and San Serif Font Options

San Serif font is a typeface that does not use serifs (the small lines at the ends of characters).

Font type is important for the readability of your copy and titles, and can set the tone of the website (playful, funky, all business, etc.).

Popular website friendly sans serif fonts include Open Sans, Avant Garde, Arial, Tahoma, Amasis, and Geneva.  San Serif font style is considered as presenting a more modern or contemporary tone.

Popular Serif fonts include Times Roman, Courier, New Century Schoolbook, and Palatino.

In the early days of websites, it was usually recommended to use san serif fonts, but screen resolution has improved dramatically over the years such that it is safe to use san serif or serif options, allowing design choice and readability to dictate.

For more information on the readability of font selection read this article How Typography Determines Readability: Serif vs. Sans Serif, and How To Combine Fonts, by Harshita Arora.

View San Serif Fonts

Read here about the importance of fonts on influencing the tone and user experience on your website.

There are many design elements to consider in website design including page symmetry, font type, font color, use of headlines and calls-to-actions, and of course color.

Choosing the right color scheme that will resonate with your target market (ideal customer) is an important consideration.  The strategies for logo color are different than for the website, yet both must complement each other on the website page.

First step is to choose a website color that will work well with your logo, and allow colors in the logo to be used as accent colors for borders, button colors, etc.  If you plan to drop your logo into a header or footer that has a background color, then you will have to choose a contrasting color so the logo is not lost in the background. Here are three examples of the same logo with three different Header background colors.

Whatever background color you adopt, it should be consistent across the website. The dominant color in the logo is usually used for the dominant accent color on website page. In the above example, blue is the dominant color, which used throughout the site.

The likeability and effectiveness of color or color scheme on a website design is dependent on many factors including age, gender, education and location (culture). Secondary factors like how color is used to mitigate the busyness of a page or to draw attention to headlines or calls-to-actions can influence a viewer’s perception of the page’s likability and readability.  Together website design likeability and readability can influence behavior and perception.

“Demographic variables play a significant role in supporting the prediction of visual appeal. These include age, gender, education level and geographic location,” according to a 2014 study Quantifying Visual Preferences Around the World; by Katharina Reinecke, University of Michigan and Krzysztof Z. Gajos; Harvard University. The study also concluded “A visual analysis of our websites suggests that a moderate complexity results in highest appeal ratings when achieved with a good balance between text, color, and images.”

The study analysis concluded the preferences of various subgroups found “females liked colorful websites more, and colorless websites less, than males. For complexity, both genders reached their peak appeal at a similar low to moderate complexity level, but females disliked simple websites more. Adults aged 41 years and above liked websites with a higher colorfulness and complexity than younger age groups.” The study also found “a negative correlation between education level and colorfulness, as well as between education level and complexity. Independent of age, highly educated users prefer less complex and less colorful websites than others.“

But color choice is not just about demographics of your target customer. It also has to do with context of your brand image.  Green might work well if you are in financial services, but also works well if your brand stands for environmentally friendly.  For more insights into color strategies for website design this Psychology Today article, Color Psychology: How Colors Influence the Mind: The psychology of color in persuasion; by Gregory Ciotti, references several research studies that  can be used to guide your color strategy.

To learn more about the importance of color, read our article on How Color Influences Website Design.