1.3. Создание макета сайта на Photoshop. Создание меню сайта, добавление иконок в меню сайта

Автор Ivan Samoilov
1.3. Создание макета сайта на Photoshop.  Создание меню сайта, добавление иконок в меню сайта

Урок номер три продолжаем создание макета сайта в.

Фотошопе в третьем уроке также немножко ещё. Поработаем над и я бы хотел предложить вам создать так сказать некие добавить некий иконки найти иконки вот перед пунктами меню. Перед каждым пунктом меню добавить иконки.

Ну например вот где главное пункт.

Меню главное до. Поставить здесь такой домик у трубниковой можно было поставить какой-то папочку. Да у нас не знаю. Посмотрим Подумаем. Что можно сделать. Ну и также контакт контакты чтобы тоже можно будет добавить свою вообще как добавляется иконки на сайт. Я писал об этом статью. Вот оно как быстро вставить иконку на сайт помощь можно зайти посмотреть почитать, но в принципе всё написано здесь описаны. Кстати два способа один такой. Рональд pro100eda. Используй HTML код символов.. Ну Давай перейдём просто посылки посмотрим просто-напросто в целях ознакомления быстрого такого ощущать вообще спецсимволы HTML да и у каждого спецсимвола есть какой-то свой определенный код вот есть HTML Code is CSS под которым можно прописывать и использовать на своём сайте примере также в моей статье может найти второй способ он более немножко по сложнее, но он более так сказать тем более интересные — это использования сервиса Font awesome, а вообще сервис так называется потому, что вот фонд фонд вообще-то шрифт да то есть здесь главная особенность этого сервиса заключается в том чтобы. А вообще скачать шрифты которые предлагают нам этот сервис использовать их в дальнейшем при верстке сайта. Да тут есть всякие разные варианты — это всё описывается моя сейчас куртка расскажу просто задача скачать шрифт и установить его в систему до нашу наш Windows зачем просто. Настя копируется шрифт и останавливается загружается. Да вот в папку шрифты папка шрифты вот сюда мы вставляем здесь. Да вот обратить внимание все шрифты которые хранятся на компьютере цена заканчиваем вот этот шрифт сейчас попробую в списке найти этот шрифт называется вот он Font awesome 5 Free Solid обычный и Font awesome Free обычный где-то ещё должен быть. Аватан фон алфавит обычно тоже да вот так вот эти шрифты называются то есть после того как вы их. Установите вот сюда вот в папку шрифты мы можем их использовать вот здесь в какой-то определенный шрифт на сайте значит смотрите, что мы можем сейчас сделать. Давайте просто создадим новый текстовый слой выберем выберем этот шрифт вот у меня находится Font awesome Free убираем его переключаем язык на английский английскую раскладку и дальше заходим уже на сервис font-awesome нажимаем icons iOS. У нас есть такое перечисление икона которые мы можем использовать на сайте до обратить внимание, что здесь некоторые иконки затемненные затонированы. Да Это говорит о том, что нам необходимо приобрести версию про она стоит сейчас. Если не ошибаюсь 6260. Ну если у вас есть такая возможность вы можете приобрести лицензию, но у меня такой возможности нет да в принципе особого особой обходимости в этом нет здесь довольно большое количество разнообразных иконок в бесплатном доступе на и. Ну давайте теперь найдём какой-нибудь домик для пункта меню главное. Да и так мы здесь очень удобно найти просто пишем например Home воду надо. Да вот они у нас появляются и. Обратите внимание вот здесь вот справа на панели который находится в правом вот здесь у нас Solid здесь у нас здесь у нас Light Regular Light — это у нас для. Про версии то есть мы можем использовать только соли то есть. Нам необходимо вот здесь вот Solid переключили английскую включили английскую раскладку и просто напишем слово Home и. Выдели Как здорово просто — это слово превратилось в изображении до янжимы его можем подставлять вот таким вот образом и давайте сейчас просто немножко акцентируем. Да вот вот таким вот образом можно быстро и легко поставить иконку на сайт да давайте дальше вот здесь вот для вкладки пункта меню в рубрике на ещё найдём найдём на ничем. На ищем сейчас как как ты солнышко у нас в форме папки до папка по-моему по-английски Folder Folder Not Enough for Letter написал. Ну неважно вот у нас. Ну я бы предпочел бы взять. Вот — это вот изображение. А мы можем просто взять и скопировать вот — это вот название также добавляем в текстовый слой выбрать шрифт. Здесь также Solid. Обратите внимание. Просто у нас, а у нас в принципе можем использовать irregular. Ну чтобы не нарушать статистику да то есть здесь его основы. Значит ты здесь у нас будет салют всё оставляем текст который скопировали у нас уже появилась. Папочка подносим её выравниваем нужно место немножко выравниваем центральным пункты меню кстати вот выбираем до свои именно нужно выбрать слои можно — это сделать чтобы несколько слоев нажимаем контроллер кликом левой кнопкой мыши. Да и выбираем несколько каких-то определенных слоев идём дальше пункт. Меню ананас ананас. Ну в принципе я вам предложил бы вариант вот такой вот users использовать users вот такой вот такая вот японочка до также обратить внимание есть только свободный доступ Solid копируем название переходим в Photoshop создаем новый текст свой так шрифт у нас выбран в туалет есть установлено и проставляем текст уже появилась японочка поставляемые в нужное место немножко регулируем стрелочками тренируем. Вот и давай ещё один. У нас контакты так контакты для контактов. Я предложил бы например использовать какой-нибудь конверт envelope вот такой вот.

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

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