Здравствуйте, уважаемые читатели блога https://delajblog.ru!
В общем случае, весь интернет – это огромное количество веб-страниц, связанных между собой гиперссылками. Для создания веб-страниц был создан язык HTML(англ. HyperText Markup Language — язык разметки гипертекста). По-простому – текст со ссылками. Увидел ссылку, нажал на неё и попал на другую страницу. Веб-страница иначе может называться как документ, и имеет расширение файла .html. Документ HTML — это фактически файл с простым текстом, содержащим некоторые фрагменты кода, которые несут информацию о том, как страница должна отображаться.
Веб-страницу можно создать в любом текстовом редакторе, хоть в Notepad.
Вот пример простейшего кода, набранного в тестовом редакторе:
<html> <head> <title> Пример простой веб-страницы </ title> </ head> <body> Здесь располагается текст, который нужно отобразить в браузере, например, как сделать свой блог. </ body> </ html>
Для просмотра веб-страниц созданы специальные программы – браузеры, например, Internet Explorer, Opera, Chrome и т.д. При открытии документа, браузер считывает те инструкции, которые дают указания, как надо считывать программный код.
Теги
HTML использует систему «тегов» для записи инструкции о том, как страница должна отображаться в браузере. Они заключаются в угловые скобки, например, <title> — это тег, под названием title.
В общем виде они записываются так:
< тег атрибут1= «значение» атрибут2= «значение»>
< тег атрибут1= «значение» атрибут2= «значение»>…</тег>
В первом случае записан одинарный тег, а во втором парный (или контейнер). Обратите внимание, что парный состоит из открывающего <тег>, и закрывающего </тег> (в закрывающем добавляется слэш).
Каждый тег может иметь атрибут, т.е. его свойства и соответственно значение этого атрибута.
Пример:
<html lang=»ru-RU»>
Где, html – название тега, lang – атрибут тега html, ru-RU – значение атрибута.
Структура HTML кода
Любая веб страница содержит следующие обязательные элементы. Рассмотрим пример:
<html> <head> <title> Простейшая веб-страница</title> </head> <body> Здесь располагается текст, который будет виден в браузере. </body> </html>
Открывающий <html> и закрывающий </html> теги сообщают браузеру, что этот код следует читать и интерпретировать, как код языка HTML (все, что записано в этом контейнере – HTML).
В контейнере head записывается служебная информация для поисковых систем. Здесь располагается контейнер title, в котором записывается название веб-документа (это название будет видно заголовке браузера).
В контейнере body располагается контент (содержание) документа: текст, видео, рисунки и т.д.
Ссылки
Поскольку весь интернет состоит из ссылок, то в рассматриваемом языке имеется очень важный тег — <a>.
Он выглядит примерно так:
<a href=» https://delajblog.ru/sozdat-blog/kak-sozdat-svoj-blog.html »>Нажми здесь</a>
Такая запись создала гиперссылку. В браузере будет видна подчеркнутая ссылка с тестом Нажми здесь, при нажатии на который вы перейдёте на веб-страницу по адресу https://delajblog.ru/kak-sozdat-svoj-blog/.
Тегов в этом языке много. Заучить их сходу не получится. Но, сделаны справочники этого языка. В которых, всегда можно посмотреть применение того или иного тега. Одним из наиболее простых, ясных и понятных (по моему мнению, автор вполне понимает, о чём пишет) — это http://htmlbook.ru/html
Вполне понятно, что в отдельной статье (да и такого маленького объёма) невозможно рассказать о языке разметки гипертекста даже основы. Но иметь хотя бы общее представление просто необходимо. Так столкнулся с решением простой задачи – изменить внешний вид сайта, и тут деваться некуда. Как минимум нужно иметь представление о HTML, CSS и PHP. Так что придётся постигать их основы.
Похожие статьи: