Вёрстка и подготовка макета к вёрстке

советы по веб-верстке

В этом посте я собрал подборку советов, которые будут полезны для веб-дизайнеров, которые верстают или собираются передать макеты для верстки «верстакам».

Совет №1: Не стоит сливать все элементы дизайна в один слой
Вместо слития слоёв раскладывайте их по группам, которые называйте соответственно общей структуре документа: шапка, меню, контент, подвал и т. д.

Совет №2: Сохраняйте макет сайта в PSD
Конечно, макет сайта можно делать и в Illustrator, и в InDesign, и даже в Corel Draw, кому как удобнее. Вопрос в том, будет ли это удобно верстальщику, которому вы отдадите макет в последствие. Большинство всё же привыкли и предпочитают работать с программой Photoshop.

Совет №3: Архивируйте PSD файл перед отправкой
Это связано в первую очередь с размером исходного файла и передачей его другим людям. Архив будет весить значительно меньше, чем исходник.

Совет №4: Давайте осмысленные названия слоям
Это важно не только для верстальщика, но и вам будет проще работать с файлом. Называйте слои соответственно их содержимому, например: «background» или «twitter_icon».

Совет №5: Давайте осмысленные названия файлам
Всё, что вы сохраняете в файл для дальнейшей передачи другим людям, будь то макет сайта или что-то ещё, должно иметь осмысленные и понятные названия, при этом желательно на латинице. Будет правильным называть файл макета в соответствие с рубрикой или страницей, например, «lp_avtoshina.psd», «купить чехлы для iphone 5».psd или «dostavka_i_oplata.psd»

Совет №6: Удаляйте все ненужные слои
Удаление ненужных слоёв уменьшает размер файла изображения и делает его более читаемым.

Совет №7: Перестаньте верстать таблицами, если ещё не перестали – перехо дите на блочную вёрстку.
Такая вёрстка макета прошлый век. Используйте табличную вёрстку по её прямому назначению — для вёрстки таблиц.

Совет №8: Не делайте так, чтобы ссылки, расположенные на сайте, открыва лись в новом окне.
Кроме случаев, когда ссылка изначально не ведёт на какой-то сторонний ресурс.