версия для печатиНа мой взгляд, то, как сейчас нам преподносят саму идеологию Веб-3 («менеджеры знаний», МЗ), является слишком упрощённым подходом. Если говорить только об МЗ, то это будет не Веб-3, а, скажем, Веб-2.1.
Самое главное, что упускается из виду при этом - это развитие технологий. Мы ведь говорим о самой прогрессивной части современного ИТ-мира - Интернете - и при этом забываем о его основах! Поэтому, как мне кажется, придется немного напрячь воображалку и провести мозговой штурм на тему: «Веб-3: взгляд с точки практического применения».
Основы
В Интернете есть пока две стороны взаимодействия: пользователи на разных концах «провода». Иногда к этому примешивается третья сторона - поисковики - но серьёзного влияния на мнение и образ жизни пользователей они не оказывают. Ключевое слово здесь «мнение», ибо только за счёт мнения различных юзеров (а точнее, его эксплуатации) и можно строить более-менее серьёзный i-бизнес. Как было верно замечено в вышеупомянутой статье, веб при переходе от первой версии ко второй бросился из одной крайности в другую: от статичного, но качественного содержимого к массово генерируемому некачественному (за редкими исключениями). Поэтому и было предложено брать деньги за посредничество - даже профессию создали «менеджеры знаний».
Я ни в коей мере не умаляю значимости подобных людей, поскольку это логичный и естественный шаг в развитии Интернета. Но, повторюсь, это не Веб-3, а Веб-2.1. По моему стойкому убеждению, при переходе от Веб-2 к Веб-3 должен быть осуществлён рывок под названием «автоматизация». Уже сейчас начинают появляться первые прототипы «интеллектуальной» рекламы, «интеллектуального» же поиска, «интеллектуального» спама и т.п. Однако в них нет одного - адаптивности.
Адаптивность
Чем отличается контент, созданный пользователем, от оного, созданного машиной? В большинстве случаев - степенью интеграции в окружающий текст и качеством доносимой информации. Да, никто не спорит, что зачастую машинные результаты более точно соответствуют окружающему близлежащему тексту по содержимому, но при этом они заметно отличаются по стилевому изложению во всех смыслах: синтаксическом, цветовом и прочих. Об этом как-то давно уже упоминал Лебедев, но тем не менее никаких подвижек в умах дизайнеров и аналитиков так и не произошло.
К примеру, возьмём самую больную тему: рекламу, - ибо без нее не выжить ни одному более-менее серьёзному веб-проекту. Почему нас так раздражают эти баннеры, контекстные ссылки и иже с ними? Потому, что они:
- Радикально не вписываются в созданный авторами проекта стиль;
- Выглядят вырванными из контекста непонятными кусками фраз;
- Являются одной здоровенной ссылкой (вспомни, как этом ужасно, когда идёт целый абзац подчёркнутого текста - бррр, аж передёргивает!).
Из-за чего всё это происходит? Зачастую при размещении рекламы на страницах проекта используются так называемые «доноры» рекламы - специализированные сайты-хранилища баннеров, рекламных текстов и т.п. К ним относятся в том числе и Бегун с AdSense’ом. Однако, даже предоставляя некоторое количество настроек отображения, доноры не позволяют полностью адаптировать объявления к стилю страницы, на которой они будут отображаться. А уж про баннеры я и не говорю - попробуй-ка адаптировать баннер компании «Пупкин и Ко», выполненный в дикорастущем стиле, к сайту с web-2-стилем! В этой статье поговорим о графической стороне адаптивной рекламы.
Есть несколько вариантов решения подобной проблемы. Начнём с текстовой рекламы (напомню, мы пока говорим только о графическом стиле отображения, а не об интеграции в контекст).
Что такое текстовая реклама с точки зрения разработчика сайта? Сейчас это кусок XHTML-кода со связанной таблицей стилей. Да, можно, конечно, поколдовать немного и добиться замены таблицы стилей на свою (недавно мне даже попался плагин для Wordpress, позволяющий делать подобные манипуляции с AdSense-блоками).
Но это уже прошлый век. Выход - вездесущий XML (для рекламы создадим диалект, называемый, скажем, AdML). Выглядит это так: донор при запросе выдаёт AdML-код примерно следующего содержания:
<?xml version="1.0"?>
<ad xmlns="http://www.cerebrate.ru/spec/adml/" xml:lang="ru" adml:version="1.0">
<ad:donor>http://www.ad-agency.ru/</ad:donor>
<ad:title><h>Сайт Васи Пупкина</h></ad:title>
<ad:org>Пупкин и Ко</ad:org>
<ad:link>http://www.pupkinandco.com/</ad:link>
<ad:text>Великолепный ресурс о Васе Пупкином. Приходите к нам!</ad:text>
<ad:extended>
<![CDATA[
<h1>Ресурс Васи Пупкина</h1>
<p>
На нашем ресурсе вы найдёте все, что захотите:
<ul>
<li>Вот это</li>
<li>А ещё это</li>
<li>И ещё много чего</li>
</ul>
Приходите к нам!
</p>
]]>
</ad:extended>
<ad:id>ad-agency-159ef14a</ad:id>
<ad:clientid>ad-agency-2514</ad:clientid>
</ad>
Обработчик, стоящий на стороне ресурса, трансформирует этот код в, скажем, такой:
<div class="ad">
<a href="http://www.pupkinandco.com/"><h3>Сайт Васи Пупкина</h3></a>
<p>Великолепный ресурс о Васе Пупкином. Приходите к нам!</p>
</div>
Понятно, что при этом стилевая разметка абсолютно настраиваема и может быть полностью адаптирована к дизайну данного ресурса. Более того, мы можем отсекать нежелательные элементы рекламы и сами решать, будет ли отображаться полная версия рекламного объявления со своим форматированием либо краткая текстовая. Наконец, можно настроить фильтрацию объявлений, чтобы исключить рекламирование ресурсов конкурентов.
Перейдём к наиболее сложному вопросу: баннерной рекламе. Понятно, что настроить баннер для отображения на сайте куда сложнее текстовых ссылок, особенно если это динамический баннер (например, флэш или анимированный GIF). На мой взгляд, решить проблему можно следующим образом.
На помощь нам опять приходит AdML. Однако здесь задача куда сложнее и состоит в том, чтобы описать изображение, а не передать его напрямую. Понятно, что это нетривиальная деятельность, однако, как показывает моя практика, баннер, идеально вписывающийся в дизайн страницы, нажимается куда чаще, чем уродец, созданный за пару минут для массового тиражирования - так что дело того стоит. (К тому же ImageMagick стоит на всех нормальных хостингах и портирован под все веб-языки программирования, так что проблемы генерации изображения не будет.) Возьмём простейший пример: на статичном баннере изображён логотип, а справа от него идёт краткое описание ресурса и «ссылка» навигации. Код будет выглядеть примерно так:
<?xml version="1.0"?>
<ad xmlns="http://www.cerebrate.ru/spec/adml" xml:lang="ru" adml:version="1.0">
<ad:type>
<name>img</name>
<width>200px</width>
<height>100px</height>
</ad:type>
<ad:img>
<href>
http://www.ad-agency.ru/ad/ad-agency-159ef14a/img/0.png
</href>
<top>10px</top>
<left>10px</left>
<width>50px</width>
<height>50px</height>
</ad:img>
<ad:title>
<top>10px</top>
<left>70px</left>
<width>120px</width>
<height>20px</height>
<font:family>sans-serif</font:family>
<font:size>14pt</font:size>
<align>center</align>
<h>Сайт Васи Пупкина</h>
</ad:title>
<ad:org>Пупкин и Ко</ad:org>
<ad:link>http://www.pupkinandco.com/</ad:link>
<ad:text>
<top>40px</top>
<left>70px</left>
<width>120px</width>
<height>150px</height>
<font:family>sans-serif</font:family>
<font:size>10pt</font:size>
<align>justify</align>
<content>Великолепный ресурс о Васе Пупкином. Приходите к нам!</content>
</ad:text>
<ad:id>ad-agency-b5925aef</ad:id>
<ad:clientid>ad-agency-2514</ad:clientid>
</ad>
Аналогично тому, как преобразуется текстовый блок, механизм ресурса трансформирует полученный AdML в более приятный и лаконичный XHTML:
<div class="ad-img">
<a href="http://www.pupkinandco.com/">
<img src="/ad/img-gen.php?id=ad-agency-b5925aef" width="200px" height="200px" alt="Сайт Васи Пупкина" />
</a>
</div>
Вдобавок, мы можем экономить трафик пользователя, так как в наших руках находится генерация картинки, и мы можем задать для неё требуемое качество, причём грузить со стороннего сервера приходится в худшем случае какие-то отдельные элементы изображения да AdML-код, а не изображение целиком. Также здесь можно осуществлять фильтрацию конкурентов, о чем в обычной баннерной рекламе можно только мечтать либо полагаться на услуги баннерных сетей, также работающих в этом плане не очень эффективно.
Наконец, поговорим о динамичной рекламе. В настоящее время активно используются два её вида: Flash и анимированный GIF. Подход при этом идентичный: получаем AdML-код от донора и конвертируем его в требуемый формат.
Однако здесь есть одно большое НО. Получить анимированный джифчик достаточно просто и не требует особого напряжения: добавляем к запрашиваемому коду необходимое количество элементов второго уровня <ad:scene>, внутрь которых помещаем требуемые слои (изображения, текст и т.п.) и генерируем. А вот сложности возникают, когда требуется создать Flash-баннер. Поскольку создание подобных баннеров и так сопряжено с определёнными трудностями, то описание его при помощи AdML если не невозможно, то по меньшей мере очень сложно, поскольку во Flash есть ещё такая «мелочь», как ActionScript.
Поэтому мне представляется такой выход: передача флэш-баннеру необходимых параметров типа фона, цвета текста, ссылок и проч. Сразу оговорюсь - я далеко не знаток технологии Flash, поэтому не знаю всех тонкостей ее реализации на стороне клиента. Однако, если сейчас и не существует механизма передачи параметров подобным объектам, то почему бы его не сделать? Ничего принципиально сложного, зато сколько удобств!
На этом пока вынужден остановиться. В следующих частях продолжим разговор о смысловой стороне адаптивной рекламы, дизайне веба-3 и о том, как броузеры должны его правильно отображать.
