Пример капчи, отрисованной не картинкой, а HTML-CSS-разметкой
Пример явился следствием изучения вопроса поиска
новых форм отображения капчи, способных в силу новизны
временно усложнить работу антикапч, пока ими не будут
разработаны алгоритмы распознавания по такому способу
демонстрации капчи.
Одновременно исследовался вопрос размещения капчи в
теле документа, то есть когда на сайте отсутствует
отдельный URL (адрес), по которому капча может быть
доступна как независимый от документа элемент. То
есть избавиться от двухзапросной модели прогрузки
защищаемых страниц - там браузер грузит страницу, а
затем грузит капчу. Здесь же капча поступает сразу
с документом.
размер сгенерированной разметки: 31071 байт
та же разметка gzip-уплотнённая: 5141 байт
Пример картинки, загруженной из файла и преобразованной в HTML-CSS-разметку
Пример явился следствием поиска способа дать интернет
магазинам, использующим на сайте эксклюзивные фотографии
товаров, возможность защитить эти фотографии от попадания
в поисковые системы. Сопутствующей задачей была защита от
массового автоматизированного выкачивания посторонними
(в данном примере не использовался алгоритм нерегулярности -
введение помех воссозданию картинки по разметке).
Для сравнения, оригинал картинки здесь.
размер сгенерированной разметки: 104646 байт
та же разметка gzip-уплотнённая: 14681 байт
размер оригинального файла: 18395 байт
При создании разметки картинка была приведена
к 256-цветной ради уменьшения кода разметки,
применён RLE-подобный алгоритм "сжатия" пикселей
в пределах каждой линии изображения. LZW-подобная
техника уплотнения графических данных, способная
дать более выгодный результат (который затем может
быть обработан gzip-уплотнением разметки), не применялась
в силу примерочной постановки экспериментов.
Пример "видео" с помощью HTML-CSS-разметки и CSS3-анимации пикселей
Пример не имеет практической ценности, просто демонстрирует,
что в принципе можно было бы делать средствами CSS.
Из-за экономии в размере генерируемой разметки, пример
построен на вендорном префиксе -webkit, следовательно
видео не будет воспроизводиться в остальных браузерах,
кроме Chrome и поддерживающих его вендорные префиксы.
Откройте оригинал в отдельном окне и подвиньте сбоку
к миникадру, чтобы сравнить движение.
размер сгенерированной разметки: 240175 байт
та же разметка gzip-уплотнённая: 24981 байт
Видео закодировано по методу, сходному с идеями алгоритма
Pixel Behaviour Check (кодирование видеопотока вдоль
последовательности кадров, наблюдая за поведением пикселей).
Запись поведения пикселей осуществлена RLE-подобным алгоритмом.
Из всего видеокадра здесь демонстрируется только узкая
полоска, потому что на полном кадре браузер "умирает" в
попытках просчитать css-анимацию всех пикселей кадра в
количестве X*Y пикселей, под каждый из которых браузер
невольно выделяет отдельный процесс анимации, в то время
как в настоящем декодере это делалось бы в одном процессе.