Изменение структуры HTML с использованием Javascript и эффектов для поисковых систем - PullRequest
2 голосов
/ 02 июня 2011

У меня есть вложенная структура меню ul, которая начинается следующим образом:

<div id="left">
    <ul id="left-nav">
        <li>
            <a href="#">Link 1</a>
            <ul class=".sub-nav">
                <li><a href="#">Sublink 1</a></li>
                <li><a href="#">Sublink 2</a></li>
                <li><a href="#">Sublink 3</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Link 2</a>
            <ul class=".sub-nav">
                <li><a href="#">Sublink 1</a></li>
                <li><a href="#">Sublink 2</a></li>
                <li><a href="#">Sublink 3</a></li>
            </ul>
        </li>
    </ul>
</div>

Из-за требований к дизайну у меня должны быть все вложенные элементы за пределами их родителя.<li> s и добавьте их в контейнер #left с помощью jQuery. Я также сохраняю ссылку на каждый субнап, используя атрибуты id / data

var $left = $("#left");
$(".sub-nav").each(function(index) {
    $(this).attr("id", "subnav" + index);
    $(this).parent().data("subnav", index);
    var offsetTop = $(this).parent().position().top;
    $(this).css("top", offsetTop);
    $(this).appendTo($left);
});

Вот итоговый HTML

<div id="left">
    <ul id="left-nav">
        <li>
            <a href="#" data-subnav="subnav1">Link 1</a>
        </li>
        <li>
            <a href="#" data-subnav="subnav2">Link 2</a>
        </li>
    </ul>
    <ul class=".sub-nav" id="subnav1">
        <li><a href="#">Sublink 1</a></li>
        <li><a href="#">Sublink 2</a></li>
        <li><a href="#">Sublink 3</a></li>
    </ul>
    <ul class=".sub-nav" id="subnav2">
        <li><a href="#">Sublink 1</a></li>
        <li><a href="#">Sublink 2</a></li>
        <li><a href="#">Sublink 3</a></li>
    </ul>
</div>

Меню теперь работает отлично, но меня беспокоит тот факт, что я меняю структуру HTML и семантика отключена.Повлияет ли это на поисковые системы?Должны ли у меня быть какие-либо другие проблемы?

1 Ответ

2 голосов
/ 02 июня 2011

Инструменты Google для веб-мастеров имеет возможность "извлечь как googlebot" - который покажет вам документ после того, как индексатор Google его проанализирует. Запустите его и проверьте сами, если можете.

Робот Google определенно не выполняет javascript. Есть некоторые доказательства того, что он может читать встроенный javascript для извлечения URL-адресов для сканирования (например, для перехода по ссылкам, к которым прикреплены атрибуты «onclick»). Вам не нужно беспокоиться о том, что он запускает ваш код манипуляции с DOM.

...