Верстка сайта. Как ее сделать своими руками?23.04.2013
Еще совсем недавно версткой веб-страниц занимались только профессионалы, сегодня же любой достаточно активный пользователь сети Интернет может сверстать свой сайт сам.
1. В первую очередь необходимо составить список элементов, присутствующих на сайте, речь идет о навигации, форме поиска, рекламном или информационном баннере, списке друзей. Верхняя часть страницы, как правило, содержит информацию о названии проекта или же может отводиться под горизонтальное меню навигации. В центральной части находится основное содержимое сайта. В нижней части размещаются счетчики посещаемости и контактная информация для обратной связи. Хостинг, аренда сервера и ddos защита также немаловажны для ресурса, поэтому выбирайте только проверенного провайдера.
2. Далее в графическом редакторе создается макет сайта. Здесь главное – определить внешний вид элементов и их взаимное расположение. При выборе цветовой гаммы отдайте предпочтение нейтральным тонам.
Все блоки должны быть оформлены в едином стиле, дизайн ресурса должен быть максимально удобен для пользователя. Необходимо с осторожностью выбирать элементы, которые в будущем будут осложнять реализацию возможностей CSS и HTML.
3. Необходимо в растровом формате сохранить макет страницы так, чтобы не потерялось качество. Определитесь с элементами оформления, которые планируется реализовать средствами HTML. Речь идет о меню, ссылках, таблицах, формах поиска. Остальные элементы необходимо извлечь из макета и сохранить в отдельных файлах.
Следует создать на жестком диске пару текстовых документов и сменить расширение одного из них на .htm. Он будет содержать код, который отвечает за взаимное расположение элементов.
Во втором файле будут содержаться таблицы стилей. Какова будет функциональность вашего хостинга, решать только вам, помните, услуга аренда сервера у качественного провайдера может только помочь в деле продвижения вашего сайта.
4. Первый файл открывается в HTML-редакторе, на его странице размещаются элементы оформления, которые были сохранены ранее в растровых файлах. Теперь можно создать таблицы, текстовые ссылки и другие элементы и реализовать их HTML средствами.
Атрибуты элементов, такие как цвет, границы, размер шрифта, необходимо записать в CSS файл. Если нужно сделать элементы страницы анимационными, то стоит использовать язык JavaScript.
Успехов!
|