Что такое страница в интернете. Что такое Web-страница? Перечислите основные элементы Web-страницы


Web-страница - это специально отформатированный документ, который может включать текст, графику, гиперсвязи, аудиоряд, анимацию, видеоряд.

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

Веб-с айт (от англ. website : web - «паутина, сеть» и site - «место», буквально «место, сегмент, часть в сети») - совокупность электронных документов (файлов) частного лица или организации в компьютерной сети, объединённая под одним адресом (доменным именем или IP-адресом).

Все сайты в совокупности составляют Всемирную паутину, где коммуникация (паутина) объединяет сегменты информации мирового сообщества в единое целое - базу данных и коммуникации планетарного масштаба. Для прямого доступа клиентов к сайтам на серверах был специально разработан протокол HTTP.

Web-сайт по своей структуре напоминает журнал, который содержит информацию, посвященную какой-либо теме или проблеме. Как журнал состоит из печатных страниц, так и Web-сайт состоит из компьютерных Web-страниц.

Программа, демонстрирующая веб-страницу, называется веб-браузер.

Создание Web-сайтов реализуется с использованием языка разметки гипертекстовых документов HTML. Технология HTML состоит в том, что в обычный текстовый документ вставляются управляющие символы (тэги) и в результате мы получаем Web-страницу. Браузер при загрузке Web-страницы представляет ее на экране в том виде, который задается тэгами.

HTML позволяет:

· форматировать текст;

· включать в документ изображения, мультимедиа;

· с помощью этого языка создаются гипертекстовые ссылки на другие Web-страницы.

HTML используется для создания информационного содержимого файла и для определения структуры и формата Web-страниц. Так как HTML-файлы являются обычными текстовыми файлами, такой файл может быть практически отправлен на любой компьютер.

Для создания Web-страниц используются простейшие текстовые редакторы, которые не включают в создаваемый документ управляющие символы форматирования текста. В качестве такого редактора в Windows можно использовать стандартное приложение «Блокнот».

Обычно файл Веб-страницы имеет расширение.html или.htm.

Кроме того, существует много технологий, в которых основные действия по созданию сайтов уже автоматизированы, остается лишь внести изменения в соответствии со своей тематикой.

Для того, чтобы просмотреть HTML-страницу, достаточно просто ввести ее URL-адрес в строке адреса Web-браузера, а затем следовать по гиперссылкам. Но именно в этом и заключается основная проблема - как узнать адрес страницы? Чаще всего бывает так, что известно то, что необходимо найти, но неизвестно где именно искать. Для решения этой проблемы существуют специальные поисковые системы. С точки зрения пользователя, поисковая система - это обычный сайт на главной странице которого находятся разбитые по рубрикам («Спорт», «Бизнес», «Компьютеры» и т.п.) ссылки на другие сайты. Кроме того, поисковая система позволяет пользователю ввести несколько ключевых слов и возвращает ссылки на страницы, содержащие эти ключевые слова.

Веб - сайт

Веб-сайт (англ. Website, от web - паутина и site - "место") - в компьютерной сети объединённая под одним адресом совокупность документов частного лица или организации. По умолчанию подразумевается что сайт располагается в сети Интернет. Все веб-сайты Интернета в совокупности составляют Всемирную паутину. Для прямого доступа клиентов к веб-сайтам на серверах был специально разработан протокол HTTP. Веб-сайты иначе называют Интернет-представительством человека или организации. Когда говорят "своя страничка в Интернет", то подразумевается целый веб-сайт или личная страница в составе чужого сайта. Кроме веб-сайтов в сети Интернет так же доступны WAP-сайты для мобильных телефонов.

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

В большинстве случаев в Интернете одному веб-сайту соответствует одно доменное имя. Именно по доменным именам сайты идентифицируются в глобальной сети. Возможны иные варианты: один сайт на нескольких доменах или несколько сайтов под одним доменом. Обычно несколько доменов используют крупные сайты (веб-порталы) чтобы логически отделить разные виды предоставляемых услуг (mail.yandex.ru, news.yandex.ru, auto.yandex.ru). Нередки и случаи выделения отдельных доменов для разных стран или языков. Например, google.ru и google.fr логически являются сайтом Гугла на разных языках, но технически это разные сайты. Объединение нескольких сайтов под одним доменом характерно для бесплатных хостингов. Для идентификации сайтов в адресе после указания хоста стоит тильда и имя сайта: example.com/~my-site-name/.

Веб-сайт, часто называют сокращённо сайт - это не что иное, как совокупность логически связанных между собой веб-страниц, или просто одна страница. Страницы сайта доступны в Интернете средствами протоколов HTTP или HTTPS. Веб-сайт имеет своё место в интернете, определяемое персональным для каждого сайта адресом, который принято называть URL. Любой веб-сайт имеет своего владельца, владельцем может быть как физическое, так и юридическое лицо.

Веб-сайт состоит из страниц

Веб-сайт состоит из страниц, объединённых общим корневым URL и, как правило, общей логической структурой, темой, оформлением (дизайном) и техническим устройством. В свою очередь Всемирная паутина это не, что иное, как совокупность всех веб-сайтов. Веб-страницы представляют собой текстовые файлы, написанные на языке гипертекстовой разметки HTML или XHTML.

При просмотре веб-страницы, в специальной программе, которую называют браузером, HTML файлы загружаются на компьютер пользователя. После загрузки браузер выводит веб-страницы на экран пользователя. В качестве аппаратного средства для выхода в интернет с целью обзора содержимого веб-страниц могут использоваться различные устройства: персональный компьютер, КПК, некоторые модели игровых приставок и другие устройства, все эти устройства поддерживают стандарты языка HTML / XHTML и веб-страницы на них отображаются одинаково.

Язык HTML / XHTML даёт возможность форматировать страницы, помещать на них текст, гиперссылки, таблицы, картинки и другие объекты. Таблица стилей CSS, которую можно использовать в HTML документах даёт дополнительные возможности для создания внешнего вида веб-страниц.

JavaScript и некоторые другие скриптовые языки

На веб-страницах так же можно использовать JavaScript и некоторые другие скриптовые языки поддерживаемые браузером, да придание интерактивности веб-документу. Для связи между веб-страницами внутри сайта и связи между разными веб-сайтами Всемирной паутины используются гипертекстовые-ссылки или сокращённо гипер-ссылки. Если гипер-ссылка используется для связи страниц внутри сайта, её называют внутренней, а если она связывает разные сайты, её называют внешней.

Страницы сайта

Страницы на сайте могут быть статичными, то есть они хранятся на веб-сервере виде неизменяемых файлов, а могут быть динамическими, то есть генерироваться прямо на сервере специальной программой, которую ещё называют движок сайта. Движок сайта может предоставлять большой набор возможностей, для изменения содержимого веб-страниц, добавления новые веб-страниц и осуществления других действий по конфигурированию веб-сайта и редактированию информации на нём через веб-интерфейс администрирования, который называют системой управления сайтом или CMS.

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

Немного из истории развития веб-сайтов

Первый в мире сайт был создан 6 августа 1991 г. Американцем Тимом Бернерс-Ли он разместил на сайте публикацию о технологии World Wide Web. Основой технологии World Wide Web является протокол передачи данных HTTP, язык гипертекстовой разметки HTML и система адресации URL. На сайте также были описаны и другие основные принципы работы сети Интернет, такие как работа серверов, веб-браузеров и т.д. Сайт, созданный Тимом Бернерс-Ли, так же стал первым мире Интернет каталогом, т.к. на нём позже были размещены ссылки и на другие ресурсы тогдашнего Интернета.

Необходимые инструменты для работы сайта были подготовлены ещё раньше, в конце 1990 появился первый браузер, который получил название WorldWideWeb, он дополнительно включал функцию гипертекстового редактора. Тим Бернерс-Ли также подготовил первый веб-сервер на базе NeXTcube.

Введение в HTML

В этой главе:

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

Как браузер получает веб-страницы?

Для общего понимания давайте рассмотрим небольшую теорию о том, как браузер получает веб-страницы и что такое веб-сервер. Чтобы получить веб-страницу, нужно создать файл, написанный на языке HTML, и поместить его на веб-сервер. После того как вы поместили созданный файл на веб-сервер, любой браузер сможет через интернет отыскать вашу веб-страницу. Веб-сервер - это обычный компьютер с доступом в интернет, который непрерывно работает и ожидает запросов от браузеров. Любой сервер хранит веб-страницы, картинки, аудиофайлы и файлы других типов. Когда сервер получает запрос от браузера на какой-нибудь ресурс (изображения, веб-страницы и др.), он находит этот ресурс (если может определить местоположение ресурса) и отправляет его браузеру.

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

Но каким образом браузер узнает о том, как именно отображать страницу? Вот здесь начинает работать язык HTML. Он говорит браузеру все о содержании и структуре страницы. Если вы выполните свою работу хорошо (код будет написан корректно и без ошибок), то ваши страницы будут одинаково отображаться во всех браузерах.

Примечание: Браузер (от англ. Web browser - Веб-обозреватель) - программное обеспечение, используемое для просмотра веб-сайтов, то есть для запроса веб-страниц (преимущественно из Сети - интернета), их обработки, вывода в окне браузера и перехода от одной страницы к другой. К наиболее популярным браузерам относятся: Internet Explorer , Mozilla Firefox , Google Chrome , Safari , Opera .

Обратите внимание: во время обучения вам не придется выкладывать никакие страницы на веб-сервер, все прекрасно будет работать и на вашем локальном компьютере.

Перед тем как продолжить, давайте рассмотрим, для чего нужен HTML-редактор, что из себя представляет HTML-документ и как его создавать.

Зачем нужен HTML-редактор?

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

Существует множество платных и бесплатных HTML-редакторов, к наиболее часто используемым платным относятся Dreamweaver , Visual Studio и PHPStorm . В качестве бесплатных редакторов можно использовать notepad++ и geany .

Что из себя представляет HTML-документ?

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

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

  1. В открытом редакторе (или в обычном текстовом документе) нажимаем файл → выбираем сохранить как → внизу в текстовом поле имя файла: напишем к примеру так: mypage.html → жмем сохранить . Всё, HTML-документ создан.
  2. Кликаем правой кнопкой мыши (ПКМ ) на текстовом файле → выбираем переименовать и меняем расширение с .txt на .html . Чтобы воспользоваться данным способом, нам надо сделать так, чтобы по умолчанию у всех файлов были доступны их расширения, делается это следующим образом: нажимаем Пуск → открываем Панель управления → выбираем Параметры папок → вкладка Вид → прокручиваем в самый низ и убираем галочку на Скрывать расширения для зарегистрированных типов файлов .

Открыть файл, сохраненный с расширением.html, для просмотра в браузере можно двумя способами:

  1. Кликнуть по нему два раза левой кнопкой мыши, в этом случае веб-страница откроется в том браузере, который выбран по умолчанию.
  2. Кликнуть по нему ПКМ → наводим курсор на открыть с помощью... → выбираем нужный вам браузер.

При получении HTML-документа браузер будет отображать его в виде веб-страницы (веб-страницей является то, что отображается в окне браузера), при этом вы не увидите в окне своего браузера отображения написанных вами тегов, потому что они будут интерпретированы для отображения содержимого страницы в нужном вам виде.

Заголовок

Мой первый заголовок

Мой первый абзац

Результат данного кода в окне браузера:


