- •Часть 1.
- •Глава 1. Основные подходы к разработке Web-приложений: языки, модели и технологии 6
- •Глава 2. Основы html – языка гипертекстовой разметки 43
- •Глава 3. Основы использования css – каскадных таблиц стилей 147
- •Введение
- •Глава 1.Основные подходы к разработке Web-приложений: языки, модели и технологии
- •1.1. Эволюция языков создания (разметки) страницы Web
- •1.2. Разработка Web приложений
- •1.2.1. Системы обработки информации: интранет, интернет и экстранет.
- •1.2.2. Что означает термин «системы на основе Web»
- •1.2.3.Концепция клиент/серверной архитектуры
- •1.2.4. Обобщенная модель взаимодействия клиент-сервер
- •1.2.5. Трехслойная модель клиент/серверная архитектура для Web приложений и задачи его разработки
- •1.2.6. Модели реализации функций Web приложений
- •1.2.6.1. Модель доставки информации
- •1.2.6.2. Модель обработки информации
- •1.2.7. Присваивание функций обработки информации компонентам трёхзвенной системы Web
- •1.3. Реализация принципов функционирования Web-технологий
- •1.3.1. Некоторые детали сетевого взаимодействия
- •Подробнее о сетевых протоколах
- •Краткий список номеров портов для разных протоколов передачи информации
- •Подробнее о протоколе tcp
- •Подробнее о протоколе udp
- •1.3.2. Типы данных и их обработка Web сервере
- •1.3.2.1. Обработка статических данных
- •1.3.2.4.Обработка динамических данных
- •1.3.3. О некоторых других Web технологиях
- •1.3.4. Заключение. О навыках разработки серьёзных Web-- приложений
- •1.4. Контрольные вопросы к главе 1
- •Глава 2.Основы html – языка гипертекстовой разметки
- •2.1 Введение в html.
- •2.1.1 История развития html
- •2.1.2. Основные положения гипертекстовой разметки
- •2.2 Структура html – документа и используемые для этого тэги
- •2.2.1. Назначение раздела 1- дать информацию о версии html
- •2.2.2.1.Заголовочная часть html – документа
- •Элемент разметки title
- •Элемент разметки base
- •Элемент разметки meta
- •Элемент разметки link
- •Элемент разметки style
- •Элемент разметки script
- •2.2.2.2. Тело html документа: структурные элементы и описывающие их тэги
- •Заголовки в тексте
- •Абзацы (параграфы)
- •Рисунки
- •Гиперссылки
- •Html формы
- •Пользовательские элементы структуры.
- •2.3. Разметка, обеспечивающая форматирование html – документа
- •2.3.1. Понятие форматирования
- •2.3.2. Форматирование страницы и текста
- •2.3.2.1. Цвет фона страницы (атрибут bgcolor)
- •Принятые в html формальные обозначения некоторых цветов.
- •2.3.2.2. Использование в качестве фона страницы изображения (атрибут bаскground)
- •2.3.3.6. Многоуровневые списки
- •2.3.4. Форматирование произвольного фрагмента текста.
- •2.4. Форматирование гипертекстовых ссылок и закладок
- •2.4.1. Гиперссылки
- •2.4.2. Закладки
- •2.5.2. Создание простейших html-таблиц
- •2.5.3. Форматирование таблиц
- •2.5.3.1. Расположение заголовка таблицы
- •2.5.3.2. Рамка таблицы. Атрибуты border и bordercolor
- •2.5.3.3 Цвет фона таблицы и фоновый рисунок. Атрибуты bgcolor и background
- •2.5.3.4 Расстояние между ячейками. Атрибут cellspacing
- •2.5.3.5. Отступ между рамкой таблицы и содержимым ячейки. Атрибут cellpadding
- •2.5.3.6. Ширина и высота таблицы. Атрибуты width и height
- •2.5.3.7. Горизонтальное выравнивание таблицы. Атрибут align
- •2.5.3.8. Объединение ячеек. Атрибуты collspan и rowspan
- •2.5.3.9. Форматирование данных внутри таблицы
- •2.6. Графика в html.
- •2.6.1. Общие соображения.
- •2.6.2. Способы хранения изображений.
- •2.6.4.1. Выравнивание изображений (атрибут align).
- •2.6.4.2. Задание размеров выводимого изображения (атрибуты width и heigth).
- •2.6.4.3. Отделение изображений от текста (атрибуты hspace и vspace).
- •2.6.4.4. Рамки вокруг изображений (атрибут border).
- •2.6.4.5. Альтернативный текст (атрибут alt).
- •2.6.5. Гиперкарты – важный элемент гипертекста
- •2.6.5.1. Использование гиперкарт
- •2.6.5.2. Терминология, связанная с гиперкартами
- •2.6.5.3. Преимущества и недостатки гиперкарт
- •2.6.5.4. Графическое представление гиперкарты
- •2.6.5.5. Описание конфигурации карты-изображения
- •Элемент разметки гиперкарт
- •Атрибут shape
- •Атрибут coords
- •Атрибуты href и nohref
- •Атрибут target
- •Атрибут alt
- •2.6.5.6. Алгоритм создания гиперкарт
- •2.6.5.7. Средства создания гиперкарт
- •2.7. Формы в html
- •2.7.1. Основы создания форм.
- •2.7.1.1. Атрибут action
- •2.7.1.2. Атрибут method
- •Метод get
- •2.7.2.2. Поле для пароля
- •2.7.2.3. Многострочный текст
- •2.7.2.4. Поле со списком
- •Группировка элементов списка
- •2.7.2.5. Переключатели
- •2.7.2.6. Флажки
- •2.7.2.7. Скрытое поле
- •Атрибуты скрытого поля
- •2.7.2.8. Кнопки
- •Кнопка submit
- •Кнопка reset
- •Кнопка с изображением
- •Параметры поля с изображением
- •2.7.2.9. Поле отправки файла
- •2.7.2.10. Группировка элементов формы.
- •2.7.2.11. Переход между полями с помощью табуляции
- •2.7.2.12. Ограничение доступа к элементам формы.
- •2.8. Фреймы
- •2.8.1. Сфера применения фреймов
- •2.8.2. Создание Web-страниц с фреймами
- •Глава 3.Основы использования css – каскадных таблиц стилей
- •3.1. Понятие css
- •3.2. Подключение css
- •3.2.1. Таблица связанных стилей
- •3.2.2. Таблица глобальных стилей
- •3.2.3. Внутренние стили
- •3.3. Базовый синтаксис
- •3.4. Селекторы тегов
- •3.5. Классы
- •3.6. Идентификаторы
- •3.7. Правила создания стиля
- •3.8. Основы css-верстки. Создание «резинового» шаблона.
- •3.8.1. Создание макета из одной колонки
- •3.8.2. Макет из двух колонок
- •3.8.3. Макет из трех колонок
- •Задания для самостоятельной работы. Задание 1.
- •Сергей Алексеев
- •1971-1975 Институт легкой промышленности Москва
- •Задание 2.
- •Задание 3.
- •Задание 4.
- •Задание 5.
- •Задание 6.
- •Задание 7
1.2.6.2. Модель обработки информации
Чтобы преодолеть статическое, пассивное использование Web, возникает необходимость рассматривать Web не просто как систему доставки информации, но как полнофункциональную систему обработки информации
Основные функции обработки информации отображены на Рис. 1 -4.
Ввод
Обработка
Вывод
Хранение
Рис. 1‑4. Основные функции обработки информации
В системе Web четыре базовые функции ввода, обработки, вывода и хранения имеют специфические значения:
Функция ввода позволяет пользователям взаимодействовать с системой, запрашивая параметры обработки, управляя информационным доступом и определяя методы доставки. Кроме того, пользователь может стать источником данных, которые обрабатывает система и которые она поддерживает в своих репозиториях11 хранимой информации.
Функция обработки относится к деятельности по манипуляции данными и логике обработки, необходимых для выполнения работы системы. Этот термин предполагает, что система может "программироваться" для выполнения арифметических и логических операций, необходимых для манипуляции данными ввода и для создания выводимой информации.
Функция вывода доставляет результаты обработки пользователю в правильном, своевременном и соответствующим образом форматированном виде.
Функция хранения гарантирует продолжительность существования и целостность обрабатываемой информации, поддерживая ее в течение длительного периода времени и позволяя добавлять, изменять или удалять систематическим образом. В конечном счете, хранимая информация становится основным контентом страниц Web, отражая самую современную и точную информацию, появляющуюся на этих страницах.
С точки зрения обработки информации сама сеть Web функционирует как гигантская открытая компьютерная система, и фактически такой и является. Деятельность по обработке информации происходит на различных аппаратных и программных компонентах, расположенных в одном месте или разбросанных по всему миру.
На сайтах, реализующих полную модель обработки информации, информационное содержание имеет следующие характеристики:
всегда актуально, поскольку пользователь может взаимодействовать со страницей Web, добавляя или изменяя информацию в системе,
персонализировано в соответствии с потребностями пользователя,
автоматически изменяется в ответ на запросы пользователя, и когда изменяется сама информация.
1.2.7. Присваивание функций обработки информации компонентам трёхзвенной системы Web
Вернёмся снова к понятию трехслойной, клиент/серверной системы, и посмотрим, как аппаратные компоненты, программные компоненты, и функции обработки связаны друг с другом с точки зрения обработки информации. Для этого придётся соединить два рисунка: Рис. 1 -3. Аппаратные и программные слои трехслойной системы обработки информации и Рис. 1 -4. В результате получим Рис. 1 -5.
Рис. 1‑5. Функции системы обработки информации, отображенные в трехслойную систему клиент/сервер
Все функции ввода и вывода в основном выполняются на клиентской машине Web. Такая деятельность интерфейса пользователя, как ввод данных, проверка данных, управление обработкой и форматирование вывода, выполняются на клиенте Web.
Основная деятельность по обработке информации падает на сервер Web, называемый иногда сервером приложений Web. Здесь программируются арифметические и логические процедуры для выполнения задач системы по бизнес обработке.
Наконец, хранение данных и функции доступа выполняются на сервере базы данных. Этот компонент управляет хранением информации и функциями извлечения, необходимыми для выполнения бизнес - обработки, и позволяет осуществлять долгосрочное обслуживание хранимой информации посредством добавления, изменения и удаления файлов и баз данных.
Основная идея подобного разделения функций заключается в том, что специализированные компоненты выполняют специализированную работу, для которой они лучше всего подходят.
Справедливо также то, что системные функции «не привязаны к месту». То есть деятельность ввода, обработки, вывода и хранения могут происходить там, где расположены компоненты. Они могут быть:
заключены в одной машине на одном рабочем столе,
распределены между двумя или несколькими машинами в отделе или компании либо
широко разбросаны по всему земному шару.
Во всех этих случаях используемые технологии и методы являются практически одинаковыми, делая достаточно рутинной (простой, однотипной) разработку приложений Web для любой физической или географической среды, с которой столкнется разработчик.
