What font is used for my site
?When choosing, it is necessary to take into account for the font size the fact that not all users have an ideal look.
The young professionals site will adopt a reduced font to save space, but it's not the most general choice.
As for the font, in some cases it may be extremely important to have a clear distinction between the characters 1 (one) l (lowercase) I (i uppercase), which is not the case with Arial, but which Verdana does very well .
Fonts and single, l, i uppercase, o lowercase, o uppercase, zero characters:
Arial: 1 l I O 0
Verdana: 1L I O 0
Georgia: 1L I O 0
Helvetica: 1 L I O 0
Times New Roman: 1 l I O 0
If different fonts are used for different page elements, then it is best to express the size as a percentage, since "em" may have different results depending on the font.
Examples of popular sites
Based on the fact that the most popular and visited sites cannot be mistaken, to get an objective answer to all questions, it would be best to see what choice they made!
Amazon
body { font-family: verdana,arial,helvetica,sans-serif; font-size: small; background-color: #FFFFFF; color: #000000; margin-top: 0px; } .h1 { font-size: medium; }
body { height:100%; font-family:Helvetica,Arial,sans-serif; font-size:small; color:#000; background-color:#fff; margin:3px 8px 0 0; padding:0; } h1 { font-size:160%} h2 { font-size:140%} h3 { font-size:120%}
Apple
body { font: 12px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; background-color: #fff; color: #333; margin:0; padding:0; } h1 { font-size: 24px; font-weight: bold; line-height: 36px; margin-bottom: 18px; } h2 { font-size: 16px; font-weight: bold; line-height: 18px; margin-bottom: 18px; } h3 { font-size: 1em; font-weight: bold; line-height: 18px; }
New York Time
body {
background-color:#FFFFFF;
color:#333333;
font-family:georgia,"times new roman",times,serif;
font-size:62.5%;
line-height:1.5em;
margin:0;
padding:13px 0;
}
Common features:
- Using px and percentages, not em.
- Black or dark gray (# 333).
- The background color is always white.
- Font choice: Each site has its own preferences. If we take into account alternative funds, then the most often used are: Arial, non-serif, Verdana .
Conclusion
Best Font:
Select from Arial, Verdana, Georgia, depending on the content and comment made above. Mismanaged police are a forced alternative choice.
You can use different fonts for titles and other elements.
Font size:
Often sites tend to use small symbols. A font size of 13 pixels is generally considered a good compromise between readability and bulkiness. In terms of title sizes, look at the choice of Google or Apple.
Unit of measure:
The base size, the body size, is expressed using the small code. Tag sizes are expressed as percentages or pixels.
Using pixels does not remove anything on the relative side: when the user expands the page, the text in pixels increases with the rest.