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

Все знают, что боты сканируют сайт на наличие форм, поэтому прятать их с помощью только лишь CSS бесполезно. Казалось бы, очевидный способ защиты — капча. Но сложная капча вполне способна отбить у пользователей желание вообще пользоваться формой при наличии альтернативы (например, на более «дружелюбном» в этом отношении, сайте).

Так что же делать?

На помощь нам придут все те же HTML, CSS и Javascript. Но воспользуемся мы ими в данном случае немного «нестандартно»:

  1. Создаем отдельную страницу с формой. Вывести форму на отдельную страницу можно либо с помощью создания пункта меню типа «форма», либо с помощью модуля, привязанного к определенной странице, либо с помощью плагина и кода вставки формы в тело страницы. Так же, сам движок позволяет создать новую позицию и вывести ее, с помощью кода вставки. Поэтому здесь проблем возникнуть не должно.
  2. Создаем ссылку на страницу. Для старых версий Joomla подойдет «меню-невидимка» с созданием в нем соответствующего пункта. В версиях движка 3.x есть замечательная опция, которая подходит к нашему случаю как нельзя лучше — «отображать ссылку в меню». Устанавливаем  ее значение равным «Нет».
  3. Закрываем созданную ссылку от индексирования поисковыми системами всеми возможными способами. Если они автоматически выводятся в расширениях, генерирующих sitemap.xml — скрываем. Ряд расширений для создания карт сайта на Joomla позволяют закрывать от индексирования и/или скрывать определенные материалы.
  4. Создаем «навигацию» с помощью html, css и javascript, не годную к сканированию спам-ботами, но отлично видимую и доступную для реальных пользователей.

Теперь подробнее по последнему, четвертому пункту.

В необходимом месте на сайте создается, примерно, такой html-код:

  <span id="myfeedback">Обратная связь</span>

Вместо span может быть абсолютно любой тег. Идентификатор так же может быть любым. Если на страницу с формой должен вести один из пунктов меню сайта, то для этого великолепно подойдет пункт меню с типом «Разделитель». Для него движок самостоятельно генерирует уникальный селектор. При этом значение в поле «ссылка» там прописывать, конечно же, не нужно.

Далее нам поможет Javascript (или JQuery) и функция, вызываемая после загрузки страницы.

Если используется чистый js, то код будет таким:

  document.getElementById('myfeedback').onclick = function() {
      document.location.pathname = '/my-form-link.html';
  }

Если JQuery:

  jQuery('#myfeedback').click(function() {
      document.location.pathname = '/my-form-link.html';
  });    

А в стилях CSS элемент с идентификатором myfeedback оформляется так же, как и прочие кнопки или ссылки: такой же вид курсора, такой же цвет (линия подчеркивания или ее отсутствие). Одним словом,  в стилях прописываем все, что укажет пользователю на то, что перед ним ссылка или кнопка, с которой можно взаимодействовать и перейти к форме обратной связи.

Таким образом, получается, что переход на страницу с формой осуществляется только по клику на некий элемент DOM с определенным идентификатором. Пользователь при этом увидит обычную ссылку (или пункт меню), а вот спам-бот при сканировании этой части страницы ничего не обнаружит: тегов form нет; полей input, которые нужно заполнить, нет; URL-адресов, по которым нужно осуществить дальнейший поиск страниц с формами тоже нет.

Однако, к сожалению, минусы у этого способа тоже имеются:

  1. Браузер пользователя обязательно должен использовать javascript
  2. Неудобство для самих веб-мастеров при организации такой «навигации» по страницам с формами (особенно, если их много).

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

Хостинг TimeWeb

Добавить комментарий