ІІ етап ІОІТ-2017
Веб-технології

Прочитати більше

Інформація, інструкції та рекомендації щодо виконання

ІІ етап Інтернет-олімпіади з інформаційних технологій у номінації "Веб-технології" проводиться з 13 по 17 листопада 2017 року в заочній формі з використанням Інтернет-ресурсу itolymp.

Для успішного проходження ІІ етапу Вам потрібно до 17 листопада виконати запропоновані нижче завдання та надіслати їх на ресурс itolymp за допомогою Вашого облікового запису. В цілому вам потрібно: увійти, натиснути на змагання ІІ етап ІОІТ-2017 у номінації "Веб-технології" - після цього ви побачите перелік завдань із посиланням для надсилання розв'язку для кожного з них.

Впродовж виконання завдань строго забороняється використання під час розв’язання файлів розв’язань інших учасників. Будь-які дії, що порушують Правила проведення Інтернет-олімпіади з інформаційних технологій «ІОІТ-2017», а також вказівки журі та організаційного комітету можуть призвести до позбавлення учасника права на подальшу участь у змаганні.

Не залишайте в файлах розв’язань позначки, що ідентифікують Вашу особу. Вони призводять до анулювання роботи.

Уважно читайте умови завдань. Пам’ятайте: правильне розуміння поставленої перед вами задачі – половина шляху до її розв’язання. Автори завдань та члени журі очікують на ваші запитання, які ви можете поставити за допомогою системи itolymp.

З побажаннями успіхів, організаційний комітет Інтернет-олімпіади

Музика, що нас захоплює

Завантажити заготовку (формат zip)

В межах цього етапу Вам пропонується виконати три завдання, пов'язані з музикою. Кожне завдання пов'язане з однією з тенологій: HTML, CSS, JavaScript.

Примітка: як розв'язок, приймаються виключно ті файли, які вказані в кожному із завдань. Вважається, що файл розв'язку поміщається у папку з вихідними файлами й опісля робота перевіряється. Редагування інших файлів у теці ніяк не вплине на процес перевірки.

Розв'язки перевірятимуться в Chrome 60+ або еквівалетному браузері.

Завдання 1. HTML

Якубів Віктор Романович, заступник голови журі

Осадча Мирослава

Використовуючи стилі, подані у файлі initial.css, відредагувати тільки файл index.html так, аби вміщена в ньому стаття Як музика вплаває на продуктивність була розмічена відповідно до наступного зразка.

Необхідні для завдання матеріали знаходять в теці з назвою 1.

На що звертається увага

  • Наявність заголовків, абзаців, блоків цитат, списків, посилань
  • Використання елементів HTML 5
  • Логічно-побудована структура в HTML 5 Outliner
  • Відсутність помилок у W3C Validator

Завдання 2. CSS

Якубів Віктор Романович, заступник голови журі

Використовуючи подану у файлі index.html розмітку відредагувати тільки файл solution.css так, щоб утворилася музична нота, відповідно до поданої на зразку.

Необхідні для завдання матеріали знаходять в теці з назвою 2.

Завдання можна виконувати частково.

На що звертається увага

  • Наявність елементів ноти
  • Використання псевдоелементів ::before, ::after
  • Наявність градієнтної заливки на кожній з частин ноти

Завдання 3. JavaScript

Якубів Віктор Романович, заступник голови журі

У теці 3 поданий макет Антоніо Вівальді – Пори року. Редагуючи тільки файл solution.js зробити так, щоб при кліку на відповідну пору року програвався музичний файл, на який вказує посилання.

На що звертається увага

  • Використання стандартів ES 2015 і вище
  • Відсутність переходів при кліку на посилання на «пори року»
  • Клік по іншому посиланні зупиняє поточний трек
  • Повторний клік на посиланні призупиняє відтворення музики
  • При наведенні на посилання відображається кнопка «play» або «pause» в залежності від стану програвача