Скачать презентацию Итнернет в бизнесе Лекция 8 КНТЭУ
4b797e9b8a9e1f5a054c9fc244db725d.ppt
- Количество слайдов: 32
Скачать презентацию Итнернет в бизнесе Лекция 8 КНТЭУ
Скачать презентацию Итнернет в бизнесе Лекция 8 КНТЭУ
Итнернет в бизнесе. Лекция № 8 © КНТЭУ, каф. ИТС, доц. Шклярский С. М. Основы webпроектирования 1. 2. 3. 4. 5. 6. 7. Краткая история Web. Понятие гипертекста. Организация информации в Web документах. Элементы компьютерной графики. Классификация бизнес-сайтов. Основные этапы и принципы web-проектирования. Инструментальные средства web-дизайна. Обзор языка разметки HTML.
1. Краткая история Web. Понятие гипертекста В основе World Wide Web (WWW) лежит понятие гипертекста. Впервые термин предложил Теодор Нельсон на 20 конференции ACM в 1965 г. : … By 'hypertext' mean nonsequential writing - text that branches and allows choice to the reader, best read at an interactive screen. «… под гипертекстом понимается непоследовательная запись текста, когда от разветвляется, что позволяет читателю делать выбор для быстрого интерактивного чтения с экрана)…» Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Принципы гипертекстовой организации информации заложил Ванневар Буш. В 1945 г. он разработал гипотетическую машину Memex, в которой предложил механизм перекресных ссылок для доступа к информации, аналогичный современному гипертексту. В Memex документы хранятся совместно со специальными полями, описывающими некие ассоциативные связи информации. Гипертекст – это форма представления информации, когда совместно с содержательной составляющей в тексте хранятся (а) адреса других частей текста; (б) метки, на которые ссылаются из других частей текста. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Линейный текст 1 2 3 4 5 Гипертекст адреса метки Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
В 1989 году в Европейской лаборатории физики элементарных частиц (CERN, Швейцария, Женева) Тим Бернерс-Ли разработал компьютерную технологию гипертекстовых документов - World Wide Web, позволяющую пользователям иметь доступ к любой информации, находящейся в сети Internet на компьютерах по всему миру. 1 -я web страница: 12 декабря 1991 г. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Первый web сервер запущен в эксплуатацию в 1991 г. в Стенфордском ускорителе элементарных частиц (SLAC) на мэйнфрейме Ne. XT. В феврале 1993 г. программист Национального центра суперкомпьютерных вычислений (NCSA) Марк Андриссен представил полнофункциональную версию броузера для Unix систем под названием Mosaic. Январь 1995 г. – образован консорциум 3 WC (www. w 3 c. org) для координации и стандартизации разработок в области World Wide Web. К 2002 г. насчитывал более 500 организаций-членов по всему миру. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
2. Организация информации в Web документах Web-страница - это текстовый файл в на языке HTML, который броузер получает от сервера и выводит на экран. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Web-документ - это одна или более Web-страниц, связанные единым смысловым содержанием или сценарием просмотра при помощи гиперссылок. Домашняя страница – экран, с которого начинается просмотр Web-документа. Гиперссылка web – это объект Web документа, хранящий адрес URL другого документа или страницы и осуществляющий переход на нее по щелчку мыши или по другому запрограммированному действию пользователя. Внешними называются гиперссылки, которые ссылаются на URL внешнего, по отношению к данному, Web-документа. Внутренние гиперссылки отвечают за переходы между страницами внутри одного web-документа или отдельной страницы. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Типы Web документов: Ø Линейные - в которых просмотр происходит последовательно от одной страницы к следующей. Ø Нелинейные - позволяют осуществлять переходы от страницы к странице при помощи гиперссылок. Элементы Web-страницы: ü Пассивные - это элементы информативного или оформительного характера, к которым пользователь имеет только визуальный доступ (текст, рисунки, таблицы). ü Активные элементы - это те, которые вызывают некоторое действие в ответ на определенные действия пользователя (кнопки, ссылки, меню и т. д. ) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Пассивный Активный Пассивный Основы web-проектирования Активный © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Типы Web-страниц: • Статические - страницы, которые создаются на этапе проектирования Web-документа и не меняют своего содержания длительное время, а изменение содержания производится вручную. Обычно имеют расширение htm или html. Например: index. htm, home. html. • Динамические - это страницы, которые автоматически генерируются Web-сервером в ответ на запрос пользователя. Имеют расширение asp, php и т. д. , в зависимости от используемого средства для ее генерации. Например: stat. asp, news. php. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
3. Элементы компьютерной графики Типы графических файлов: 1. Векторные – это такие файлы, которые хранят в себе алгоритм построения изображения. Хранение векторного изображения: A(100, 150) 100, 150 – 200, 250 – 180, 130 Отображение векторного изображения: выбрать координту А; нарисовать линию до В; нарисовать линию до С; нарисовать линию до А; C(180, 130) B(200, 250) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
2. Растровые – это файлы, в которых изображение хранится как набор пикселей (графических точек). A(100, 150) C(180, 130) Каждая точка изображения представлена числом. B(200, 250) Глубина цвета - характеристика качества растрового изображения – определяется количеством бит, описывающих одну точку изображения (8, 16 или 24). Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Характеристики палитр: • Однобайтовая (8 бит) 2 8 = 256 оттенков • Двухбайтовая (16 бит) 2 16 = 65536 оттенков • Трехбайтовая (24 бита) 2 24 = 16777216 оттенков Сравнительные характеристики типов графических файлов Векторный Растровый Достоинства n Малый объем, n Масштабируемость без потери качества Хорошая цветопередача. Недостатки Плохая передача сложного цвета (полутонов, переходов и т. д. ) Большой объем Область применения Инженерные схемы, графики, анимация. Фотография, сложная графика (полиграфия) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Форматы растровых графических файлов: Из-за своих размеров для Интернет непригодны • BMP - Windows device independent Bitmap Применяется для хранения растровых изображенией в ОС Windows. • TIFF - Tagged Image File Format (теговый формат файлов изображений) Аппаратно независимый формат. Является лучшим форматом для хранения растровых файлов в издательских системах. GIF -Format raphics графического Interchange • (формат обмена) • JPEG - Joint Photographics Group (объединенная группа экспертов в области фотографии • графика) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Размеры файла рисунка в 24 битовой палитре: TIFF - 538 K BMP - 513 K JPG - 29 K GIF - 18 K (8 бит) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Графический формат GIF Разработан в 1987 г. в онлайновой службе Compu. Serve для быстрого обмена изображениями по телефонным линиям. Время передачи уменьшается за счет того, что изображение хранится в сжатом виде. Достоинства: малый размер, возможность отображения на любом компьютере, черезстрочное воспроизведение в броузере, эффект «прозрачности» цветов. Недостаток: 8 -битная палитра (256 цветов) Область применения: несложная графика и анимация, диаграмы и т. п. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Графический формат JPEG Разработан в 1995 г. для передачи и высококачественного воспроизведения сжатых изображений. Достоинства: возможность выбора коэффициента сжатия, использование 24 -битной глубины цвета. Недостаток: отсутствие чрезстрочного воспроизведения и средств анимации. Область применения: качественное фотоархивы в Сети и т. п. Основы web-проектирования Web оформление, © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Графические редакторы: n Простейшие: MS Paintbrush, MS Photo Editor (не требовательны к ресурсам ПК, только растровая графика, ограниченное количество поддерживаемых форматов). n Среднего класса: Addobe Photo Shop, Corel. Draw (работают с векторной графикой, большое количество форматов) n Профессиональные: 3 D Studio Pro(Max), Amaya (требуют мощных графических станций, обработка трехмерной графики и анимации) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
4. Классификация бизнес-сайтов. Web-сайт - это совокупность web-документов, объединенных общей тематикой и ссылками, обеспечивающими возможность перехода с одной страницы на другую. Web-узел – это комплекс аппаратно-программных средств, обеспечивающих функционирование Web-сайта. Имеет по крайней мере один IP-адрес и, как правило, представляет собой локальную вычислительную сеть. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Классификация сайтов Web-сайты Некоммерческие Коммерческие Персональные страницы Сайты некоммерческих организаций Реального бизнеса Сетевого бизнеса Реклама компании Торговля аудиторией Информационная поддержка продукта Информационная площадка Реализация товара Online-сервисы Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Web-сайты для реального бизнеса Сайты реального бизнеса в Интернет. являются продолжением Функции: ü Реклама компании или продукта. Сайт - одно из средств рекламы, символ престижа, обеспечивает возможность установления новых деловых контактов; ü Информационная поддержка продукта. С помощью Интернет обеспечивается предпродажный и послепродажный информационный сервис, прием заявок на обслуживание, консультации специалистов. Реализация товара или услуги через сеть. Интернет обеспечивает рекламу, информационное обслуживание, заказ и оплату товара. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Web-сайты для бизнеса в Интернет Сайты для бизнеса в Интернет не имеют за собой вещественных реальных торговых площадок и производственных мощностей. Функции: ü Торговля (целевой) аудиторией. Сайты, предлагающие бесплатные услуги, привлекают большое количество посетителей. Компании, делающие реальный бизнес, оплачивают рекламу на таких сайтах; ü Информационная площадка. С помощью сайта, субъектам реального рынка предлагается новый качественный уровень информационного взаимодействия. Владелец сайта получает прибыль с операций, совершаемых на сайте или при помощи сайта. (аукционы, платные поисковые системы и подписки) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Характеристика Типы коммерческих сайтов Значение и их характеристики Структура Простая Главная цель рассказ о компании: чем она занимается, как организована, кто является ее партнерами, адрес, телефоны и прочая контактная информация Объем сайта около 5 страниц Дополнительны е возможности размещена карта — схема маршрута, фотографии, памятки и прочие документы. Достоинства быстрота развертывания, низкая стоимость, легкость поддержки Недостатки отсутствует обратная связь с посетителями, не представлены предлагаемые товары или услуги, не подразумевается частое обновление. Источники эффекта Облегчение доступа к контактной первичной информации о фирме. аудиторию потенциальных клиентов Сайт-визитка Основы web-проектирования информации, Увеличивает © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Характеристика Значение Структура Простая Главная цель рассказ о компании: чем она занимается, как организована, кто является ее партнерами, адрес, телефоны и прочая контактная информация. Сведения о товарах/услугах. Объем сайта Около 10 страниц. Обязательны ссылки на необходимые ресурсы и на сайты партнеров Дополнительны е возможности Присутствует адрес и схема проезда, Размещены ссылки Корпоративный сайт на необходимые ресурсы или на сайты партнеров. Присутствует прайс-лист товаров и услуг. Достоинства быстрота развертывания, низкая стоимость, легкость поддержки. Недостатки отсутствует обратная связь с посетителями, подразумевается частое обновление. Источники эффекта Облегчение доступа к контактной информации, первичной информации о фирме и товарах/услугах. Увеличивает аудиторию потенциальных клиентов Основы web-проектирования не © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Характеристика Значение Структура сложная древовидная, глубиной порядка 3 -4 Главная цель своевременное и полное информирование пользователя о товарах и услугах, предоставляемых фирмой. Непосредственная торговля на сайте. Объем сайта более 15 страниц Дополнительны е возможности переход к портальной структуре или интеграция в портал с предоставлением всевозможных сопутствующих услуг. Электронный магазин Возможно предоставление услуг типа бизнес-бизнесу (B 2 B). Достоинства Снижает накладные расходы на персонал, рекламу, арендуемые помещения, телефонно-факсовые услуги. Недостатки требует постоянной обновления. Источники эффекта Снижение накладных деятельности Основы web-проектирования поддержки расходов и оперативного коммерческой © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
5. Основные этапы и принципы web-проектирования Этапы создания сайта 1. Формулирование цели сайта 2. Определение состава потенциальных посетителей 3. Сбор и создание собственных информационных материалов (контент) 4. Оформление этих материалов (web - дизайн) 5. Обеспечение доступа к сайту (регистрация, техническая и информационная поддержка) 6. Рекламирование ресурса Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Основные принципы web-дизайна 1). Единство Шрифты - в пределах сайта должены иметь одинаковые характеристики - такие, как гарнитура (начертание), кегль (высота), цвет. Абзацы - желательно, чтобы преобладал какой-нибудь один из видов выравнивания Цветовая схема web-сайта должна повторяться на всех страничках сайта. При выборе схемы нужно использовать правило 3 -х цветов. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Большой цветовой круг Освальда применяется для образования гармоничных сочетаний из двух, трех, четырех цветовых тонов. Круг естественных цветов по Гете сжк основной треугольник, первичные (основные) цвета фоз - перевернутый треугольник (вторичные цвета) Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Белый, черный и все оттенки серого цветов называются ахроматическими. Все цветные тона называются хроматическими. Хроматические цветовые тона с ахроматическими наиболее гармоничны в следующих сочетаниях: • красный, оранжевый и желтый (теплые) с черным; • голубой, синий, фиолетовый (холодные) с белым. Виды сочетаний хроматических цветов : 1. Контрастные сочетания. Цвета расположены друг против друга (например Ф и Ж). 2. Сочетания цветов, расположенных по углам либо основного, либо перевернутого треугольника. 3. Сочетания цветов, расположенных в круге под углом 90° 4. Ньюансовые (монохромные) сочетания (например, голубой и синий). Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
2). Графическое оформление сайта Ø должно укладываться в общую цветовую схему; Ø нужно не смешивать в оформлении рисованные и фотореалистические элементы; Ø размер графических элементов не должен существенно влиять на скорость загрузки сайта; Ø нужно задавать параметр ALT тэга IMG - это будет восприниматься как подпись к фотографии и, кроме того, избавит пользователя от ожидания в случае, если его не интересует данная страничка. Основы web-проектирования © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
3). Равновесие Оптический центр находится на расстоянии пяти восьмых от нижнего края композиции Равновесие - это расположение элементов слева и справа от оптического центра сверху и снизу. Существют два неформальное. вида Основы web-проектирования равновесия - формальное и © КНТЭУ - 2003, каф. ИТС, доц. Шклярский С. М.
Скачать презентацию Итнернет в бизнесе Лекция 8 КНТЭУ
4b797e9b8a9e1f5a054c9fc244db725d.ppt