PSD2HTML: web-дизайн в два приема

   Способ верстки дизайна сайта в Photoshop известен давно. Казалось бы сам редактор для этого не предназначен, но именно в нем вы можете себя почувствовать настоящим дизайнером будущего сайта. Вы словно художник рисуете обложку своего сайта, сохраняете ее в PSD формате и…, стоп, вот тут интересный момент: надо полученный PSD нарезать на отдельные картинки и прописать их в html- и css-файлах. Процесс конвертации вашего PSD в HTML неординарный. В целом, процесс нарезки очень утомительный, ведь надо отделить каждый элемент дизайна и вручную его экспортировать. Т.е. процесс самой верстки дизайна логически отделен от процесса его конвертации в шаблон. Как это сделать – впервые показал Евгений Попов. Тот его мини-курс был переводом трудов англоязычного автора. После этого Евгений к этой теме не возращался, потому как, по его словам, его профиль – инфобизнес. Тем не менее мне удалось найти аналогичную тему в его новом курсе, где этот модуль называется «CSS практика».

   Хороший мини-курс по верстке дизайна в Photoshop вышел и от Захаренко Алексея «Как создать свой первый профессиональный дизайн сайта с нуля».  Однако в этом курсе процесс нарезки не рассмотрен вовсе. Не затронут он и в профессиональном курсе «Мастер web-дизайна». Ну что ж, Алексей считает, что нарезка не тема его курса. Его право. Хотя описание такого процесса наверняка бы только увеличило притягательность его материалов!  Поэтому более полно в этом плане выглядит мини-курс Бернацкого Андрея  «Как нарисовать обалденный дизайн сайта с нуля, сверстать его и установить на WordPress».

   Про то что описание процесса нарезки актуально говорит даже тот факт что существует сервис PSD2HTMLConverter который работает на платной основе. Есть и другие подобные сервисы.  Но мы же не ищем неизвестных путей. В поисках возможных вариантов облегчить данную процедуру, пришлось опробовать немало инструментов нарезки дизайна. На этом ресурсе есть подборка советов и уловок, которые можно использовать ради того, чтобы облегчить себе эту непростую задачу в самом Photoshop. Надеюсь, что-нибудь из этого окажется полезным и для вас!