Надежный способ сокрытия ссылок сайта от поисковых роботов -12


В один из рабочих дней мне пришел список заданий. Отдельным пунктом была просьба найти способ надежного сокрытия внешних ссылок на сайте от поисковых систем.

В чем суть проблемы? Существует несколько способов спрятать ссылку от поисковых роботов, но у них имеются свои особенности:

  1. javascript позволяет закрыть ссылку от индексации, но сам google уже спокойно понимает такие скрипты;

  2. можно добавить к ссылке атрибут nofollow – это просто, но ссылочный вес самой ссылки будет теряться и при периодическом переиндексировании снизится общий вес сайта;

  3. cамый странный метод сокрытия ссылок — это закрытие конкретных страниц от индексации при помощи мета тегов или в файле robots.txt, но происходит полная потеря ссылочного веса передаваемого странице.

Зная эти нюансы, специалист по СЕО исключил все три способа сокрытия ссылок и предложил мне попытаться найти новое решение. И оно было найдено: что, если засунуть ссылку в некий стандартный функционал на сайте, который поисковый робот всегда игнорирует?
Возьмем обычную форму с методом отправки post:

<form method="post">
    <button class="my">
       Образец экспериментальной ссылки
    </button>
</form>

При помощи класса my можно стиль формы сделать оптимальным для дизайна вашего сайта, например:

<style>
      .my{
          border:none;
          background: none;
          text-decoration: underline;
          color: blue;
          cursor: pointer;
          color:#00bceb
      }
      .form{
        width: 300px;
        margin: 50px auto;
      }
</style>

Как же добавить в форму нужную ссылку? Тут я вспомнил про javascript, теперь наша форма выглядит так:

<form method="post">
    <button class="my" onclick="window.open('https://librebook.me/the_mysterious_island');">
        Образец экспериментальной ссылки
    </button>
</form>

Как только пользователь кликнет по кнопке формы, замаскированной под ссылку, сработает форма с методом post, команда onclick выполнится и откроется новая вкладка по требуемому адресу. Задача условно решена. Однако, если таких ссылок много на странице, для каждой писать форму?

Воспользуемся PHP. Пусть у нас имеется массив ссылок, например:

$mass = [
   'Таинственный остров' => 'https://www.litmir.me/bd/?b=265607',
   'Три дня Индиго' => 'https://www.litres.ru/sergey-lukyanenko/tri-dnya-indigo/',
   'Зеленая Миля' => 'https://librebook.me/the_green_mile',
   'Герой должен быть один' => 'https://librebook.me/geroi_doljen_byt_odin',
   'Затерянный мир' => 'https://librebook.me/zateriannyi_mir_doil_artur_ignatius_konan',
];

Добавим простейшим способом все формы на страницу:

foreach($mass as $k => $v) {
   echo '<br><form method="post"><button class="my" onclick="window.open(\''. $v .'\');">'. $k .'</button></form>';
}

Здесь нужно очень внимательно следить за расстановкой одинарных и двойных кавычек, чтобы не было ошибки.

Для одной страницы задача решена, а если страниц много? Проще всего создать функцию и ее вызывать с нужными параметрами:

function s_link(string $name, string $link) {
   $res = '<br><form method="post"><button class="my" onclick="window.open(\''. $link .'\');">'. $name .'</button></form>';
   return $res;
}

$res = s_link('Yandex','https://ya.ru');
echo $res;

Если js в данном примере не нравится, то можно обойтись без него:

<form method="post" action="https://www.litmir.me/bd/?b=265607" target="_blank">
    <button class="my">
       Таинственный остров
    </button>
</form>

Тогда функция будет выглядеть так:

function m_link(string $name, string $link) {
  $res = '<br><form method="post" action="'.$link.'" target="_blank"><button class="my">'.$name.'</button></form>';
  return $res;
}

$res = m_link('Books','https://www.labirint.ru/books/');
echo $res; 

Если заместо названия ссылки хочется поместить картинку, то html код:

<form action="https://google.ru" target="_blank">      
    <button class="my">
       <img src="123.jpg" alt=""> 
    </button>
</form>


