Файл: Основы программирования на языке HTML ( Язык программирования HTML как средство создания гипертекстовых документов ).pdf
Добавлен: 01.04.2023
Просмотров: 60
Скачиваний: 2
СОДЕРЖАНИЕ
Глава 1. Язык программирования HTML как средство создания гипертекстовых документов
1.1. Сравнение концепций WEB: WEB 1.0, WEB 2.0, WEB 3.0, WEB 4.0
1.2. Структура Web-страницы и Web-сайта
Глава 2. Создание Web- страниц с помощью языка HTML
2.1. Размещение и оформление текста
2.3 Особенности разработки ВЕБ-приложений для информационных киосков
Введение
Интернет развивается довольно стремительно. Вся информация в Web-браузере отображается в виде Web-страниц, которые являются основным элементов WWW. WWW или же World Wide Web-глобальная сеть где содержит миллионы сайтов, на которых размещена различная информация. Для создания страницы необходимо владеть языками для написания серверных скриптов, как PHP,XML,ASP, Perl, для того чтобы страница была более динамичнее используются скрипты VBScript и JavaScript, они помогают производить вычисления ,как например работа с датой и временем.
Первое что необходимо научиться- это создавать простые страницы с помощью HTML. Если вы думаете что нет необходимости, то не стоит так думать. HTML давно перестал уже быть просто языком программирования. Человек изучающий этот язык получает возможность делать сложные вещи простыми способами, главное быстро. В гипертекст включается мультимедиа и обычные документы. Язык HTML на данный момент используется по всему миру. Он позволяет создавать «заготовки» будущей страницы, а уже позже можно с помощью скриптов. Во время создания страниц необходимо владеть языком HTML.
Объект исследования: язык гипертекстовой разметки HTML.
Предмет исследования: изучение возможностей языка гипертекстовой разметки HTML.
Цель: рассмотреть особенности работы в языке гипертекстовой разметки HTML.
Задачи исследования:
- Изучить и проанализировать специальную литературу по теме исследования.
- Рассмотреть основы языка гипертекстовой разметки HTML.
- Выявить особенности работы с языком гипертекстовой разметки HTML.
- Создать электронное портфолио при помощи языка HTML.
Методы исследования: изучение литературы, анализ, синтез, классификация и обобщение, моделирование.
Практическая значимость: материалы курсовой работы можно использовать студентам и преподавателям при подготовке к учебным занятиям, а также при самостоятельном изучении языка гипертекстовой разметки HTML
Глава 1. Язык программирования HTML как средство создания гипертекстовых документов
1.1. Сравнение концепций WEB: WEB 1.0, WEB 2.0, WEB 3.0, WEB 4.0
HTML – похож на обычный текстовый файл, в котором находится как стандартный текст, так и особые коды форматирования или разметки. Эти коды указывают, каким образом должен отображаться данный документ программой — просмотрщиком (браузером).
Язык — HTML представляет синтаксис и набор управляющих команд (тегов, tags), они не выводятся на экран, но указывают браузеру, как отображать содержимое документа. Также он для создания ссылок на другие документы, локальные или сетевые, которые находятся в сети Интернет. Добавляются команды, позволяющие «включать» и « выключать» те или иные режимы отображения, предписывающие браузеру выполнить какое-то действие (например, «разорвать» в этом месте абзац и перенести дальнейший текст на новую строку, загрузить из внешнего из внешнего файла и «внедрить» в текст иллюстрацию из указанного внешнего файла и пр.). Также можно разработать Web-страницу, без знания языка HTML,поскольку HTML тексты могут создаваться разными специальными редакторами. Но писать HTML нетрудно. Это даже легче чем изучить интерфейс самих специальных редакторов по HTML которые бывают ограничены в своих возможностях, или во все приводит к ошибки HTML код, который не работает на разных платформах.
Гипертекст-это информационная структура, которая позволяет установить смысловые связи между элементами текста на экране компьютера таким образом, чтобы переходить от одного элемента к другому. Когда его применяют по умолчанию он выделяется синим цветом и подчеркиванием, в последствии можно изменить цвет (гиперссылки).[14]
Слово же «гипертекстовый» в расшифровке названия языка HTML нуждается в отдельном пояснении.[8]
Сейчас, в наше время концепция Web 3.0 заполонила просторы интернета, но, прежде чем описывать WEB 3.0, нужно вспомнить историю Интернета и попытаться понять эволюцию этого живого существа, которое в наши дни является частью жизни миллиардов людей на Земле.
Первый вопрос, на который нужно ответить, это вопрос о том, почему был создан Интернет?
Вплоть до 90-ых годов 20-го столетия коммуникация и передача данных на расстояние были очень ограниченными. Но всё изменилось с появлением Интернета. Основная его идея заключалась в том, чтобы иметь возможность общаться между отдельными сетями, связывая их воедино. По мере развития интернета появлялись различные веб-сайты, что давало пользователям общаться на расстоянии.
Web 0.0 – лексический web
Web 0.0 – доинтернетовские сети, включавшие либо линейные двухточечные системы коммуникаций, либо квазипочтовые сети типа usenet, biznet, fidonet. Это были первые поиски и попытки объединения информационных сетей в действительно глобальную сеть. Web 0.0 можно охарактеризовать как стадию разработки интернета.
Web 1.0 – морфологический web
Первая реализация сети Интернет (до 1999 года) называется «сетью только для чтения». Роль среднего интернет-пользователя ограничивалась чтением информации, которая была ему представлена. На этом этапе размещением информации занимались только лишь администраторы сайта. Другими словами, веб-сайты этой эпохи позволяли пользователям искать информацию и читать её, но генерировать контент сами пользователи не могли. Было очень мало способов взаимодействия пользователя с контентом.
Также в эту эпоху впервые появляется понятие «электронной коммерции» Появлялись различные сайты, предлагающие различные платные услуги пользователям: от сервиса покупки билетов до полноценных интернет-магазинов. Общая цель заключалась в том, чтобы представить продукты потенциальным клиентам в таком виде, как это делает каталог или брошюра. Через веб-сайты продавцы могли предоставить товар или услугу для человека, находящегося в любой точке мира.
Web 2.0. – синтаксический web
Отсутствие активного взаимодействия обычных пользователей с сетью привело к рождению Web 2.0.
Web 2.0 – это, скорее, новый способ использования Интернета, чем реальная эволюция его основного определения.
В основном, Web 2.0 ссылается на расширенный способ обмена информацией, совместной работы, общения и взаимодействия. Пользователи становятся участниками контента веб-сайта, то есть контент генерируется пользователями, но модерируется администрацией сайта. Web 2.0 становится местом, где пользователи из разных горизонтов могут обмениваться и обсуждать по широкому кругу тем.
Это время также связано с созданием социальных сетей (таких, как MySpace, Facebook, Twitter), сайтов для обмена видео (YouTube), энциклопедий (WikipedoA), блогов (LiveJournal, Blogger). В эту же эпоху появляются веб-приложения, RSS, XML и веб-API.
Web 3.0 – семантический web
Web 3.0 также известен как «семантическая сеть». Он включает в себя несколько технологий для организации и структурирования данных, которые вы можете найти в Интернете, чтобы сделать его доступным и полезным для программ и программного обеспечения.
Цель состоит в том, чтобы сделать Интернет понятным для людей.
Многие веб-сайты начинают использовать технологию SVG для отображения анимированного контента, а Flash-анимация уже использует эту технологию для доставки расширенного анимированного контента без большого «веса» обычных видеофильмов. Контент сайтов генерируется и модерируется пользователями.
Возникли сетевые, «облачные» вычисления, забирающие управление приватными информационными ресурсами внутрь гипер-серверов Паутины.
В это время появляются описательные механизмы семантической паутины (RDF, DAML, OIL, OWL). В настоящее время они уже разработаны, однако на этапе интеллектуальной обработки и вывода информации проблемы всё ещё не решены.
Web 4.0 – прагматический web
Идея прагматической сети заключается в том, что, когда метаданные организованы (Web 3.0), люди и «машины» могут взаимодействовать в симбиозе. Это означает, что мы могли бы построить более мощные интерфейсы, например, контролируемые интерфейсы.
Инновации в сетевых технологиях WEB
Несмотря на кажущийся революционный экспоненциальный характер развития Интернета, он развивался и развивается эволюционно, довольно мелкими шагами, определяемыми общей сложностью системы.
Экспоненциальное развитие сети обусловливается её многоуровневым развитием, то есть одновременным развитием технологий на разных сетевых уровнях, когда инновация на одном уровне влечёт инновации на других уровнях иерархии:
- аппаратно-физический, определяемый развитием аппаратуры процессоров и физикой линий связи;
- сетевых протоколов, определяемых развитием прикладных теории сигналов, теории и практики кодирования;
- операционно-системный, определяемый развитием ОС;
- программно-инструментальный, определяемый уровнем инструментального ПО;
- топологический уровень, определяемый развитием сетевых технологий;
- управления данными, определяющий способы и инструменты манипуляции данными,
- прикладной, определяемый развитием программных web-приложений.
- сетевых отношений, определяемых топологией и характером связей в сети;
- общественно-информационный уровень, определяемый направлением информационных потоков и характером зависимости пользователя (клиента) и сервера.
Таблица 1.
Сравнение концепций Web
Концепция Уровень |
Web 1.0 |
Web 2.0 |
Web 3.0 |
Web 4.0 |
аппаратно-физический |
web-серверы, ПК |
оптоволокно, графические процессоры |
гипер-серверы, нетбуки, планшеты, многоядерные ПК |
распознающие процессоры |
сетевых протоколов |
TCP/IP |
защищённые протоколы, p2p-сети |
мультимедиа-протоколы, семантические протоколы |
управляющие телематические протоколы |
операционно-системный |
многозадачные ОС |
сетевые ОС |
облачные вычислительные структуры |
загружаемые ОС |
программно-инструмен-тальный |
сетевые языки, 3GL |
визуальные среды, 4GL |
серверные среды, 5GL |
языки искусственного интеллекта, 6GL |
топологи-ческий |
иерархическая фиксированная однонаправленная структура |
сетевая многосвязная диалоговая структура |
реляционная структура |
логическая (объектно-реляционная) структура |
управления данными |
корпоративная сетевая СУБД |
поисковые гипер-серверы |
анализирующие гипер-серверы |
управляющие гипер-серверы |
прикладной |
browser, статический HTML-сайт, HTML2.0 - HTML3.2 |
browser-framework, динамические сайты на CMS-движках, HTML4 |
идентифицирующий net-framework, сетевые прикладные сервисы, межсерверный обмен, HTML5, XML |
slave-приложение, управляющее пользователем, глобальный master -управляющий гипер-сервер |
сетевых отношений |
сетевой гипертекст |
интерактивная связь |
поисковая оценивающая связь |
глобальная управляющая связь |
общественно-информа-ционный |
технические сети, клиент осуществляет “серфинг” по сети, читает всю информацию сети |
бытовые сети (СМИ), клиент “разговаривает”, общается с сервером, сервер регулирует область чтения и действий клиента |
разведывательные сети, сервер собирает досье на клиента и управляет приложениями клиента. |
управляющие сети, сервер управляет всеми клиентами в режиме электронного правителя |
1.2. Структура Web-страницы и Web-сайта
Web-страница напоминает собой текстовый файл. Поскольку HTML-документы записываются в ASCII-формате, то для ее создания может использоваться любой текстовый редактор.
Страница на которую попадает пользователь, когда вводит www-адрес (или URL) данного сайта, должен называться index.html или welcome.html. Остальные страницы сайта (если они есть) могут иметь произвольные имена (но обязательно без символа «#» и состоящие из латинских букв, иначе могут возникнуть проблемы при их размещении на сервере), а пользователь будет попадать на них по ссылкам с основной страницы.
Содержимое файла Web-страницы заключается в тег <HTML> . . .
</HTML> - это указывает браузеру, что текст представляет собой HTML-документ, содержит в себе теги, которые браузер должен выявить, распознать и правильно интерпретировать. Внутри этого контейнера обычно располагаются только листинги скриптов, если они имеются на данной странице.
Интернет — страница обычно состоит из двух частей: заголовка (HEAD) и тела (BODY). Эта базовая структура в простейшем виде , ее можно наглядно показать.
<HTML> Начало тега HTML – документа
<HEAD> Начало тега заголовка
<TITLE> начало тега строки — названия страницы
… строка названия страницы
</TITLE> конец тега строки — названия страницы
</HEAD> конец тега заголовка
<BODY> начало тега тела страницы
… тело (всё содержимое) страницы
</BODY> конец тега тела страницы
</HTML> конец тега HTML – документа
Таким образом, чтобы превратить имеющийся текст в готовую Web-страницу, достаточно лишь заключить весь этот текст в тег <BODY>, добавить сверху строку-название, заключённую в «двойной» тег <HEAD><TITLE>… </TITLE> <HEAD/>, а потом всё это заключать в общий тег <HTML> … </HTML>, тогда браузер воспринимает такую запись совершенно правильно и выдаёт в своём окне необходимый текст.
Чтобы создать страницу, следует сначала использовать эти теги.
Указанная строка-название будет выводиться в заголовке окна браузера, когда данная страница будет в нём просматриваться, а также (уже после размещения этой страницы в Интернете) в списках, выдаваемых поисковыми серверами, и в списке «Избранное» браузера, если эта страница будет туда помещена. [12]
Здесь же слово «заголовок» обозначает текстовую строку, которая выводится в окне браузера.