І етап ІОІТ-2016
Веб-технології
Завдання I етапу номінації «Веб-технології»
Інтернет-олімпіади з інформаційних технологій
Беручись за виконання завдань Ви погоджуєтеся із Правилами участі в олімпіаді, зокрема із пунктами про дискваліфікацію.
Відповідно до Указу Президента України 2016 рік в нашій державі оголошений роком англійської мови. В зв'язку з цим Вам пропонується зробити веб-сторінку про англійську мову та культуру, а також надається можливість дізнатися про неї багато цікавого.
Робота поділяється на дві частини: Розробка та Розгортання.
Розробка
Завдання 1
Завдання коштуватиме 50 % балів
Використувуючи можливості HTML, CSS та JavaScript, а також довільних фреймворків чи бібліотек розробити веб-сторінку відповідно до поданого макету українською або англійською мовою на вибір.
Додаткові матеріали знахотяться в архіві all-about-english.zip
Текстові частини до кожної версії макету подані в належному форматуванні в документах all-about-english.en.rtf
та all-about-english.uk.rtf
для англійської та української версії відповідно.
Всі потрібні зображення та шрифти подані в каталозі assets
в архіві з матеріалами завдань.
Вимоги до виконання макету
- Шрифти:
- Georgia для основного тексту
- Open Sans для заголовків (рекомендується використовувати Google Fonts)
- Кольори:
- основний:
#303F9F
- текст:
#212121
- фон:
#FFFFFF
- тіні:
#000000
- світло:
#FFFFFF
- основний:
- Блоки:
- заголовки повинні добре читатися
- посилання в тексті повинні активні та вести до вказаних джерел, як в супровідних документах
all-about-english.en.rtf
таall-about-english.uk.rtf
- посилання на джерела у футері повинні бути клікабельними, та вести до наступних адрес:
- Інтернет-олімпіада з інформаційних технологій:
іоіт.укр
- Mastersportal:
www.mastersportal.eu/articles/1036/all-you-need-to-know-about-english.html
- Вікіпедія:
uk.wikipedia.org
абоen.wikipedia.org
в залежності від обраної мови виконання завдання - Unsplash:
unsplash.com/collections/341323/all-about-english
- Інтернет-олімпіада з інформаційних технологій:
Завдання 2
Завдання коштуватиме 25 % балів
Вдосконалити виконану в попередньому завдані роботу згідно із наступними правками.
1. Карта англомових держав
У заголовку секції «Географія» (Georgaphy) розмістити карту відповідно до макету
Карта повинна відділятися від фону та бути посиланням на наступні сторінки Вікіпедії у відповідності до обраної Вами мовної версії макету
en.wikipedia.org/wiki/List_of_countries_by_English-speaking_population
в англомовнійuk.wikipedia.org/wiki/Список_англомовних_країн_та_регіонів
в україномовній
2. Слайдер
Перетворити секцію «Відомі носії мови» (Famous speakers of English) на слайдер використовуючи будь-яку зручну для Вас бібліотеку
Розгортання
Частина коштуватиме 25 % балів
За допомогою реєстратора реєстратора доменних імен NIC.UA зареєструвати домен та замовити безкоштовний випробувальний термін хостингу
Домен повинен бути зареєстрований в безкоштовній зоні імен .pp.ua; для активації радимо скористатися автоматичним роботом сервісу миттєвих повідомлень Telegram — @ppuabot (Відеоінструкція)
Додайте до Вашого рішення мета-тег
<meta name="itolymp:authcheck" content="...">
, де замість...
вставте ідентифікатор, що знаходиться на сторінці етапу в системі itolymp (Етапи змагання - І етап у номінації "веб-технології")Опублікуйте своє рішення на замовленому хостингу, та натисніть на сторінці етапу кнопку Перевірити для того, щоб система автоматично перевірила дану частину роботи
Зверніть увагу: зміна налаштувань DNS та реєстрація домену може тривати до 24 годин.
Якщо в системі під час перевірки виникла помилка, проте Ви впевнені в тому, що вказали та зробили все правильно, переконайтеся, що опубліковане Вами рішення доступне з мережі Інтернет. В іншому разі зачекайте добу та повторіть операцію ще раз.
Загальні вимоги та критерії оцінювання
Рішення подається у zip-архіві, в якому містяться
- вихідні файли
- зібрана версія проекту, якщо використовувалися препроцесори
Завдання повинні бути виконаними у відповідності до стандартів HTML 5 та CSS 3
Проект зібраний і цілком працездатний в останніх версіях найпопулярніших браузерів
Також звертається увага на
- завершеність роботи, наявність усіх блоків
- відповідність стандартам
- якість коду
- оптимізація (як клієнтська, так і робочого процесу)
- використання сторонніх бібліотек та їх доцільність
- відображення тексту відповідно до макета та поданих в матеріалах супровідних файлів
- адаптацію рішення до дисплеїв різного розміру
- успішне проходження перевірки Markup Validator Service