Наши партнеры
Статистика
99 ч. 99 ч.
Сегодня нас посетило 0 человек
Комментарии
  • 00:33ReveN
    адаптируй плз)
  • 19:57mikk
    Красивый шаблон
  • 01:33o^OpS
    Поробуй зарегатся. Ет недолго!
    А так в правом верхнем углу) biggrin
  • Страница 1 из 1
  • 1
Урок по созданию макета сайта!
mikk » Не в сети » 24.03.2011 » 20:02 » Сообщение # 1
Админ
Группа: Гл.Администратор
Сообщений: 1102
Награды: 5
Репутация: 81
Создаём холст
Этот макет довольно большой длины, ставим размер 950 x 1520 пикселей.

Используем заливку и заполняем наш холст #d9d9d9.
Создаём Область содержимого
Выбираем инструмент прямоугольник с закруглёнными углами и ставим радиус на 30 Пикселей.

На новом слое нарисуйте новый холст немного меньше чем у вас прежний.

Добавьте и этот холст к округлым углам.
Настройки холста:


Создаём Шапку сайта
Выбирите инструмент 'прямоугольная область', высота должна быть не более 123 пикселей и ширина так же.

Заливаем этот прямоугольник любым цветом.




Далее у вас получится что-то похожее на это:

Далее при помощи инструмента лоссо сделайте уголок для шапки

Выделение с помощью лоссо заполните любым цветом и следуйте следующим стилям слоя.


После того, как вы всё это сделали, должно получиться что-то вроде этого:

Далее на шапку наносите текст, а выше ваши кнопочки 'Главная' 'Форум' и так далее, следуйте примеру:

Создаём поле новостей
Для этого так же используем прямоугольное выделение под ваш заголовок новостей.

Заполняете любым цветом и следуете далее.




Получится примерно такое:

Используя лоссо снова делаем уголок, это делаем так же как мы делали для шапки.

В зоголовок новости добавляем название и в описание какой-то материал

После создаём 2 линии по 1 пикселю и расстояние меж ними по 1 пикселю, разделитель, которая должна быть не более 1 пикселя. Это даёт эффект отступа от новости.

Под линией отступа создаём иконки 'Комментариев' и 'Автор темы'.

Копируем слоя и дублируем 2-3 раза.

После добавьте пару белых квадратов, заполненых белым цветом и выставьте в них номера страниц.

Далее делаем вертикальные линии для отделения новостей от блоков сайта (меню).

Создаём меню так же как и новости прямоугольным выделением.
Получится такое:

Создаём стрелочки и список чего-либо в меню, как здесь:

Ниже добавляем такой же раздел, но с другим содержанием, здесь на пример "Спонсоры"

Создаём нижнюю часть макета
У вас должно в нижней части получиться что-то вроде этого, здесь нужна довольно-таки большая длина, но подберайте на сколько хватает.

Эту часть заполняем своей информацией, как здесь:

Итог

Сам учился по этому уроку, всё доступно. Всем удачи cool tongue

Источник! Перевод by Dimoffka ©
 
  • Страница 1 из 1
  • 1
Поиск: