Перевірка кросбраузерності сайту - видимість сайту в браузерах

1. вступ
2. Видимість сайту в браузерах
3. Browsershots.org
4. Turbo.net (колишній Spoon)
5. Видимість сайту в Internet Explorer
6. Для чого підходить
7. Browserling.com
8. Browsera.com
9. CrossBrowserTesting
10. Browserstack.com
11. Saucelabs.com
12. Навіщо потрібен час для перевірок
13. висновок

вступ

Поняття кроссбраузерность сайту відноситься до його властивостей однаково відображатися на різних браузерах Інтернет.

Видимість сайту в браузерах

Якщо ви «погуглити» список браузерів доступних для установки користувачам, то напевно знайдете список з 60 ± програм. Більшість з них будуть модифікаціями Chromium і Firefox, проте загальний список вийде значний. (список тут )

Вручну перевірити видимість сайту у всіх браузерах завдання, м'яко сказати, недолуга. Хоча можна встановити у себе основні браузери і дуже швидко відкрити свій сайт в основних браузерах Google Chrome, Яндекс Chrome, Firefox і Opera і тим самим перекрити 90% можливих відвідувачів вашого сайту.

За даними статистики StatCounter, популярність браузерів в Росії на жовтень 2018 року виглядає так.

Сумніваюся, що це графік сильно змінитися в найближчі роки.

Якщо цієї інформації недостатньо, то перевірити, як виглядає сайт в різних браузерах, допоможуть спеціальні сервіси.

Browsershots.org

сервіс Browsershots дає вам безкоштовну можливість зробити скіншоти перевіряється сторінки сайту в заснованих браузерах і їх версіях. Безкоштовно, перевірка кросбраузерності сайту, проводиться для осей Linux і Windows. Для MAC і BSD доведеться робити грошовий внесок.

Зверніть увагу на налаштування сервісу, вони внизу сторінки. По-перше, тут ви можете вибрати свою мову. Вибір російської мови не дасть доброго результату, вам переведуть пару рядків з меню і все. Але це не важливо.

Більш цікаві 5 налаштувань: Screen Size, Color Depth, Javascript, Java, Flash. За умовчанням вони виставлені на розсуд сервісу.

Також зверніть увагу, що виділені не всі чеки і за замовчуванням перевіряються не всі браузери, а лише останні, за даними сервісу, версії Браузерів.

Ще один момент. Значок копірайту внизу дає інформацію, що сервіс не оновлювався з 2015 року. Це підтверджують останні версії браузерів доступні для перевірки. Наприклад, останній «Opera» для перевірок 15.0, а не 56.0.

Незважаючи на це сервіс працює і після введення повної адреси сайту в поле перевірок і натискання кнопки Submit, сервіс поставить вас в довгу, безкоштовну чергу перевірок. Через деякий час зробить вам запитувані скріншоти.

Turbo.net (колишній Spoon)

сервіс turbo.net дозволяє запустити онлайн на вашому робочому столі або планшеті браузери IE, Chrome, Firefox. Далі ви викликаєте свій сайт і вивчаєте його, скільки вам потрібно.

На цьому сайті інструмент перевірок кросбраузерності називається «Browser Sandbox» і скористатися ним ви можете після простої реєстрації на сайті.

На жаль, з недавніх пір цей сервіс став умовно безкоштовним, і безкоштовна пробна версія дозволяє запускати обмежена кількість сеансів з обмеженням за часом.

Відео покаже, як працює сервіс і що таке, видимість сайту в браузерах.

Видимість сайту в Internet Explorer

Повертаючись до статистики StatCounter, ми виявляємо, що, в світі, браузер Microsoft Internet Explorer, займає третє місце, по використанню. А це означає, що ігнорувати це браузер з усіма його версіями можна.

Перевірити видимість сайту в Internet Explorer можна дуже просто. Є спеціальний інструмент - перевірка кросбраузерності сайту у всіх версіях Internet Explorer, сервіс netrenderer.com . Далі його опис, запозичене з сайту сервісу.

IE NetRenderer дозволяє вам перевіряти, як веб-сайт відображається численними версіями Microsoft Internet Explorer. Особливо старі версії веб-браузерів Microsoft відомі своїм несподіваним поведінкою і недотриманням інтернет-стандартів W3C. Тому для кожного веб-дизайнера потрібно обов'язково регулярно перевіряти свої веб-сайти на сумісність з цими веб-браузерами. Просто введіть URL-адресу перевіряється веб-сторінки в поле і натисніть кнопку «Render». Через кілька секунд ви отримаєте скріншот сторінки. Спробуйте, це безкоштовно!

