Designfire - блог о дизайне, обо мне, ну и немного о заработке в сети. Это не очередной сайт с кисточками для фотошопа. Это сайт, в который я буду записывать все свои попытки научиться чему-то новому. Так что будем учиться вместе !

Как создать сайт на HTML и не только

Язык HTML (англ. HyperText Markup Language) — один из самых простых и самый универсальный во всей глобальной сети интернет. Универсален он потому, что без его участия так или иначе не обходится ни одна из страничек во Всемирной паутине.

Особенностью данного языка является то, что он состоит из системы различных тегов — дескрипторов, содержащих информацию о различных элементах сайта — от изображений до таблиц и гиперссылок. Правильное и последовательное расположение всех тегов и элементов в программном коде позволяет создать достаточно сложные страницы с самым разнообразным контентом. Однако страница, созданная на HTML, может быть достаточно статичной, а это значит, что это хороший вариант для одностраничного сайта или сайта с постоянной информацией. В современных условиях такого может быть просто недостаточно.

Тем не менее, знать язык HTML необходимо для того, кто хочет научиться создавать сайты самостоятельно. К тому же, есть способ сделать страницы динамичными.

Приступая к работе, следует продумать шаблон — то, как будет выглядеть сайт, где будут располагаться элементы меню, логотип компании и информационный блок. Именно эта работа и является творческой, поскольку здесь продумывается не только конфигурация страниц, но и их внешний вид.

Визуализация сайта в графическом редакторе (чаще всего Photoshop)

Для создания эскиза сайта лучше воспользоваться некоторыми графическими редакторами, но лучше — программами Adobe Photoshop или CorelDRAW. «Нарисовав» сайт, можно сохранить его в Adobe Photoshop через вкладку «Файл»—>Сохранить для Веб». Программа сгенерирует все графические элементы, необходимые для ресурса, которые потом можно загрузить на сервер.

При помощи кода, можно сверстать визауальный вид сайта, который веб-дизайнер сделал в программе Фотошоп. Большинство элементов сайта, будь то менюшки, кнопки или иллюстрации, создаются в графических редакторах. Урок для начинающий как создать кнопку для сайта в Фотошопе можете почитать на блоге Астры. Очень простой пошаговый урок, сможет выполнить любой, главное иметь под рукой компьютер и программу.

«Несущими конструкциями» страницы являются дескрипторы html, head, /head, body, /body, /html (в кавычках <...>). Они и определяют его структуру.

указывает тип документа для браузера и поисковых роботов, вместе с закрывающим тегом /head — заголовок документа, body и /body — его «тело».

Следует помнить, что любой дескриптор существует в паре со своим закрывающим тегом. И только при выполнении этого условия документ будет отображаться правильно. Информация, например, текст или изображение, находится строго внутри открывающего и закрывающего тега.

Для наилучшего результата при организации контента можно использовать различные способы группировки информации — с помощью таблиц или блоков div. Одним из самых удобных способов, который пригодится многостраничным сайтам, является использование таблиц стилей CSS, поскольку их применение задает условия оформления на все страницы ресурса.

Сложнее создать динамическую страницу — ту, которая меняет своё содержание регулярно либо при каждом обращении к сайту. Для этого используются языки веб-программирования. Одним из самых популярных является PHP. Его особенность заключается в том, что содержание страницы формируется на сервере, благодаря заданным «сценариям» страницы. Для создания сайта на PHP целесообразно использовать комплекс файлов — по сути, это отдельные части документа, которые «раскроены» и ссылаются друг на друга. Правильная организация работы всех этих файлов позволяет создать сложные страницы и сайты, например, форумы, блоги и порталы.

Видео про основы HTML

Источник: статья использует материалы http://astra-c.com/

Если вам интересно читать этот блог, подпишитесть на RSS feed
Сделайте это сейчас!

Ваш комментарий будет первым :)

Оставить комментарий


Ваше имя (обязательно)
Ваше e-mail (обязательно)
Ваш блог или сайт