Коли ви починаєте оптимізувати свою веб-сторінку, перше та головне, що ви, можливо, захочете знати, - це поточний загальний розмір сторінки. Це відправна точка майже для всієї оптимізації веб-сторінок.
Загальний розмір сторінки - це показник багатьох речей, особливо час візуалізації веб-сторінки. У більшості випадків ви хочете зробити веб-сторінку якомога швидше зазвичай протягом 2 або 3 секунд. Чим більше розмір сторінки, тим більший час відтворення в більшості випадків.
Це також дозволяє зменшити або оптимізувати використовувану смугу пропускання. Якщо ви платите за пропускну здатність, то кожен байт розраховує, особливо, якщо це сайт високого трафіку. Більшість веб-хостів мають необмежений трафік, вбудований у цінові пакети, тому це може бути не проблемою. Але пам'ятайте, що кожен додатковий байт з'їдає деяку кількість часу і ресурсу, незалежно від того, наскільки невелика вартість.
Загальний розмір сторінки включає в себе весь код на сторінці і всі включені ресурси, які потрібні для відображення сторінки в браузері. Це включає HTML, JavaScript, CSS, зображення, відео та всі інші засоби масової інформації та ресурси, на які посилаються та використовуються на сторінці.
Веб-браузер Chrome
Найпростіший спосіб виміряти розмір сторінки - це веб-переглядач. Якщо ви використовуєте Google Chrome або будь-який з відповідних веб-переглядачів (наприклад, Вівальді, Opera), можна скористатися вбудованими у веб-переглядачі інструментами для розробників .
- Натисніть кнопку Налаштувати (кнопка з трьома точками) в рядку меню
- Виберіть Додаткові інструменти та натисніть Інструменти розробника (можна скористатися комбінацією клавіш Ctrl + Shift + I )
- Натисніть вкладку Мережа
- Завантажте (або перезавантажте) сторінку, яку потрібно виміряти, у відповідній вкладці веб-переглядача
На вкладці Мережа в Інструментах розробника тепер має відображатися вся необхідна інформація. Якщо ви подивитеся на нижню частину вкладки, ви побачите загальний показник для сторінки, включаючи кількість запитів, розмір сторінки та час завантаження.
Нижче наведено скріншот випадкової сторінки з Amazon. Як видно на скріншоті, було 192 загального запиту, а загальний розмір сторінки - 9,7 Мб.
Також на вкладці Мережа ви побачите повну таблицю, де відображаються всі запити, зроблені на сервері, і розмір кожного ресурсу. Ви також можете побачити час завантаження (або вибірки) кожного з цих ресурсів. Ви можете сортувати стовпці Розмір і Час у таблиці, щоб легко знайти " голодні" ресурси. Тепер з даними в руці можна почати оптимізувати сторінку.
Хоча, зовсім не обов'язково, ви повинні перезавантажити сторінку кілька разів, щоб побачити, як вона поводиться, і якщо є якісь помітні зміни між оновленнями. Іноді неефективні функції JavaScript можуть спотворювати значення. Однак загальний розмір сторінки має залишатися незмінним.
Також спробуйте вимкнути кеш. Ви можете легко вимкнути кеш у верхній частині панелі. Ви побачите опцію Вимкнути кеш на верхній панелі інструментів. Виберіть цей параметр, щоб переконатися, що ви отримуєте послідовний звіт про перезавантаження.
Веб-браузер Firefox
Якщо ви використовуєте Mozilla Firefox, ви можете використовувати один з двох інструментів: інструмент веб-розробника або Firebug розширення. Обидва вони дуже схожі і подібні до інструментів у браузерах Chrome. Коли ви зрозумієте, як працює один інструмент, ви можете легко знайти свій шлях навколо інших.
Інструмент веб-розробника вбудований у браузер Firefox, а Firebug - це розширення, яке можна встановити як розширення.
Інструмент веб-розробника відкривається у Firefox за допомогою комбінації клавіш Ctrl + Shift + I. За допомогою клавіш Ctrl + Shift + Q можна безпосередньо відкрити вкладку мережі. Ви також можете відкрити інструмент з меню з назвою Web Developer .
- Натисніть на пункт меню Інструменти
- Виберіть Веб-розробник
- Виберіть пункт Мережа
Після відкриття інструмента натисніть вкладку Мережа , якщо вона ще не вибрана. Тепер завантажте сторінку, яку ви хочете проаналізувати, на вкладці, і вам слід деталізувати показники сторінки.
У правій частині верхньої панелі інструментів ви знайдете певну інформацію про сторінку (вона може знаходитись у правому нижньому куті, залежно від опції). Ви повинні відсортувати таблицю, щоб знайти ресурси, які надто довго завантажуються. Як ви бачите цю сторінку, було 172 запитів і загальною сторінкою 9679 Кб.
Firebug є розширенням веб-розробки, який дуже популярний, і він працює майже так само, як і Web Developer Tool в контексті аналізу сторінок. Я не збираюся вдаватися до докладного опису того, як він працює, але ви повинні знайти необхідну інформацію про розмір сторінки на вкладці Мережа . Вона працює дуже схоже на інструменти, які ми охопили.
Якщо ви ще не використовуєте Firebug, то, ймовірно, це перекручування, щоб встановити його лише для того, щоб знайти розмір сторінки.
Інтернет-ресурси
Є кілька онлайн-аналізаторів веб-сторінок, які можна використовувати для пошуку розміру сторінки. Багато популярних інструментів здійснюють глибокий аналіз, а не просто показують розмір сторінки. Крім того, ці онлайн-аналізатори корисні, тільки якщо у вас є загальнодоступний URL, тобто. Ви вже опублікували сторінку. У більшості випадків ви хочете проаналізувати сторінку, як ви її розробляєте, що робить інструменти на основі браузера набагато кориснішими.
Є деякі онлайн-інструменти / веб-сайти, які використовують лише розмір сторінки, але спочатку слід перевірити, що саме вони включають у розрахунок розміру сторінки. Я вважаю, що деякі з них не містять жодних посилань третьої сторони, таких як Adsense, Disqus тощо.
Ось кілька веб-сайтів, які можна спробувати: Малі інструменти SEO і Отримати рейтинг .
Ви зможете знайти більше за допомогою простого пошуку Google. Happy Оптимізація !!
