Технологии создания Web-документов. Введение 1991 – год рождения WWW (World Wide Web - Всемирная паутина). Тим Бернерс-Ли, сотрудник CERN (Швейцария) - презентация

1 Технологии создания Web-документов

2 Введение 1991 – год рождения WWW (World Wide Web - Всемирная паутина). Тим Бернерс-Ли, сотрудник CERN (Швейцария) разрабатывает язык гипертекстовой разметки документов – HTML. Пол Линднер из Миннесотского университета создает систему Gopher.

3 Введение Мир WWW (World Wide Web - Всемирная паутина) состоит из компьютеров - Web- серверов, которые не только хранят мультимедийную информацию, такую как видео, аудио, картинки и фотографии, но и предоставляют пользователям Internet простые средства подсоединения и доступа к этой информации.

4 Введение Web-технологии – технологии мультимедиа и гипертекста, которые делают WWW уникальным средством поиска, выбора и тиражирования информации.

5 Что такое Web-документ? Мультимедийный документ, состоящий из фрагментов текста, звуковых, графических и видеоданных; Гипертекстовый документ, имеющий в своем составе ссылки на другие документы (гиперссылки).

6 Что такое Web-документ? текстовый документ в системе кодов ASCII или Unicode, содержащий специальные символы (управляющие элементы), которые называются тегами и описывают как следует отображать документ на экране компьютера и какие элементы документа являются ссылками на другие документы.

7 Что такое Web-документ? Гипертекстовые документы Всемирной паутины называются веб-страницами (Web page). Множество логически связанных страниц, хранящихся в одном месте, называется веб-узлом, или веб- сайтом (Website).

8 Программные средства, с помощью которых осуществляется доступ к Web-документам, подразделяются на две категории: программы, выполняющие функции клиента; программы, выполняющие функции сервера. Программные средства

9 Программы-клиенты хранятся на компьютере пользователя. По требованию пользователя обращаются к программе-серверу, достают информацию и отображают ее на экране монитора. Такие программы называются браузерами или веб-браузерами (Web browser) Программные средства

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

11 MS Internet Explorer Netscape Navigator Opera И др. Популярные Web-браузеры

12 Как создаются Web-документы? Традиционный подход («ручной»); Применение офисных программных средств (MS Office); Применение специализированных Web-редакторов.

13 «Традиционный» подход Преимущества Web-документы создаются в простейшем текстовом редакторе (например, в блокноте); Очень «чистые» документы. Недостатки Необходимо знать HTML; Длительные сроки разработки Web- документов;

14 Применение MS Office Преимущества Web-документы создаются визуальными (экранными) средствами с помощью знакомых и привычных инструментов; нет необходимости изучать HTML. Недостатки документы перенасыщены служебной информацией, что существенно увеличивает информационный объем документа и время вывода документа на экран.

15 Визуальные Web-редакторы Технология WYSIWING (What You See Is What You Get – что видишь, то и получаешь) Macromedia Dreamweaver MS Front Page Adobe GoLive Macromedia Home Site Cool Page Hot Dog и др.

16 Применение специализированных Web-редакторов Преимущества Избавляют от ручного ввода html- тэгов, Web-документы создаются визуальными (экранными) средствами; Возможность «ручного» вмешательства во внутреннюю структуру - зная HTML, можно прибегнуть к традиционному редактированию кода; Получаемые документы достаточно «чисты» - не очень перегружены служебной информацией Недостатки Высокая стоимость программных средств для разработки Web- документов

17 Основы HTML Hyper Text Markup Language -язык разметки гипертекста Создатель – Тим Бернерс-ли

18 Структура Web-документа Название страницы... … ИНФОРМАЦИЯ, ОТОБРАЖАЕМАЯ В ОКНЕ БРАУЗЕРА…. Тело документа Заголовок документа

19 Теги форматирования текста Код html документаВид в браузере Текст перед абзацем. Содержание нового абзаца. Текст перед абзацем. Содержание нового абзаца. Перенос на новую строку в абзаце. Новая строка. - Enter - Shift+Enter

20 Теги форматирования текста Код html документаВид в браузере полужирный курсив подчеркнутый полужирный и курсив

21 Код html документаВид в браузере Перечеркнутый текст. Перечеркнутый текст выводит текст шрифтом большего размера. выводит текст шрифтом меньшего размера. Теги форматирования текста

22 Код html документаВид в браузере Обычный текст подстрочный текст Обычный текст надстрочный текст отмечает текстовый фрагмент как определение для выделения важных фрагментов текста Теги форматирования текста