What font should the web designer use for the website? What principles should be observed in selecting images and arranging them? What are the criteria for choosing the right font and images for the site? Why is it important to what font the website texts are written in and how the photos are chosen?
In this context, we read the summary of the last two chapters of the book Principles of Beautiful Web Design. We have divided this very useful book into four parts. We reviewed the summary of its first to third chapters in the previous contents of this 4-content collection.
Reading this collection is very useful and practical for those who
- Are they interested in web design?
- They have just finished training in website design and still don’t have enough experience in it and don’t know where to start designing a website or,
- They want to design a website by themselves and they didn’t even get training.
Table of Contents
Practical tips about typography for web designers
Let us first review the topics discussed in the previous sections. In the first part (the first content of the collection), we reviewed a summary of the first chapter of the book. In the first chapter, the definition of the web design process and the design of the overall structure of the pages of a website were discussed. The second part was dedicated to choosing the color for the website. In the third part, the summary of the third chapter of the book, which is about the texture of the website template, was mentioned.
The fourth chapter of the book is devoted to typography and the fifth chapter is devoted to illustration. We begin with a summary of the most important points made in Chapter 4 about typography.
Typography, legibility, and beauty
Typography is more or less the same as typesetting and page layout. Typesetting is an old profession. It is as old as the printing industry. That is, it is necessary before printing and publishing any text (newspaper, book, magazine, and even the text content of a website).
- Letters and words should be arranged next to each other,
- The distance of letters from each other and the distance of words from each other should be clear.
- Decisions should be made about the arrangement of letters next to each other
- Choose the appropriate font for the text.
Making all these decisions is necessary because letters, words, and phrases must be legible. Typography helps the readability of textual content.
Font and technical limitations of choosing the right font
A font is a set of letters that appear in a certain style on a paper or screen. Each font has its name. Fonts usually have several different types: regular font face, italic, bold, and bold italic. The collection of different types of font is included in the font family. Each font family is a typeface. For example, Times New Roman is a typeface that contains different types of fonts.
The web designer cannot choose any font he wants for the website. The font or font family that is chosen must be compatible with browsers and the website. Because browsers cannot read every font. And not every font is designed to be placed on a website. Some fonts are desktop fonts, that is, they are used in desktop software design, not web design. So, the font must be web-safe. There is another consideration: the font should load and display quickly. The web designer must first add the font file to the site. Some fonts are so detailed and their files are so heavy that they don’t load quickly.
Practical tips about image selection and image selection for web designers
We come to the fifth chapter (image selection and image selection) and answer the question of how and based on what criteria the web designer should choose photos and images for the website.
Choosing photos and images for a website is a very difficult and complex task because people (users) interpret images based on their culture and experiences. Two people looking at the same picture are not looking at the same picture, they are seeing two pictures. Also, the selection of some photos is more sensitive. For example, to choose the hero image or hero shot, the banner image that is placed in the upper half of the website page and the user sees it first when he opens the page, you need to be more careful and obsessive.
For this reason, the web designer must choose a photo or image for the website that answers two of the following three questions positively about that photo:
- Is the image related to the brand and its products?
- Is the picture interesting?
- Is the image attractive?
In the following, we will explain more about each of those questions so that the topic is completely clear and the difference between being attractive and being interesting is also clear.
1. Is the image related to the brand and its products?
Remember that a photo can tell a brand story. Such a photo remains in the user’s mind. Also, it helps him understand what the content of the page is about. So, choose a picture so that the user will see the answer to these questions by looking at it: What is this website, and what is offered on it? Therefore, the more relevant the photo or image is to the brand, products, services, or content of a section or page, the better.
2. Is the picture interesting?
The image must be interesting, not necessarily beautiful. User engagement is more important than beauty. You may need to create a very different photo or image to stand out from the competition. I recommend that you visit hi-im-julian’s website (portfolio) and see how creatively he has created a very different and interesting image to introduce and show each of his skills.
3. Is the photo attractive?
The image should appeal to the user’s eyes or engage his emotions. What is the attractive image? Appeal, whether visual or emotional, depends on the subject of the website and its target users. For example, if the website is designed to sell baby clothes; There is probably nothing more attractive than a picture of a mother and her baby.
Attractiveness is a mental and artistic thing. This makes it difficult. But remember that the image is supposed to be attractive to invite the user to do something. For example, if the website is for a restaurant, an attractive photo will make the user want to buy and try the restaurant’s food.
At the same time, remember that:
Photos on the website should convey a message to the user and help the user to have a better understanding of the business and its product or attract his attention to stay on the page and read its content. This is why marketing considerations and the project’s marketing team should be taken into account when choosing images. In some projects, the selection of images is entirely the responsibility of the marketing team, and the web designer has no role in it.
For this reason, the marketing team may decide to use 3D design or illustration instead of photos.