Чтобы отредактировать код HTML-документа, нажмите на него ПКМ → наводим курсор на открыть с помощью... → выбираем нужный вам редактор, если в списке нет нужного редактора, жмем Выбрать программу... и выбираем нужный редактор. Некоторые редакторы (для примера возьмем notepad++ ) можно выбрать прямо в контекстном меню, нажав по документу ПКМ и выбрав сверху Edit with Notepad++ (редактировать с помощью notepad++).

Что такое HTML?

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

  • Аббревиатура HTML расшифровывается как H yper T ext M arkup L anguage (язык разметки гипертекста).
  • Запомните, он не является языком программирования, это язык разметки.
  • HTML использует теги разметки, чтобы описать структуру веб-страницы.

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

HTML теги - это ключевые слова или символы, заключенные в угловые скобки, например ,

,

и т.д. Теги бывают двух видов: парные и одиночные (их также называют пустыми). Парные теги состоят из открывающего и закрывающего тега, например: . Символ "/" после угловой скобки указывает на то, что тег закрывающий. Одиночные теги состоят только из открывающего тега, например:
. Теги не чувствительны к регистру, поэтому могут быть написаны как прописными, так и строчными буквами:

Означает то же самое, что и

По стандарту HTML5 теги могут быть написаны в любом регистре.

С помощью тегов браузер распознает структуру и значение вашего текста, например, они сообщают браузеру, какая часть текста является заголовком, где начинается новый абзац, что нужно подчеркнуть и где расположить изображение (картинку). Получив эту информацию, браузер использует встроенные в него по умолчанию правила о том, как отображать каждый из этих элементов. Без использования тегов браузер выведет просто сплошной поток текста, без отступов, заголовков, абзацев и т.д. Чтобы стало понятнее, рассмотрим это подробнее на примерах ниже.

Так выглядит страница, в которой используются теги для разметки:

Летнее меню

Напитки в нашем кафе

Мультифрукт - 100р.

Фруктовый напиток, содержащий апельсиновый и ананасовый соки.

Молочный коктель - 150р.

Сливочное мороженое, перемешанное с мякотью фруктов.


То же самое, но без использования тегов:

Напитки в нашем кафе Мультифрукт - 100р. Фруктовый напиток, содержащий апельсиновый и ананасовый соки. Молочный коктель - 150р. Сливочное мороженое, перемешанное с мякотью фруктов.

Основная масса контента, представленного в интернете — это веб-страницы. Это исторически самый первый тип документов, предназначенных для размещения в виртуальном сетевом пространстве, но до сих пор сохранивший актуальность и практически не имеющий конкурирующих форматов. Какова структура веб-страниц? С помощью каких средств веб-разработки они создаются?

Что представляет собой Web-страница?

«Перечислите основные элементы Web-страницы» - говорит нам экзаменатор на уроке информатики. Что мы сможем сказать ему в ответ? Прежде всего повествуем о том, что собой представляет веб-страница в принципе.

Согласно общепринятому в среде IT-специалистов определению, это документ, который предназначен для открытия в специализированной программе — браузере, и который содержит данные для отображения на экране компьютера с помощью соответствующего типа ПО различного полезного контента — текстов, ссылок, графики, видео, музыки и т. д. Web-страница — это текстовый документ. Соответствующие данные для браузера представляют собой буквы, цифры и специальные символы, используемые как элементы языка разметки — HTML. Именно с помощью него создатель веб-страницы «объясняет» браузеру, каким образом отображать на экране тот или иной контент.

Место и роль веб-страниц в структуре сайтов

Можно ли сказать, что Web-страница — это основной компонент веб-сайта? Отчасти это верно. Однако, как мы отметили выше, веб-страница — это всего лишь текстовый документ. На сайте же, как правило, также располагаются картинки, видео и иные мультимедийные элементы. Веб-страница вместить их в себя не может, однако в своей структуре она может содержать ссылки на них. Таким образом, веб-страницу можно назвать основным компонентом сайта в аспекте главенствующей роли в отображении виртуального контента перед пользователями.

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

Принцип задействования гипертекста

