Неработающие ссылки внутри тега ‹template›

Недавно я начал использовать тег <template> для HTML, который потом обрабатываю с помощью библиотеки шаблонов, например.

<template id="tmpl">
  <div class="something">
    <a href="/pages/{{link}}">{{title}}</a>
  </div>
</template>
...
<script>
var output = Mustache.render($('#tmpl').html(), {
  link: 'abc',
  title: 'abc'
});
</script>

Однако я понял, что это означает, что в моем HTML-коде есть неработающая ссылка (example.com/pages/{{link}}). Это вызывает беспокойство, поскольку различные сканеры могут посчитать его недействительным (фактически, консоль поиска Google сообщает, что на моей домашней странице есть неработающая ссылка).

  1. Допустимо ли использовать <template> таким образом?

  2. Не лучше ли поместить его во что-то вроде <script type="text/template"> (как показано на веб-сайте handlebars.js)?


html tags semantic-markup html5-template
person fstanis    schedule 31.10.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Переменная output действительно содержит ожидаемый HTML-код, то есть визуализированный шаблон; однако ваш код нигде не записывает содержимое переменной output.

Вот рабочий пример:

<template id="tmpl">
  <div class="something">
    <a href="/pages/{{link}}">{{title}}</a>
  </div>
</template>

<span id="output"></span>

<script>
var output = Mustache.render($('#tmpl').html(), {
  link: 'abc',
  title: 'abc'
});
$('#output').html(output);
</script>

Google неправильно просканировал тестовый сайт, который я настроил для этого. Однако, когда я попросил GoogleBot отобразить мою версию вашего кода, он отобразил ссылку внутри элемента template, то есть *{{title}}*, и ссылку на визуализированный шаблон, то есть *abc*. Несмотря на то, что Google сообщает, что у вас есть неработающая ссылка в элементе template, на самом деле это не так, когда пользователь просматривает ее.

Один из возможных способов заставить Google прекратить работу, указав, что у вас неработающая ссылка, - это заключить ваши template теги в <!--googleoff: anchor--> ...templates... <!--googleon: anchor-->. Эти теги не позволяют роботу Googlebot индексировать содержащиеся в нем теги привязки.

Пример:

<!--googleoff: anchor-->
<template id="tmpl">
    <div class="something">
        <a href="/pages/{{link}}">{{title}}</a>
    </div>
</template>
<!--googleon: anchor-->
person Tim    schedule 14.11.2016
comment
Спасибо, я понятия не имел о googleoff комментариях! Тем не менее, я знаю, что мой пример на самом деле ничего не рендерил (я просто использовал его, чтобы показать, как я использую тег <template>); мой первоначальный вопрос (все еще активный) действительно о том, является ли это использование <template> семантически (и в противном случае) допустимым или его следует избегать? - person fstanis; 15.11.2016