Чтобы еще больше упростить жизнь, если подобных ссылок очень много, можно сделать выборку всех статей из базы данных в тех разделах сайта, где требуется сделать замену ссылки на форму. Затем посмотреть вхождение конкретной ссылки в статью и поставить на нее место форму отправки данных. В этом случае придется учитывать особенности «движка» вашего сайта, количество статей и ссылок. Например, обработку данных лучше делать поэтапно: берем сто статей, производим необходимую работу, следующий массив из ста статей. Подобные скрипты запускаются обычно вечером, когда с контентом сайта никто не работает.

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

После помещения ссылки в форму, браузер ее уже не замечает.


Есть небольшой недостаток внешнего вида "ссылки" у данного способа: сам тег <form> является блочным, то есть занимает всю строку. Если попытаться вставить подобные элементы в предложение, то все формы уходят на новую строку и текст становится с разрывами. Это явление лучше учитывать: я добавлял в стили "display: contents" и разрывов уже не было.

Код на гитхабе для ленивых

Уважаемые читатели! Какими методами сокрытия ссылок веб-страниц вы пользуетесь?




Комментарии (54):

  1. Expany
    /#24363742 / +2

    Ок ок, мы можем добавить onclick с window.open, хотя в случае открытия в той же вкладке было бы правильнее применить location.href, да и в целом, можно было бы отказаться от js, используя под ссылку атрибут action="" и передавать данные(которых нет) в method="get"

    • coder_one
      /#24363888

      Есть разные решения любой задачи - это вполне нормальное явление.

  2. haldagan
    /#24363754 / +1

    Я про пауков мало знаю, поэтому возникли вопросы:

    который поисковый робот всегда игнорирует?

    Если всегда игнорирует - зачем извращения с javascript? И какова причина этого игнорирования?

    сам google уже спокойно понимает такие скрипты;

    Так если гугл спокойно эмулирует js, то почему он проигнорирует "window.open"?

    window.open

    Ну такое себе. Может откроется, а может "popup has been blocked".

    браузер ее уже не замечает

    И о чем это говорит? Если, например, засунуть эту ссылку в action формы или кнопки, то поведение, вроде, таким же будет.

    сам тег <form> является блочным, то есть занимает всю строку

    "display:inline"? Вот на этом моменте возникает вопрос: а написанное до этого вообще хоть какую-то ценность имеет?

    • coder_one
      /#24363926

      1.) "Если всегда игнорирует - зачем извращения с javascript?
      СЕОшник сказал, что это сработало.
      2.)JS находится внутри формы
      3.)Всякое может быть, я обычно рассчитываю на большинство пользователей. Некоторые ребята вообще запрещают исполнение js браузером, теперь без фронтенда обходиться?
      4.)Просто наглядный пример.
      5.)"display:inline" пробывал и ни на одном сайте, где я применял формы он не сработал. Причину не выяснял. Помогает display: contents. В этом месте указал лишь особенность, а не невозможность решить проблему.

    • sanchezzzhak
      /#24366902

      Скорее всего гугл не кликает по кнопкам, так-как этот функционал может быть отправкой комментария или вызов Ктулху по телефону.

  3. dimuska139
    /#24363758 / +6

    Я люблю ссылки открывать в новой вкладке с помощью нажатия на колёсико мыши. В данном случае это будет работать?

    • GenkaOk
      /#24363842 / +6

      Нет. Как и не будет работать "Скопировать ссылку"

      Ужасное решение, всякий раз сталкиваясь с такими "оптимизаторами" мучаюсь копируя ссылки.

      В чём проблема использовать <noindex></noindex>

      • coder_one
        /#24363876 / -3

        В начале статьи я описал в чем проблема использования noindex и nofollow. Поэтому пришлось придумывать решения задачи.

    • coder_one
      /#24363880 / -2

      При клике автоматически ссылка будет в новой вкладке. Я это предусмотрел, чтобы посетитель не уходил с сайта: посмотрел что ему интересно, закрыл новое окно и попал снова на сайт.

      • dimuska139
        /#24363910 / +8

        Я в день лазаю по десяткам сайтов. Где-то клик (левой кнопкой мыши) по ссылке открывает страницу в новой вкладке, а где-то нет - поэтому я всегда нажимаю на ссылку колёсиком. И, нет, я не один такой. А тут получается, что при нажатии колёсиком на ссылку на вашем сайте, не произойдёт вообще ничего. По-моему, это не очень, потому что подобные SEO-вопросы не должны влиять на удобство пользования сайтом.

        • coder_one
          /#24363938 / -5

          Иногда приходится жертвовать удобством ради достижения цели. С хорошим СЕО больше бесплатного трафика получается.

          • dimuska139
            /#24364116 / +4

            Такое ощущение, будто б вы мне сейчас из 2007-го года написали. Посмотрите топ выдачи по разным запросам и то, насколько сайты из топа не следуют "правилам СЕО" в большинстве своём. Решает, основном, нормальная работа сайта на мобильных устройствах, скорость загрузки страниц и поведенческие факторы. Всё остальное - мелочи, влияние которых ничтожно.

            • coder_one
              /#24364130 / -2

              Я не специалист по СЕО, но ребята, с которыми я работаю стараются учесть все моменты, чтобы получить максимальный результат.

              • dopusteam
                /#24364218

                Судя по статье - далеко не все

              • dimasmagadan
                /#24368640

                интересно, как эти самые ребята учитывают требования поисковиков по accessibility?

              • Fuyusion
                /#24368708

                В данном случае, неудобство сайта ведёт к уменьшению количества юзеров, это куда более весомый аргумент для ранжирования

        • sden77
          /#24364150

          Интересно, есть ли хоть какое-то объективное исследование о наличии смысла в таких ссылках? А то слышу эти рассказы про связь количества исходящих ссылок и положении сайта в выдаче уже лет 15. Такое ощущение, что это уже из разряда городских легенд.

          • coder_one
            /#24364166 / -2

            В нашей организации это практикуется до сих пор, значит есть смысл.

            • dopusteam
              /#24364220 / +10

              Нет, не значит

              • coder_one
                /#24364288 / -1

                вряд ли сеошник будет делать лишнюю работу просто так, когда зарплата от этого не увеличивается

                • sden77
                  /#24364376 / +8

                  Правильная имитация бурной детельности - один из важнейших скиллов сеошника

                  • coder_one
                    /#24364386 / -1

                    Зачем ему что-то имитировать, если работы полно?

        • drdead
          /#24364342 / +6

          А тут получается, что при нажатии колёсиком на ссылку на вашем сайте, не произойдёт вообще ничего.

          *Мидл клик х2* "Ага, сайт нихрена не работает нормально, кто вообще кодил" *вкладка закрывается*

          Прекрасный способ потерять пользователей.

          • coder_one
            /#24364350 / -2

            Т.е.по Вашему все так делают? Вы лично вели опрос и владеете статистикой?
            Очень сильно в этом сомневаюсь.

  4. dopusteam
    /#24363812 / +2

    А зачем вообще скрывать ссылки?

    • coder_one
      /#24363866 / -3

      В данном случае это полезно для СЕО

      • dopusteam
        /#24364014 / +2

        Ужас какой то. И это не ответ, кстати

        • coder_one
          /#24364038 / -1

          По сути, здесь речь идет об увеличении бесплатного трафика на сайт через работу с СЕО.

          • Deosis
            /#24367716

            А теперь представьте, что все сайты ссылающиеся на вас сделаю также.

            Ваш сайт просто исчезнет из гугла, так как он не найдет на него ссылки.

            • coder_one
              /#24368272

              Вы пишите не обоснованную ерунду, сразу ставьте мне минус в карму и рейтинг тоже, для этого же все эти сомнительные комменты тут? Видимо, в песочнице все люди с рейтингом любят "доминировать". Речь идет о правильном SEO в конкретных случаях, а Вы возводите все в абсолют.

      • mentin
        /#24364370

        В смысле SEO (search engine optimization), а не CEO? Или это что-то другое?

        Но в любом случае это не объяснение кому это помогает (вашему сайту, или тому на который ссылаются) и как?

    • Dofmen
      /#24364412

      Это нужно когда на сайте есть большое количество исходящих ссылок на сторонние ресурсы (например страницы с контактами организаций и их сайтов) чтобы поисковики не "опускали" сайт из за этого ибо они считают такойсайт ссылочной помойкой...

      • Klenov_s
        /#24364558 / +1

        Именно для таких случаев предусмотрен nofollow. На нормальных сайтах это вполне адекватно работает и поисковики ничего такого о сайте не думают. А, вот, когда сайт на самом деле является ссылочной помойкой и приходится изобретать такие костыли.

  5. PaulZi
    /#24363826

    Для формы можно указать target _blank также как и для ссылки

    • coder_one
      /#24363868 / -1

      зачем, если открытие итак идет в новом окне?

      • PaulZi
        /#24363894

        Затем что не требуется js

        • coder_one
          /#24363908 / -1

          Ссылку как передавать будете?

          • PaulZi
            /#24363936 / +1

            <form action="https://ya.ru" target="_blank"><button>open</button></form>

            Можно ещё вынести форму куда то вниз перед боди, и использовать только кнопку с атрибутами form и formaction.

            Но это все конечно странности...

            • coder_one
              /#24363944 / -2

              спасибо, про атрибут target="_blank" для формы не знал.

  6. Dofmen
    /#24364010 / +3

    Решение проблемы простое:

    1. кодируете ссылки в base64.

    2. В тег с классом ссылки помещаете атрибут data-... со значением закодированной ссылки.

    3. На класс ссылки вешаете js функцию обработчик клика на ссылку, которая выдергивает значение дата атрибута и передает его рнр скрипту в виде гет запроса с открытием новой вкладки.

    4. рнр скрипт упомянутый выше получает закодированную ссылку, декодирует ее и генерирует код html страницы с немедленной переадресацией рефрешем по требуемой ссылке.

    5. Вот и все. для поисковика никаких ссылок, реализованных таким образом на странице нет.. :-)

  7. sden77
    /#24364172

    Был еще механизм, схожий с click hijacking: под указателем мыши всё время находится прозрачный div, в котором динамически создавалась ссылка с урлом, "спрятанным" в элементе, на который указывает указатель мыши (под прозрачным div'ом). Но там были сложности с выделением текста и использованием правой клавиши мыши

  8. SiteCenter
    /#24364302 / +6

    Пожизненный бан на посещение Хабра следует выдавать за посты такие. Автор - учитесь делать достойные сайты вместо паразитирования на несовершенстве веба.

    • coder_one
      /#24365282 / -3

      Уважаемый,
      1.) Вы нарушили правило хабра "Оскорблять других пользователей, не следить за эмоциями ". Ваш эмоциональный всплеск не имеет ничего общего с этой статьей. Изложенный в ней механизм работы со ссылками на примере php работает и имеет право на существование.
      2.) "Автор - учитесь делать достойные сайты вместо паразитирования на несовершенстве веба." Сайты делать я умею и не собирался на чем либо паразитировать. Ознакомьтесь с "УК РФ Статья 128.1. Клевета"

      3.)Если Вы хотите всех банить за мнение и за полезные статьи, то попробуйте создать и раскрутить свой "хабр".
      4.)По озвученной теме от вас не было ни одного факта и аргумента, Ваш комментарий считаю мусорным, если это не так, то обоснуйте свою позицию.

  9. mentin
    /#24364374 / +2

    А не сделать ли все внешние ссылки через редирект на общую страничку (с параметром куда) которая уже защищена от роботов с помощью robots.txt? И никаких извращений не надо. Или по каким-то причинам не сработает?

  10. sden77
    /#24364396

    Перечитал еще раз 3 причины использования такого изврата, и так и не понял, какая преследуется цель - закрыть ссылку от индексации или таки передавать ссылочный вес. Второй и третий пункты противоречат первому

  11. aliencash
    /#24364690 / +1

    Есть мнение, что google и яндекс не эмулируют js, а ищут ссылки в коде js. Конструкция типа const link = "htt" + "ps:/" + "/s" + "omelink." + "ru"; должна решить вопрос.

  12. FanatPHP
    /#24365568

    Здесь нужно очень внимательно следить за расстановкой одинарных и двойных кавычек, чтобы не было ошибки.

    Раз уж пост в хабе РНР, то давайте я вам покажу, как в этом языке принято выводить НTML и вообще оформлять код, чтобы его можно было легко читать и редактировать, без всяких проблем с кавычками.


    Не забывая при этом об элементарных правилах безопасности.


    <?php foreach($mass as $k => $v): ?>
        <br>
        <form method="post">
            <button class="my" onclick="<?=htmlspecialchars("window.open(".json_encode($v).")", ENT_QUOTES) ?>">
                <?=htmlspecialchars($k, ENT_QUOTES) ?>
            </button>
        </form>
    <?php endforeach ?>

    • coder_one
      /#24365926 / -1

      Обработчик данных форм обычно пишут в отдельном файле.

      • FanatPHP
        /#24365948 / +1

        Не понял. Отдельном от чего? И при чем здесь "обработчик данных форм" вообще?
        Вы точно мне комментарий писали? У меня нет никакого обработчика. Я всего лишь взял ваш собственный код — я даже не знаю, где он используется, в обработчике, в форме, или где-то ещё — и показал, как его можно написать, чтобы во-первых, не путаться в кавычках, во-вторых, его было удобно читать и редактировать, и в-третьих, чтобы он был безопасным, а не как сейчас.

        • coder_one
          /#24365970 / -4

          Вы серьезно думаете, что я всего этого не знаю? Спасибо за Ваше мнение.

          • FanatPHP
            /#24367808 / +1

            Да, я серьёзно так думаю.
            Во-первых, если знаете, то почему не применяете?
            Во-вторых, человек обычно пишет о том, что считает важным. У вас это расстановка кавычек.
            В-третьих, пользователи РНР традиционно путаются в вопросах безопасности. Буквально под каждой статьёй в этом хабе я каждый раз объясняю базовые вещи. Потому что "знать" — это одно, а понимать — совсем другое. И большинство, увы, именно что "знает", вызубрив в самом начале карьеры пару волшебных заклинаний, которые потом и применяет бездумно до пенсии, к месту и не к месту. При этом не понимая смысла своих действий, в конечном итоге всегда получишь уязвимость.

            • coder_one
              /#24368312

              Если бы вы много работали с разными конструкторами, cms, cамописными сайтами и фреймверками, то не задавали бы этих вопросов. Для Вас ответ был бы очевидным: случаи бывают разные и ограничения тоже, поэтому я статью постарался сделать максимально простой. "пользователи РНР "? Хорошо, буду считать Вас пользователем php. Я - программист. Минусы не забудьте поставить. Не ожидал встретить столько не адекватных комментов при публикации полезного материала. Не вижу больше смысла отвечать на бесконечные и весьма сомнительные комментарии.

  13. BlackStar1991
    /#24366922

    Интересная статья. Я, то знаю зачем ты скрываешь реферальные ссылки от выдачи ;) Сам практиковал метод просто вместо ссылки использовать <button> а в дата атрибут ложить нужный адрес, по нажатию на кнопку считывать то что в дата атрибуте и делать редирект. Твой метод избыточен, + по сути ты используешь тот же JS только засовываешь его в html исполнение, по производительности и загрузке странице не айс... правда, это сугубо логика и нельзя это ни как в SEO померять. Ещё меня в этом методе смущает, что если у тебя будет на странице +100500 таких рефовых форм, то это тоже может быть странным для поискового робота...

  14. eugene3711
    /#24369624 / +2

    Сам работал SEOшником и знаю, как бывшие коллеги любят придумывать разные странные извращения, которые якобы улучшают ранжирование.

    Вообще в этой сфере много домыслов и фантазий, которые возникают на фоне недостаточного понимания специалистами технической части.

    На самом деле, всё SEO держится на одном простом правиле: "Делай красивый и удобный сайт для людей". Если за сайтом стоит адекватный бизнес, то сайт будет ранжироваться, а если нет - то никакое SEO не поможет.

    Серые и черные схемы тоже рано или поздно будут обличены, а результаты белого способа останутся.