Веб-страницы
<<  Web-страницы Создание персональной страницы  >>
Создание web-страниц
Создание web-страниц
Средство графического представления информации
Средство графического представления информации
Интерактивная мультимедийная гипертекстовая среда
Интерактивная мультимедийная гипертекстовая среда
Гипертекст
Гипертекст
Протокол Интернета
Протокол Интернета
Клиент-сервер
Клиент-сервер
Основные web - браузеры
Основные web - браузеры
Создание web-сайта
Создание web-сайта
Логическая структура сайта
Логическая структура сайта
Иерархическая структура сайта
Иерархическая структура сайта
Линейная структура сайта
Линейная структура сайта
Организация сайта в виде паутины
Организация сайта в виде паутины
HTML-документ
HTML-документ
Физическая структура сайта
Физическая структура сайта
Элементы web-страницы
Элементы web-страницы
Заголовок
Заголовок
Текст
Текст
Соотношение цветов текста и фона
Соотношение цветов текста и фона
Графика
Графика
Элементы web-страниц
Элементы web-страниц
Альтернативный текст
Альтернативный текст
Фоновое изображение
Фоновое изображение
Гиперссылки
Гиперссылки
Указатель ссылки
Указатель ссылки
Графическое изображение
Графическое изображение
Адресная часть ссылки
Адресная часть ссылки
Ссылка указывает на страницу внешнего сайта
Ссылка указывает на страницу внешнего сайта
Адресная часть
Адресная часть
Относительный адрес
Относительный адрес
Ресурс Интернет
Ресурс Интернет
Таблицы
Таблицы
Фреймы
Фреймы
Название сайта
Название сайта
Установочный файл
Установочный файл
Форматирование фреймов
Форматирование фреймов
Ссылка
Ссылка
Проблемы использования фреймов
Проблемы использования фреймов
Средства создания web-страниц
Средства создания web-страниц
HTML-документ можно редактировать любым средством создания
HTML-документ можно редактировать любым средством создания
Редакторы визуального проектирования
Редакторы визуального проектирования
Форматирование текста
Форматирование текста
Вставка объектов мультимедиа
Вставка объектов мультимедиа
Фоновый звук
Фоновый звук
Проверка гиперссылок
Проверка гиперссылок
Методы реализации динамических страниц
Методы реализации динамических страниц
Personal Home Page
Personal Home Page
Скрипт
Скрипт
Программа для создания интерактивной анимации
Программа для создания интерактивной анимации
Расширение стандарта
Расширение стандарта
Формы
Формы
Программа, обрабатывающая данные
Программа, обрабатывающая данные
Обработка данных из формы
Обработка данных из формы
Создание динамических страниц
Создание динамических страниц
Этапы создания web-сайта
Этапы создания web-сайта
Удобство пользователя
Удобство пользователя
Литература
Литература
Презентация «Создание веб-страниц». Размер 302 КБ. Автор: Андрей.

Создание веб-страниц

содержание презентации «Создание веб-страниц.pps»
СлайдТекст
1 Создание web-страниц

Создание web-страниц

Создание Web-страниц. Н.Г.Гончарик Кафедра информатизации профессионального образования РИПО.

2 Средство графического представления информации

Средство графического представления информации

Основные понятия. World Wide Web – средство графического представления информации в Интернете Web-страница – гипермедийный HTML-документ HTML (Hyper Text Markup Language) – язык гипертекстовой разметки Web-сайт – группа Web-страниц, связанных единой темой, схемой оформления и гипертекстовыми ссылками Браузер – программа, предназначенная для просмотра Web-страниц.

3 Интерактивная мультимедийная гипертекстовая среда

Интерактивная мультимедийная гипертекстовая среда

World Wide Web. Интерактивная мультимедийная гипертекстовая среда, использующая язык разметки и поддерживающая множество протоколов Интернета (текст, графика, видеоклипы, звук).

4 Гипертекст

Гипертекст