Итак, Web-страницей называется документ, составленный на языке HTML, с помощью которого осуществляется разметка гипертекста. Но что это за явление? Что такое гипертекст? Не углубляясь сильно в теорию, отметим, что это текст, который тем или иным образом позволяет получить быстрый доступ к другому — посредством ссылок. В обычной книге это невозможно — там «простой текст». Для получения доступа к нужной странице читатель должен совершить несколько перелистываний, до этого ознакомившись с содержанием или сносками. В режиме «гипертекста» основную часть работы совершает компьютер — за счет сведений, отражаемых в HTML-элементах страницы.

Если преподаватель информатики говорит нам: "Перечислите основные элементы Web-страницы", то мы совершенно корректным образом можем начать повествование о компонентах соответствующего документа, которые создаются с помощью языка разметки HTML. Поэтому для начала рассмотрим некоторые теоретические моменты, касающиеся HTML.

Структура языка HTML: теги

Каким образом браузер считывает нужные данные о веб-странице из документа, составленного на языке HTML? Очень просто.

Основные элементы данного языка — это теги. Они в большинстве случаев парные — есть открывающий, а есть закрывающий. Первые обозначаются с помощью только угловых скобок. Вторые — аналогично, но перед второй скобкой ставится слэш — символ /. Браузер умеет их распознавать, и потому без проблем отображает содержимое веб-страниц в соответствии с алгоритмами, создаваемыми разработчиком документа.

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

Атрибуты

Другие важнейшие элементы HTML-языка — атрибуты. С их помощью создатель веб-страницы может задавать свойства контента — например, высоту шрифта, его цвет, положение относительно страницы. То же самое касается картинок, видео и иных мультимедийных компонентов. Атрибуты пишутся в пределах открывающего тега.

Содержимое

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

Элементы веб-страниц

«Так перечислите основные элементы Web-страницы, наконец!» - повторяет преподаватель. "С удовольствием," — отвечаем мы ему. Что же входит в структуру рассматриваемого типа документов? Условимся, что будем рассматривать данный аспект в именно контексте HTML-элементов веб-страницы. То есть их отображение в браузере — то, что пользователь видит на экране - нас будет интересовать в меньшей степени. Дело в том, что соответствующие HTML-алгоритмы, на основе которых программа отображает контент одинаково, могут быть разными. И в этом особенность языка HTML: нужное изображение на Web-странице можно вывести разными способами. При этом они могут быть как равнозначными с точки зрения трудозатрат создателя веб-страницы способами, так и предполагать разный объем усилий и времени на их осуществление.

Элементы веб-страниц: заголовок

Стандартные элементы Web-страницы, как бы это удивительно ни звучало, представлены в очень небольшом количестве. По сути, их только два — заголовок и основная часть документа. Вместе с тем каждый из них может иметь достаточно сложную структуру.

Какова специфика заголовка? Располагается он в самой верхней части веб-страницы. В HTML-коде, который формирует заголовок, как правило, предполагается «шифрование» только текста, но при необходимости в соответствующем элементе можно также размещать небольшие графические вставки. И это, собственно, все, что можно сказать о заголовке. Казалось бы, его роль в структуре соответствующего документа незначительна. Но это не так. Заголовки веб-страниц очень значимы с точки зрения индексации сайтов в поисковых системах — Яндексе, Google. Данный элемент должен быть полностью релевантен содержанию веб-страницы, а также тематической специфике сайта.

Каким образом заголовок веб-страницы фиксируется с помощью языка HTML? Очень просто. Сначала пишется открывающий тег, который всегда выглядит как HEAD с угловыми скобками, затем — содержание заголовка, после — закрывающий тег. Пишутся они, разумеется, в самом верхней части веб-документа.

Заголовок веб-документа может включать ряд дополнительных элементов. Иногда формат Web-страницы может требовать отображения текста в конкретной кодировке. Как обеспечить соответствие веб-документа этому критерию? Очень просто. В структуре заголовка документа должны быть размещены HTML-алгоритмы, предписывающие браузеру использовать конкретную кодировку языка — например, кириллическую. Соответствующие команды размещаются в рамках тега META, который, так же как и другие, бывает открывающим и закрывающим.

