Ця стаття є частиною серії під назвою Magento SEO.

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

Збільшення швидкості

Скорочення часу завантаження сторінки є проблемою для всіх веб-розробників. Будучи гігантської CMS, Magento працює не дуже швидко, але, внісши невеликі зміни, ви зможете збільшити продуктивність.

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

З 2010 року Google у визначенні рейтингу сторінок надає особливого значення часу завантаження сторінки сайту. У цій статті ми коротко обговоримо деякі прості способи зменшення часу завантаження сторінок вашого Magento.

Швидкий і простий спосіб зробити ваш Magento сайт швидким — це внести кілька невеликих змін в панелі адміністрування. Перш за все, потрібно включити кеш Magento. Тільки цей маленький крок дозволить скоротити час завантаження сторінок на 30-40%.

При включеному кеші Magento може не завантажувати всі сторінки ресурсу з сервера при кожному запиті. Щоб включити кеш Magento перейдіть до Система — Управління кешем. Виберіть всі типи кеша і в випадаючому меню у правому верхньому куті панелі адміністрування виберіть дію «Включити», після чого натисніть кнопку «Підтвердити»:

По-друге, нам потрібно об’єднати файли CSS і JS до виводу. Переходимо до Система – Конфігурація — Розробник. Тут ви побачите опцію «Злиття файлів JavaScript» і «Злиття файлів CSS. Встановіть для цих полів значення «Так» і натисніть «Зберегти»:

Прискорення і додавання функціональних фрагментів в Magento

Об’єднання CSS і JS файлів дозволить скоротити кількість запитів до сервера під час завантаження сторінки. Це також суттєво скоротить час завантаження.

Далі, ми будемо запускати процес компіляції Magento. Функція компіляції Magento компілює всі файли Magento, щоб створити один шлях include для підвищення продуктивності. Це зменшує час завантаження сторінки на 25-50%.

Для того щоб використовувати цей інструмент, для папки includes і файлу includes/config.php повинно бути дозволено внесення змін.

Щоб почати процес компіляції, виберіть пункт Система – Сервіс — Компіляції. У правому верхньому куті ви побачите кнопку «Запустити процес компіляції». Натисніть цю кнопку, і процес запуститься:

Прискорення і додавання функціональних фрагментів в Magento

Далі ми повинні зробити кілька додаткових дій для скорочення часу завантаження сторінок, які потребуватимуть змін у файлі .htaccess. В папках Magento може бути кілька файлів .htaccess, але тут ми будемо редагувати один з них, той, що розташований в кореневій директорії.

Через файл .htaccess ми спочатку задамо кодування вмісту, яка буде стискати файл перед відправкою його запитувачу агенту. Це дозволить зменшити час завантаження файлів. По-друге, ми додамо в заголовках тривалість їх дії. Це означає, що при завантаженні ресурсів браузер буде перевіряти заголовки. Якщо термін дії заголовків не закінчився, то буде використовуватися кешована версія.

Щоб включити стиснення, виведіть з коментарів цю рядок коду у файлі .htaccess за замовчуванням, тобто видалити символ # перед php_flag zlib.output_compression on:

############################################
# enable resulting html compression
php_flag zlib.output_compression on
############################################

Далі, щоб привести в дію gzip-стиснення, ми додаємо в файл .htaccess наступні рядки:

############################################
# Inserting filter on all content
SetOutputFilter DEFLATE
# Inserting filter only on selected content types
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css-text/javascript application/javascript
# Tackling some Netscape 4.x problems
BrowserMatch ^Mozilla/4 gzip-only-text/html
# Tackling some Netscape 4.06-4.08 problems
BrowserMatch ^Mozilla/4.0[678] no-gzip
# Scenario: MSIE masquerades as Netscape
BrowserMatch bMSIE !no-gzip !gzip-only-text/html
# Command not for images compressing
SetEnvIfNoCase Request_URI .(?:gif|.jpe?g|png)$ no-gzip dont-vary
# Handling Proxies correctly
Header append Vary User-Agent env=!dont-vary
############################################

І в кінці давайте задамо ліміт дійсності для заголовків, додавши у файл .htaccess наступний код:

############################################
# First of all enable expirations
ExpiresActive On
# Default expiration
ExpiresDefault «access plus 1 month»
# For favicon
ExpiresByType image/x-icon «access plus 1 year»
# Set Images Expiry
ExpiresByType image/gif «access plus 1 month»
ExpiresByType image/png «access plus 1 month»
ExpiresByType image/jpg «access plus 1 month»
ExpiresByType image/jpeg «access plus 1 month»
# Set CSS Expiry
ExpiresByType text/css «access 1 month»
# For Javascript Expiry
ExpiresByType application/javascript «access plus 1 year»
############################################

