- •Содержание
- •Предисловие
- •Правила выполнения практических работ
- •Обеспеченность занятия (средства обучения):
- •Порядок выполнения отчета по практической работе
- •Задания для практического занятия:
- •Контрольные вопросы
- •1. Выбор критериев при оценке сайтов
- •2. Составление списка сайтов
- •3. Выставление критериев
- •4. Оценка результатов и выводы
- •Задания для практического занятия:
- •Контрольные вопросы
- •Подстановки
- •Задания для практического занятия:
- •Вариант 1
- •Вариант 2
- •Вариант 3
- •Вариант 4
- •Вариант 5
- •1. Общая структура
- •2. Атрибуты
- •3. Регистр записи команд
- •4. Escape-последовательности (подстановки)
- •5. Перевод строки, пробелы, табуляция
- •6. Комментарии
- •7. Общие рекомендации
- •8. Цветовые спецификации
- •9. Базовые теги разметки гипертекста
- •12. Заголовки
- •Задания для практического занятия:
- •Подстановки
- •Задания для практического занятия:
- •Виды тегов:
- •Подстановки
- •Задания для практического занятия: Размещение таблиц на html-странице. Форматирование текста в таблице
- •В таблице могут использоваться следующие способы выравнивания:
- •2.2 Размещение таблиц на html-странице. Форматирование ячеек таблицы
- •Форматирование заднего фона таблиц, рядов и ячеек:
- •2.3 Размещение таблиц на html-странице. Объединение ячеек таблицы
- •Объединение ячеек таблицы:
- •Контрольные вопросы
- •Практическое занятие 7-8 «Дополнительные элементы языка html для форматирования web-страниц»
- •Образовательные результаты, заявленные во фгос третьего поколения:
- •Виды тегов:
- •Подстановки
- •Задания для практического занятия:
- •Коллекция горизонтальных линий
- •Escape-поcледовательности
- •Физические и логические стили
- •Образец технического задания на разработку web-сайта Техническое задание на разработку Веб-сайта
- •Подписи Сторон:
- •Задания для практического занятия:
- •Задания для практического занятия:
- •Контрольные вопросы
- •1. Семейства шрифтов font-family
- •4. Оформление текста text-decoration. Значения: подчеркивание (underline), надчеркивание (overline), зачеркивание (line-through), нет подчеркивания (попе).
- •1. Цвет элемента color — цвет элемента в модели rgb или по стандартным названиям цветов.
- •Отступы.
- •1. Выравнивание text-align — выравнивание абзаца относительно страницы или ячейки таблицы. Значения: по левому краю (left), по центру (center), по правому краю (right), по ширине (justify).
- •Задание для практического занятия:
- •Простейшая анимация
- •Дополнительные кадры анимации
- •Анимация размеров клипа
- •Создание анимации имитирующие приближение локомотива к зрителю
- •Настойка плавности анимации
- •Применение цветового эффекта
- •Анимация фильтра Glow (Свечение) и его настройка
- •Применение фильтра Blur (Размытие)
- •Озвучивание анимации
- •Задания для практического занятия:
- •Контрольные вопросы
- •Анимация движения по траектории
- •Настройте плавность анимации
- •Вложенные клипы
- •Озвучивание анимации
- •Вставка фонового рисунка
- •Создание второй сцены
- •Создание анимации и применение фильтра
- •Озвучивание второй сцены
- •Создание анимации формы
- •Использование идентификаторов формы
- •Создание анимации плывущего парохода
- •Создание анимации волны
- •Имитация наката волн
- •Имитация качки парохода на волнах
- •Сборка анимации
- •Задания для практического занятия:
- •1. Введение
- •2. Сведения об ошибках
- •Сообщение об ошибке
- •Исправление ошибок
- •3. Дата и время
- •4. Команда onMouseOver
- •Разбор скрипта
- •Другие свойства
- •5. Обработчики событий
- •Команды и эффекты
- •Задания для практического занятия:
- •Типовые виды сайтов
- •Задания для практического занятия: Вариант 1
- •Вариант 2
- •Контрольные вопросы
Задания для практического занятия:
1. Напишите скрипт так, чтобы вышли две строки текста, красная и синяя. Необходимо дописать несколько команд Javascript, а не просто добавить немного HTML к приведенному примеру. На странице должно оказаться следующее:
Иван рубил дрова, Варвара топила печь.
2. Скопируйте скрипт на страницу и сохраните ее.
<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY>
<SCRIPT language=JavaScript>
..t
dothis = new Date()
month = dothis.getMonth()
month = (month * 1) + 1
day = dothis.getDate()
year = dothis.getFullYear()
document.wrte(" ",day,"/",month,"/",year," ")
</SCRIPT>
</BODY> </HTML>
Загружая страницу, браузер должен выдать вам два сообщения об ошибке. Исправьте их.
Если он заработает, то на странице появится сегодняшняя дата. (Подсказка: возможно, сначала вы получите только одно сообщение. Вторая ошибка появится, когда вы исправите первую.)
3. Напишите скрипт, который поместит на вашу страницу дату, разделенную дробями /. Приветственный текст должен быть зеленого цвета. Также отметьте, что это вы написали скрипт.
4. Новый метод, alert() (предупредить) - он вызывает небольшое диалоговое окно с текстом и кнопкой OK. Попробуйте сделать так, чтобы окно предупреждения всплывало при наведении курсора на ссылку. Вот формат команды:
alert('текст в окошке')
Подумайте хорошенько, решите, что должно произойти сначала, что потом.
5. Создайте форму, которая будет взаимодействовать с пользователем. Форма должна иметь три элемента: поле ввода с просьбой ввести имя; два поля для флажков с вопросом о том, что больше нравится пользователю, мороженое или шоколад; кнопку отправки данных. С каждым элементом должно произойти следующее: При вводе имени в строке состояния должны появиться слова: «Впишите сюда свое имя». Два поля с флажками должны отослать в строку состояния слова: «Вы выбрали...» и выбор пользователя. При нажатии на кнопку должно выскочить окно предупреждения, благодарящее пользователя за участие в опросе.
Контрольные вопросы
1. Что позволяет вызывать команда onSubmit?
2. В чем суть объектой модели JavaScript?
3. Дайте определение понятию JavaScript?
Практическая работа № 20-23
«Создание сайта и его публикация»
Цель работы: 1.Выработать навык создания сайтов в Macromedia Dreamweaver с использованием основных тегов.
2.применить знания и умения полученные ранее на практических занятиях
Образовательные результаты, заявленные во ФГОС третьего поколения:
Студент должен
уметь:
- создавать web-приложения;
знать:
- инструменты создания web-приложений.
- основные редакторы WEB-страниц;
Краткие теоретические и учебно-методические материалы по теме практической работы
Основные этапы разработки сайта
Можно выделить шесть основных этапов разработки сайта:
1) составление технического задания;
2) подготовка текстового содержания и иллюстраций;
3) разработка дизайна сайта;
4) кодирование и программирование;
5) тестирование сайта;
6) публикация и раскрутка сайта.
В техническом задании определяются цели и задачи проекта, сроки его выполнения, структура сайта и параметры его реализации. После составления технического задания собирается весь текстовый и иллюстративный материал сайта. Следующим этапом будет выполнение нескольких эскизов внешнего вида сайта, учитывая пожелания заказчиков по цветовым решениям. Практически одновременно с отрисовкой ЭСКИЗОВ начинается кодирование и программирование механизма сайта. По окончании этой работы нужно провести тщательное тестирование созданного сайта на предмет ошибок в процессе его функционирования. Только убедившись в том, что все отлажено и нет никаких сбоев, можно опубликовать готовый сайт на сервере. С этого момента сайт смогут увидеть миллионы .пользователей Интернета.