Основная часть веб-страницы

Основная часть веб-документа открывается тегом BODY, закрывается же с помощью соответствующего элемента, включающего слэш. При этом между открывающим и закрывающим тегами может быть огромное количество дополнительных команд языка разметки гипертекста. Это связано с тем, что в основной части веб-страницы размещено ее полезное содержимое — тексты, ссылки, графика, видео, различные формы для заполнения.

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

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

Базовые HTML-теги

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

Достаточно распространен тег P. Он, как и другие аналогичные элементы языка разметки гипертекста, может быть открывающим и закрывающим. Данный тег позволяет форматировать отдельно взятый абзац документа. Можно, например, задавать для него определенный тип шрифта или его цвет. Однако это осуществляется с помощью дополнительного тега - FONT. При этом размещаться он будет внутри того, который обозначает пределы абзаца — это позволит не распространять HTML-команду, отражающую тип предпочтительного шрифта, на другие элементы веб-страницы.

С помощью тега TABLE создаются таблицы. При помощи соответствующих ему атрибутов можно определять необходимое количество столбцов и строк, задавать их ширину, специфику границ, размер и цвет шрифта текста в таблице.

Отвечает за обработку браузером картинок. В нем также можно размещать различные атрибуты, регулирующие размер картинки, ее положение на странице.

Ссылки на другие веб-документы или файлы указываются с помощью тега A. Как правило, внутри него располагаются атрибуты, которые обозначают тот факт, что в структуре веб-страницы — гиперссылка. При этом указывается документ, файл или сайт, на который она ведет.

Распространен такой тег, как FRAMESET. С его помощью можно разделить пространство веб-страницы на несколько областей — фреймов. В каждом из них можно на отдельные веб-документы. То есть фреймы позволяют корректно расположить на одном экране одновременно две и более страницы.

Рассказ о ключевых элементах веб-страниц и последующее повествование о средствах их форматирования с помощью языка HTML - примерно таким будет алгоритм нашего ответа на вопрос, который нам задал экзаменатор. Если он обратился к нам, сказав «перечислите основные элементы Web-страницы», то мы, используя соответствующую методологию, будем иметь все шансы раскрыть тему. То есть под термином «элементы» мы можем понимать ключевые компоненты структуры веб-документа, либо типы содержимого — текст, картинки, таблицы, фреймы, ссылки, которые веб-мастер формирует с помощью такого инструмента, как язык HTML.

Специфика инструментов веб-разработки

В дополнение к сказанному мы можем пояснить, что тегов и атрибутов, предусмотренных стандартами HTML — огромное количество. Кроме HTML веб-разработчиками могут использоваться дополнительные средства форматирования гипертекстовых документов. Например, с помощью JavaScript можно создавать динамические Web-страницы — то есть те, в которых контент постоянно обновляется (как за счет действий самого пользователя, так и в соответствии с заранее прописанными в скриптах алгоритмами).

Полезно будет добавить, что веб-разработчик может задействовать в своей работе полноценные языки программирования, такие как, например, Perl, PHP, Java, Python, с помощью которых возможности работы с гипертекстовыми документами становятся еще шире. Необходимость в этом может быть связана с тем, что области применения веб-технологий сегодня — самые разные. Задачи, которые стоят перед современными разработчиками, могут быть достаточно сложными. Например, иногда требуется осуществить перевод Web-страниц, написанных на русском языке, на английский. В этом случае инструментарий разработчика будет самым разнообразным.

Здравствуйте, уважаемые читатели блога. С этой статьи мы начнем изучать основы языка HTML.

Вам скорей всего уже известно, что основным языком Internet-а является язык гипертекстовой разметки HTML (HyperText Markup Language) . В этой статье мы узнаем базовые понятия HTML и научимся создавать простейшие WEB-страницы.

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

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

