Как да направите заглавки за уебсайтове

Съдържание:

Как да направите заглавки за уебсайтове
Как да направите заглавки за уебсайтове

Видео: Как да направите заглавки за уебсайтове

Видео: Как да направите заглавки за уебсайтове
Видео: Excel: Диагональное разделение ячейки (два заголовка в одной ячейке) 2024, Може
Anonim

Принципът „да бъдеш посрещнат с дрехи“е валиден не само за хората, но и за сайтовете. Роклята на сайта е неговият дизайн. И именно дизайнът определя впечатлението, което посетителят има в първите няколко секунди от разглеждането на ресурса. Това впечатление е особено важно, защото определя бъдещото му поведение. Първият елемент на дизайна, който всеки потребител, който посещава сайта, вижда, е неговият „хедър“. Капачката е лицето на уеб ресурса. Следователно всеки начинаещ уеб дизайнер иска първо да се научи как да прави заглавки за сайтове.

Как да направите заглавки за уебсайтове
Как да направите заглавки за уебсайтове

Необходимо

  • - достъп до Интернет;
  • - модерен браузър;
  • - редактор на растерни графики (GIMP, Photoshop);
  • - по избор: редактор на векторни графики (CorelDraw);
  • - по избор: среда за 3D моделиране (Blender, 3DStudio);
  • - по избор: лист хартия, молив или химикал.

Инструкции

Етап 1

Разработете концепция за бъдещия хедър на сайта. В идеалния случай концепцията трябва да се основава на първоначалната идея. Когато липсват идеи, вдъхновение може да се получи чрез анализ на съществуващите добри решения. Отразете резултата от творческото изследване под формата на скица върху лист хартия. Скицата трябва да отразява структурата на бъдещия хедър на сайта с посочване на "гумени" места и зони, изпълнени с изображения. На този етап е добре да помислите върху приблизителна цветова схема за дизайна на заглавката.

Стъпка 2

Изберете размера на заглавката. Всъщност си струва ясно да се дефинира само един от неговите параметри - височината. По правило височината на заглавията на сайта е фиксирана и не зависи от логическата разделителна способност, която влияе върху параметрите на дисплея на шрифтовете. С други думи, трябва да изберете стойност за височината на заглавката в пиксели. В този случай има смисъл да се вземе предвид възможността за поставяне на банери или блокове от контекстна реклама в заглавката. По отношение на ширината трябва да определите минималната стойност, като подчертаете поне една "гумена" област, която позволява на заглавката да се адаптира към различни размери на уеб страницата.

Стъпка 3

Създайте заглавен шаблон в графичен редактор. В нов документ добавете прозрачен слой, към който ще плъзнете скицата според избраните геометрични параметри. Височината на слоя трябва да съвпада с височината на заглавката. Ширината може да се приеме за произволна, но по-голяма от минималния размер, оставяйки място за хоризонтални „гумени“области. “В шаблона посочете зони с фиксирани и променливи размери, зони, предназначени за запълване със статични изображения, фонови изображения.

Стъпка 4

Търсете или създавайте статични изображения, които да поставите в шаблона на заглавката. Логото и някои уникални елементи могат да бъдат създадени във векторен редактор или среда за 3D моделиране. Доста лесно е да намерите тематични изображения на безплатни фотобанки в Интернет.

Стъпка 5

Поставете фона, логото и статичните изображения в шаблона на заглавката на сайта в графичен редактор. Добавете фона и всяко изображение към отделен прозрачен слой. Подредете слоевете по най-добрия начин. Чрез преместване на изображения на слоеве постигнете идеалното им оформление, съответстващо на предварително създадения шаблон.

Стъпка 6

Запазете полученото заглавно изображение. Запазете работния проект в естествения формат на графичния редактор. След това запазете сплесканото заглавно изображение във формат без загуби (например PNG).

Стъпка 7

Създайте HTML шаблон на заглавката, ако е необходимо. Отворете сплесканото изображение в редактора. Изрежете от него изображения, които съответстват на области с фиксиран размер. От местата, съответстващи на "гумените" области, изрежете изображенията с ширина 1 пиксел. Запазете всички изображения на диск. Подредете HTML заглавката, като използвате запазените изображения.

Препоръчано: