Российский государственный университет физической культуры, спорта, молодежи и туризма Кафедра информационных технологий 2011 Технология написания и публикации Интернет-проекта в сети Тема лекции: Вопрос 2. Основы языка разметки гипертекста H T M L Вопрос 1. Всемирная паутина W W W

– дополнительная электронная литература ИНТЕРНЕТ-ПРОЕКТ СТРАНИЦА СТУДЕНТА РГУФКСиТ по специальности ТУРИЗМ Зачетные требования к Интернет-проекту Total Commander 6

Слайд. 4 ЗАЧЕТНЫЕ ТРЕБОВАНИЯ К ИНТЕРНЕТ-ПРОЕКТУ Тема: Страница студента РГУФКСиТ по специальности ТУРИЗМ

Слайд. 5 ЗАЧЕТНЫЕ ТРЕБОВАНИЯ К ИНТЕРНЕТ-ПРОЕКТУ

Слайд. 6 ЗАЧЕТНЫЕ ТРЕБОВАНИЯ К ИНТЕРНЕТ-ПРОЕКТУ

Слайд. 7 ЗАЧЕТНЫЕ ТРЕБОВАНИЯ К ИНТЕРНЕТ-ПРОЕКТУ 4-ая страница (название страницы: КАРТА МАРШРУТА) содержит: 4.1. Графический объект с электронной картой туристического маршрута, состоящей из 4 областей (минимум). Каждая область содержит гиперссылку, открывающую контрольную страницу (1 область открывает файл map1.html с текстом "Карта 1", 2 область открывает файл map2.html с текстом "Карта 2",и т.д.). Содержание контрольных страниц студенты выбирают произвольно; 4.2. гиперссылки на 1, 2, 3, 5 страницы с указанием названия страниц.

Слайд. 2 ИНТЕРНЕТ – СЕТЬ СЕТЕЙ Спутник Оптико- волокно УК Информ. Сервер Клиентские компьютеры, клиентское ПО Клиент 1 Сервер Клиент Microsoft Internet Explorer Netscape Navigator Сервер WWW (World Wide Web) Microsoft Web Server Apachi. Клиент 3 Сервер Клиент 4

Слайд. 3 Адресация в Интернете Цифровой адрес IP-адрес Буквенный адрес Доменное имя abcz.com Сервер доменных имен 2 32 = Ivanov.narod.ru Административные: COM, ORG, NET, MIL Географические: RU, CA, DE, FR,JP

Слайд. 4 Web-сайт Web-страница гипертекст гиперссылка Home Page Универсальный локатор сетевых ресурсов (URL- Uniform Resource Locator) http (hypertext transfer protocol) – протокол передачи гипертекста – имя домена sport – подкаталог ski.htm – файл страницы

Слайд. 5 Вопрос 2. Основы языка разметки гипертекста H T M L 1.HTML (HyperText Markup Language) – язык разметки гипертекста (структура, встроенные команды). HTML страница состоит из: - текста (содержимое документа), - тегов (определяют структуру и внешний вид Web-страницы при отображении в клиентской программе). Web-сайт ГЦОЛИФК Начальный тег Конечный тег Исключения: - вставка графического объекта, - разрыв строки, - горизонтальная линейка, - новый абзац.

Слайд. 6 Структура HTML-страницы My first Web Заголовок Тело Текст 1 Текст 2 Web-сайт ГЦОЛИФК

Слайд. 7

Слайд. 8

Слайд. 9 Наиболее распространенные теги и их атрибуты 1)... - начальный и конечный теги всего HTML- документа. 2)... - начальный и конечный теги заголовка документа. 3)... - начальный и конечный теги названия документа. 4) - служебный тег для поисковых систем (отображают содержимое content). 5) - служебный тег для определения кодировки (Windows и кириллица). 5.1.

Слайд. 10 Наиболее распространенные теги и их атрибуты (продолжение) 6)... - начальный и конечный теги тела HTML-документа. Атрибуты: 6.1. Background="url" – указывается URL фонового изображения Web–страницы. Относительный адрес фона Web-страницы Абсолютный адрес фона Web-страницы Атрибуты: 6.2. BgColor=цвет" – указывается URL фона Web–страницы. Цвет фона Web-страницы По названию цвета: Шестиразрядный шестнадцатеричный код:

Слайд. 11 Шестиразрядный шестнадцатеричный код Red Интенс. – 1 байт , 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F Green Интенс. – 1 байт Blue FF0 0 FFFF00 (желтый), FF00FF (малиновый), 00FFFF (бирюзовый), FFFFFF (белый), (черный) (серый)

Слайд. 12 Определение цвета в граф.редакторе Adobe Photoshop Панель инструментов Цвет переднего плана

Слайд. 13 Наиболее распространенные теги и их атрибуты (продолжение) гиперссылка. Атрибуты: 7.1. href="url" – указывается URL-адрес целевого документа гиперссылки. Относительная гиперссылка Фотоальбом Абсолютная гиперссылка ГЦОЛИФК Написать письмо установка размера, цвета или гарнитуры заключенного в теги текста Атрибуты: 8.1. Со L оr="цвет" – установка цвета заключенного в теги текста. Face= "список" – установка гарнитуры заключенного в теги текста. Size= "значение" – размер шрифта устанавливается равным заданному абсолютному значению от 1 до ГЦОЛИФК - установка размера, цвета или гарнитуры заключенного в теги текста

Слайд. 14 Наиболее распространенные теги и их атрибуты (продолжение) 9. - новый абзац. Атрибуты: 9.1. Аlign="позиция" – задается способ выравнивания текста в абзаце: left - по левому краю, center - по центру, right - по правому краю, justify - по ширине страницы размещение заключенного в теги текста по центру разрыв текущего текстового потока и возобновление его с начала следующей строки заключенный в теги текст будет отображаться полужирным шрифтом заключенный в теги текст будет смещен вверх (верхний индекс) заключенный в теги текст будет отображаться в курсивном начертании

Слайд. 15 Наиболее распространенные теги и их атрибуты (продолжение) разрыв текущего текстового потока cо вставкой горизонтальной линии Атрибуты: Аlign="позиция" –выравнивание линии: по левому краю (left), центру (center) или правому краю (right); Size="n" –толщина линии, равная целому числу пикселей (минимальная видимая точка на экране) Width="n" –ширина линии, равная целому числу пикселей (например: Width=150) или % от ширины страницы, абзаца (например: Width=90%) бегущая строка текста Атрибуты: Аlign= "позиция" – задается размещение бегущей строки по вертикали относительно текста, в котором она расположена: вверху (top), по середине (middle) или внизу (bottom); Bgсо L оr="цвет" –цвет фона бегущей строки; height="n" –высота (в пикселях) зоны бегущей строки; Width="n" –ширина зоны бегущей строки в пикселях.

Слайд. 16 Наиболее распространенные теги и их атрибуты (продолжение) вставка графического файла. Атрибуты: Src="url"–URL-адрес изображения (обязательный атрибут) Border="n" – указывается толщина в пикселях обрамления изображения Height=n" – задается высота изображения в пикселях; Width="n" – указывается ширина изображения в пикселях вставка таблицы Атрибуты: Background="ur L " –URL фонового изображения таблицы; Bgcolor="цвет" –цвет фона всей таблицы; Border=n –обрамление, образованное линиями толщиной n пикселей Bodercolor="цвет" – задается цвет линий обрамления всей таблицы; Cellpadding=n" – область свободного пространства шириной n пикселей между границами ячейки и ее содержимым; Cellspacing="n" –интервал между ячейками таблицы; Width="n" –ширина таблицы в пикселях или в процентах от ширины абзаца; Height="n" –высота таблицы в пикселях или в процентах от высоты абзаца.

Слайд. 17 Наиболее распространенные теги и их атрибуты (продолжение) вставка таблицы строка ячеек в таблице (только внутри тегов таблицы) Атрибуты: – Аlign="позиция" выравнивание содержимого ячеек в данной строке; Bgcolor="цвет" –цвет фона строки (приоритетно к цвету фона таблицы) ; Valign="позиция" – выравнивание содержимого ячеек в данной строке по вертикали: вверху (top), по центру (center), внизу (bottom); Аlign="позиция" –выравнивание содержимого ячеек в данной строке по горизонтали: left - по левому краю, center - по центру, right - по правому краю, justify - по ширине ячейки.

Слайд. 18 Наиболее распространенные теги и их атрибуты (продолжение) вставка таблицы строка ячеек в таблице (только внутри тегов таблицы) Атрибуты: – Аlign="позиция" выравнивание содержимого ячейки по горизонтали: left - по левому краю, center - по центру, right - по правому краю, justify - по ширине ячейки; данной строке; Valign="позиция" – выравнивание содержимого ячейки по вертикали: вверху (top), по центру (center), внизу (bottom); Bgcolor="цвет" –цвет фона ячейки (приоритетно к цвету фона таблицы) ; Сolspan="n" – объединение n соседних столбцов; Rowspan="n" – объединение n соседних строк Width="n" –ширина ячейки в пикселях или в процентах от ширины таблицы; Height="n" –высота ячейки в пикселях ячейка в таблице (только внутри тегов строки таблицы)

Слайд. 19 Команды меню Содержимое страницы Команды меню Содержимое страницы

Слайд. 19..

Слайд. 20 Меню ОКНО ИНФО ОПРЕДЕЛЕНИЕ ОБЛАСТИ ССЫЛКИ НА КАРТЕ