Браузер — это специальная программа, предназначенная для просмотра веб-сайтов, например Internet Explorer. При помощи браузера вы бродите по сайтам, щелкая по ссылкам. Любой такой щелчок заставляет браузер сделать запрос на html-страницу web-серверу, получить ответ и отобразить страницу в своем окне. Именно при отображении страницы начинает работать язык HTML, он сообщает браузеру все о структуре и содержимом web-страницы. С помощью команд — тегов , HTML указывает браузеру, где начинаются абзацы текста, какая часть текста является заголовком и указывает куда вставлять таблицы, и даже картинки. А теги это слова в угловых скобках, например

,

, .

Срочно нужен интернет-магазин, а времени на изучение HTML, CSS, PHP и других технологий нет. Тогда просто можете арендовать интернет магазин с полностью реализованным функционалом и оптимизацией под поисковые системы.

Язык HTML и его теги

Первая версия языка HTML появилась еще в 1992 году. На момент 2013 года разрабатывается спецификация новой версии HTML под номером 5. Разработкой данной спецификации занимается организация World Wide Web Consortium, или сокращенно W3C. Организация W3C занимается разработкой и других Web-стандартов. Ознакомится с этими стандартами вы можете на их сайте www.w3.org . Кстати, Многие Web-браузеры уже поддерживают некоторые возможности HTML 5.

Предлагаю начать изучение языка HTML сразу с примера. Поэтому давайте создадим нашу первую Web-страничку. Для создания WEB-страниц подойдет любой текстовый редактор. Я предлагаю для начала воспользоваться встроенным в Windows Блокнотом (Notepad) (вообще в дальнейшем для редактирования html-кода я советую использовать ). Найти его можно: «Пуск->Все программы->Стандартные->Блокнот». Давайте создадим страничку об автомобилях. Итак, откроем Блокнот и наберем в нем текст:





Пример Web-страницы


Сайт об автомобилях.


Добро пожаловать на наш автомобильный сайт. Здесь Вы найдете много интересных и полезных статей об автомобилях. На сайте есть описания многих импортных и отечественных автомобилей.



Далее сохраним созданную web-страницу в файл с именем index.html. При этом в диалоговом окне сохранения файла необходимо задать кодировку UTF-8 и заключить имя файла в кавычки, иначе Блокнот добавит к нему расширение txt, и наш файл получит имя index.htm.txt:

Теперь осталось открыть созданный файл в браузере и посмотреть на результат. Для этого можно воспользоваться поставляемым в составе Windows браузером Microsoft Internet Explorer, либо любым другим установленным на вашем компьютере браузером, щелкнув два раза мышкой по файлу index.html или перетаскиванием файла на значок браузера. Открываем и видим примерно такой результат:

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

Что такое тег?

Теперь поговорим подробнее о структуре страницы. Рассмотрим фрагмент:

Сайт об автомобилях

. Здесь мы видим текст, который отображается на странице как заголовок, заключенный в теги

и

. Что же такое тег в html языке?

Тег HTML - это обычные слова и символы, заключенные в угловые скобки, например

,

, . Так тег

является открывающим тегом, тег

закрывающим тегом, а текст между ними называется содержимым тега. Также тег

и тег

называются парными тегами. Вместе открывающий тег плюс содержимое плюс закрывающий тег образуют элемент html-документа. Бывают еще элементы состоящие из одного открывающего тега:

Так парный тег

определяет элемент заголовка первого уровня. Всего существует шесть уровней заголовков, это элементы

.

Элементы бывают блочные и строчные (текстовые). Блочные элементы осуществляют структурное форматирование страницы. Блочные элементы всегда отображаются на странице с новой строки и имеют отступ от соседних элементов. Строчные элементы осуществляют непосредственное форматирование текста или логическое форматирование. Элемент

является блочным элементом.

На этом у меня все!!! До встречи в следующих постах!







2024 © gtavrl.ru.