Гипертекст -. Означает, что определенная часть выделенной информации ссылается на другие фрагменты информации.

5 Протокол Интернета

Протокол Интернета

Протокол Интернета - HTTP. способ связи, с помощью которого страницы с информацией отправляются и принимаются в Интернет Hyper Text Transfer Protocol.

6 Клиент-сервер

Клиент-сервер

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

7 Основные web - браузеры

Основные web - браузеры

Основные Web - браузеры. Netscape communicator (фирма netscape) internet explorer (фирма microsoft).

8 Создание web-сайта

Создание web-сайта

Создание Web-сайта. Цель создания сайта Задачи, решаемые посредством сайта Потенциальная аудитория Информация на сайте.

9 Логическая структура сайта

Логическая структура сайта

Логическая структура сайта. Разбиение материла на логические разделы с заранее спроектированными гиперсвязями Домашняя (стартовая) страница содержит ссылки на все (или основные) разделы сайта, анонсы их содержимого и т.д. Заглавная страница – не содержит содержательной информации и элементов навигации. Содержит логотип, выбор кодировки, языка, счетчик посещений и т.д.

10 Иерархическая структура сайта

Иерархическая структура сайта

Иерархическая структура сайта.

11 Линейная структура сайта

Линейная структура сайта

Линейная структура сайта. Страница 1. Страница 2. Страница 3. …

12 Организация сайта в виде паутины

Организация сайта в виде паутины

Организация сайта в виде паутины.

13 HTML-документ

HTML-документ

Web-страница с точки зрения файловой структуры. Web-страница – это HTML-документ + Файлы мультимедиа + Активные компоненты.

14 Физическая структура сайта

Физическая структура сайта

Физическая структура сайта. Алгоритм размещения файлов по подкаталогам папки сайта. Только строчные латинские буквы в именах файлов и папок.

15 Элементы web-страницы

Элементы web-страницы

Элементы Web-страницы. Заголовок. Текст, отображающийся в строке заголовка браузера при просмотре страницы Первым появляется при загрузке Служит закладкой на страницу Имеет больший вес при индексации.

16 Заголовок

Заголовок

Элементы Web-страницы. Заголовок.

17 Текст

Текст

Элементы Web-страницы. Текст. Форматирование: Гарнитура Способ начертания Цвет Размер Интервал Поля Цвет фона …

18 Соотношение цветов текста и фона

Соотношение цветов текста и фона

Соотношение цветов текста и фона. Необходимо указывать цвет и фона, и шрифта Или не указывать ни цвет фона, ни цвет шрифта. Ваш браузер. Браузер посетителя.

19 Графика

Графика

Элементы Web-страницы. Графика. В HTML-документе присутствует лишь адрес файла с графическим изображением D:\мои рисунки\ris.gif D:\site\image\ris.gif ..\..\image\ris.gif.

20 Элементы web-страниц

Элементы web-страниц

Элементы Web-страниц. Графика. Размер изображения: в пикселях или процентах от ширины окна.

21 Альтернативный текст

Альтернативный текст

Элементы Web-страниц. Графика. Альтернативный текст отображается в режиме отключения графики или неграфическими браузерами.

22 Фоновое изображение

Фоновое изображение

Элементы Web-страниц. Графика. Фоновое изображение. Браузер отображает графику. Браузер не отображает графику, фоновый цвет страницы не задан. Браузер не отображает графику, фоновый цвет страницы задан.

23 Гиперссылки

Гиперссылки

Элементы Web-страницы. Гиперссылки. Гиперссылка устанавливает связи между Web-страницами Элементы гиперссылки: Указатель ссылки Адресная часть.

24 Указатель ссылки

Указатель ссылки

Элементы Web-страницы. Гиперссылки. Указатель ссылки: Фрагмент текста Подчеркнутый Выделенный цветом непросмотренная ссылка просмотренная ссылка.

25 Графическое изображение

Графическое изображение

Элементы Web-страницы. Гиперссылки. Указатель ссылки: Графическое изображение Кнопка Изображение-карта.

