Як зробити редирект: докладний огляд для гуманітаріїв

407

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

Як зробити редирект: докладний огляд для гуманітаріїв

Що таке редиректи і навіщо вони потрібні

Редірект — перенаправлення користувача з однієї сторінки на іншу. Наприклад, при переході за посиланням http://texterra.ru/blog/ браузер автоматично перенаправляє користувача URL https://texterra.ru/blog/.

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

В даному випадку донор – сторінка, з якої пересилаються користувачі. Акцептор – сторінка, на яку спрямовуються користувачі.

Ось приклади використання редиректів:

  • Перенаправлення з http https. Приклад вказано вище.
  • Перенаправлення з URL на www URL без www і навпаки. При переході по посиланню https://tinkoff.ru браузер перенаправляє користувача на https://www.tinkoff.ru. При переході по посиланню https://www.vc.ru браузер перенаправляє на відвідувача https://vc.ru/.
  • Переїзд сайту на інший домен. Пару років тому колеги з популярного видання відмовилися від назви «Цукерберг подзвонить» і налаштували редирект з адреси http://siliconrus.com на https://vc.ru/.
  • Перенаправлення трафіку з однієї сторінки на іншу. Наприклад, якщо в інтернет-магазині немає якогось товару, він може перенаправити трафік на сторінку схожого продукту.
  • Перенаправлення користувачів на мобільну версію сайту. Якщо власник ресурсу використовує для адаптації до мобільного трафіку тільки мобільну версію сайту, він налаштовує редирект мобільних користувачів з www.example.au на www.m.example.au.

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

Які бувають види редиректів і коли їх використовують

Для користувача все редиректи однакові: при спробі перейти по одному URL вони потрапляють на інший URL. Зазвичай інтернет-серфери навіть не помічають, що браузер перенаправив їх з однієї адреси на інший.

Браузери і роботи пошукових систем визначають вид редіректу за кодом стану HTTP. Перенаправлення можуть мати різний HTTP статус: 301, 302, 303, 307. Розглянемо докладніше кожен.

Редирект 301

Це найпоширеніший вид перенаправлення. HTTP статус 301 значить, що ресурс назавжди переміщений з запитаний URL на новий. Після отримання відповіді 301 браузер робить новий запит і перенаправляє користувача на актуальну сторінку.

Як зробити редирект: докладний огляд для гуманітаріїв

Якщо ви використовуєте редирект 301, авторитет і посилальний профіль старої сторінки передаються на нову. Наприклад, не бійтеся втратити вага вхідних посилань при перекладі сайту на безпечний протокол з’єднання. Коректний редирект 301 з http https зберігає цю характеристику ресурсу і його конкретних сторінок.

Редирект 302

HTTP 1.0 статус 302 використовувався для позначення тимчасового переміщення запитаного ресурсу на нову адресу. HTTP 1.1 редирект 302 позначає статус «Знайдено» або Found. Тобто ресурс існує, але власник на деякий час перемістив його на нову адресу. Редирект 302 не передає авторитет і посилальний профіль донора акцептору.

HTTP 1.1 для тимчасового перенаправлення запропоновані редиректи 303 і 307. Це пов’язано з некоректною обробкою статусу 302 в деяких браузерах.

За стандартами HTTP 1.0 браузер після отримання відповіді 302 повинен використовувати для нового запиту метод POST. Розробники деяких браузерів не дотримуються цей стандарт і використовують для нового запиту метод GET. HTTP 1.1. цю проблему вирішують редиректи 303 і 307.

Замість 302 для тимчасового перенаправлення краще використовувати редиректи 303 і 307.

Редиректи 303 і 307

HTTP 1.1 статус 303 запропоновано замість редіректу 302. Значення коду – See Other або «Дивіться інший ресурс». Для нового запиту браузер повинен використовувати метод GET. Застосовуйте редирект 303, коли у вас немає адекватної відповіді на запит користувача, але є більш або менш підходяща заміна.

Редирект 303 підходить, коли на цільовій сторінці є форми. У цьому випадку важливо, щоб браузер робив запит безпечним методом GET.

Статус 307 також використовується замість редіректу 302. Значення коду – Temporary Redirect або «тимчасове перенаправлення». Браузер не повинен змінювати метод нового запиту. Запити безпечними методами GET і HEAD виконуються автоматично. Запити небезпечними методами, наприклад, POST, виконуються з підтвердженням користувача.

