Статья 7. Как в Фотошопе сделать форму Авторизации/Регистрации для сайта.

Авторизации/Регистрации на сайте не является обязательным атрибутом страницы. Если вы делаете макет шаблона для сайта «визитки» или просто шаблон личной странички вполне можно обойтись и без неё. А вот если это будет интернет-магазин или сайт в развитии которого будут принимать участие ваши многочисленные посетители то без формы Авторизации вам не обойтись.
 Форма Авторизации это отдельный блок, поэтому как обычно создаём новую папочку «авторизация/регистрация» в числе прочих папок «header».  В данный момент содержимое папки «mysite-001″  выглядит вот так.

Как видите всё содержимое «шапки » сайта разложено по папкам и очень легко найти каждый элемент.  Вновь созданная папка «реквизиты и лозунги» о содержимом которой я не писал,  имеет внутри текстовые файлы. Файлы эти временные и могут быть заменены на любые в процессе вёрстки. Будь то баннер или любой слоган.

Ну а что касаемо формы Авторизации, то как обычно каждый элемент – это новый слой.  В слоях это выглядит вот так.

Ну а визуально, немного поэкспериментировав, я сделал вот такую форму Авторизации.

Естественно форма может быть как горизонтальной так и вертикальной.  Вы придумываете , создаёте дизайн макета, а уж «помучатся» с вашими фантазиями придётся верстальщику. Ну что поделать? У каждого своя работа.  Интересный шаблон требует сложности для каждой из сторон.  Подробно описывать как создавались слои для формы авторизации я не буду. Здесь и так всё видно и понятно.   «Шапочка» макета практически готова, но осталась одна маленькая и очень существенная деталь. Это раскройка фоновой «background» картинки на части для уменьшения скорости загрузки страницы.  Как это сделать? В следующем уроке и сделаем.  А в данный момент наш макет шаблона выглядит вот так.  Для просмотра в полный размер следует «кликнуть» в поле картинки.

Удачи!  :)