26 Адресная часть ссылки

Адресная часть ссылки

Элементы Web-страницы. Гиперссылки. Адресная часть ссылки Ссылка указывает на страницу того же сайта. Относительный адрес a.htm ..\eng\b.htm.

27 Ссылка указывает на страницу внешнего сайта

Ссылка указывает на страницу внешнего сайта

Элементы Web-страницы. Гиперссылки. Адресная часть ссылки Ссылка указывает на страницу внешнего сайта Полный URL http://www.nihe.niks.by ссылка внешнего ресурса.

28 Адресная часть

Адресная часть

Элементы Web-страницы. Гиперссылки. Адресная часть ссылки Ссылка указывает на определенную область страницы в нужном месте документа назначения создается закладка с неким именем в исходном документе создается ссылка Относительный или полный адрес + имя закладки c.htm#end.

29 Относительный адрес

Относительный адрес

Элементы Web-страницы. Гиперссылки. Адресная часть ссылки Ссылка указывает на документ другого типа. Относительный адрес: ..\..\other\abc.zip Для просмотра файла на компьютере посетителя должна быть установлена соответствующая программа.

30 Ресурс Интернет

Ресурс Интернет

Элементы Web-страницы. Гиперссылки. Адресная часть ссылки Ссылка указывает на другой ресурс Интернет Ссылка на адрес электронной почты mailto:me@nihe.niks.by Ссылка на группу новостей: news:news.newusers.com.

31 Таблицы

Таблицы

Элементы Web-страницы. Таблицы. Метод представления данных Средство компоновки страницы.

32 Фреймы

Фреймы

Элементы Web-страницы. Фреймы. Фрейм – область окна браузера, в которой осуществляется просмотр отдельного HTML-документа.

33 Название сайта

Название сайта

Элементы Web-страницы. Фреймы. Название сайта. Выбранный документ.

34 Установочный файл

Установочный файл

Элементы Web-страницы. Фреймы. Установочный файл фреймов – отдельный документ HTML, задающий способ раскладки фреймов, их форматирование и текст для браузеров, не поддерживающих фреймы.

35 Форматирование фреймов

Форматирование фреймов

Элементы Web-страницы. Фреймы. Форматирование фреймов: Граница изменение цвета изменение месторасположения при помощи мыши отображение границы Отображение полосы прокрутки у фрейма.

36 Ссылка

Ссылка

Элементы Web-страницы. Фреймы. Ссылка 5.

37 Проблемы использования фреймов

Проблемы использования фреймов

Элементы Web-страницы. Фреймы. Проблемы использования фреймов: «Висячая» полоса прокрутки В адресной строке браузера отображается URL установочного файла фреймов Не отображаются неграфическими браузерами Некорректно индексируются некоторыми поисковыми системами.

38 Средства создания web-страниц

Средства создания web-страниц

Средства создания Web-страниц. Простейшие текстовые редакторы – Блокнот, Far Editor, Norton Editor Специализированные HTML-редакторы – Homesite, Hotdog Professional, Coffee Cup HTML Editor ++ Редакторы визуального проектирования WYSIWYG – MS Word, MS Front Page, Macromedia Dreamweaver.

39 HTML-документ можно редактировать любым средством создания

HTML-документ можно редактировать любым средством создания

Средства создания Web-страниц. Любой HTML-документ можно редактировать любым средством создания Web-страниц.

40 Редакторы визуального проектирования

Редакторы визуального проектирования

Редакторы визуального проектирования. Создание сайта с использованием шаблона: создание логической и физической структуры Создание отдельной страницы с фреймами или без них (с использованием шаблона).

41 Форматирование текста

Форматирование текста

Редакторы визуального проектирования. Форматирование текста Списки Горизонтальные линии Таблицы.

42 Вставка объектов мультимедиа

Вставка объектов мультимедиа

Редакторы визуального проектирования. Вставка объектов мультимедиа Выбор папки для размещения графического файла При указании на файл указывается относительный путь.

