FAQ Частые Вопросы и ответы по ucoz - Уникальные шаблоны и дизайн - веб дизайн

Главная » FAQ » FAQ по фотошопу


Вот сам пример создания такого фона как на скрине
фон сакита в полоску
Очень просто:  пример как фон сделан на нашем сайте смотрите пример вокруг рамки новости.

   создаем документ размером 4х4 пикселя покрываем его нужным фоном общим к примеру серым
далее переключаемся в режим карандаш при этом за ранее выбрав цвет узора полоски и на носим вот такие вот квадратики по 1 пикселю как вы видите что их всего 4 в увеличенном состояний.
  Для фона не стоит прибегать к ярким или контрастным узорам фон не должен отвлекать глаз а привлекать наоборот
  Далее вставляем нашу картинку сохранив ее в формате в gif в данный вид кода Как изменить фон сайта?

   Как из макета сделать шаблон? задал вопрос пользователь и приложил скриншот макета который на самом деле уже готовый и используется как на ucoz так и на DLE
  Вопрос задается часто, но прежде всего могу сказать сразу что новичок не сможет создать сам шаблон сайта, так как тут нужны знания фотошопа, иметь опыт в нарезание деталей графики, и умение так же распределить что останется графикой а что буде сплошным цветом, так же нужно знать что чем меньше весит сайта графика тем он быстрее загружается в браузере у пользователя, ну а после разрезания нужны знания HTML для грамотной верстки.
   Конечно же не кто не начинал сразу создавать интересные и правильные шаблоны, все начинали с уродливых проектов и после поднятия своего опыта становятся истинными мастерами своего творчества.

   Для первых шагов в познание и понимание этого процесса я предлагаю научится делать детали дизайна, после усвоение тонкостей не проблема будет создать и большой проект к которому вы стремитесь.
Я хочу вам переложить свои Видео урок верстки рамки баннера и создание таблицы для графики и еще один урок не мало важен Видео урок создание шапки резиновой и верстка ее для сайтов ucoz
Названия уроков говорят сами за себя.В 1 уроке Пример на баннере размером 468х60  размер рамки составляет 488х80 что значит +10px на каждую сторону, во втором уроке наглядно показано как создать в фотошопе шапку, разрезать ее и произвести миниатюрную верстку.

Как сделать графику это дела каждого и разное по своей уникальности, верстка и разрез так же уникален но по одному принципу.
  Существует два типа натягивания графики на проект
1 это табличный (<table><tr><td></td></tr></table>) что показан в уроке, для меня он самый простои и удобный, для многих этот тип сложен
2 это дивный (<div> </div>), помогает использовать удобно стили и занимает мало места и является в загрузке наиболее быстрым чем табличный
   Для верстки очень эффективно используют программы что улучшает качество создания, одна из этих лучших программ Dreamweaver но что бы ей уметь пользоваться необходимо опять же знать язык HTML. Dreamweaver хорошо используется в совмещение с Photoshop то есть с его исходниками вашего проекта в формате PSD.
В фотошопе вам необходимо удобно разложить все элементы графические по папкам подписав их для вашего же удобства как показано на скрине
тип папок в фотшопе
Если создавать разрезание и сохранение то всем известно что для этого используется инструмент перо, которым вы можете с точностью до пикселя устанавливать размеры деталей вашего проекта, после расчерчивания или разрезания ваш макет выглядит таким образом

разрезанный макет шаблона
далее остается только сохранить но не картинкой а картинкой вместе с HTML кодом.
После сохранения ваше творение раскладывается по папкам отдельно графика и и отдельно страница , если кликнуть по файлу страницы то вам выдаст в сборке вашу работу, если выделить все то будет видно как по деталькам разрезан сам рисунок или макет, дальше нужно знания языка ХТМЛ что бы подредактировать и залить веб графику на сайт предварительно заменив ссылки на сами элементы проекта.
Лично я исходя из своих знаний стиля CSS и языка ХТМЛ делаю это все сам используя только блокнот.. вам кажется это сложным, но уверяю вас спустя пол года активного изучения и самостоятельного составления дизайнов и их верстки вы будите так же писать код всей страницы используя только программу Фотошоп и Блокнот. Достаточных знание и совета можно получить на нашем форуме Фотошоперу / Уроки по фотошопу где все знатоки поделятся всем тем чему сами научились и считают полезным для знания о том как создавать свое и неповторимое.
Вот в принципе мой ответ на вопрос пользователя нашего сайта. Удачи вам начинание создания красивого дизайна.

счетчик посещений