Силлабус (памятка) учебной дисциплины «Основы интернет-технологий» Для студентов группы 150100.62 (ФГОСЗ) «Материаловедение и технологии материалов» (МиТМ) (7 семестр) Составил: Доцент каф. ФиТКМ, к.т.н. Головина Елена Анатольевна _______________________________ Утверждаю: Зав. кафедрой: д.т.н., профессор Маркин Виктор Борисович _______________________________ В результате изучения дисциплины обучающиеся должны: знать уметь возможности современных -самостоятельно работать на компьютере информационно-коммуникационных с использованием основного набора технологий на основе программных, прикладных программ и в Интернете информационно-поисковых систем и -использовать различных сервисов баз данных Интернета: новостные службы, карты, - теоретические основы Интернета, сервисы для работы с документами, - основные ресурсы и службы файлообменники, словари и Интернета, переводчики, сервисы рисования, -способы подключения, сетевые электронные платежные системы, технологии, интернет-магазины и др. - работу в наиболее популярных -безопасность работы в глобальной сети; обозревателях, -работать с электронной почтой через веб-интерфейсы и через клиенты - просмотр Web-страниц владеть -методами компьютерной графики. техникой машинного перевода текстов, электронными словарями и текстовыми редакторами. -авыками использования современных информационных технологий и средств телекоммуникации, глобальных информационных ресурсов в научно-исследовательской, расчетноаналитической, проектно-технологической деятельности 1. Содержание дисциплины Тема 1. Основные понятия. (2 часа) [1-7] 1.1. Дизайн в Internet: задачи, подходы, решения. Основные понятия и терминология. 1.2. Этапы разработки WEB-сайта. Уменьшение затрат ресурсов и сроков создания WEB-сайта. Основные формулировки в техническом задании на разработку сайта. 1.3. Возможности современных программ, используемых для создания WEB-страниц. Обзор программ Macromedia DreamWeaver, HomeSite и Microsoft FrontPage. 1.4. Основные возможности программы DreamWeaver. Задание цветового оформления. Выбор цветовой схемы. 1.5. Создание и использование каскадных таблиц стилей CSS. Практическая работа. Создание макета сайта в программе DreamWeaver. Тема 2. Разработка информационной архитектуры. (2 часа) [1-7] 2.1. Элементы информационной архитектуры. 2.2. Распределение информации по разделам сайта с учетом информационной, логической и визуальной взаимосвязи между разделами. 2.3. Основные компоненты WEB-страницы и способы их визуального представления на страницах сайта. 2.4. Разработка простого макета страницы и линейной системы навигации. 2.5. Использование шаблонов (templates) в DreamWeaver: создание шаблонов, применение к готовым страницам, модификация шаблонов. Практическая работа. Создание сайта с линейной системой навигации с использованием шаблонов. Тема 3. Эргономика WEB-сайта. (2 часа) [1-7] 3.1. Эргономика сайта (web-usability). Факторы, которые затрудняют и факторы, которые облегчают восприятие пользователем информации на сайте. 3.2. Макетирование в WEB. Приемы макетирования. Создание фиксированных и адаптируемых страниц. Размещение информации на странице с учетом решаемых задач. Примеры удачных и неудачных решений. 3.3. Система навигации на сайте. Принципы построения системы навигации. Создание навигационных палитр. Практическая работа. Создание сайта с двухуровневой системой навигации. Создание адаптируемого макета. Тема 4. Подготовка иллюстраций для WEB. (2 часа) [[1-7] 4.1. Требования к иллюстрациям в Internet. Обзор форматов иллюстраций JPEG, GIF, PNG, SWF, SVG. 4.2. Подготовка графики в программах Adobe PhotoShop, Adobe ImageReady и Macromedia Fireworks. Способы уменьшения объема файла. 4.3. Использование коллекций изображений (clipart) векторных графических редакторов на примере CorelDraw. 4.4. Подготовка 1 изображений, имеющих прозрачные области. Представление текстовой информации. Практическая работа. Оптимизация заданных изображений и заготовок из Clipart. Размещение их на WEB-страницах. Тема 5. Подготовка графических элементов. (2 часа) [1-7] 5.1. Создание кнопок. Имитация различных состояний кнопки. 5.2. Создание фоновых иллюстраций. Техника создания бесшовных узоров в программах Adobe PhotoShop и Adobe ImageReady. 5.3. "Нарезка" изображений на фрагменты в программе Adobe ImageReady. Оптимизация фрагментов изображений. Практическая работа. Добавление кнопок и фоновых элементов. Тема 6. Gif-анимация и баннеры. Карта изображения ImageMap. (2 часа) [1-7] 6.1. Что такое GIF-анимация. Способы создания и параметры анимации. Способы уменьшения объема файла. 6.2. Использование Adobe ImageReady и Ulead GifAnimator для создания gif-анимации. Преобразование в GIF-анимацию файлов двухмерной и трехмерной графики. 6.3. Баннеры: параметры, размещение на WEB-странице. Разработка сюжета баннера. 6.4. Использование GIF-анимации и роликов FLASH в баннерной рекламе. Воздействие баннерной рекламы на пользователя. 6.5. Применение карт изображений ImageMap в WEB-дизайне. Практическая работа: создание баннеров. Тема 7. Создание динамических элементов в DreamWeaver. (2 часа) [1-7] 7.1. Основные сведения о программе DreamWeaver 7.2. Назначение палитр Behaviors и TimeLine. 7.3. Управление параметрами элементов в DreamWeaver. Обработка событий. 7.4. Типовые операции (модальные окна, открытие новых окон и управление ими), проверка данных формы, управление видимостью и содержанием слоев, проверка броузера. 7.5. Сложные операции: создание раскрывающихся меню, анимация слоев, создание эффекта "rollover". 7.6. Использование возможностей Macromedia Flash. Практическая работа: создание эффекта "rollover" для кнопок. Тема 8. Оценка сайта. (2 часа) [1-7] Тестирование сайта. 8.1. Критерии оценок созданного сайта. 8.2. Способы снижения визуального шума и повышения четкости подачи материала. 8.3. Этапы стандартного тестирования сайта. 8.4. Методика тестирования сайта на аудитории. Выработка предложений по редизайну и обоснование необходимости редизайна. 8.5. Обзор ресурсов, связанных с вопросами WEB-дизайна и WEB-usability. Практическая работа: выполнение тестирования заданного сайта и выработка предложений по редизайну. 2. Лабораторные работы Лабораторная работа №1. (4 часа) Создание макета сайта в программе DreamWeaver. [8, 9] [8, 9]Лабораторная работа №2. (4 часа) Создание сайта с линейной системой навигации с использованием шаблонов. [8, 9] Лабораторная работа №3. (4 часа) Создание сайта с двухуровневой системой навигации. Создание адаптируемого макета. [8, 9] Лабораторная работа №4. (4 часа) Оптимизация заданных изображений и заготовок из Clipart. Размещение их на WEB-страницах. [8, 9] Лабораторная работа №5. (4 часа) Добавление кнопок и фоновых элементов. [8, 9] Лабораторная работа №6. (4 часа) Создание баннеров. [8, 9] Лабораторная работа №7. (4 часа) Создание эффекта "rollover" для кнопок. [8, 9] Лабораторная работа №8. (6 часов ) Выполнение тестирования заданного сайта и выработка предложений по редизайну. [8, 9] 3. Самостоятельная работа Подготовка к лекциям (подготовка к контрольным работам) (7 часов) [1, 3] Подготовка к лабораторным работам (защита отчета по лабораторным работам) (10 часов) [2, 1, 3] Выполнение расчетного задания (защита расчетного задания) (10 часов) [3, 1, 4, 5] 4. Литература 1. Хольцшлаг, Молли Е. Языки HTML и CSS: для создания Web-сайтов /М. Хольцшлаг.-М.: Триумф, 2007.-303 с.: ил. – 1 экз 2. Создание Web-страниц и Web-сайтов: Самоучитель.-М.: Триумф, 2002.-490 с.: ил. – 1 экз. 3. Создание Web-сайтов без посторонней помощи / под ред. В. Н. Печникова. М.: Технический бестселлер, 2006. - 464 с.: ил. + [1] CD. - (Серия «Технический бестселлер»).- 1 экз 4. Сырых, Ю.А. Современный веб-дизайн. Рисуем сайт, который продает. - М.: ООО "И.Д. Вильяме", 2008. — 304 с.: ил. – 1 экз. 5. CorelDRAW ХЗ. Учебный курс Автор: Миронов Д.Ф. Издательство: Питер Год: 2006 С.397. 6. Прохоренок Н. А. HTML, javascript, PHP и MySQL. Джентльменский набор Webмастера Издательство: БХВ-Петербург 2010, С: 900 7. Робин Никсон. Создаем динамические веб-сайты с помощью PHP, MySQL и javascript. Издательство: Питер 2011 С.496 8. Комягин В. Б. CorelDRAW 7 в примерах /В. Б. Комягин, А. О. Коцюбинский.-М.: Триумф, 1997.-413 с.: ил. 1. Немцова Т.И., Назарова Ю.В.Практикум по информатике. Компьютерная графика и WEB-дизайн Издательство: Форум-Инфра, 2011, С. 288. 2. Заргарян Ю.А., Заргарян Е.В. Компьютерная графика в практических приложениях Издательство: ТТИ ЮФУ, 2009, С.255 5. Аттестация по курсу в 7-м семестре, рейтинг Оценка индивидуальной деятельности студентов по дисциплине складывается из следующих видов работ: для текущего и семестрового рейтинга учитываются: посещаемость, контрольные работы и активность студентов на лекциях – от 0 до 100 баллов (удельный вес – 0,1); выполнение лабораторных работ – от 0 до 100 баллов, удельный вес – 0,2; защита расчетного задания – от 0 до 100 баллов, удельный вес – 0,2; для итогового рейтинга учитываются: семестровый рейтинг – от 0 до 100 баллов, удельный вес – 0,5; сдача экзамена – максимум 100 баллов, удельный вес – 0,5. Рейтинг студента определяется по формуле: R R p p i i , i где R – итоговый рейтинг, Ri – оценка за i-ю контрольную точку (этап), pi – удельный вес контрольной точки. Суммирование проводится по всем контрольным точкам с начала семестра до момента вычисления рейтинга. Связь рейтинга студента с итоговой оценкой по дисциплине: 0–24 25–49 50–74 75–100 "неудовлетворительно" "удовлетворительно" "хорошо" "отлично"