2. Разрабатываем сайт Для того, чтобы создать сайт самостоятельно, необходимо выполнить 2 этапа работ: Разработка шаблона сайта. Именно здесь необходимо определить, как сайт будет выглядеть. Верстка сайта. Наполняем сайт контентом и заставляем все это работать. 2.1 Разработка шаблона сайта Как правило, этот этап работ выполняется в достаточно мощном графическом редакторе, например, Adobe Photoshop или CorelDraw. Фотошоп несколько проще в освоении и использовании, а возможности его очень велики. Именно поэтому среди веб-дизайнеров Photoshop пользуется вполне заслуженной популярностью. Воспользуемся им и мы. Создаем в Фотошопе новый документ. Задаем имя – MySite. Выбираем разрешение 800 х 600, это гарантирует корректное отображение у любого пользователя, размер по вертикали потом сможем увеличить. Выбираем разрешение 72 пикселя на дюйм и RGB-цвет. Эти установки делаем обязательно, именно они отвечают за корректное отображение веб-страницы. Устанавливаем цвет фона D3B497 в шестнадцатеричном виде или выбираем с помощью палитры цветов. Выбрав пункт меню «Вид» – «Направляющие» активируем отображение линеек и направляющих. В пункте меню «Вид» - «Показать» включаем сетку Выбираем инструмент «Перемещение» и, щелкнув на левой или верхней линейке, вытаскиваем вертикальные и горизонтальные направляющие Получаем размеченную область. В пункте меню «Вид» - «Привязка к» не забываем убедиться, что включена привязка к направляющим и границам документа. Командой «Слой» - «Новый» создаем слой с именем banner. Используя инструмент «Прямоугольная область» выделяем нужный нам фрагмент между направляющими. Рисуем в этой области прямоугольник со скругленными углами. Выбираем цвет заливки и заливаем его. Таким же образом размечаем еще несколько областей – для логотипа, текста приветствия, и описательного текста. Слой для текста приветствия не заливаем. Для каждого из залитых слоев выбираем эффект «Внешний свет», задаем направление, получаем отбрасываемую тень На области логотипа создаем слой с тем же цветом заливки. С помощью инструмента «Горизонтальный текст» вводим текст. Создаем на области баннера новый слой. Открываем файл с изображением и просто перетаскиваем его на вновь созданный слой. Аналогично заполняем изображениями и текстом остальные области Наш макет готов! Теперь из него нужно вырезать фрагменты, необходимые для нашей страницы. Это – область баннера, область логотипа, верхняя и нижняя рамки для поясняющего текста и часть области, для фона поясняющего текста. С помощью инструмента «Фрагмент» выбираем необходимые части изображения. В меню «Файл» выбираем «Сохранить для Веб». Далее настраиваем качество изображений и сохраняем, в результате получаем множество графических фрагментов нашего шаблона. В папке, куда был сохранен сам шаблон, появилась папка images с изображениями. Отбираем нужные и переименовываем. Макет создан, необходимые фрагменты получены, можно переходить к верстке. Конечно, пока мы воспользовались лишь самыми примитивными возможностями Adobe Photoshop. Книги по веб-дизайну помогут более полно изучить его возможности и познакомиться с другими редакторами. Для быстрого старта зачастую выгоднее воспользоваться готовыми шаблонами, чем рисовать их самим. В разделе шаблоны сайтов можно найти много прекрасных шаблонов и создать на их основе свой сайт.