Найти тему
V07BiT.Compiles

HTML-страница

Продолжим разбираться, что такое html-страница (web-страница).

В предыдущей статье рассказывалось, как и какой выбрать текстовый редактор для изготовления html-страницы. Допустим мы выбрали для себя текстовый редактор и уже установили его, в котором мы будем редактировать html-страницу, и допустим, что это будет "Notepad++", а в предыдущем посту речь шла, "что-же такое web-страница" и мы выяснили для себя, что это HTML (HyperText Markup Language — «язык гипертекстовой разметки»).

И, что-же это за разметка такая, и, что-же это и почему это язык?

Гипертекстовая разметка (HTML) - это всякие, разные нерусские слова которые называются тэги (TAG) и из себя они представляют, эти тэги, нечто подобное типа скобок, а пишутся тэги внутри знаков меньше и больше, (вспоминаем математику) <HTML> - вот так - это первая скобка которая открывается, а вот так </HTML> - это вторая скобка, которая закрывается. И получается вот как: <HTML> </HTML> - это самые первые скобки HTML-страницы внутри которых (между этих скобок(тегов)) и размещается всё содержимое html-страницы.

А, что дальше-то? Что там размещать? А внутри тэгов <HTML> размещаются другие теги, внутри которых размещаются ещё тэги содержащие в себе всякую-разную информацию, и разные тексты.

Вот, примерно, как это выглядит:

Описание самых необходимых тэгов в которых будут расположены другие тэги содержащих в себе какую-либо информацию и данные
Описание самых необходимых тэгов в которых будут расположены другие тэги содержащих в себе какую-либо информацию и данные
Описание разделов в основном конструкторе html тэгах
Описание разделов в основном конструкторе html тэгах

Сейчас попробуем сами, своими ручками, что-нибудь изобразить

И так, сейчас можно открыть свой текстовый редактор, который установили для редактирования html-страниц, и написать там вот такое:

Открыли текстовый редактор Notepad++ и написали в нём вот такие тэги
Открыли текстовый редактор Notepad++ и написали в нём вот такие тэги

Для сохранения своих работ, своих html-страниц, нужно сделать отдельную папку и обозвать её как-нибудь. Ну например сделаем папку на "Рабочем столе" или в "Мои документы", или ещё где, где вам нравится, и обзавём её как-нибудь, например: "web-pages" и сохраним туда свою первую html-страницу, и назовём её "index.html". Почему "index.html"? Потому-что "index.html" - это самая главная страница на сайте с которой начинается путешествие по сайту (хотя расширение файла у "index" может быть разное, но на данный момент нас интересует именно "index.html").

Я сделал папку "web-pages"на диске D:\ в папке "Web-HTML"
Я сделал папку "web-pages"на диске D:\ в папке "Web-HTML"

...и сохраняю туда свой "index.html":

Сохранение html-страницы в папку "web-pages"
Сохранение html-страницы в папку "web-pages"

Теперь, следующим шагом попытаемся засунуть свою web-страницу в браузер, допустим в "Google Chrome", смотря кто с каким работает, у меня например установлены разные браузеры и "Google Chrome", и "Mozilla Fire Fox", и "Opera", и "Microsoft Edge". Для этого просто щёлкаем мышкой два раза по файлу "index.html" и этот наш файлик попадает в наш браузер, и что мы там увидим? А ничего! Просто белое пятно.

В пустом конструкторе-каркасе html-страницы браузер ничего не отображает
В пустом конструкторе-каркасе html-страницы браузер ничего не отображает

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

Но об этом в следующих статьях.