3 key concepts of web design

If you’ve ever looked at web design concepts, you’re definitely aware of the following mindset: “Web design is just too easy these days.” Designers don’t have to struggle with any of the constraints that dominated the early days of the internet anymore, thanks to lightning-fast internet speeds and advanced browsers. More than ever, a website is a designer’s canvas.”

web design, laptop, administrator


The grouping of graphic elements in a logo in order of priority is known as visual hierarchy. The visual weight of an aspect in a design’s hierarchy determines its meaning, communicating to a viewer’s eyes what to reflect on and in what order.

It’s a well-known phenomenon that people of most countries read left-to-right and top-down. However, it is well known that reading action follows a far more complicated series of laws beyond these constraints. This is particularly true on the internet, where people “scan” pages even more than they “read.”

Important objects, such as the slogan, call to action, or main picture, are placed along the axis that the reader is supposed to search in relation to these calculated reading patterns. These are usually in the form of a “F” or a “Z.”

Text Scanning Patterns: Eyetracking Evidence
F-Shaped demonstration


The word “web-safe fonts” has already become a bit of a relic in 2014. Browsers only accepted a small selection of fonts in the early days of the internet—usually only those that were already installed in users’ word processing software—and if you deviated from these, any visitors might see random symbols.

a few general guidelines to remember:

Headlines can use serif fonts.
Serif fonts are always used for headlines in web design because they are difficult to read at smaller sizes. In general, body text should be sans-serif.

What is the difference between Serif and Sans Serif Fonts - Easil

Keep fonts to a minimum.
Keep the number of separate fonts on a website to a bare minimum to avoid clutter. At maximum, two or three. For more detail, see our recent article on smart font pairing.

Take up as little room as possible.
Keep in mind that certain font files can be very large, which can cause a website’s load time to be slowed.


We won’t go into too much detail here because the concepts of picture and colour selection aren’t really unique to web design. The biggest rule to remember is to not overdo it.

For Colors:

Keep your color scheme simple.
Much like fonts, limit yourself to two or three. They can, of course, represent the host’s branding while also serving as a way to draw attention to key areas, as stated in the “visual hierarchy” segment.

Consider the case of color blindness.
Another thing to bear in mind is that about 5% of the (male) population is colorblind, so be careful with your color combinations.

For images:

Minimize activity.
Avoid moving pictures. Refrain from using flash. Even .gifs are suspect because they are produced with extreme care. In general, surveys suggest that audiences favour websites that do not change their appearance.

Select pictures with care.
Don’t just use photographs to fill space; tourists may see this right away and will lose interest in your website. Instead, only use photographs that convey valuable content, such as demonstrating accompanying text or elaborating on a feature being described.

Always follow all stock picture copyright guidelines.
Keep in mind the copyright conditions that apply to your pictures. The majority of pictures are copyrighted, which means you or your customer would have to pay to use them. You will learn more about this subject by reading some of our previous posts.

Keep file sizes to a minimum.
Check to see that the picture sizes are as small as possible (web resolution is 72 ppi). Images usually make up 60% or more of a web page’s size and loading time.

Leave a Comment