» » Аналізуємо якість сайту за допомогою DOM Monster

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

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

-кількість зовнішніх JS і CSS файлів. Наприклад, багато плагіни для WordPress використовують свої власні CSS і JS файли, які завантажуються разом зі сторінкою;

-оптимізація і стиснення зображень, JS-скриптів та CSS файлів. Наприклад, JPG зображення в 100% якості, розмір окремих CSS і JS файлів і т.д.;

-стиск сторінок сервером. Чи використовується для сайту Gzip - утиліта стиснення і відновлення файлів;

-використання кешування сторінок. Наприклад, застосування різноманітних плагінів WordPress для кешування - від Hyper Cache до Maxsite Cache;

-оптимізація кількості завантажуваних елементів і зменшення кількості http-запитів. Наприклад, використання CSS спрайтів або видалення зайвих і невикористовуваних сторонніх додатків (кілька варіантів кнопок Twitter, Facebook і т.д.;


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

-оптимізація і очищення бази даних сайту. З'явилися у версії WordPress 3.0 ревізії дуже сильно засмічують базу, що призводить до збільшення її об'єму і більше тривалій обробці запитів

А я в свою чергу хочу розповісти вам про вподобаному мені новому легкому і зручному інструменті для аналізу якості сайту під назвою DOM Monster - cross-браузерному Букмарклет, який дозволяє аналізувати об'єктну модель документа та інші особливості сторінок.

Навіщо потрібен DOM Monster і що він вміє
Не дивлячись на досить широке кількість різного роду оптимізаторів, DOM Monster надає додаткову інформацію, яку я не бачив в інших сервісах аналізу. наприклад:
аналіз JS-коду в тексті сторінки і його обсягу;
перевірка кількості зовнішніх JS і CSS-файлів;
перевірка кількості iframe в коді сторінки;
перевірка глибини укладення коду;
перевірка порожнього і невикористаного місця в коді сторінки (прогалини, переноси рядків і т.д.);
аналіз Doctype сторінки;аналіз кількості коментарів у коді сторінки;
аналіз відповідності сторінки - HTML5;
перевірка актуальності використовуваної версії jQuery.

Як використовувати DOM Monster
На відміну від Firebug / Page Speed ​​, DOM Monster - це букмарклет , який працює практично не залежно від платформи або браузера ( на жаль , поточна версія 1.2.8 не підтримує Internet Explorer). Крім того , оновлення і контроль версій не потрібно, тому сам букмарклет це JS- файл , розміщений на сервері розробника. Втім , ви можете завантажити вихідний код і розмістити файл у себе на сервері.У використанні DOM Monster вкрай простий - просто перетягніть посилання на панель закладок браузера , потім зайдіть на будь-який сайт і натисніть на неї . У вас відкриється вікно , аналогічне тому , що на скріншоті нижче , з усіма параметрами та порадами по сайту.

Аналізуємо якість сайту за допомогою DOM Monster


665 22.11.13



Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера