Как сделать верстку сайта?

2 ноября 2014 г. Просмотров: 324 Инструкции
В прошлом веке верстка веб-страниц была уделом немногих профессионалов. Развитие технологий привело к значительному упрощению этой задачи. Теперь сверстать сайт по силам любому пользователю интернет.
Создать сайт самостоятельно с Wix.com

Вам понадобится

  • - программный пакет для верстки веб-страниц;
  • - растровый графический редактор для создания элементов оформления.

Инструкция

  • Cоставьте список элементов, которые будут присутствовать на сайте.
    Это могут быть такие составляющие, как меню навигации, форма поиска, рекламный или информационный баннер, список друзей. В верхней части страницы обычно указывается название проекта, может находиться горизонтальное меню навигации. Центральная часть отводится основному содержимому сайта. В нижней части страницы обычно размещают счетчики посещаемости, контактную информацию для обратной связи.
  • Создайте макет сайта в графическом редакторе. Основной задачей здесь является определение внешнего вида элементов, их взаимного расположения. Не используйте слишком яркие цвета. Лучше всего воспринимается нейтральная цветовая палитра. Используйте единый стиль оформления блоков. Постарайтесь сделать дизайн максимально удобный для пользователя. Избегайте элементов, которые будет заведомо сложно реализовать средствами HTML и CSS.
  • Сохраните макет страницы в растровом формате без потери качества. Определите элементы оформления, которые будут реализованы средствами HTML. Это могут быть меню, ссылки, таблицы, формы поиска. Остальные элементы извлеките из макета и сохраните в отдельных файлах. Создайте на жестком диске два текстовых документа. Смените расширение одного из них на .htm. В нем будет находиться код, отвечающий за взаимное расположение элементов. Второй файл будет содержать таблицы стилей.
  • Откройте первый файл в HTML-редакторе. Разместите на странице элементы оформления, сохраненные ранее в растровых файлах. Создайте текстовые ссылки, таблицы и другие элементы, которые должны быть реализованы средствами HTML. Атрибуты элементов, такие как цвет, размер шрифта, наличие границ, записывайте в CSS файл. При необходимости анимации элементов страницы используйте язык JavaScript.
  • Оцените статью!