Використовуйте редирект 307, щоб показати, що шуканий ресурс тимчасово доступний за іншою адресою.

Проміжний висновок: у більшості випадків власникам сайтів підходить редирект 301. У цьому разі HTTP статус повідомляє пошукових роботів, що документ назавжди переміщений на нову адресу. Цей вид редіректу передає авторитет і посилальну масу зі сторінки-донора на сторінку-акцептор. Редиректи 303 і 307 використовуються, коли власник сайту хоче тимчасово перенаправляти користувачів з одного документа на інший.

Чек-лист по оптимізації сайту, або 100+ причин не ховати SEO

Які типи редиректів бувають

Редиректи класифікуються за способом реалізації. Налаштувати перенаправлення можна через файл .htaccess або nginx2.config, засобами PHP, HTML, JavaScript. Докладніше про кожному типі нижче.

Що таке htaccess-редирект

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

Щоб налаштувати перенаправлення, змініть файл .htaccess. Для доступу до файлу скористайтесь FTP-клієнтом, наприклад, FileZilla. У налаштуваннях програми в меню «Сервер» увімкніть примусове відображення прихованих файлів. Файл .htaccess знаходиться в папці з назвою доменного імені ресурсу в каталозі public_html.

Як зробити редирект: докладний огляд для гуманітаріїв

Щоб відредагувати файл, скачайте його на жорсткий диск комп’ютера. Для цього виділіть файл і в контекстному меню виберіть потрібну опцію. Щоб завантажити відредагований файл на сервер, виділіть його в списку файлів і папок на жорсткому диску, відкрийте контекстне меню і виберіть потрібну опцію.

Як зробити редирект: докладний огляд для гуманітаріїв

В інтерфейсі FTP-клієнта FileZilla зліва доступні файли і папки локального комп’ютера, а праворуч — файли і папки віддаленого сервера.

Як зробити редирект: докладний огляд для гуманітаріїв

Також доступ до файлу .htaccess можна отримати через панель управління хостингом. В cPanel відкрийте розділ інтерфейсу «Файли – Диспетчер файлів».

Як зробити редирект: докладний огляд для гуманітаріїв

У налаштуваннях диспетчера увімкніть відображення прихованих файлів.

Як зробити редирект: докладний огляд для гуманітаріїв

Скачайте файл на комп’ютер і виправте. Також файл можна редагувати через cPanel.

Як зробити редирект: докладний огляд для гуманітаріїв

Щоб відредагувати файл .htaccess, відкрийте його в блокноті. Додайте код редіректу. Збережіть зміни і завантажте файл на сервер.

Як зробити редирект: докладний огляд для гуманітаріїв

Про коді редіректів налаштуваннях конкретних перенаправлень піде мова нижче.

Щоб редірект на сервері під управлінням Nginx, потрібно додати код перенаправлення в конфігураційний файл nginx2.conf. Код додається в блоці server. Отримати код редіректу можна за допомогою конвертера.

PHP-перенаправлення

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

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

Скачайте на жорсткий диск файл index.php або відкрийте його для редагування у вікні диспетчера файлів панелі управління хостингом. Файл знаходиться в кореневій папці сайту. Там же знаходиться файл .htaccess.

Як зробити редирект: докладний огляд для гуманітаріїв

Додайте у файл index.php код редіректу. Збережіть зміни і завантажте файл на сервер.

Як зробити редирект: докладний огляд для гуманітаріїв

JavaScript-редирект

Редірект з допомогою коду JavaScript виконується на стороні браузера, а не на стороні сервера. Щоб відвідувач потрапив зі старої сторінки на нову, скрипт редіректу повинен повністю завантажитися в браузері. Тому JavaScript-редирект – більш повільний спосіб перенаправлення, ніж серверні редиректи. Ще одна проблема — автоматичне перенаправлення не спрацює, якщо користувач відключив у браузері JavaScript.

Тим не менш JavaScript-перенаправлення в деяких випадках зручні. Наприклад, їх можна використовувати для перенаправлення з затримкою. Ви можете написати на старій сторінці повідомлення на кшталт «Ми переїхали на новий сайт, зараз ви будете автоматично туди перенаправлені». Через кілька секунд користувач автоматично потрапить на нову сторінку.

