Мобільні пристрої вже складають величезну частину, якщо не більшість, читацької роботи в Інтернеті для багатьох веб-сайтів, тому переконання, що ваш сайт буде виглядати та функціонувати належним чином на iPhone або планшеті, має вирішальне значення. Існує багато сервісів, які пропонують попередній перегляд мобільних розробок для певної URL-адреси, але Apple зробила тестування веб-сайтів для готовності мобільних пристроїв набагато простішими за допомогою Safari 9 в OS X El Capitan. Нова функція під назвою Режим чуйного дизайну дозволяє швидко переглянути, як виглядає веб-сайт на різних пристроях Apple, а також звичайні роздільні можливості екрану для мобільних пристроїв. Ось як це працює.
Важливо ще раз зазначити, що Режим чуйного дизайну - це нова функція, яка є ексклюзивною для Safari 9 в OS X El Capitan, тому для доступу до неї вам потрібно буде мати принаймні ці версії браузера та операційної системи. Якщо ваш Mac відповідає цій вимозі, спочатку потрібно ввімкнути режим розробника Safari. Для цього запустіть Safari і натисніть Safari в рядку меню. Потім виберіть Налаштування> Додатково .
На вкладці "Додатково" у вікні "Налаштування Safari" встановіть прапорець "Показувати розробку меню в панелі меню". Як випливає з назви цього параметра, на панелі меню Safari справа від пункту меню з'явиться нове меню "Розробити". "Закладки".
Потім закрийте вікно налаштувань Safari та перейдіть на веб-сайт, який ви хочете протестувати в режимі чуйного дизайну. Після повного завантаження веб-сайту у вашому браузері скористайтеся комбінацією клавіш Command-Option-R, і ви побачите вікно веб-переглядача, яке конвертується у попередній перегляд однієї з кількох резолюцій мобільного пристрою (ви також можете отримати доступ до режиму чуйного дизайну, натиснувши кнопку Розробити в рядок меню Safari та виберіть Вхід в режим чуйного дизайну ).
Режим дизайну Safari - чуйний перегляд дозволяє переглядати, як виглядає веб-сайт із усіма роздільними можливостями мобільних пристроїв Apple, від 3, 5-дюймового iPhone 4S до 12, 9-дюймового iPad Pro. Користувачі також мають можливість вибрати роздільну здатність 1x, 2x або 3x "Retina" та змінити агент браузера, щоб імітувати поведінку найбільш популярних браузерів, таких як Chrome, Firefox та Edge.
Для кожного розміру пристрою та розміру екрана користувачі можуть клацнути піктограму пристрою, щоб змінити орієнтацію на портрет та пейзаж, або для пристроїв, таких як iPad Air та iPad Pro, які підтримують розділений вигляд, можна клацнути, щоб обертатися між різними схемами розділеного перегляду.
Хоча в режимі чутливого дизайну Safari відсутні деякі варіанти подібних попередніх інструментів, вбудований він безпосередньо в Safari може бути величезною економією часу для веб-дизайнерів та чудовим інструментом для вивчення та тестування власників веб-сайтів, які хочуть переконатися, що їх відвідувачі мобільних пристроїв отримуєте найкращий досвід незалежно від роздільної здатності екрана чи розміру.
Після того, як ви закінчите тестування, ви можете залишити режим чуйного дизайну, або закривши вікно браузера або вкладку, або знову натиснути ярлик Command-Option-R .
