Создание web страницы html. Что такое веб-страница. HTML и другие понятия

Итак, что же такое 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/.

06.09.17 1.5K

Что такое web страница ? Это документ, написанный на языке разметки гипертекста (HTML ), который можно просмотреть с помощью браузера. Доступ к веб-странице осуществляется путем ввода URL-адреса .

Веб-страница может содержать текст, графику и гиперссылки на другие страницы и файлы.

Как открыть веб-страницу

Для просмотра веб-страницы требуется браузер (например, Internet Explorer , Edge , Safari , Firefox или Chrome ). В браузере можно открыть веб-страницу, указав в адресной строке URL-адрес . Например, введя «https://www.computerhope.com/esd.htm », вы откроете страницу ESD Computer Hope .

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

Когда была создана первая веб-страница?

Первая веб-страница была создана в CERN Тимом Бернерсом-Ли 6 августа 1991 года. Перед тем, вы можете посетить и просмотреть первый сайт и первую веб-страницу по адресу http://info.cern.ch/ .

В чем разница между сайтом и веб-страницей?

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


В приведенном выше примере URL-адреса «url.htm» — веб-страница, это всегда последняя часть URL-адреса . Для URL , которые не имеют окончаний .htm , .html , .php , .cgi , .pl или другого расширения файла, сервер загружает веб-страницу index.htm по умолчанию. Например, для URL-адреса страницы контактов нет веб-страницы. В этом случае загружается индексный файл по умолчанию из каталога /contact .

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

Мы уже упоминали, что для просмотра web страниц используются браузеры. Веб-страница состоит из нескольких элементов, включая CSS , изображения и JavaScript . Тело веб-страницы создается с использованием HTML . Этот код может быть создан с использованием HTML-редактора, написан человеком или сгенерирован с использованием серверных скриптов. Обычно веб-страница, созданная человеком, заканчивается расширением .htm или .html . Например, эта страница имеет имя файла «webpage.htm ». Страницы, сгенерированные скриптом, могут заканчиваться на .cgi , .php , .pl и т.д.

Какие элементы содержит веб-страница?

Ниже приведена разбивка основных элементов, чтобы веб-дизайнеры могли понять, какова логическая структура web страницы :

  1. Название сайта, логотип или название компании почти всегда находятся в верхнем левом углу каждой веб-страницы. Также неплохо использовать слоган или краткое описание страницы, чтобы дать новым посетителям представление о сайте. Этот элемент веб-страницы обычно является ссылкой, которая ведет на главную страницу;
  2. Панель поиска позволяет посетителям быстро найти веб-страницу. Она должна присутствовать на каждой странице;
  3. Панель или меню навигации обычно находится в верхней или левой части каждой веб-страницы. Она и должна включать в себя ссылки на каждый из основных разделов сайта;
  4. Рекламные баннеры могут отображаться в разных местах на веб-странице. Обычно они отображаются в верхней, левой, правой или нижней части веб-страницы или включены в основной контент;
  5. Социальные кнопки позволяют посетителям делиться ссылкой на веб-страницу на сайтах социальных сетей;
  6. В созданных web страницах хлебные крошки помогают посетителю понять, где он находится, а также перейти к другим разделам сайта;
  7. Заголовок должен находиться в верхней части каждой веб-страницы. Он создается с использованием HTML-тега

    .

  8. Начальный абзац является одним из наиболее важных элементов веб-страницы. Он должен заинтересовать посетителя ознакомиться с содержимым веб-страницы. Один из способов привлечь внимание посетителей — вставить изображение рядом с начальным абзацем;
  9. Каждая веб-страница должна быть разбита на заголовки более низкого уровня, которые позволяют посетителю легко просматривать контент и находить на странице то, что ему наиболее интересно. При создании веб-страницы это можно сделать с помощью HTML-тегов

    ;
  10. Хорошая идея — предоставить посетителям ссылку или кнопку, перенаправляющую на форму обратной связи, чтобы они могли сообщить, была ли полезна им данная веб-страница или нет;
  11. Дополнительная информация и инструменты, такие как кнопка для вывода страницы на печать, также могут быть полезны для пользователей;
  12. Футер должен включать в себя дополнительную информацию, которая важна для компании или сайта. А также ссылки на другие веб-страницы;
  13. Копирайт и любое юридическое или конфиденциальное уведомление также должны быть размещены на всех веб-страницах. В основах проектирования web страниц этот элемент не только может ссылаться на соответствующую юридическую информацию. Он также указывает, что посетители достигли конца веб-страницы;
  14. Кнопка «Вверх страницы » может помочь посетителям быстро вернуться к верхней части веб-страницы, чтобы получить доступ к ссылкам меню.

