Создаём сайт на HTML5

У нас вы можете заказать сайт-визитку, небольшой каталог или полнофункциональный интернет-магазин, которые будут выполнены качественно.

Предлагаем

1. Сайт от 35 000 рублей

2. Взятие сайта на обслуживание. от 3500 р/месяц

3. Проведение рекламных кампаний Google AdWords. от 3500 р/месяц.

Еще предложения

Веб-разработка, Транспорт, Агентства недвижимости, Переводы, Интернет-магазины, Контекстная реклама

Прием заявок

9.00 - 16.00 Мск

Контакты

Тел.: +7 (905) 529-53-55

Skype:  mainframe.13

Email:  info@poly-edr.ru

Создаём сайт на HTML5

Создаём сайт на HTML5

Сайт на HTML5

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

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

 

 

Сайт на HTML5


Итак, начнём! Вы когда-нибудь задумывались, открывая сайт, о том каким образом текст, картинка, видео оказываются на каком-то определённом месте? Если не задумывались, то рассмотрим, как все это работает.

 

Язык HTML и его работа.

Для того чтобы, разместить наши объекты, там, где нам хочется, люди придумали специальный язык разметки HTML. Заметьте, что это именно язык разметки, он размечает страницу, показывает браузеру, где должны находиться объекты, это не язык программирования.
HTML представляет из себя обычный документ, в котором написаны различные ключевые слова для браузера. Чтобы обычные слова можно было различить от ключевых слов, их помещают в угловые скобки (<и>). Например, мы хотим поместить на нашу страницу картинку, то мы пишем:
<img scr=”pic.png”>
Что на русском обозначает:
<берём картинку из файла pic.png>

 

Теги

Теги – это специальные ключевые слова, слова разметки, которые показывают браузеру, о том, что находится в разные места. Как уже писалось ранее, теги заключены угловыми скобками с двух сторон. Теги по своей структуре бываю разные – парные и одиночные.
Парный тег — это как контейнер, в который помещают всю информацию, например, текст, видео или даже другой тег. Парные теги разделяют на теги открытия и закрытия.
Тег открытия: <p>
Тег закрытия: </p>
Информацию записываю между этих двух тегов:
<p>инфрмацияинформация</p>

Теги


Одиночный тег – это тег, который не имеет тега закрытия и служит для форматирования текста или же для служебных слов.
<img scr=”pic228.png”>

 

Строение HTML-документа

Для того чтобы браузеру читать наш код, мы должны определённым образом создать структуру документу.
Первым с чего начинает любой документ — это с его типа:
<!DOCTYPE html>
Это означает, что браузер читает наш файл как документ с HTML кодом, а нечем другим.
Далее идёт сам документ:
<html></html>
В него помещается все остальные теги, которые только есть. Если же мы напишем любой тег вне <html></html>, то он читаться не будет.
<!DOCTYPE html>
<я тег и мне здесь нельзя>
<html>
<я тег и мне здесь можно>
</html>
Третьим, что идёт это голова документа. В ней находится вся важная информация о нашей странице, такая как, название страницы, кодировка, таблицы стиле и т. д.
<head></head>
Четвёртый тег - завершающий, в котором заключена вся наша страница! Именно там будет находиться вся наша информация. Тег – тело.
<body></body>
Как видим, структура документа очень похожа на человека. <!DOCTYPE html> - обозначает что это человек, <html></html> - это и есть человек, <head></head> - голова человека, <body></body> - тело человека.
И теперь давайте общим видом посмотрим, как же должна выглядеть наша страница
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>

 

Первое что нужно написать

Ты, наверное, замечал, что при открытии сайта вверху вкладки отображается его название. Интересно, как это сделали? Для этого нам поможет тег названия сайта <title></title>.

Первое что нужно написать

Данный тег записывается в структурные раздел <head></head>, если же мы тег названия поместим в другом месте, то он работать не будет.