Загрузка

RUS | ANG | |

StepkinBlog.ru

Пока я творю, я живу!
Блог посвящен: HTML, CSS, PHP, Wordpress, Bootstrap

Главная » Основы HTML » Cкелет HTML. Основы HTML для начинающих. Урок №1

10.01.2015


21:53


9586


5


Основы HTML для начинающих – скелет HTML . Урок №1

Cкелет HTML. Основы HTML для начинающих. Урок №1

Всем привет! Я рад, что вы посетили мой блог stepkinblog.ru.
При создании веб-страниц и сайтов приходится работать с HTML . Поэтому, вы сделали очень правильное решение изучить основы HTML.
Предлагаю вам пройти изучение именно моих уроков. Почему именно моих? Во-первых, потому что они поданы в легкой и доступной форме для новичков, во-вторых, потому что каждый урок будет иметь практическое занятие, а как известно практика играет важную роль.
Итак, урок №1. В нем я расскажу, что такое HTML и схематически отображу скелет HTML документа.
Что такое HTML?
HTML – (от англ. Hypertext Markup Language ) это язык разметки гипертекста, разработанным британским ученным Тимом Бернерс-Ли (Tim Berners-Lee) в 1991—1992 годах.

Тимом Бернерс-Ли (Tim Berners-Lee)

Попробую своими словами и максимально проще объяснить, что значит язык разметки гипертекста.

Гипертекст – это совокупность текстов, ссылок, картинок, таблиц, которые взаимосвязаны. Это вам ничего не напоминает? Да, это обыкновенная веб-страница.

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

Язык – набор тегов, с помощью которых осуществляется разметка в HTML.

На данном этапе логично было бы объяснить еще значение слова тег, но об этом чуть позже.

Теперь рассмотрим, из чего состоит скелет HTML документа. Разберем скелет по косточкам.

Скелет HTML

Для лучшего понимания из чего состоит HTML документ, я подготовил  схему:

Скелет HTML

Разъяснение схемы:

1). <HTML> и </HTML> - это начало и конец HTML документа.

2). <HEAD> и </HEAD> - голова HTML документа. В голову документа вставляют различные служебные теги (мета теги). Со служебными тегами мы обязательно столкнемся в дальнейших уроках и все подробно разберем.

3). <title> и </title> - заголовок документа. Это один из служебных тегов, который размещается в голове HTML документа между тегами <HEAD> и </HEAD>.
Давайте посмотрим, где будет отображаться заголовок документа в браузере:

Основы HTML для начинающих – скелет HTML . Урок №1

Также заголовок документа будет отображаться в результатах поиска в поисковых системах:

Основы HTML для начинающих – скелет HTML . Урок №1

4). <BODY> и </BODY> - тело документа. В теле документа находится все, что мы хотим видеть на веб-странице: текст, картинки, таблицы, аудио, видео и т. д.

Вот теперь пришло время выяснить, что такое ТЕГ

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

Для примера я пропишу парочку тегов: <html></html>, <head></head>, <title></title>, <br>, <p></p> и др.

Также хочу упомянуть, что есть теги, которые нужно закрывать. Например:
<html> - открываем тег.
</html> - закрываем тег.

Есть теги одиночки, которые не нуждаются в паре или в закрытии. Например:
<br> - тег для переноса строки.

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



Случайные записи:

  1. Цикл While (Do- While). Основы PHP с нуля. Урок №11
  2. Подключение. Основы bootstrap 3 для начинающих. Урок №2
  3. PHP операторы. Основы PHP с нуля. Урок №8
  4. HTML формы. Основы HTML для начинающих. Урок №18
  5. Миниатюры. Основы bootstrap 3 для начинающих. Урок №25

Последние записи рубрики:

  1. Бесплатный курс по основам HTML
  2. Шпаргалка по HTML на русском языке
  3. Создание простого мини сайта. Практика по пройдённому материалу
  4. Тесты HTML онлайн. Основы HTML для начинающих
  5. Как прописать мета теги. Основы HTML для начинающих. Урок №21

5 ответа(ов) на статью: “Cкелет HTML. Основы HTML для начинающих. Урок №1”

  1. Колька says:

    Спасибо за доступный и понятный урок. :arrow:

    Ответить

    Степка
    Степка ответил(а) на комментарий:

    :arrow:
    Пожалуйста!

    Ответить

  2. Света says:

    Спасибо, Степан за статью! Все расписано понятливо и хорошо! Уже начинаю изучать HTML по вашим урокам. Жду с нетерпением других. ;-)

    Ответить

    Степка
    Степка ответил(а) на комментарий:

    Спасибо, Света за комментарий! Уроки делаю! За лето, хочу полностью закончить уроки HTML для начинающих.

    Ответить

    Света ответил(а) на комментарий:

    :!: буду ждать с нетерпением других уроков!!!

Добавить комментарий

;-) :| :x :twisted: :smokes: :smile: :shock: :sad: :rose: :roll: :razz: :pop-corne: :oops: :o :mrgreen: :lol: :idea: :grin: :gazeta: :evil: :cry: :cool: :coffe: :arrow: :???: :?: :!:

Подписаться на обновления:

Подпишись на обновления моего блога через e-m@il:

@

Реклама на блоге:

Мои цели на
2017 год:

Довести количество статей до 150

Доделать этот блог

Закончить тему «Основы CSS»

Закончить тему «Основы PHP»

Начать тему «Основы JavaScript»

Добиться посещаемости 500 чел/сутки

Статистика:

Записей: 104
Страниц: 3
Рубрик: 9
Меток: 11
Комментариев: 245