Beautiful web site design: top 10
From the author: I welcome current and future web designers, as well as other readers of my blog. Today I want to demonstrate an unrealistically beautiful web site design that…

Continue reading →

Rubber web design. What and where are we going to stretch?
When developing a website, the webmaster, first of all, should be based on the project goals. If it is important for the customer that the web page can be adjusted…

Continue reading →

Beautiful web site design: top 10
From the author: I welcome current and future web designers, as well as other readers of my blog. Today I want to demonstrate an unrealistically beautiful web site design that…

Continue reading →

Composition in web design, or what Photoshop textbooks are silent about

From the author: today we’ll talk about what is a composition in web design that photographers, artists and web designers love to talk about. It may seem to a beginner in this area that this is some kind of secret knowledge, accessible only to the elite. But today you are lucky: I will help you understand this issue, so much so that you can influence not only the mood of visitors to the site, but also their decision to purchase. Here we go?

Surely, you often have to visit sites that, at first glance, seem to be like nothing – both the pictures are beautiful and the text is folding, however, they lack some kind of logic, completeness, or something. And all because the owners of such sites, most likely, did not bother with the laws of composition – the art of organizing the elements of the site, combining and arranging them in their places.

Oh, that brain …
Our brain has the ability to instantly perceive information and create visual connections. I will explain with examples. Below you see two circles.

You immediately found a way to distinguish between them, right? But the task is more complicated for you.

Web design. Fast start

Learn the course and learn how to create a website design and prototype in Figma

Learn more

Despite such a variety of objects, you can definitely describe any of them.
What does web design, balance, the basics of composition have to do with it? – you ask. The thing is that our brain has a unique ability to instantly classify information. It can group visually similar objects into groups. Using the simplest visual tools, you can transmit a large amount of information to users and manage their attention.

Composition is a certain combination of website elements.
Harmony in the proportions of the parts of the whole, beauty and the logic of construction are inherent not only in human creations. Signs of composition can be found in the structure of the universe, animal organisms and plants, and natural forms. Therefore, the term “composition” can be equally applied to the structure of the website, the description of the flower and the characterization of public speaking.
The easiest way to talk about composition in web design is when it is not followed. Each of us intuitively feels its presence / absence: are the elements in a harmonious interaction, are they subordinate to the main idea of ​​the site, picture, photograph.

To make your site design look natural and harmonious, without falling apart into separate components, follow the basic design principles, the description of which I give in this article.

Choosing the right colors
The choice of color depends on how people perceive your site, and at the same time, your product. The muffled colors seem relaxed and calm to us, and the bright and contrasting ones are vigorous and energetic.

Think about what emotion you want to arouse in a visitor to your site, and then choose the right color scheme. A good example is the fresh Orangina website design, highlighting the brand’s image:
To attract attention should use color accents. In contrasting colors you can, for example, design the most important buttons – “Buy” and “Contact us”. I will introduce you to some of the most important principles for choosing and combining colors.

1. Complementary colors. All opposites on the color wheel create a strong contrast, so you can use them, but only carefully.
2. Analog colors. Such “neighbors” in the color wheel do not have a strong contrast.
3. The triad. An almost win-win combination is an isosceles triangle.

Web design. Fast start

Learn the course and learn how to create a website design and prototype in Figma

Learn more

4. Tetrad. Two pairs of complementary colors should be used very carefully so as not to cause chaos in the cold.

The rule of thirds – where to put?
The rule of thirds refers to the basics of composition in web design. It arose as a result of the interpretation of the golden section rule (maybe, remember, Leonardo da Vinci still used it in his paintings).

At first, I wanted to show you the picture “The Vitruvian Man,” for example, but because of his overly frank outfit, or rather, his absence, I decided that I would not. Suddenly, the children are reading an article here 🙂 Therefore, admire the Madonna:
Mentally draw two vertical and two horizontal lines on the page, dividing the area into nine equal parts. It is believed that most people focus their eyes on the points of intersection of these lines. Remember the rule of thirds every time you think where to place, for example, a call to action button.

In general, it’s pretty funny that such a mathematical rule applies to something as subjective as web design. This is a kind of aesthetic compromise, which creates a sense of balance on the screen, without overloading it, but without making it too static.

Popular web design software with raster and vector graphics
From the author: for the successful design and creation of sites you will definitely need special programs for web design. There have been tons of new applications lately, but which…

...

The Importance of Visual Context in Web Design
From the author: According to the results of a popular study by the University of Missouri Science and Technology, visitors form an opinion about your business site in less than…

...

Buttons in web design
From the author: I love buttons. With their help, you can do many different things: move on to the next stage, accept various conditions, perform something. Buttons make the site…

...

How to work with non-designers
From the author: the modern workplace is gradually becoming a more distributed and global environment, so cooperation with people in different time zones and with different cultures is becoming more…

...