2013-05-15 3 views
0

Это больше из лучших практик/простота в вопросе содержания.Как структурировать идентификаторы фрагментов на моей веб-странице

У меня есть несколько веб-страниц, где я хотел бы упростить просмотр. Итак, для этого я собираюсь использовать идентификаторы фрагментов (внутренние ссылки). Вот пример некоторых из моего HTML:

<article> 
    <h1>Name of WebPage</h1> 
      <h2>Section One</h2> 
       Here is the content of my Section one. 

      <h2>Section Two</h2> 
       Here is the content of my Section two. 

      <h2>Section Three</h2> 
       Here is the content of my Section three. 

      ....(may have additional h2 sections) 
</article> 

Эти веб-страниц может быть трудно ориентироваться, если есть десятки h2 теги. Я надеюсь использовать панель меню, которая использует идентификаторы фрагментов для ссылки на «Раздел первый», «Раздел второй», «Раздел третий» и т. Д.

Теперь мне нужно преобразовать этот HTML-код, чтобы использовать Идентификаторы фрагментов, но прежде чем я начну менять этот код, я хотел бы получить дополнительные мысли о том, как я должен это делать.

У меня есть несколько вариантов:

1) ручная смена

<h2> NameOfH2 </h2> 

в

<h2 id='NameOfH2'> NameOfH2 </h2> 

Затем добавьте ссылки Fragment Identifier в боковом меню вручную.

2) ручное изменение

<h2> NameOfH2 </h2> 

в

<h2 id='NameOfH2'> NameOfH2 </h2> 

Затем использовать Javascript для создания фрагмента Идентификатор ссылка в строке меню стороны каждый раз, когда страница загружается.

Я хотел был бы использовать метод 2, так как по мере того как я добавляю больше содержания к моим страницам, оно автоматически появится в боковой панели меню, но я хотел посмотреть если была любая причина я не должен был сделать это.

Кроме того, у меня есть тонна тегов для редактирования, и мне было интересно, есть ли у вас, ребята, какие-то мысли о том, как добавить id в html. Прямо сейчас, я рассматриваю возможность написания программы для прохождения каждой страницы и редактирования каждого тега, но мне хотелось узнать, существует ли там решение.

Спасибо за любую помощь заранее!

+0

Это вопрос дизайна, а не технический вопрос, подходящий для SO. Но с технической стороны вы можете назначить атрибуты 'id' элементам' article'; это особенно важно, если вы используете стиль ': target'. И, конечно же, вы должны генерировать атрибуты и внутреннюю таблицу содержимого на стороне сервера. –

ответ

1

Если вы не возражаете, чтобы внутренние ссылки работали только при включенном JavaScript, вы могли бы просто генерировать как TOC, так и идентификаторы фрагментов с помощью JavaScript.

ППК имеет скрипт, который делает только что: http://www.quirksmode.org/dom/toc.html

Если вам это нужно для работы с JS отключен, вы можете создать как ТОС и боковые идентификаторы серверов.

+0

Спасибо! Это то, что я искал. – Thomas07vt