Учебное пособие по HTML - httpdoc.ru

Учебное пособие по HTML - полное базовое руководство для начинающих.

HTML - это язык разметки, который создает макет веб-страницы. Сегодня в сети есть по крайней мере 1.2 billion веб-сайты, и все они созданы с использованием HTML. Воспользуйтесь нашим руководством по HTMl и получите полное базовое руководство для начинающих.

Если вы заинтересованы в разработке веб-сайтов, то глубокое знание HTML - это первый шаг. Только после этого можно начинать кодирование CSS и JavaScript.

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

В нашей предыдущей статье мы кратко представили Что такое HTML? . Мы также поговорили о некоторых предпосылках и популярных Редакторы HTML . Мы предлагаем вам сначала прочитать эту статью, а затем продолжить изучение этого руководства.

Полезное чтение: Разработка полного стека - шаги, чтобы стать разработчиком полного стека .

HTML - это язык программирования?

HTML называется языком разметки, который отличается от языка программирования. Его полная форма - это язык гипертекстовой разметки. Теперь, что такое язык разметки? Что такое гипертекст? Чем он отличается от языка программирования? Давайте объясним каждый термин и начнем наше руководство по HTML:

  • Гипертекст: Гипертекст означает текст со встроенной в него ссылкой. Если вы нажмете на эту ссылку, откроется новая веб-страница. Помимо текста, гипертекст может содержать Таблицы HTML , HTML-списки , HTML-формы , HTML-изображения , так далее.
  • Язык разметки: язык разметки использует теги для определения элементов в документе. Он содержит знакомые слова, которые читаются человеком, например формы , таблицы , ссылки , названия и т. д. Каждый тег на языке разметки имеет собственное особое значение и выполняет определенную операцию.

В заключение, HTML - это не язык программирования. Язык программирования использует логику для получения результата, он использует условные операторы, переменные, функции и т. Д. В то время как HTML - это язык разметки, который создает структуры с использованием тегов для представления данных. Здесь нет никакой логики или алгоритма.


Краткая история HTML

Давайте быстро рассмотрим исторические факты о HTML-

  • Сэр Tim Berners-Lee разработал HTML в конце 1989 года, и его считают отцом HTML.
  • В 1996 году Консорциум World Wide Web (W3C) стал органом, ответственным за поддержку спецификаций HTML.
  • Он стал международным стандартом (ISO) в 2000 году.

Особенности HTML

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

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

Преимущества изучения HTML

Первоначально HTML был разработан для определения структуры веб-страниц. У него были некоторые базовые теги только для структурных изменений, таких как Заголовок ярлык, пункт ярлык, список ярлык. Однако постоянные исследования и развитие технологий помогли ему развиваться на протяжении многих лет. Давайте посмотрим на некоторые преимущества HTML:

  • У него есть теги, которые оптимизируют сайт для поисковой системы и повышают производительность. Эти теги теги <meta> , теги <heading> , тег <title> , так далее.
  • Это основа проектирования и разработки веб-страниц. Как только вы разберетесь с основами, другие связанные технологии, такие как Javascript , CSS и т. д. становятся более понятными.

Первый пример HTML-кода для новичков с объяснением

Это первый базовый пример в этом руководстве по HTML. Это довольно легко понять даже новичку. Взгляните на структуру HTML-кода, но не обращайте особого внимания на несхожие теги. Это ваш первый пример с очень простыми HTML-тегами:

Пример
<!DOCTYPE html>
<html lang="en"> 
<HTML> 
<head> 
<title> Page Title </title> 
</head> 
<body> 

<h1> This is a Heading </h1> 
<p> This is a Paragraph </p> 

</body> 
</html>

Выход

Page Title

Это заголовок

Это абзац


