11 апреля 2006 года вышла в свет новая версия браузера от Microsoft, Internet Explorer (IE-7), содержащая код, который поддерживает корректную работу flash-анимации на страницах сайтов. Если раньше flash часто блокировался, то современная версия браузера обеспечивает flash-анимации нормальную работу. Метод, который применили разработчики Microsoft, позволил решить ряд серьезных проблем.
Flash, по мнению многих, снижает видимость страниц сайта поисковыми системами. SEO-специалисты уделяют этому аспекту большое внимание.
Достаточное количество популярных WYSIWYG инструментов (от англ. – “What You See Is What You Get” – “что видишь, то и получишь”) вырабатывают непригодный HTML-код для внедрения flash, к тому же большинство дизайнеров, работающих с flash-анимацией, к сожалению, не знают всех возможностей программирования и грамотной организации HTML-кода, едва ли знакомы с поисковой оптимизацией. В результате большинство страниц с flash работают некорректно.
Требования для поддержания корректной работы flash
Для дизайнера Flash – это способ представления большого количества информации в весьма ограниченных рамках, не нарушая при этом общую концепцию дизайна страницы сайта. К примеру, если вы продаете какую-либо технологию, то flash-анимация проиллюстрирует ее преимущества с помощью слайд-шоу или небольшого фильма.
Работа с HTML и flash позволяет достигнуть следующих результатов:
• экономия пространства за счет flash;
• успешная поисковая оптимизация;
• доступ людей с различными возможностями (настройками, браузерами) к информации;
• грамотный код;
• корректная работа браузера IE.
Заметим, что добиться всех поставленных целей с сайтами, полностью созданными на flash, невозможно: организационной структуры сайта как бы нет – он состоит из одной страницы. Дабы избежать этого, рекомендуется создавать все-таки сайт на HTML с небольшими вставками flash.
В качестве одного из приемов программирования с оптимизацией flash под SEO можно использовать DIV с контентом, воспринимаемым поисковыми системами, а также JavaScript для того, чтобы определять, в каких случаях браузер может отображать flash. Когда браузер поддерживает работу flash-анимации, JavaScript может управлять объектами и изображениями на одной странице, чтобы в конечном итоге перемещать контент, заменяя его в анимационных flash-объектах. Известно, что роботы поисковых систем не индексируют JavaScript, но они индексируют контент, которым управляет JavaScript. В этом контенте можно размещать текст, ссылки, заголовки, картинки, то есть все то, что может быть проиндексировано на обычной HTML-странице.
Однако нужно всегда помнить, что альтернативный контент, который предлагается на сайте посредством DIV, должен обязательно быть полезен пользователю. Если используется очевидный спам, к сайту могут быть применены санкции со стороны поисковиков.
О представлении мультимедийного контента можно узнать на сайте Консорциума Всемирной Паутины (W3C), программы по организации доступа к Сети для людей с ограниченными возможностями (WAI).
Пример кода, который расположен ниже, показывает, как реализованы шапка сайта и его меню с помощью flash на сайте. Меню сайта функционирует должным образом с помощью компонента ActiveX, обновленного для новой версии IE. Ранее внутренние страницы сайта не были доступны для индексации, так как роботы не могли пройти по ним: они были полностью реализованы во flash. Для того чтобы разрешить сложившуюся проблему, был вставлен следующий HTML-код:
<head>
<script type="text/javascript" src="/jscript/flashobject.js"></script>
</head>
<body>
<div id="flashcontent">
<h1>WirelessBuilders</h1>
<p>What we do</p>
<ul>
<li>Site Survey </li>
<li>802.11b </li>
<li>802.11g </li>
<li>systems integration </li>
<li>network design </li>
<li>project management </li>
<li>training </li>
<li>professional services (consulting)</li>
</ul>
<p><a title="Services" href="/services.shtml">Services</a> |
<a title="About Us" href="/about.shtml">About Us</a> |
<a title="Contact " href="/contact.shtml">Contact</a> |
<a title="Partners" href="/partners.shtml">Partners</a></p>
</div>
<script type="text/javascript">
var fo = new FlashObject("/flash/newstyle.swf", "mymovie", "800", "105", "6", "#ffffff");
fo.write("flashcontent");
</script>
</body>
Этот шаг позволил добиться того, что сначала ссылки на внутренние страницы, а затем и сами страницы были проиндексированы роботами поисковых систем.
Получить подробную информацию о данном методе и некоторых других решениях, связанных с flash и JavaScript, можно, перейдя по ссылке.
Второй пример показывает, как разместить очень большой фрагмент текста в ограниченном пространстве. Здесь, помимо DIV, использовались возможности CSS, позволившие оставить без изменения структуру страницы при смене текста, которую можно наблюдать даже в отключенных браузерах, JavaScript.
<div id="movieAlt">
<div id="movieAltInner">
<h2><a href="/products/index.html">Simics</a> is
used to develop the embedded
software that runs electronic devices such as:</h2>
<li>Aerospace hardware</li>
<li>Automobile control systems</li>
<li>Telecommunications infrastructure</li>
<li> High-end servers</li>
</ul>
<p><em>Hardware:</em> <strong>Satellite Control
System</strong></p>
<p> <em>Challenge:</em> Unable to test software with satellites
on orbit. How
to verify new software?</p>
<p> <em>Resolution:</em> Using Simics, the developers
can run software
quality tests on the ground, to ensure that the software works correctly
before it's installed.</p>
<h2>Industry: Automotive</h2>
<p><em>Hardware:</em> <strong>Electronic Control
Unit</strong></p>
<p><em>Challenge:</em> Need to develop software now, but
the ECU won't
be available for months</p>
<p><em>Resolution:</em> Simics enables programmers to
develop and test
the software before the hardware is available, reducing time to market.</p>
<h2><em>Industry:</em> Telecommunications</h2>
<p><em>Hardware:</em><strong> Wireless Network Equipment</strong></p>
<p><em>Challenge: </em> You have twenty programmers. Each
needs a complete
system for testing. They cost MILLIONS.</p>
<p><em>Resolution:</em> Using Simics to create a model
of the target hardware,
each programmer can have his or her own virtual device for software testing
and debugging, without breaking your budget.</p>
<h2>Industry: Internet</h2>
<p><em>Hardware:</em> <strong>Network servers</strong></p>
<p><em>Challenge:</em> Software bugs keep popping up.
Some take weeks to
reproduce and fix. You are running out of time.</p>
<p><em>Resolution:</em> With Simics, programmers can
run the program forwards
and backwards to quickly identify, recreate and repair bugs.</p>
</div>
</div>
<script type="text/javascript">
var fo = new
FlashObject("flash/virtutech_intro.swf", "mymovie", "497", "287", "7", "#ffffff");
fo.write("movieAlt");
</script>
The CSS Code
#movieAlt { /*Vertical scroll bar on alternative content*/
height: 287px;
width: 497px;
overflow: auto;
}
#movieAltInner { /*Use separate div because IE's faulty box model*/
padding: 10px 20px;
}
После использования этого метода сайты приобретали интересный дизайн и возможность ранжироваться поисковыми системами на самых высоких позициях.
Джонатан Хокман
Подготовил Сергей Стружков
Статья получена: www.SeoNews.ru
Противовирусные препараты: за и против
Добро пожаловать в Армению. Знакомство с Арменией
Крыша из сэндвич панелей для индивидуального строительства
Возможно ли отменить договор купли-продажи квартиры, если он был уже подписан
Как выбрать блеск для губ
Чего боятся мужчины
Как побороть страх перед неизвестностью
Газон на участке своими руками
Как правильно стирать шторы
Как просто бросить курить
- 2784 -