43 Фоновый звук

Фоновый звук

Редакторы визуального проектирования. Гиперссылки и закладки Фоновый звук Фреймы.

44 Проверка гиперссылок

Проверка гиперссылок

Редакторы визуального проектирования. Проверка гиперссылок Автоматическое обновление ссылок при переименовании или перемещении документа Публикация сайта.

45 Методы реализации динамических страниц

Методы реализации динамических страниц

Методы реализации динамических страниц. Javascript – модули интегрируются в файл HTML как подпрограмма java – модули существуют как самостоятельные приложения (апплеты .Class) создание бегущих строк, часов, анимации, чатов, передача изображений с web-камеры.

46 Personal Home Page

Personal Home Page

Методы реализации динамических страниц. PHP (Personal Home Page)-сценарии вставляются в тот участок документа, где необходимо разместить интерактивный элемент Позволяет организовать счетчик посещений, статистику обращений к разделам сайта, защищать доступы к файлам паролями Поддерживается не всеми серверами.

47 Скрипт

Скрипт

Методы реализации динамических страниц. ASP (Active Server Page) - скрипт исполняется на сервере, пользователю отсылается готовый HTML-документ с результатами работы ASP Программное обеспечение пользователя не имеет значения.

48 Программа для создания интерактивной анимации

Программа для создания интерактивной анимации

Методы реализации динамических страниц. Flash – программа для создания интерактивной анимации Разрабатывается с использованием приложения Macromedia Flash На компьютере пользователя инсталлируется надстройка к браузеру Macromedia Flash Player.

49 Расширение стандарта

Расширение стандарта

Методы реализации динамических страниц. DHTML – расширение стандарта HTML Использование сценариев («скриплетов»), обрабатываемых браузером совместно с кодом HTML Позволяет создать движущиеся объекты, выпадающие меню, подсвечивающиеся кнопки …

50 Формы

Формы

Формы. Посетитель заполняет форму и отправляет серверу Программа на сервере обрабатывает полученные данные Программа на сервере генерирует и отсылает посетителю новую страницу.

51 Программа, обрабатывающая данные

Программа, обрабатывающая данные

Формы. Cgi-сценарий – программа, обрабатывающая данные из формы PERL (practical extraction and report language) – язык написания cgi-сценариев.

52 Обработка данных из формы

Обработка данных из формы

Формы. Обработка данных из формы: Запись в указанный файл Отправка по электронной почте Сохранение в базе данных Передача другой программе Определение внешнего вида генерируемой страницы.

53 Создание динамических страниц

Создание динамических страниц

Создание динамических страниц средствами MS FrontPage 2000. Счетчик посещений Рекламный баннер Временный рисунок Бегущая строка Анимационный эффект при переходе к другой странице Полиморфная кнопка Формы.

54 Этапы создания web-сайта

Этапы создания web-сайта

Этапы создания Web-сайта. Выбор темы и информационного наполнения Проектирование логической структуры Проектирование физической структуры Создание отдельных страниц и установка связей между ними Тестирование Публикация.

55 Удобство пользователя

Удобство пользователя

Удобство пользователя. Учет аппаратных средств пользователя Учет программных средств пользователя Минимальный объем Корректный дизайнерский стиль.

56 Литература

Литература

Литература. Веб-дизайн: книга Дмитрия Кирсанова – Спб.: Символ-плюс, 2001 Веб-дизайн: книга Якоба Нильсена – Спб.Ж Символ-плюс, 2001 Холмогоров В. Основы Web-мастерства – Спб.: Питер, 2001 Дж. Вайскопф. Microsoft FrontPage 2000: учебный курс – Спб.: Питер, 2000 Исагулиев Г. Macromedia Dreamweaver 4 – Спб.: БХВ-Санкт-Петербург, 2001.

«Создание веб-страниц»
Сайт

5informatika.net

115 тем
5informatika.net > Веб-страницы > Создание веб-страниц.pps