Ще одна дуже важлива річ для підвищення швидкості вашого Magento магазину — це вибір сервера. У цій статті дуже докладно роз’яснено фактори, які слід враховувати при виборі сервера під Magento.

Реалізація функціональних сніппетів

Тепер настав час розробити спосіб реалізації схем — або функціональних фрагментів — у нашому Magento магазині. Вони не тільки додадуть вашим результатами пошуку більш професійний вигляд, але це також дозволить вам збільшити кількість переходів зі сторінок пошуку.

У цій статті ми будемо інтегрувати такі функціональні сніппети: товари, пропозиції і середні рейтинги. А, зрештою, я дам вам кілька посилань на ресурси, з допомогою яких ви зможете реалізувати «хлібні крихти» і схеми розміщення товарів.

За замовчуванням результати пошуку в пошукових системах виглядають наступним чином:

Прискорення і додавання функціональних фрагментів в Magento

Реалізувавши функціональні фрагменти, ви можете надати їм такий вигляд:

Прискорення і додавання функціональних фрагментів в Magento

Майте на увазі, що реалізація цих рекомендацій потребує редагування файлів шаблонів. Для їх реалізації ви повинні мати базові знання з HTML і PHP. Крім того, переконайтеся, що перед редагуванням ви зберегли резервну копію кожного файлу.

Ми почнемо з реалізації схеми розміщення продукту. Відкрийте в редакторі цей файл:

app/design/frontend/[package]/[theme]/template/catalog/product/view.phtml і додайте виділений код в клас product-view:

Тепер давайте задамо теги для назви товару, описи та зображення. Щоб задати теги для назви продукту, знайдіть тег h1, що містить назву продукту, і додайте в нього наступний код:

productAttribute($_product,$_product->getName(), ‘name’) ?>

Тепер, щоб поставити теги для опису, знайдіть div опису продукту і переконайтеся, що він включає в себе атрибути з наступним кодом:

productAttribute($_product, nl2br($_product->getShortDescription()), ‘short_description’) ?>

Далі, у файлі
app/design/frontend/[package]/[theme]/template/catalog/product/view/media.phtml, знайдіть теги зображення (якщо ви використовуєте тему за замовчуванням, ви знайдете їх в двох місцях — у рядках 40 та 62), і включіть в них наступне:

$_img = ‘Прискорення і додавання функціональних фрагментів в Magento‘;
$_img = ‘Прискорення і додавання функціональних фрагментів в Magento‘;

Тепер, ми додамо інформацію про середню рейтингу товару. Для цього відкрийте цей файл:
app/design/frontend/[package]/[theme]/template/review/helper/summary.phtml.

Замініть весь код у файлі наведеним нижче кодом:

getReviewsCount()): ?>

__(‘%d Review(s)’, $this->getReviewsCount()) ?>
|
__(‘Add Your Review’) ?>



getDisplayIfEmpty()): ?>


__(‘Be the first to review this product’) ?>

Тепер, щоб забезпечити виведення розділу пропозицій, відкрити такий файл:
app/design/frontend/[package/[theme]/template/catalog/product/view/type/default.phtml.

Додайте наступний код в початку, після перших коментарів (приблизно у рядку 28):


isAvailable()): ?>

__(‘Availability:’) ?>
__(‘In stock’) ?>

__(‘Availability:’) ?>
__(‘Out of stock’) ?>

І в кінці файлу додайте наступний код:

Щоб додати ціну, відкрийте цей файл:
app/design/frontend/[package]/[theme]/template/catalog/product/price.phtml.

Додати код відповідні атрибути в кожному примірнику об’єкта класів price і regular-price. Для кожного екземпляра блоку span з класом price ми додаємо наступний код:

currency($_price + $_weeeTaxAmount, true, true)); ?>

Крім того, для кожного span з класом regular-price ми додаємо в нього наступний код:

currency($_price + $_weeeTaxAmount, true, true)); ?>

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

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

Висновок

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

У наступній статті цієї серії я поділюся деякими міркуваннями з приводу SEO для створення установок мульти-магазину для Magento. А також наведу короткий огляд деяких корисних SEO-розширень для Magento.

Переклад статті «Increasing Speed and Adding Rich Snippets in Magento» був підготовлений дружною командою проекту Сайтостроение від А до Я.