Боримся со спамом!!!!

Нашел на одном из сайтов интернета. Идея мне понравилась)))
Вот сама статья:

Боремся со спамом с помощью CSS!
Борьба со спамом - это то, с чем сталкивается почти каждый владелец сайта, на котором разрешено комментирование. Самый популярный и эффективный (?) способ борьбы со спамом - использование специального изображения капча, информацию с которого комментатор должен ввести в предусмотренное для этого поле. С тех пор, как появились алгоритмы OCR, которые позволяют распознавать текст на изображении, на капчах стали выводить “грязный” и искаженный текст.

“Грязный” и искаженный текст может раздражать пользователей и препятствовать тому, чтобы они оставляли комментарии. Еще одна вещь, которая заставляет подумать дважды, когда заходит речь об использовании некоторых из существующих вариантов капчи, - тот факт, что вы не можете контролировать их внешний вид.

А как на счет того, чтобы призвать на помощь технологию CSS.

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

Как было сказано выше, существует технология OCR, которая распознает символы на изображениях. Но для того, чтобы эта технология работала, необходимо наличие самого изображения, что логично.

Теперь начинается самое интересное. Изображение капчи нужно выводить не тегом <img>, как это делается везде, а использовать его в виде фонового изображения, заданного с помощью CSS.

И в результате OCR не сможет ничего распознать. Согласитесь, что вряд ли робот обучен тому, чтобы сначала просканировать html-код, определить расположение вашего CSS-файла, сравнить CSS-селекторы, найти нужно CSS-правило, определить расположение изображения и прочитать его, используя OCR.

Вот простой пример использования данного метода.

HTML код
1
2
3
4

<p>
<label class="captcha" for="captcha">Введите сумму чисел на изображении</label>
<input type="text" name="captcha" id="captcha" />
</p>

CSS код
1
2
3
4
5
6
7

label.captcha {
display: block;
background: url(i/captcha.gif) no-repeat;
height: 28px;
line-height: 28px;
padding-left: 90px;
}

Цыфры сместились
Продолжение:
Положительные стороны

Плюсы метода заключаются в том, что можно легко самому задать нужный внешний вид капчи, поместить на изображение свой собственный текст, простую математическую функцию и т.д. И робот при этом не сможет ее разобрать, т.к. изображение выводится с помощью CSS.
Недостатки

Единственный минус метода заключается в том, что при просмотре сайта через браузер с отключенной поддержкой CSS (такие вообще часто встречаются?), не поймут, что вы просите их сделать. Т.е. используя этот трюк, вы препятствуете добавлению комментариев частью вашей аудитории.