Щоб реалізувати перенаправлення з допомогою JavaScript, додайте код редіректу між тегами і сторінки, з якої потрібно перенаправляти користувачів. На сайтах під управлінням WordPress це можна зробити за допомогою безкоштовного плагіна Per page add to head.

Як зробити редирект: докладний огляд для гуманітаріїв

Збережіть зміни на сторінці і перевірте, як працює редирект.

Як зробити редирект: докладний огляд для гуманітаріїв

HTML-редирект

Цей тип перенаправлення також працює на стороні браузера. Щоб перенаправлення спрацювало, оглядач повинен завантажити відповідний HTML-код: мета-тег refresh. Тому цей тип редиректів працює повільніше перенаправлень на рівні сервера.

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

Як зробити редирект: докладний огляд для гуманітаріїв

Збережіть зміни і перевірте, як працює перенаправлення.

Проміжний підсумок: віддавайте перевагу серверні редиректи, так як вони зручніше для користувачів. У більшості випадків перенаправлення краще налаштовувати через конфігураційний файл .htaccess для серверів Apache та nginx2.config для серверів на Nginx.

Як скласти грамотне техзавдання на розробку сайту

Де взяти код редіректу

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

  • Redirect 301 Code Generator. Генерує код редіректу для Apache, ASP і ASP.NET. Також створює JavaScript і HTML-перенаправлень.
  • Seomagnifier. Створює код 301 редіректу з домену з www на домен без www і навпаки.
  • Redirect 301 Code Generator Tool. Створює редиректи зі сторінки на сторінку, а також з домену без www на домен з www. Генерує PHP-код, перенаправлення для серверів на ASP і ASP.NET, HTML і JavaScript-перенаправлення.
  • Генератор файлу .htaccess. Створює код редиректів зі сторінки на сторінку, а також між розділами сайту, генерує скрипти перенаправлень з домену з www на домен без www.
  • Універсальний генератор коду для перенаправлень .htaccess. Можна вибрати сценарій редиректа, вказати URL і згенерувати код.
  • Генератор редиректів 301. Створює код перенаправлень для серверів Apache, ASP, ASP.NET, а також код HTML і JavaScript-редиректів.
  • Генератор перенаправлень від Brontobytes. Допоможе редірект зі старого домену на новий, змінити адресу окремих сторінок і розділів ресурсу, налаштувати перенаправлення з домену без www на домен з www.
  • Користувачам серверів на Nginx буде корисний конвертер коду. Він трансформує редиректи .htaccess в перенаправлення для nginx2.config.

За даними британської компанії Netcraft на листопад 2017 року, 44 % активних сайтів працюють на серверах під управлінням Apache. 21 % ресурсів працює на серверах під управлінням Nginx. Частка серверів з іншим не перевищує 8 %.

Як робити редиректи: популярні приклади

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

Як зробити редирект з http https

Часто власники сайтів стикаються з необхідністю зробити серверний редирект при перекладі сайту на безпечний протокол з’єднання. Щоб реалізувати перенаправлення, виконайте наступні дії:

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

    Коректно перевести сайт на безпечний протокол допоможуть наступні ресурси:

    • Розповідь нашого маркетолога Тимура Фехрайдинова про досвід і особливості перекладу на безпечний протокол сайту «Текстерры».
    • Технічна інструкція по перекладу на https сайту на WordPress, включаючи тактику роботи з Google Search Console і «Яндекс.Вебмастер».
    • Плагін для WP Really Simple SSL. За хвилину вирішує всі технічні завдання, пов’язані з установкою SSL-сертифіката і перекладом сайту на безпечний протокол.
    Як зробити редирект: докладний огляд для гуманітаріїв

    Як зробити редирект на www

    Докладну інструкцію по перенаправленню з домену без www на домен без www через файл .htaccess читайте в статті про дзеркала сайтів. Якщо хочете, виконайте цей же редирект з допомогою php. Дійте так:

  • Завантажте на жорсткий диск файл index.php.
  • Згенеруйте код редіректу.
  • Вставити код в файл, збережіть зміни і завантажте index.php на сервер.
  • Вкажіть основний URL в налаштуваннях сайту. В WordPress це можна зробити в меню «Параметри – Общие».
  • Як зробити редирект: докладний огляд для гуманітаріїв

    У створеному коді може бути згадка сайту генератора. Воно не впливає на роботу перенаправлень, тому його можна видалити.

    Перевірте, як працює перенаправлення. На ілюстрації нижче видно, що до налаштування редіректу сайт був доступний за двома URL. Після зміни файлу index.php ресурс доступний за однією адресою.

    Як зробити редирект: докладний огляд для гуманітаріїв

    Як налаштувати перенаправлення з однієї сторінки

    Щоб редірект з однієї сторінки на іншу, відредагуйте файл .htaccess або index.php: додайте в нього згенерований код редіректу. Якщо сайт працює на WordPress, скористайтеся для налаштування редиректів плагінами:

    • Simple 301 Redirects. Про налаштуваннях читайте в статті про дзеркало сайтів.
    • Redirection. Інструкція по налаштуванню дивіться в нашій статті «Лайфхаки для користувачів WordPress».
    • Redirect. Додає блок налаштування редиректів на сторінку редагування публікацій.
    Як зробити редирект: докладний огляд для гуманітаріїв

    Перенаправлення можна налаштовувати через панель управління сервером. В cPanel налаштування доступні в розділі «Домени – Перенаправлення». Інструкції дивіться в статті про дзеркала сайтів.

    Як редірект при зміні домену

    При переїзді на новий домен перенаправлення налаштовується так само, як перенаправлення з http або https з домену з www на домен без www. Зміни можна внести через файл .htaccess або index.php.

    Згенеруйте код посторінкового редіректу. Для цього вкажіть URL старого і нового домену і відзначте прапорцями опції, зазначені на ілюстрації.

    Як зробити редирект: докладний огляд для гуманітаріїв

    Додайте код в файл .htaccess і збережіть зміни.

    Як зробити редирект: докладний огляд для гуманітаріїв

    Як зробити редирект папки

    Редирект папки (каталогу, директорії) можна налаштувати за допомогою файлів .htaccess або index.php. Налаштування перенаправлень може знадобитися, якщо в URL сторінок відображаються назви директорій.

    Наприклад, у блозі про книги URL може виглядати так: https://exampleblog.ru/klassica/idiot. Автор створює окремий каталог для російської класики і хоче, щоб URL виглядав так: https://exampleblog.ru/russkaya-klassica/idiot. В .htaccess потрібно додати такий код:

    RedirectMatch 301 ^/klassica/(.*)$ /russkaya-klassica/$1

    Окремі випадки: редирект слеша і редирект розширення

    Одні власники сайтів воліють URL зі слешем в кінці, а інші без слеша: https://exampleblog.ru/page/ і https://exampleblog.ru/page відповідно. Пошукові системи вважають варіанти зі слешем і без нього різними URL. Тому важливо вибрати бажану структуру мережевих адрес і налаштувати перенаправлення.

    Згенеруйте код редиректа і додайте його у файл .htaccess. Переконайтеся, що відзначили галочкою потрібну опцію.

    Як зробити редирект: докладний огляд для гуманітаріїв

    Щоб налаштувати перенаправлення з адреси з розширенням на адресу без розширення, згенеруйте код і додайте його в конфігураційний файл. Редірект з URL з розширенням .html URL з розширенням .php виглядає так:

    RewriteEngine on

    RewriteRule index\.html index.php [NC,R]

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

    Як перевірити редирект

    Перевірити редирект можна в браузері. Почистіть кеш або відкрийте оглядач в режимі інкогніто і введіть URL. Також перевіряти перенаправлення можна з допомогою веб-сервісів:

    • Чекер PrCy.
    • Redirect Checker.
    • Redirect Check.

    Чекер показують вид редиректа і статус відповіді сервера при переході на нову адресу.

    Як зробити редирект: докладний огляд для гуманітаріїв

    Зробити редирект просто

    Для цього в першу чергу виберіть вид редіректу. У більшості випадків підходить перенаправлення 301 або постійний редирект. Іноді для тимчасового перенаправлення варто використовувати редирект 303 і 307.

    Виберіть тип редіректу. Швидше за все працюють серверні редиректи, які настроюються за допомогою конфігураційних файлів .htaccess для серверів Apache та nginx2.config для серверів Nginx. Також можна налаштувати PHP-редирект з допомогою файлу index.php. JavaScript і HTML-перенаправлення працюють повільніше, тому використовуйте їх у виняткових випадках.

    Згенеруйте код редіректу з допомогою одного із запропонованих у статті сервісів і додайте його в конфігураційний файл або файл index.php. Перевірте коректність редіректу вручну або за допомогою веб-сервісу.