Тема лекции: КОМПЬЮТЕРНЫЕ СЕТИ. ИНТЕРНЕТ 1. ИСТОРИЯ ИНТЕРНЕТ 2. УПРАВЛЕНИЕ ИНТЕРНЕТ 2. ПРОТОКОЛ ИНТЕРНЕТ TCP / IP 3. ИНФОРМАЦИОННЫЕ СЕРВИСЫ ИНТЕРНЕТА 4. ФОРМАТЫ ГРАФИКИ В СЕТИ

Слайд. 12 Интернет (сеть сетей) Политическая конкуренция Исторические предпосылки Технологическая конкуренция СССР холодная война США 1957 г. Запуск СССР первого искусственного спутника Земли 1958 г. Агенство Перспективных Исследований США (ARPA- Advanced Research Project Agency) 1961 г. Леонард Клейнрок 1969 г. Проект ARPANET (Network) 1962 г. Академик Глушков - ОГАС Л.Клейнрок на празд. 30- ия Интернет

Слайд. 13 Интернет (сеть сетей) A Б

Слайд. 14 Интернет (исторические даты) ARPANET MILNET (military) INTERNET NSFNET (National Science Foundation)

Слайд. 15 Интернет (исторические даты) RELCOM (SU) РосНИИРОС (RU), Координ. Центр

Слайд. 16 Интернет (управление сетью) Совет по архитектуре (IAB- Internet Architecture Board) ОБЩЕСТВО ИНТЕРНЕТ (ISOC- Internet Society) Центр сетевой информации (InterNIC- Internet Network Informational Center) РосНИИРОС- RBNet (Russian Backbone) Координационный центр национального домена

Слайд. 17 Интернет (структура сети) Спутник Оптико- волокно УК Сервер доменных имен (DNS) Информ. Сервер Рабочие станции Домен SPORTEDU

Слайд. 18 Протокол TCP/IP (Transmission Control Protocol / Internet Protocol) TCP- разбивка на пакеты, нумерация, сборка IP- адресация, маршрутизация

Слайд. 19 Общая схема передачи сообщения с Интернете

Слайд. 20 Адресация в Интернете Цифровой адрес IP-адрес Буквенный адрес Доменное имя abcz.com Сервер доменных имен 2 32 = Ivanov.narod.ru Административные: COM, ORG, NET, MIL Географические: RU, CA, DE, FR,JP