Что пользователи могут сделать на веб-странице?

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

Что такое HTML

Сегодня интернетом пользуется 3,5 миллиарда человек – это половина населения Земли. Путешествуя по сайтам, многие люди даже не догадываются, что при их создании использовался язык HTML. Без него все веб-страницы выглядели бы сплошным неудобочитаемым полотном строчек. Попробуем разобраться, что собой представляет этот язык, и для чего он нужен.

HTML и другие понятия

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

Язык HTML

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

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

, и
позволяют начертить таблицу.

Написать сайт на html можно в самом простом текстовом редакторе, правильно расставив тэги и заменив расширение.txt на.html. Для пользователей, которые понятия не имеют, что такое HTML, было создано множество редакторов, делающих работу с кодом простой и наглядной. Самыми популярными программами являются FrontPage, Dreamweaver и HomeSite. Все они облегчают процесс создания сайтов, но засоряют коды страниц ненужными тэгами, увеличивая их объем. Поэтому многие даже начинающие сайтостроители предпочитают изучать язык гипертекстовой разметки и писать HTML-код вручную.

Что такое веб-страница

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


  • картинки;
  • фотографии;
  • аудио- и видеофайлы;
  • таблицы;
  • списки;
  • ссылки на другие страницы.

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

Как правило, веб-страница состоит из:

  • «шапки», в которой расположена основная информация: название сайта, логотип, девиз, телефоны, форма поиска;
  • основного блока, где размещается контент страницы;
  • боковых колонок с длинными списками: пунктами меню, рубриками;
  • «подвала» с контактами, копирайтом, счетчиками посещений, отдельными пунктами меню.

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

Что такое сайт

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

Каждый сайт имеет свое доменное имя, которое вводится в адресную строку браузера. Оно гораздо короче и лаконичнее, чем адреса внутренних веб-страниц, поэтому запомнить его не составит труда. Некоторые сайты имеют 2 и более адреса, которые ведут к одному и тому же ресурсу. Так часто поступают компании, которым нужно, чтобы клиенты могли найти их сайт, введя название фирмы как на латинице, так и на кириллице. В зависимости от объема и характера контента, сайты делятся на 3 типа.

Инструкция

Все, что посетитель видит на веб- , воссоздается браузером из инструкций, присланных по его сервером. Эти инструкции написаны на HTML (HyperText Markup Language - «язык разметки гипертекста») и для файлов, в которых они хранятся, выделены htm и html. Создать такой файл вы можете в обычном текстовом редакторе - это будет первым шагом создания веб-страницы . Откройте, например, стандартный Блокнот, и создайте пустой файл с именем index.html. Когда вы набираете адрес сайта, не указывая конкретную страницу (например, ), первым делом ищет страницу именно с таким названием - index.

Инструкции языка HTML называют «тегами» и каждый из них заключен в такие скобки - <>. Некоторые из тегов - парные, то есть состоят из открывающего и закрывающего тегов, а между ними размещается информация. Например, тег, дающий браузеру , что ниже размещен код именно на языке HTML, так:Закрывающий тег, сообщающий, что в этом месте код HTML закончен, пишется так:Как видите, закрывающий тег отличается от открывающего наличием значка слэша после открывающей скобки (

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

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

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

Здесь целый параграф информации!

Не все теги языка HTML - парные. У некоторых из них все необходимое размещено внутри открывающего тега. У таких тегов закрывающий слэш ставится перед закрывающей скобкой. Например, тег окончания строки и «перевода каретки»
:

Первая строка параграфа.


Вторая строка параграфа.

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

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


Первая строка параграфа.


Вторая строка параграфа.



На этом

  • Сергей Савенков

    какой то “куцый” обзор… как будто спешили куда то