Сервіс IE NetRenderer працює швидко. На відміну від інших служб скріншотів, ми можемо обробляти велику кількість захоплених завдань паралельно і в реальному часі. Швидкість рендеринга повинна бути порівнянною, якщо не швидше від вашого локального браузера. Наші двигуни IE мають гарантовану пропускну здатність інтернету в 200 Мбіт / с.

Для чого підходить

Цей інструмент веб-рендеринга ідеально підходить для веб-дизайнерів, які працюють на робочих платформах Apple iMac і Linux. Він дозволяє перевіряти веб-проекти з самого початку на всіх популярних версіях Internet Explorer, без необхідності виділяти кілька фізичних або віртуальних ПК з Microsoft Windows для цієї мети. Перед кожним завданням рендеринга ми очищаємо кеш Internet Explorer. Це дозволяє відразу побачити ефект від всіх змін, внесених під час веб-розробки.

Зазвичай IE Netrenderer показує тільки саму верхню частину будь-якої веб-сторінки. Якщо ви хочете побачити частині сторінки нижче, введіть вертикальне значення зсуву пікселя в поле праворуч на URL. Потім рендеринг починається з вказаної позиції вертикального пікселя.

Веб-сайти, які витягають вміст сторінки через JavaScript після виконання головної HTML-сторінки, можуть ще не завершитися, коли NetRenderer зробить знімок екрана. Те ж саме може статися з об'єктами зовнішньої сторінки, які повинні бути завантажені з повільних сторонніх серверів. Показником цього є або порожній, або неповний знімок екрана. Якщо це станеться, відзначте прапорець під кнопкою «Render», щоб дозволити додатковий час рендеринга, щоб сценарії мали більше шансів закінчити.

Знімок екрана завжди відповідає 100% оригінального розміру і точності картинки аж до пікселя. Користувач зазначає максимальну ширину видимого перегляду на екранах 800 × 600 і 1024 × 768 з урахуванням ширини смуги прокрутки браузера.

NetRenderer завантажує веб-сторінки з Німеччини, а не з вашого ПК. Це робить його корисним для декількох інших цілей. Ви можете, наприклад, використовувати його як швидку перевірку з вашої локальної мережі вашої компанії, щоб перевіряти наявність Webmail або веб-інтерфейс вашого брандмауера зовні.

Можете використовувати його в якості приблизної оцінки, швидкості завантаження веб-сайту людьми в Центральній Європі. Ви також можете використовувати IE NetRenderer для перегляду веб-сайтів анонімно. Відвідавши веб-сервер ви не залишите ніяких слідів ні про вашу IP-адресу, ОС, версії браузера, плагинах або файлах cookie.

Browserling.com

використовуючи сервіс Browserling.com , Проводиться перевірка кросбраузерності сайту тестуванням вашого сайт на обраному браузері з обраної версією і обраної платформі в онлайн режимі.

Сервіс зручний, але на безкоштовному тарифі обмежений час сесії перевірки трьома хвилинами. Платний тариф з необмеженими перевірками коштує 19 $ / місяць. Примітно наявність перевірок на Android (6 версій).

Так як перевірка кросбраузерності сайту відноситься до професійних перевірок, то більшість сервісів платні. Подивимося на них.

Browsera.com

сервіс browsera.com платний, проте в планах підписки є 30-денна безкоштовна пробна версія.

CrossBrowserTesting

сервіс CrossBrowserTesting дозволить провести тестування сумісності крос-браузера в хмарному сервері на 2000+ реальних браузерах Інтернет.

У безкоштовному тарифному плані, після реєстрації, можна провести 60 хвилин перевірочних сесій на місяць (6 сесій по 10 хвилин). Необмежене використання сервісу коштує 15 $ / в місяць.

Browserstack.com

даний сервіс browserstack.com платний, від 29 $. Він дасть можливість перевірити свій сайт в різних браузерах на різних фізичних і мобільних пристроях Android і iOS для отримання найбільш точних результатів.

Saucelabs.com

На сайті потужний набір різних платних інструментів, серед яких є тест кросбраузерності, від 19 $. посилання .

Навіщо потрібен час для перевірок

На завершення поясню, чому важливо не тільки подивитися, як виглядає ваш сайт в різних браузерах, але мати час на його перевірку.

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

висновок

Починав статтю з бажанням показати кращий безкоштовний сервіс для перевірок кросбраузерності сайту. Однак до кінця статті не бачу таких сервісів. Вся зручна і функціональна перевірка кросбраузерності сайту і видимість сайту в браузерах доступна тільки на платних сервісах. Однак рекомендую безкоштовний Browsershots.org.

© www.wordpress-abc

Статті пов'язані з теми: