Тести з Веб дизайну для здобувачів освіти 11 класу

Тест з веб Дизайну :

1. **Що таке HTML і CSS?**

   - a. HyperText Markup Language і Cascading Style Sheets

   - b. High-level Text Markup Language і Computer Style Sheets

   - c. HyperTransfer Markup Language і Creative Style Sheets

2. **Яка різниця між margin і padding у CSS?**

   - a. Margin - це відстань між елементом і його зовнішнім контуром, а Padding - це відстань між елементом і його внутрішнім контуром.

   - b. Margin - це відстань між елементом і його внутрішнім контуром, а Padding - це відстань між елементом і його зовнішнім контуром.

   - c. Margin і Padding використовуються взаємозамінно.

3. **Як вибрати всі елементи div з класом "example"?**

   - a. `div.example`

   - b. `example.div`

   - c. `#example.div`

4. **Що таке адаптивний (responsive) веб-дизайн?**

   - a. Такий дизайн, який використовує багато кольорів.

   - b. Дизайн, який адаптується до різних розмірів екранів пристроїв.

   - c. Дизайн, який використовує анімацію для привертання уваги користувачів.

5. **Які основні принципи доступності веб-сайтів?**

   - a. Колірні схеми та великі шрифти.

   - b. Доступність до інтернету та швидкість завантаження.

   - c. Врахування потреб людей з обмеженими можливостями та створення сайтів, які доступні для всіх користувачів.

6. **Які три основні компоненти у Flexbox?**

   - a. Контейнер, рядок і колонка.

   - b. Рівень, блок і елемент.

   - c. Гнучкість, порядок і розташування.

7. **Як визначити абсолютний шлях до зовнішнього файлу стилів (CSS) в HTML-документі?**

   - a. `<link rel="stylesheet" type="text/css" href="/styles/main.css">`

   - b. `<style src="/styles/main.css">`

   - c. `<css href="/styles/main.css">`

8. **Що таке UX (User Experience) в дизайні?**

   - a. Верстка веб-сторінок.

   - b. Взаємодія користувача з продуктом та його враження від цієї взаємодії.

   - c. Вибір типографії та кольорів для сайту.

9. **Як зробити анімацію в CSS?**

   - a. Використовуючи тег `<animate>` в HTML.

   - b. За допомогою властивості `animation` в CSS та ключових кадрів (`@keyframes`).

   - c. За допомогою JavaScript `animate()` функції.

10. **Яке призначення медіа-запитів (media queries) в CSS?**

    - a. Визначення розташування файлів мультимедіа на сервері.

    - b. Застосування стилів до різних пристроїв та розмірів екранів.

    - c. Визначення кольорової палітри для веб-сайту.

Бажаю успіху у ваших знаннях веб-дизайну!

Вірна відповідь: 

1. a. HyperText Markup Language і Cascading Style Sheets

2. Вірна відповідь: a. Margin - це відстань між елементом і його зовнішнім контуром, а Padding - це відстань між елементом і його внутрішнім контуром.

3.Як вибрати всі елементи div з класом "example"?

●       a. div.example

●       b. example.div

●       c. #example.div

4.Вірна відповідь: b. Дизайн, який адаптується до різних розмірів екранів пристроїв.

5.Вірна відповідь: c. Врахування потреб людей з обмеженими можливостями та створення сайтів, які доступні для всіх користувачів.

6. Вірна відповідь: a. Контейнер, рядок і колонка.

7.Вірна відповідь: a. `<link rel="stylesheet" type="text/css" href="/styles/main.css">`

8.Вірна відповідь: b. Взаємодія користувача з продуктом та його враження від цієї взаємодії.

9.Вірна відповідь: b. За допомогою властивості `animation` в CSS та ключових кадрів (`@keyframes`).

10.Вірна відповідь: b. Застосування стилів до різних пристроїв та розмірів екранів.