Кросбраузерність
За навчальною програмою 2018 року
Урок 11
10
(11)
Актуалізація опорних знань і життєвого досвіду
Розділ 2 § 11
Розкажіть про свої досягнення з вивчення розділу «Проектування та верстка веб-сторінок»
Я зробив...
Тепер я знаю...
Я зрозумів...
Я навчився...
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Кросбраузерність сайта — це властивість сайта однаково відображатися та функціонувати відповідно до поставленого завдання в усіх браузерах.
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Ідентичність - відсутність розвалів верстки і здатність відображати матеріал з однаковим ступенем читабельності.
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Тестування кросбраузерної сумісності (важлива складова частина розробки сайту) – це перевірка того, як виглядають всі веб-сторінки при перегляді в різних браузерах (наприклад, в таких веб-переглядачах як Chrome, Firefox або Internet Explorer).
Зрозуміло, що під абсолютно всі браузери адаптувати сайт не вийде, але можна почати з тих, якими користуються більшість відвідувачів вашого (дізнатися це можна, наприклад, зі статистики Google Analytics).
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Чому важливо тестувати кросбраузерну сумісність?
Якщо ви не проведете тестування та/або не проведете зміну верстки і стилів під найпопулярніші браузери, ви просто втратите багатьох потенційних відвідувачів, оскільки для них ваш сайт буде недоступним або важким для перегляду.
Сучасні користувачі мережі Інтернет мають широкий вибір веб-переглядачів (браузерів).
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Ось основні елементи, які можуть викликати проблеми із відображенням сайту:
І це може викликати конфлікти сумісності при перегляді вашого сайту (особливо, якщо він виконаний з використанням найсучасніших технологій)
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Основні інструменти для тестування кросбраузерної сумісності
Якщо ви не експерт з тестування у веб-розробці, не хвилюйтеся: в мережі Інтернет досить і платних, і безкоштовних ресурсів для цього, і вам не потрібно буде створювати свою власну систему тестування, «але»: україномовних ресурсів немає, всі вони на англійській мові.
Browserling
Browsershots
turbo.net Browser Sandbox
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Потрібно використову-вати ті елементи у верстці html-коду, що у всіх необхідних браузерах відобража-ються однаково.
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Префікси браузерів при описі в CSS3:
браузери Chrome, Safari;
-webkit-
браузер Mozilla Firefox
-moz-
браузер Internet Explorer
-ms-
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Кросбраузерність
Розділ 2 § 11
Багато розробників веб-сайтів не турбуються про кросбраузерність, а ставлять сторінку-заглушку, тобто користувач Internet Explorer може бачити лише одну сторінку,
на якій йому рекоменду-ється змінити браузер без можливості перегляду контенту.
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Запитання для рефлексії
Розділ 2 § 11
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Домашнє завдання
Розділ 2 § 11
Написати есе
«Життя без кросбраузерності»
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Працюємо за комп’ютером
Розділ 2 § 11
10�(11)
© Вивчаємо інформатику teach-inf.at.ua
Дякую за увагу!
За навчальною програмою 2018 року
Урок 11
10
(11)