20 "NOT" for web designers

Each designer has a number of rules that guide him in his work. And often the memo, made up of such rules from experienced designers are a good help for beginners. I have a number of such rules too. True, they relate to what should NOT be done in the manufacture of the layout. Some may seem trivial and obvious, others will even cause someone to be perplexed. But they really help me and, I hope, some of them will also be useful to those who are engaged in web design or want to join this area of ​​website development.

one

DO NOT do what the layout designer could not realize later. And, although modern methods allow to achieve almost any results in HTML layout, you should always remember that you are creating a website, and not an advertising poster. Your idea should be transferred without difficulties and problems of incompatibility into the code, which can be displayed with the same result on any systems.

2

Do NOT use the substitution of standard form elements for screenshots of similar elements from your operating system. Believe me, the button that you forcibly implemented in the spirit of Windows 98 is unlikely to appeal to MacOS users.
')

3

Do not shrink the text. Skittles less than 9 pt are not recommended. Use 9 and 10 pt skittles only for minor blocks, footnotes and captions. The main text publish a size of at least 11 pt.

four

DO NOT rely on standard leading values ​​(+ 120% for the size). It is often necessary to add 1–4 points to the default values, this can significantly improve the perception of the text. Most often, a value of 140–160% of the size can be successful. Pick the best in your opinion. I use the following size / leading: 11/14, 12/16, 13/18.

five

       . ,     ,      .    , -   , ,   (, code  cite).      .

6

.   (px) —   . ,    —   (pt), ..   .  — , , Em. ,    .

7

  , « ». , 21 17 .    5 ( 10), «» .  ,    .

8

    .     ,    — 140–160 .   « »,  ,   . 11–12 : 50–80   .

9

  , ,   .  , ,   — 10 ,   — 15–20 .   ,      .

10

, , . ,   ,    .

11

« » (align=«justify»).     ( ),    . ,   « »,    « »,    align=«left» « »  .

12

 «» , «»  «»,     ,   (  )   (,  ).    —  . , , «».

13

- - , , . , HTML- . - . -, - .

14

    .   ,   .  .  ,   ,   .

15

  «»   , (« . . »).   ,  .

16

  (, ).   ,   ,      ,   .    .     ,    .   -   .      — «»,     .

17

,   «  ».      .   . — , . , . . №20.

18

  .       .   .   ,   .     , « - »,   ,      « ».

19

  ,        pixel art. , ,   .  ,   ,   .   . — , HTML- , . !      .

20

«» . , «» — - .

, .      - .

UPD 1. equeny №21: , . : , .

UPD 2. . !