Слайд. 21 Способы подключения к Интернету Сеансовое (Dial-Up) постоянное Коммутируемое подключение с помощью программы эмуляции терминала (Telnet|TCP/IP) Коммутируемое подключение по протоколу (SLIP, PPP) Протокол TCP/IP Доступ ко всем информ. службам Web-узел ISDN-канал ( (цифров.сеть интегрированных служб [128 Кбит/с]) xDSL (цифров. Абонентская линия более 8 Мбит/с) Радио канал ( 3 G, 4 G 1 Гбит/с) Оптико-волокно (свыше 1 Гбит/с). комбинированное (Исход.траф.- модем, вход.трф.- спутник)

Слайд Система передачи сообщений с помощью компьютеров (CBMS) Электронная почта (Electronic mail – ) Internet Серверное ПО (MailMax) Клиентское ПО (Outlook Express) Подсистема хранения сообщений Транспортная подсистема Подсистема каталогов 2. Компоненты 3. Структура сообщения ЗаголовокТело Стандарт MIME (Multipurpose Internet Mail Extensions) 4. Адрес

Слайд г. (Университеты Дьюка и Северной Каролины) Телеконференция Usenet (Uses NetWork – сеть пользователей) Internet Сервер Usenet Клиентское ПО (Outlook Express) Иерархически упорядоченные группы новостей (конференции) Модератор Сисоп 2. Компоненты Usenet3. Стандартные (всемирные) группы новостей Alt Biz Comp News rec 4. Адрес Usenet: fido7.ru.sport.football Sci Soc Relcom Fido7 5. BBS (Bulletin Board System) FIDO Netmail, Echomail шлюз в Интернет

Слайд г. финский студент Ярко Ойкаринен Трансляция разговора в Интернете IRC (Internet Relay Chat) – интерактивная переписка в реальном времени IP-телефония, видеоконференция Internet Сервер IRC Клиентское ПО (mIRC, Internet Explorer) Технология DCC- Direct Client Comunication 2. Компоненты IRC3. IP-телефония Способы передачи данных через Интернет 4. Общая схема IP-телефонии через выделенный канал 5. Сервер IP- телефонии шлюз полнодуплексный разговор

Слайд Технологии: точка точка, точка многоточие Трансляция разговора в Интернете Видеоконференция Internet Видео Сервер Adobe Acrobat Connect Pro Клиентское ПО (IE, ICQ, MS NetMeetting) 2. Компоненты видеоконференции 3. Аппаратно- программные требования Пропускная способность канала связи – более 1,5 Мбит/с Аппаратные и программные КОДЕКИ

Слайд. 9 Передача файлов в Интернете FTP (File Transfer Protocol) Internet Сервер FTP Клиентское ПО (FTP- Explorer, Internet Explorer) АнонимныйНеанонимный Копировать файл с сервера (Download) Копировать файл с сервера (Download) Записывать на сервер (Upload) Файлы на сервере FTP Коммер- ческие Условно бесплатно распростра- няемые (Sharewera) Бесплатные (Freewera) ftp://ftp.abcz.com

Слайд. 10 Всемирная паутина WWW (World Wide Web) Internet Сервер WWW Клиентское ПО (Internet Explorer, Netscape Navigator) 1 abcz.az.ru Home Page Универсальный локатор сетевых ресурсов (URL- Uniform Resource Locator) Web-страница Web-сайт гиперссылка Центр ИР

Слайд. 11 Универсальный локатор сетевых ресурсов (URL- Uniform Resource Locator) http (Hyper Text Transfer Protocol) – протокол передачи гипертекста по сети abc.az.ru:8081– доменное имя комп., где записан ресурс номер порта (прикладная коммуник. программа) /sport/ski.htm– подкаталог и файл ресурса

Слайд. 12 Информационно-поисковые системы Поиск по ключевым словам, фразам Поиск по категориям– спорт летние виды спорта легкая атлетика Поиск файлов (Archie) Сканирование индексирование классификация текущее обслуживание Gopher

Слайд. 13 Поиск по ключевым словам, фразам Мягкий запрос Жесткий запрос Литеральный поиск Последовательность слов в кавычках Логические операторы: AND, OR, NOT Тренировка в соревновательный период (Рамблер ) Тренировка в соревновательный период (Рамблер - 1)

Слайд. 2 Классификация компьютерных сетей (управленческий признак) Одноранговые Peer-to-Peer Network Клиент- Серверные Dedicated Server Network Равноправные к-ры Администрирование Стандартное ПО Падение производительности Пароли для все комп. Резервное копирование каждого ресурса Быстродействующий компьютер Распределенная обработка данных Защита данных Администратор сети Виды серверов: Файловый сервер сервер печати коммуникационный сервер сервер приложений сервер баз данных ИНФОРМАЦИОННО-ВЫЧИСЛИТЕЛЬНАЯ СЕТЬ

Слайд. 3 Классификация компьютерных сетей (покрываемая территория) Локальные LAN Local Area Network 2-3 км Региональные MAN Metropolitan Area Network Корпоративные (Microsoft) Глобальные WAN Wide Area Network Internet RB.Net (Russian Backbone) EURO.Net

Иерархия компьютерных сетей Региональная сеть 1 Глобальная сеть Глобальная сеть Региональная сеть 2 ЛВС 1.1.ЛВС 1.2. ЛВС 2.1. ЛВС 2.2. ЛВС 2.3. Microsoft USA RU Слайд. 4

Слайд. 5 Классификация компьютерных сетей (по скорости передачи данных) Низко- скоростные до 10 Мбит/с Средне- скоростные до 100 Мбит/с Высоко- скоростные СВЫШЕ 100 Мбит/с Трафик, полоса пропускания

Классификация компьютерных сетей (по типу среды передачи данных) Проводные Беспроводные Коаксиальный кабель 10 Мбит/c -Витая пара 100 Мб/c - Оптоволокно 1 Гбит/с -Радиоканал (WiFi) / Мбит/с / 20 км (Bluetooth) / 1 Мбит/с/ м. - Инфракрасный канал IrDA /10Мбит/с

Слайд Шина (Bus) Классификация компьютерных сетей (топологический признак) 2. Кольцо (Ring) 3. Звезда (Star) 4. Ячейка (Mesh) 5. Комбинированная топология

Слайд. 8 Топология Шина Заглушки Низкая надежность 10 к-ов. Коаксиал. кабель 10 Мбит/с.

Слайд. 9 Топология Кольцо Маркер Сложность настройки в больших сетях

Слайд. 10 Топология Звезда Концентратор Масштабируемость Коллизия

Слайд. 11 Топология Ячейка Попарное соединение Устойчивость к сбоям

Слайд 14 Форматы графики в Интернете Растровая Матрица, пиксель (Pixel) Векторная Математическое описание объектов BMP – BitMap (RLE – Run Length Encoding) GIF – Grapfic Interchange Format (LZW Lempel Ziv Welch ) JPEG – Joint Photographic Expert Group TIFF – Target Image File Format WMF – Windows Meta File SWF - Small Web Format