Урок 1. Верстка сайта-лендинга. Создание проекта и нарезка PSD-макета в Photoshop

Автор Lyubov Stishevskaya
Урок 1. Верстка сайта-лендинга. Создание проекта и нарезка PSD-макета в Photoshop

в первом уроке данного курса посвящена верстка макета лендинга курс предназначен в основном для новичков которые уже.

В некоторой степени знакомые HTML и CSS, но не могут применить свои знания практически вот такого макета начиная от нарезки изображён и заканчивая полной реализации данного шаблона приступим к работе и первоначально создадим проект. Я буду работать в воде webstorm поэтому могу создать проект внутреннего нажимаю и даю ему определённо название название Solar так их заголовками нас здесь написано именно — это слово новом окне я могу создать необходимую структуру проекта которая будет находиться в данной папке первую папку минут хранится файл или папка с изображениями и сразу внутри папки в. Стиме которые назовём.

все понадобится индексный файл в корне нашего проекта.

Как поймать ответственно у меня создался некоторым шаблоном котором присутствует стандартные заготовка для html-документа именно указано Body заголовок указана кодировка отключён файл со стилями и указан в упор так как на этом структура нашего проекта можно приступать к следующему шагу следующая, что мы сделаем — это вырезом необходимое изображение из Photoshop для того чтобы выбрать нужный слой мы воспользоваться данным инструментом называется перемещение и после чего вы должны будете нажать на галочку авто выбор и здесь выбрать группы слоев далее мы летим на необходимые нам свой. Вот в этой вот у нас выбирается свой если мы его отключил то можно заметить, что мы выбрали некоторые слова которые наложены поверх нашего изображения. Самара изображение располагается ниже. Вот она и соответственно вырезать данные изображения для того чтобы по нему правой кнопкой мыши здесь мы выбираем на новом документе и нажимаем ok.ru до этого мы должны нажать вкладку изображение далее выбираем тримминг и соответственно на основе прозрачных пикселей обрезка со всех сторон нажимаем после чего изображение уже готова сохраняемого сохранить для WEB собираем здесь изображение на качество изображения и сохраняем его свойства. Где находится. Шторм назвали у моего как соответственно. Да мы сохраняем данные изображения как болей. dp.ua логичным образом мы поступаем и с другими изображениями изображение поверх него тоже есть некоторые сомнения моего убираем создать дубликат слоя документе изображение streaming. О'кей песня. В нашем проекте так просто нелогично мы поступаем с остальными изображениями. Например я покажу ещё вот эту иконку. Мы выбираем. Вот она дубликат остается лишь сохранить для WEB только формат изображения я не буду уже вырезать по данному принципу иконок изображение в данном месте у нас нет в принципе для начала работы мы всё подготовили и уже в следующем уроке мы начнём работу над нагретым до скорого.

0 комментариев
0

Читайте также