Урок 1. Что такое HTML? Введение.
Автор: Андрей Краснокутский
Дата: 2008-11-27 Так что же такое этот таинственный - HTML?
Каждый, кто впервые сталкивается с созданием сайта(ов) или блогов, обязательно слышит такое слово, точнее абревиатуру: HTML. Конечно же человек, услышав первый раз выражение HTML, задается вопросами: Что такое HTML? Для чего нужен HTML? Как практически применить и использовать HTML? И еще у новичков возникает много других вопросов в этом же духе. Давайте вместе разберемся с этими понятиями.
HTML (HyperText Markup Language) - это язык разметки гипертекста. HTML - представляет собой систему разметки веб-страниц и определяет, где и как в web-документе или как еще говорят: на web-странице сайта, отображать отдельные элементы: текст, рисунки, ссылки и другие элементы. Т.е. при необходимости изменить, например на сайте текст (размер, цвет, наклон и т.д.) или вставить картинку в нужном месте, добавляются специальные символы называемые: тегами.
Теги не отображаются браузерами. Посетитель сайта будете видеть только результат, т.е. измененный текст. Теги всегда заключаются в угловые скобки. Например, видимая запись на web-странице: ТЕКСТ, означает, что: текст находящийся между тегами, будет отображаться жирным начертанием и к нему применен красный цвет шрифта. Аналогично с помощью тегов создаются и другие элементы на web-страницах сайта: списки, таблицы, добавляются картинки, фотографии и т.д.
По сути дела код веб-страницы - это набор Тегов (которые посетитель сайта не видит) в перемешку с обычным текстом, картинками и другими файлами и элементами сайта. Все это и формирует страницу сайта. И называется эта "смесь": Исходный код.
Исходный код каждой веб-страницы является обычным текстовым документом, который можно написать в обычном Блокноте, входящем в состав любой Windows подобной операционной системы (ОС). Блокнот - типовая программа, которая имеется на всех компьютерах, расположена она: Пуск/Все программы/Стандартные/Блокнот).
Исходный код состоит всего из двух основных компонентов, которые перемежаются между собой:
-
обычный текст и другие элементы, которые мы видим на экране монитора;
-
теги, они добавляют рисунки, устанавливают ссылки, меняют вид текста и делают еще множество других полезных вещей.
Этот текстовый документ сохраняют с расширеним: .html или .htm (большой разницы нет) и получают готовую веб-страницу.
Таким образом, освоение языка гиперразметки текста HTML, сводится к изучению основных тегов (их около двух десятков) и правил их использования (написания).
Для элементов разметки HTML существуют специальные правила, которые установлены спецификацией HTML. Этот документ регламентирует порядок применения тегов, их вложенность и принцип работы. Знание спецификации и ее соблюдение, помогает избежать типичных ошибок и позволяет создать универсальный код, одинаково хорошо работающий на различных устройствах и в разных браузерах.
Полезный совет: Мне например больше нравится пользоваться при наборе кода не типовым «Блокнотом», а более продвинутой и к тому же бесплатной программой: Notepad++. Функции программы те же (и даже больше), но все выглядит более наглядней и гораздо удобнее.
Например, есть функция подсветки кода, т.е. теги, параметры тегов и текст, отображаются разными цветами. Это очень удобно, написал тег неправильно и сразу же изменился цвет, очень наглядно и сразу видно, что допущена ошибка. Как говорится: почувствуйте разницу :). Эту программу Вы сможете найти в разделе Инструменты и скачать совершенно бесплатно на нашем сайте.
Полезный совет: В настоящее время существует довольно много визуальных редакторов для создания сайтов, путем перетаскивая мышкой какого-то элемента, Вы сразу получаете готовый код web-страницы. Конечно удобно. Но!!!… Если вдруг, на Вашей веб-странице, что то «разъедется» или просто перестанет работать, согласитесь, что не зная исходного кода Вы, не сможете это исправить. Так что знание правил написание кода – это Ваш ФУНДАМЕНТ, и его надо обязательно знать! Поэтому, если Вы действительно хотите научиться "сайтостроению", не ленитесь – набирайте исходный код ручками (хотя бы вначале обучения).
Что такое Браузеры?
Сам HTML-файл, размещается на сервере в сети Интернет. А для его просмотра необходима специальная программа, которая называется Браузер. Например браузер: Internet Explorer (IE), Mozilla Firefox, Opera и т.д. В задачу браузера входит подключение к удаленному серверу, получение HTML кода web-страницы и его (кода) интерпритация (отображение на экране монитора) согласно спецификации. Проще говоря, браузер преобразует исходный код HTML-документа в веб-страницу, которую мы и видим на экране монитора, "путешествуя" по Интернету.
Замечу так же, что браузеры вполне корректно работают и на локальном компьютере (не подключенном к Интернету). Это позволяет легко проверять и отлаживать работу созданных Вами HTML-документов (сайтов). Для этих целей используется специальное программное обеспечение, которое называется: Локальный сервер. Например, Российский пакет Локального сервера - Денвер, но об этом позже.
Для упрощения задачи, в наших уроках мы будем работать с браузером IE, этот браузер имеется у всех пользователей компьютеров с операционной системой (ОС) Windows, этот браузер входит в стандартный пакет установки ОС.
Хотя есть множество и других достойных браузеров. Другие браузеры Вы можете бесплатно скачать здесь>>> Программы для работы в Интернете и создания сайтов.
Обновлено: 24.09.2014 г.
Читайте также:
Какими программами пользоваться для создания сайтов и работы в Интернете?
Создаем первый HTML-документ.
Приступаем к форматированию текста.
Вставляем заголовки на web-страницу.
Форматируем текст web-страницы.
Просмотров: 106194
Что бы Вы хотели узнать еще???????
Notepad++ классная прога, презент, спасибо
А я dreamweaver больше люблю.
Спасибо, изучаю и стараюсь применять.Пока всё понятно и легко.
У меня уже есть этот Notepad++ но как использовать его правильно я не знаю и руководства найти не могу,а программа по всему видно мощная для простого блокнота,там столько разных вкладок .
Здравствуйте, Андрей. Хотела подписаться на обновления Вашего сайта, но ссылка оказалась не рабочей. Проверьте, пожалуйста.
Спасибо! вы очень помогли. на уроках ничего не поняла, а у вас все выучила и разобрала)
|