УрокУменьшаем количество исходного кода на странице при помощи javascript

Не секрет, что большинство поисковых систем обращают внимание на соотношение количества нормального текста к количеству html и javascript кода на странице. И чем меньше "лишнего" на странице, тем лояльнее к сайту относится эта система. Поэтому надо каким-то образом этот код урезать. Но что же делать, если, например, дизайн не позволяет? Ну вот нарисовал дизайнер закруглённые уголки в комментариях - а это как минимум 4 ( а в худшем случае и все 8 ) лишних классов для каждого коммента! Представьте, что на странице 100 комментариев. Это 400 (800) лишних классов только для уголков!!

Я предлагаю абсолютно нехитрый способ решения этой проблемы: пару строк кода на Jquery - и поисковик, а вместе с ним и Вы, будете счастливы.

Предположим, у нас шаблон комментария comment.tpl.php выглядит таким образом:

<div class="comment <?php print $comment_classes; ?>">
  <!-- вывод переменных, html разметка и прочее -->	
</div>

Очевидно, что класс comment повторяется для всех комментариев. Так давайте же просто подключим скрипт, который в этот класс добавляет 4 класса для представления уголков:

$(document).ready(function() {
  $(".comment").wrapInner('<div class = "tl"><div class = "tr"><div class = "bl"><div class = "br"></div></div></div></div>');
});

В примере я обернул содержимое коммента в 4 дополнительных класса. С той же лёгкостью вы можете добавить туда любое количество классов.

Далее, как обычно, в css файле укажите этим классам картинки фона:

.comment .tl {
  background: url(images/comment_tl.png) no-repeat top left;
}
 
.comment .tr {
  background: url(images/comment_tr.png) no-repeat top right;
}
 
.comment .bl {
  background: url(images/comment_bl.png) no-repeat bottom left;
}
 
.comment .br {
  background: url(images/comment_br.png) no-repeat bottom right;
  padding: 10px; /* отступы не помешают ;) */
}

Что получается в итоге? А то, что благодаря трём строчкам кода, на странице с большим количеством комментариев вы сэкономите не один десяток килобайт при загрузке страницы.

Я показал всё на примере комментариев. Этот пример вы можете использовать для своего решения. Таким же образом можно сэкономить на закруглённых уголках для нод или для блоков. Отдельные сео-маньяки вообще могут минимизировать количество исходного кода, загружая классы при помощи скриптов чуть ли не для каждого элемента (кто ж запретит-то?).

Более того, можно пойти дальше - и при помощи аякса подгружать контент, который вы по каким-либо причинам не хотите индексировать на данной странице. В общем, разгуляться действительно есть где. А по поводу функций Jquery, которые вам могут пригодиться - можно много полезного найти тут (спасибо Соколику за ссылку)