Дополнение к Положению об Открытом фестивале
Технического творчества «ТЕХНОFEST -2019»
Конкурс по информационным технологиям
«Веб-дизайн»
Заявки для участия в конкурсе принимаются до 31 марта по электронной почте texnofest-2018@mail.ru с указанием темы «Веб-дизайн».
Участие в Конкурсе могут принять учащиеся в возрасте от 11-18 лет.(возрастные категории Б,А).
Время выполнения
На выполнение задания отводится 4 часа.
Сроки проведения
9 апреля 2019 г. с 14.00
Подведение итогов: 10 апреля 2019 г.
Содержание задания
Ваша задача - разработать веб-сайт, посвященный первому полету человека в космос. Тема сайта: «Международная космическая станция».
Задание состоит из трех частей:
1. На основе предоставленных скриншотов сайта создать html-страницы, полностью повторяющие структуру и дизайн:
• месторасположение всех блоков, меню;
• отступы внутри блоков;
• отступы снаружи блоков;
• цветовая схема блоков, текста, ссылок;
• цветовая схема пунктов верхнего и нижнего меню;
• обязательно использование в тексте изображений (минимум 2), у разных изображений должно быть различное выравнивание (местоположение: справа и слева) (минимум в одной странице);
• обязательно использование в тексте маркированных и нумерованных списков (минимум в одной странице);
• обязательно использование в тексте таблиц (минимум в одной странице);
• дизайн сайта должен использовать принцип единообразия в структуре страницы: единый размер элементов, одинаковую высоту навигационных кнопок, оформление заголовков, подзаголовков и основного текста, оформления ссылок и изображений для всех страниц сайта;
• все каскадные таблицы стилей должны храниться в одном отдельном файле и подключаться к html-страницам;
• главная страница должна быть сверстана с учетом просмотра её при различных разрешениях экрана компьютера (980, 1120, 1200 пикселей), т.е. иметь адаптивную («резиновую») верстку.
2. Наполнение контента сайта.
материалы сайта должны быть структурированы (разложены по папкам);
3. при размещении материалов на странице должен быть указан источник информации;
4. в меню должно быть не менее 6 пунктов;
5. название пунктов меню выбираются участником самостоятельно, в соответствие с предоставленными материалами и тематикой сайта;
6. задание будет считаться выполненным, если полностью заполнены минимум три страницы с учетом всех требований п.1.;
7. пункты меню, для которых нет контента, должны быть оформлены однотипно и вместо контента используется фраза «Данный раздел находится в разработке»;
8. все страницы должны быть доступны через верхнее и нижнее меню сайта;
9. при размещении логотипа предусмотреть переход на главную страницу сайта по щелчку левой кнопки мыши;
10. предусмотреть механизм перехода с баннера на официальный сайт МКС (https://www.mcc.rsa.ru/mks.htm), сайт должен открываться в новой вкладке.
• Анимация.
11. Разработать анимированный баннер размером (350 x 200px);
12. Анимация должна быть не менее 5 сек;
13. Анимация должна состоять минимум из трех кадров.
Вводные данные:
Название темы сайта, логотип, краткое описание темы, список тем страниц, текстуальное содержание каждой темы с иллюстративным материалом и его описанием, набор случайных изображений и текста на тему сайта, скриншоты всех страниц сайта.
Выходные данные:
Сайт (набор файлов в формате HTMLи CSS). Анимированный логотип на всех страницах. Рекламный баннер на главной странице.
Оценка сайта будет осуществляться по следующим критериям:
| № критерия | Критерий | Оценка в баллах | ||
| Объективная | Судейская | Сумма | ||
| A | Верстка web-страницы (HTML) | |||
| B | Верстка web-страниц (CSS) | |||
| C | Графический дизайн и web-графика | |||
| D | Анимация | |||
| Итого |
Количество баллов, набранных участником Конкурса, определяется как сумма баллов по следующим критериям:
| № Критерия | Критерий | №суб-критерия | Суб- критерий | №аспекта | Аспект | Оценка в баллах | ||
| Объектиная | Судейская | Сумма | ||||||
| A | Верстка web- страницы (HTML) | A1 | Структура сайта | A1O1 | Материалы сайта структурированы по папкам | |||
| A1O2 | Стартовый файл index.htmили index.html | |||||||
| A1O3 | В именах файлов отсутствует кириллица | |||||||
| A1O4 | Все каскадные таблицы стилей вынесены в отдельный файл | |||||||
| A2 | Структура документа | A2O1 | Наличие тега <!Doctypehtml>или аналогичных для других версий HTML | |||||
| A2O2 | Элементы Шапка, Подвал и Меню представлены на всех страницах сайта | |||||||
| A2O3 | Запись в теге <TITLE>соответствует названию страницы. | |||||||
| A2O4 | Метаданные «keywords» имеются на каждой странице и соответствуют содержанию страницы | |||||||
| A2O5 | Метаданные «description» имеются на каждой странице и соответствуют содержанию страницы | |||||||
| A2O6 | ВалидностьHTML-кода https://validator.w3.org | |||||||
| A2S1 | Идентичное отображение страниц сайта в браузерах Firefox, Chrome | |||||||
| A3 | Интерфейс | A3O1 | Правильная работа гиперссылок. | |||||
| A3S1 | Удобство навигации | |||||||
| A4 | Адаптивная верстка главной | A4O1 | Применяется блочная структура на основе тегов div, а таблицы | |||||
| страницы | используются только при размещении содержания страницы | |||||||
| A4O2 | Размеры блоков меняются при изменении разрешения | |||||||
| A4O3 | Каркас сайта создан на основе таблиц | |||||||
| A4O4 | Изменение разрешения до 980 px не создает горизонтальной полосы прокрутки | |||||||
| A4O5 | Изображения масштабируются при изменении разрешения | |||||||
| A4S1 | Качество реализации процесса изменения каркаса при различных разрешениях (980, 1120, 1200 px) | |||||||
| A5 | Структура текста | A5O1 | Заголовки (Hn) | |||||
| A5O2 | Абзацы на основе <p>, а не <br> | |||||||
| A5O3 | Учтены авторские права (есть информация откуда взяты все заимствованные материалы) | |||||||
| A5O4 | Использование нумерованных списков (использованы/не использованы) | |||||||
| A5O5 | Использование маркированных списков (использованы/не использованы) | |||||||
| A5O6 | Использование в тексте таблиц | |||||||
| A5O7 | Ячейки таблицы правильно объединены | |||||||
| A5O8 | В тексте имеются картинки выравненные и по левому и по правому краю (за каждый тип выравнивания - 1 балл) | |||||||
| B | Верстка web-страниц (CSS) | B1 | Оформление блоков идентично заданному макету (скриншот) | B1O1 | Отступ от шапки до основного документа соответствует скриншоту | |||
| B1O2 | Отступ внутри и снаружи блоков | |||||||
| B1O3 | Отступ текста от изображения | |||||||
| B1O4 | Цвет, форма «Шапки» сайта соответствует скриншоту | |||||||
| B1O5 | Цвет, форма «Подвала» сайта соответствует скриншоту | |||||||
| B1O6 | Цвет, форма «Главное меню» сайта соответствует скриншоту | |||||||
| B1O7 | Валидность CSS | |||||||
| B1S1 | Общее впечатление о точности восстановления сайта | |||||||
| B1S2 | Пропорции и расположение «Шапки» сайта соответствуют скриншоту | |||||||
| B1S3 | Пропорции и расположение «Подвала» сайта соответствуют скриншоту | |||||||
| B1S4 | Пропорции и позиционирование «Главного меню» сайта соответствуют скриншоту | |||||||
| C | Графически й дизайн и web-графика | C1 | Графические решения | C1O1 | Все страницы сайта имеют одинаковый графический пользовательский интерфейс | |||
| C1O2 | Все основные цвета должны соответствовать цветовой гамме скриншота | |||||||
| C1O3 | Цвет ссылок должен соответствовать скриншоту | |||||||
| C1S1 | Общее впечатление о дизайне сайта | |||||||
| C1S2 | Выбрано оптимальное соотношение яркости (контраста) между текстом и фоном | |||||||
| C2 | Web- графика | C2O1 | Реальный размер изображения не превышает примененный на сайте более чем на 50% | |||||
| C2O2 | Элементы интерфейса собственной разработки | |||||||
| (кнопки) | ||||||||
| C2O3 | Альтернативный текст (атрибуты alt, title) | |||||||
| D | Анимация | D2 | Баннер | D2O1 | Имеется рекламный баннер, в котором использованы элементы логотипа | |||
| D2O2 | Размер баннера соответствует одному из предложенных | |||||||
| D2O3 | При щелчке по баннеру обеспечивается переход на официальный сайт МКС. | |||||||
| D2O4 | Официальный сайт МКС открывается в новом окне (вкладке) | |||||||
| D2S1 | Оригинальность баннера | |||||||
| Итого |
По итогам выставленных баллов жюри Конкурса составляет рейтинговую таблицу, в соответствии с которой определяет победителей и призеров Конкурса.
По всем интересующим вопросам обращаться: Крикля Татьяна Владимировна, методист отдела технического творчества МАОУ ДО «Центр детского творчества» г.о. г.Кумертау Республики Башкортостан (89272345751).
ФОРМА ЗАЯВКИ НА УЧАСТИЕ
Оформляется на бланке организации
ЗАЯВКА
на участие в Конкурсе по информационным технологиям
«Веб-дизайн»,