Что такое Web-страница? Перечислите основные элементы Web-страницы
Итак, что же такое Web-сайт и Web-страница? Чтобы разобраться в этом вопросе, давайте подумаем, а какая собственно информация может содержаться на Web-сайте? Ответ очевиден - практически любая. Сайт может содержать информацию о компьютерных играх, автомобилях, аквариумных рыбках, мифических существах, городах и странах мира и т.д. и т.п. Список можно продолжать бесконечно. На сайте даже можно разместить, к примеру, произведения великих русских классиков. Как вам например сайт "Война и мир"? Получается, что сайт это книга, но только не простая, а электронная? Да, Web-сайт, по своей сути, действительно является электронной книгой, журналом или учебником, который может содержать как полезную для вас информацию, так и ту, что вас на данный момент совсем не интересует.
Как и обычная книга, Web-сайт состоит из страниц, которые называются Web-страницами.
А как мы, собственно говоря, находим, в том же учебнике информатики, интересующую нас информацию? Мы открываем содержание, которое находиться в начале или конце учебника, ищем параграф в котором находиться необходимая информация, напротив параграфа смотрим номер страницы, открываем ее и изучаем материал. Все довольно просто и обыденно.
После того, как мы попадаем, на главную страницу грамотно разработанного сайта, то мы должны тоже увидеть нечто похожее на содержание учебника, чтобы иметь возможность оперативно найти необходимую нам информацию.
Но как добраться до нужной информации расположенной на Web-сайте, ведь мы не можем листать электронные страницы так же как обычные бумажные? Действительно, ведь мы, как правило пользуемся мышью.
На самом деле, перемещение между страницами сайта осуществляется даже более оперативно, чем перемещение между страницами при работе с обычным учебником. Для перемещения между страницами сайта используются элементы Web-страницы, при щелчке мышью на которых, можно переместиться на другую страницу сайта. Эти элементы страницы называются гиперссылками и присутствуют на всех страницах входящих в состав сайта.
В "классическом" случае, в качестве гиперссылок используют часть текста (слово или несколько слов) и графические изображения (рисунки и фотографии).
Поскольку в первом случае для создания гиперссылок используется текст, то такая гиперссылка называется текстовой. Весьма часто текстовая гиперссылка представляет собой подчеркнутый текст синего цвета. Увидев, например, на главной странице сайта надпись "Web-сайты и Web-страницы" оформленную подобным образом и щелкнув на ней левой клавишей мыши, вы должны оказаться именно на Web-странице посвященной этой теме. На странице "Web-сайты и Web-страницы" должна в свою очередь присутствовать, как минимум, одна гиперссылка, при помощи которой вы смогли бы вернуться к содержанию.
Если в качестве гиперссылки использовано графическое изображение, например фотография, то догадаться о том, что это гиперссылка будет сложно. Как же в таком случае определить, является изображение гиперссылкой или нет? На этот случай запомните следующее правило: "Если при подведении курсора мыши к элементу Web-страницы он принимает форму руки, то этот элемент является гиперссылкой".
Примечание: Из этого правила есть исключение, так например в случае с ролловерами, которые могут не являться гиперссылками, но при наведении курсора мыши на них, курсор тоже принимает форму руки. Кроме изменения вида курсора, при наведении на гиперссылку, должен также отобразиться URL (уникальный адрес ресурса), но об этом мы поговорим в уроке посвященном созданию гиперссылок средствами программы FrontPage.
Контрольные вопросы:
- Что такое Web-сайт?
- Что такое Web-страница?
- Что такое гиперссылка?
- Какие элементы 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/.
Введение в 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-документ, вам надо всего-навсего сохранить файл под другим расширением, сделать это можно двумя способами:
- В открытом редакторе (или в обычном текстовом документе) нажимаем файл → выбираем сохранить как → внизу в текстовом поле имя файла: напишем к примеру так: mypage.html → жмем сохранить . Всё, HTML-документ создан.
- Кликаем правой кнопкой мыши (ПКМ ) на текстовом файле → выбираем переименовать и меняем расширение с .txt на .html . Чтобы воспользоваться данным способом, нам надо сделать так, чтобы по умолчанию у всех файлов были доступны их расширения, делается это следующим образом: нажимаем Пуск → открываем Панель управления → выбираем Параметры папок → вкладка Вид → прокручиваем в самый низ и убираем галочку на Скрывать расширения для зарегистрированных типов файлов .
Открыть файл, сохраненный с расширением.html, для просмотра в браузере можно двумя способами:
- Кликнуть по нему два раза левой кнопкой мыши, в этом случае веб-страница откроется в том браузере, который выбран по умолчанию.
- Кликнуть по нему ПКМ → наводим курсор на открыть с помощью... → выбираем нужный вам браузер.
При получении 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р.
Сливочное мороженое, перемешанное с мякотью фруктов.
Здравствуйте, уважаемые читатели блога. С этой статьи мы начнем изучать основы языка HTML.
Вам скорей всего уже известно, что основным языком Internet-а является язык гипертекстовой разметки HTML (HyperText Markup Language) . В этой статье мы узнаем базовые понятия HTML и научимся создавать простейшие WEB-страницы.
Начнем с самого главного, рассмотрим как работает сама всемирная паутина — Internet . Для получения веб-страниц, вы создаете файлы, написанные на языке HTML, и помещаете их на веб-сервер. После этого любой браузер установленный на устройстве с доступом в Интернет, будь то компьютер, телефон или планшет, может отыскать ваши веб-страницы.
Веб-сервер — это обычный компьютер со специальным программным обеспечением, имеющий доступ в Интернет. Он непрерывно ожидает запросов от браузеров на веб-страницы, изображения, аудио- и видео-файлы. Получив запрос на один из таких ресурсов, сервер ищет его и высылает браузеру.
Браузер — это специальная программа, предназначенная для просмотра веб-сайтов, например Internet Explorer. При помощи браузера вы бродите по сайтам, щелкая по ссылкам. Любой такой щелчок заставляет браузер сделать запрос на html-страницу web-серверу, получить ответ и отобразить страницу в своем окне. Именно при отображении страницы начинает работать язык HTML, он сообщает браузеру все о структуре и содержимом web-страницы. С помощью команд — тегов , HTML указывает браузеру, где начинаются абзацы текста, какая часть текста является заголовком и указывает куда вставлять таблицы, и даже картинки. А теги это слова в угловых скобках, например
,
