jQuery mobile, метод нескольких страниц на одной странице, многократный эффект h1, SEO, доступность и семантика - PullRequest
5 голосов
/ 05 июля 2011

Является ли многостраничный метод на одной странице jquery mobile приемлемым для SEO доступности и семантики страницы?

И у меня есть сайт, который будет использовать CMS для добавления / изменения данных, имеет много страниц с 3 уровнями.

Это техника в порядке?Это создает проблему для определения уровня заголовка от H1 до H6 на нескольких страницах.Я взял ниже код с этой страницы.http://jquerymobile.com/demos/1.0a4.1/#docs/pages/docs-pages.html

И вы можете видеть, что на этой странице есть два тега <h1>, но одинаково хорош только один <h1>.

и

<h1>
<h2>
<h1>

не разрешенысогласно стандартам веб-доступности.

<body> 

<!-- Start of first page -->
<div data-role="page" id="foo">

    <div data-role="header">
        <h1>Foo</h1>
    </div><!-- /header -->

    <div data-role="content">   
        <p>I'm first in the source order so I'm shown as the page.</p>      
        <p>View internal page called <a href="#bar">bar</a></p> 
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /header -->
</div><!-- /page -->


<!-- Start of second page -->
<div data-role="page" id="bar">

    <div data-role="header">
        <h1>Bar</h1>
    </div><!-- /header -->

    <div data-role="content">   
        <p>I'm first in the source order so I'm shown as the page.</p>      
        <p><a href="#foo">Back to foo</a></p>   
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /header -->
</div><!-- /page -->
</body>

Ответы [ 3 ]

3 голосов
/ 08 июля 2011

Важно скрыть «скрытые» страницы с помощью отображения CSS: нет (или видимость: скрыто) - все текущие программы чтения с экрана будут игнорировать контент, размеченный таким образом, поэтому будут видеть только реально видимые заголовки.

2 голосов
/ 12 июля 2011

Вы никогда не хотите размещать более одной <h1> метки на веб-странице.

Я бы превратил эти <h1> теги в <h2 class="h1"> теги, использовал бы CSS для их стилизации в соответствии с вашим <h1> стилем.Затем я бы добавил один тег <h1> в другом месте на странице, скрытый с помощью CSS, который имеет качественную копию SEO, чтобы описать мобильное взаимодействие в целом вместо отдельного «состояния» мобильного взаимодействия.

Пример: вместо <h1>Mens Suits</h1> и <h1>Accessories</h1> вы можете получить <h1>Online Catalog featuring Mens Suits and Accessories</h1>

1 голос
/ 11 июля 2011

Это может быть не полный ответ, который вы ищете, но ИМХО, когда SEO важен для вашей страницы / приложения, вам следует выбирать только между:

  • Использование одного HTML-файла со всем содержимым в виде страниц в нем - так что у вас есть один адрес для продвижения, и контент переключается с помощью хеш-части URL

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

...