Объяснение HTML-тегов, используемых в Примере

  • <!DOCTYPE> - Объявление doctype указывает тип документа и версию HTML, используемую на веб-странице. Каждая версия имеет различное объявление типа документа. В этом примере используется HTML5 Doctype.
  • <html> - Это корневой тег, который описывает всю веб-страницу. Это парный тег, т. Е. Он также имеет закрывающий тег </html> . Внутри этих тегов будет написано все.
  • <head> - Тег заголовка содержит информацию о документе, такую ​​как его заголовок, информация об авторе, описание веб-страницы и т. Д. Он имеет разные теги для выполнения этих функций. Это тоже парный тег.
  • <title> - Тег заголовка используется внутри <head> и определяет заголовок документа.
  • <body> - Тег body содержит всю информацию, которая будет отображаться на веб-странице. Если вы хотите, чтобы на веб-странице отображалось что-либо, вы должны указать это в этих тегах.
  • <h1> - Заголовочный тег используется для определения заголовков. <h1> является самым крупным заголовком, а затем <h2> , <h3> к <h6> .

Вы можете попробовать наши онлайн-редактор HTML и может внести соответствующие изменения.


Microsoft Word в качестве редактора HTML для этого учебника HTML?

Можете ли вы использовать текстовые редакторы, такие как MS Word, для редактирования HTML? Ответ: да, можете, но не должны. Вы можете написать свой HTML-код в любом приложении, которое дает вам возможность писать, но вам следует использовать только специальные редакторы HTML или Блокнот.

MS Word не подходит для кодирования, потому что он не сможет форматировать код, как специальный редактор. Форматирование кода, такое как отступы, цветовая схема и т. Д., Очень важно, оно приводит к меньшему количеству ошибок и выглядит привлекательно для глаз. MS Word не понимает HTML-код и выдает грамматические ошибки.

Итак, во время полного руководства по HTML даже не думайте об использовании MS Word в качестве редактора кода. Используйте Notepad, Brackets, Sublime, VSCode и т. Д. Для разработки и проектирования веб-сайтов.


Хронология версий HTML

HTML непрерывно развивался со временем. Каждая новая версия была лучше предыдущей с расширенными функциями. Текущая версия - HTML5, снабженная различными расширенными тегами. Давайте посмотрим на график эволюции версии HTML:

HTML версии Год
HTML 1991 г.
HTML 2.0 1995 г.
HTML 3.2 1997 г.
HTML 4.01 1999 г.
XHTML 2000 г.
HTML 5 2014 г.

Часто задаваемые вопросы

Все ли веб-сайты используют HTML?

Да, все веб-сайты, представленные в Интернете, используют HTML для своего макета. Даже разные CMS, вроде Wordpress , Magento и т. д., где знания кодирования не требуются, также используйте их для разработки веб-сайтов.


Есть ли альтернатива HTML?

Нет, альтернативы HTML нет. Это стандарт для создания веб-страниц в Интернете. Создает основу сайта. Затем эта база модифицируется с помощью CSS, JavaScript, JQuery, Bootstrap и т. Д., Чтобы украсить веб-сайт и сделать его динамичным.


HTML сложно понять?

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


Что такое теги в HTML?

Тег HTML - это ключевое слово, окруженное знаком '<>' . Все эти теги имеют особое значение для веб-браузера. Работа каждого тега предопределена, и контент, который мы пишем или вставляем между этими тегами, будет отображаться на веб-странице в соответствии с определением этого тега. Например: <p> Это абзац </P>, в этой строке будет отображаться абзац, потому что содержимое, которое мы пишем между тегами <p>, отображается в браузере как абзац.


В чем смысл языка разметки?

В языке разметки используются теги, которые могут быть предопределенными (в HTML) или определяемыми пользователем (в XML). Любой язык разметки очень легко выучить, поскольку он использует удобочитаемые теги, которые легко запомнить.


Что такое полная форма HTML?

Полная форма HTML - это язык разметки гипертекста.


Что такое гипертекст?

Гипертекст - это текст, содержащий ссылку на другой текст или веб-страницу. Гипертекстовый документ - это документ, содержащий гиперссылки. Гипертекст также иногда используется для определения таблиц, изображений и т. Д. Со встроенными гиперссылками.


Мы изучили основы HTML, и в следующем руководстве по HTML мы узнаем о HTML-теги и их использование. Нажмите на Следующий.