Рамки сайта - не используйте рамки для дизайна или создания сайта

1. Поисковые системы: доступны ли рамки веб-сайтов и индексируются ли они?
2. Просканируйте ваш сайт и просмотрите ваш сайт на основе фреймов
3. Будут ли страницы индекса Google использовать фреймы?
4. Дизайн сайта: доступны ли рамки сайта?
5. Как правильно использовать рамки?
6. Предоставление заголовка кадра
7. Опишите рамочные отношения
8. Написание для браузеров, которые не поддерживают FRAME
9. Каркасные источники
10. Использование целей FRAME
11. Ранние рекомендации правительства Великобритании:
12. Первая десятка ошибок Якоба Нильсена в веб-дизайне

Если вы ДЕЙСТВИТЕЛЬНО не знаете, что вы делаете и почему вы это делаете ... не используйте рамки для дизайна вашего сайта .

Если возможно, избегайте использования фреймов . Некоторые люди испытывают затруднения при навигации внутри фреймов, либо потому, что они сбивают с толку, либо потому, что используемое ими программное обеспечение просто не может читать фреймы.

При использовании фреймов всегда предлагайте содержательный контент NOFRAMES тем, кто не может прочитать информацию в рамке. Правильно используйте NOFRAMES - «обновить браузер» не поможет кому-либо, использующему (по выбору или по необходимости) самую последнюю версию браузера, которая просто не обрабатывает фреймы. Раздел NOFRAMES должен содержать содержательный контент со ссылками на другие страницы вашего сайта, чтобы к ним можно было получить доступ без рамок.

Если вы должны использовать кадры, убедитесь, что у каждого кадра есть разумное НАЗВАНИЕ (в дополнение к ИМЯ), которое дает четкое указание содержимого, которое будет найдено в этом кадре.

Оглавление

Поисковые системы: доступны ли рамки веб-сайтов и индексируются ли они?

Кадры могут, еще в 2019 году, также вызывать серьезные проблемы у поисковых систем.

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

За почти 20 лет, что я делал, я видел много сайтов, которые появляются в Google с отсутствующей навигационной системой на странице.

Навигация была в другом фрейме, НЕ представлена ​​Google как часть страницы с контентом.

Если вы серьезно относитесь к органической поисковой оптимизации, забудьте об использовании или оптимизации фреймов и прочитайте последние рекомендации по SEO ,

Просканируйте ваш сайт и просмотрите ваш сайт на основе фреймов

Вы можете использовать такие инструменты, как общий (в том числе SEMRush Audit Tool ), SiteBulb Crawler , DeepCrawl , Кричащая лягушка или же SEO Powersuite Сайт Аудитор (чтобы назвать только несколько), чтобы проверить множество различных аспектов качества сайта.

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

Будут ли страницы индекса Google использовать фреймы?

В ходе недавней дискуссии в тусовках Google для веб-мастеров с Google Web Trends Analyst Джон Меллер обсудил возможность определения приоритетов (для ранжирования) страницы со встроенным фреймом, добавляя исходный код и контент другой внешней страницы.

Можно ли сделать страницу с iframe ранжированной в результатах поиска Google вместо URL-адреса источника iframe?

Цитата : «Если я синдицирую свой контент с другим веб-сайтом с помощью iframe, как я могу гарантировать, что URL-адрес iframe получит кредит вместо страницы, встроенной (в) iframe?» - ПРИМЕЧАНИЕ. - Я думаю, что это был вопрос. Это прочитано и ответило довольно смущающе, как только рассмотрел это во второй раз.

а также

Цитата : «так что короткую версию вы не можете - в частности, если страница встроена в iframe в другую большую страницу, то возможно, что мы будем индексировать и эту страницу для встраивания, и когда мы ее визуализируем, мы, очевидно, видим ваш контент, потому что он также виден в iframe, и в какой-то степени мы можем сказать, что это целая страница с этим контентом, мы будем индексировать его таким образом, чтобы мы могли показывать его в результатах поиска, как это обычно делается Эта связь между версией iframes и страницей для встраивания, и мы пытаемся показать это правильно в поиске, чтобы действительно выделить исходную страницу, а не просто рамку, но это не то, что вы можете сказать, я хочу, чтобы оба этих элемента были видны в поиске или вообще в Интернете, но я предпочитаю, чтобы эта конкретная страница действительно отображалась, чтобы вы могли сделать что-то, если вы, если вы общаетесь с другим веб-сайтом, использующим iframe, на этой странице которого имеется ссылка, указывающая на фактическую Колорадо нужная версия - поочередно, если вы не хотите, чтобы ваши страницы отображались в iframe, есть опции, которые вы можете поместить, я верю в заголовок страницы со специальным метатегом, чтобы сказать, что вы не хотите, чтобы ваш страницы, которые нужно создать, и это то, что браузеры будут уважать, по крайней мере, в современных браузерах, и это то, что мы уважаем и с нашей стороны, если мы видим, что URL отображается в iframe, но на самом деле этот URL не будет работать, и это Я подставил, и мы будем уважать это и для поиска »Джон Мюллер, Google 2017

Короткий ответ - ранжирование в Google, на самом деле не предназначено для определения приоритетов таких URL-адресов, которые вставляют контент в iframe с другой страницы. Google предпочитает (в общем) представлять исходный URL, если это возможно.

Если вы управляете обеими страницами, вы можете использовать Link Rel Canonical на исходной странице, которая перетаскивается в Iframe, чтобы указывать на страницу, которая содержит Iframe.

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

Дизайн сайта: доступны ли рамки сайта?

Фреймы HTML иногда используются для организации дизайна веб-сайта путем объединения как минимум двух других веб-страниц в общее визуальное пространство.

Самые сильные аргументы против использования фреймов больше связаны с удобством использования, чем с доступностью.

Например, фреймы могут уменьшить объем используемого пространства на странице, они затрудняют или делают невозможным для пользователей прямую ссылку или закладку на определенную страницу в наборе фреймов, и они часто препятствуют тому, чтобы пользовательские кнопки Назад работали должным образом.

Что касается доступности, фреймы сами по себе не являются недоступными.

Пользователи клавиатуры и пользователи вспомогательных технологий могут перемещаться между различными фреймами, составляющими страницу фреймов. Тем не менее, фреймы создают дополнительные проблемы с юзабилити, которые являются уникальными для пользователей с ограниченными возможностями, особенно для тех, кто использует программы чтения с экрана.

Часто в интерфейсе фреймов выбор пользователем ссылки в одном фрейме изменяет контент в другом фрейме.

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

Пользователи программы чтения с экрана могут переключаться между кадрами назад и вперед, но они должны знать, на какие кадры переключаться, чтобы найти контент, который они ищут.

Максимальное удобство использования кадров для пользователей программы чтения с экрана также требует, чтобы каждый кадр имел осмысленный заголовок, который говорит о его функциях. Каждый кадр называется в определении набора фреймов путем определения атрибута TITLE для каждого элемента. «Навигация» и «Содержимое» являются двумя распространенными примерами заголовков фреймов, которые хорошо работают для пользователей программ чтения с экрана.

Напротив, следует избегать названий фреймов, таких как «FrameA» и «FrameB» или «Left Frame» и «Right Frame», поскольку они не передают функцию фрейма и мало полезны для пользователей программы чтения с экрана.

Как правильно использовать рамки?

Если вы должны использовать кадры, то делайте это правильно. Для визуально включенных пользователей фреймы могут организовать страницу в разные зоны.

Для невизуальных пользователей отношения между контентом в кадрах (например, один кадр имеет оглавление, другой - сам контент) должны передаваться другими средствами.

Фреймы, реализованные сегодня (с элементами FRAMESET, FRAME и IFRAME), проблематичны по нескольким причинам:

• Без сценариев они имеют тенденцию нарушать функциональность «предыдущей страницы», предлагаемую браузерами.
• Невозможно обратиться к «текущему состоянию» набора фреймов с URI; как только набор фреймов изменяет содержимое, исходный URI больше не применяется.
• Открытие фрейма в новом окне браузера может дезориентировать или просто раздражать пользователей.

В следующих разделах мы обсудим, как сделать кадры более доступными. Мы также предоставляем альтернативу фреймам, которые используют HTML 4.01 и CSS и учитывают многие ограничения современных реализаций фреймов.

Предоставление заголовка кадра

Контрольная точка W3C:

• 12.1 Название каждого кадра для облегчения идентификации и навигации по кадрам. [Приоритет 1].

Используйте атрибут «title» для именования кадров.

<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN"> <HTML> <HEAD> <TITLE> Документ простого набора фреймов </ TITLE> </ HEAD> <FRAMESET cols = "10%, 90% "title =" Наша библиотека электронных документов "> <FRAME src =" nav.html "title =" Панель навигации "> <FRAME src =" doc.html "title =" Документы "> <NOFRAMES> <A href = "lib.html" title = "Ссылка на библиотеку"> Выберите, чтобы перейти в электронную библиотеку </A> </ NOFRAMES> </ FRAMESET>

Опишите рамочные отношения

Контрольная точка W3C:

• 1.1. Предоставьте текстовый эквивалент для каждого нетекстового элемента (например, через «alt», «longdesc» или в содержимом элемента). Это включает в себя: изображения, графическое представление текста (включая символы), области карты изображений, анимации (например, анимированные GIF-файлы), апплеты и программные объекты, объекты ASCII, рамки, сценарии, изображения, используемые в качестве маркеров списка, спейсеры, графические кнопки, звуки (воспроизводится с участием пользователя или без него), автономные аудиофайлы, аудиодорожки видео и видео. [Приоритет 1]
• 12.2. Описать назначение фреймов и как фреймы связаны друг с другом, если это не очевидно только по названиям фреймов. [Приоритет 2]

<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN"> <HTML> <HEAD> <TITLE> Сегодняшние новости </ TITLE> </ HEAD> <FRAMESET cols = "10% ,, 10 % "> <FRAMESET columns =" ​​20%, "> <FRAME src =" promo.html "name =" promo "title =" promotions "> <FRAME src =" sitenavbar.html "name =" navbar "title =" Панель навигации по сторонам "longdesc =" frameset-desc.html # navbar "> </ FRAMESET> <FRAME src =" story.html "name =" story "title =" Выбранная история - основной контент "longdesc =" frameset-desc. html # story "> <FRAMESET columns =", 20% "> <FRAME src =" headlines.html "name =" index "title =" Индекс других национальных заголовков "longdesc =" frameset-desc.html # headlines "> <FRAME src = "ad.html" name = "adspace" title = "Реклама"> </ FRAMESET> <NOFRAMES> <p> <a href="noframes.html"> Версия без фреймов </a> </ p > <p> <a href="frameset-desc.html"> Описания фреймов. </a> </ p> </ NOFRAMES> </ FRAMESET> </ HTML>

• Frameset-desc.html может сказать что-то вроде:
• #Navbar - этот фрейм предоставляет ссылки на основные
  Разделы сайта: Мировые новости, Национальные новости,
  Местные новости, Технологические новости,
  и развлекательные новости.
• #Story - в этом кадре отображается выбранная история.
• # Индекс - этот фрейм предоставляет ссылки на дневные
  заголовки в этом разделе.

Обратите внимание, что если содержимое фрейма изменится, текстовый эквивалент больше не будет применяться.

Кроме того, ссылки на описания фрейма должны быть предоставлены вместе с другим альтернативным контентом в элементе NOFRAMES FRAMESET.

Написание для браузеров, которые не поддерживают FRAME

Контрольные точки в этом разделе:

• 1.1. Предоставьте текстовый эквивалент для каждого нетекстового элемента (например, через «alt», «longdesc» или в содержимом элемента). Это включает в себя: изображения, графическое представление текста (включая символы), области карты изображений, анимации (например, анимированные GIF-файлы), апплеты и программные объекты, объекты ASCII, рамки, сценарии, изображения, используемые в качестве маркеров списка, спейсеры, графические кнопки, звуки (воспроизводится с участием пользователя или без него), автономные аудиофайлы, аудиодорожки видео и видео. [Приоритет 1]
• 6.5 Убедитесь, что динамический контент доступен, или предоставьте альтернативную презентацию или страницу. [Приоритет 2]

В этом примере, если пользователь читает «top.html»:

<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN"> <HTML> <HEAD> <TITLE> Это top.html </ TITLE> </ HEAD> <FRAMESET cols = "50% , 50% "title =" Наш большой документ "> <FRAME src =" main.html "title =" Где отображается контент "> <FRAME src =" table_of_contents.html "title =" Оглавление ">> NOFRAMES > <A href="table_of_contents.html"> Содержание. </A> <! - здесь также доступны другие навигационные ссылки, доступные в main.html. -> </ NOFRAMES> </ FRAMESET> </ HTML>

и пользовательский агент не отображает кадры, пользователь будет иметь доступ (через ссылку) к некадровой версии той же информации.

Каркасные источники

Контрольные точки в этом разделе:

• 6.2 Убедитесь, что эквиваленты для динамического содержимого обновляются при изменении динамического содержимого. [Приоритет 1]

Разработчики контента должны предоставить текстовые эквиваленты фреймов, чтобы их содержание и отношения между фреймами имели смысл. Обратите внимание, что по мере изменения содержимого фрейма также должно меняться любое описание. Это невозможно, если IMG вставлен непосредственно в кадр. Таким образом, разработчики контента всегда должны делать источник («src») фрейма HTML-файлом. Изображения могут быть вставлены в файл HTML, и их текстовые альтернативы будут корректно развиваться.

<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN"> <HTML> <HEAD> <TITLE> Правильный документ набора фреймов </ TITLE> </ HEAD> <FRAMESET cols = "100%" title = "Evolving frameset"> <FRAME name = "goodframe" src = "яблок.html" title = "Яблоки"> </ FRAMESET> </ HTML> <! - In apple.html -> <P> < IMG src = "apple.gif" alt = "Яблоки">

Следующего устаревшего примера следует избегать, поскольку он вставляет IMG непосредственно в кадр:

Устаревший пример.

<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 Frameset // EN"> <HTML> <HEAD> <TITLE> Документ с неверным набором фреймов </ TITLE> </ HEAD> <FRAMESET cols = "100%" title = "Статический набор фреймов"> <FRAME name = "badframe" src = "apple.gif" title = "Яблоки"> </ FRAMESET> </ HTML>

Обратите внимание, что если, например, ссылка приводит к вставке в кадр нового изображения:

<P> Посетите красивую рощу из <A target="badframe" href="oranges.gif" title="Oranges"> апельсинов </A>

первоначальный заголовок кадра («Яблоки») больше не будет соответствовать текущему содержимому кадра («Апельсины»).

Использование целей FRAME

Контрольные точки в этом разделе:

• 10.1 До тех пор, пока пользовательские агенты не разрешат пользователям отключать порожденные окна, не вызывайте всплывающие окна или другие окна и не изменяйте текущее окно без уведомления пользователя. [Приоритет 2]

Разработчики контента должны избегать указания нового окна в качестве цели фрейма с target = ”_ blank”.

Ранние рекомендации правительства Великобритании:

Цитата : « Убедитесь, что веб-сайт, использующий среду фреймов, можно использовать с браузерами, не поддерживающими фреймы, с помощью параметра <noframes>».

Руководство для веб-сайтов правительства Великобритании
Иллюстрированный справочник для команд веб-менеджмента

Первая десятка ошибок Якоба Нильсена в веб-дизайне

Цитата : « Разделение страницы на фреймы очень запутанно для пользователей, поскольку фреймы нарушают основную модель пользователя веб-страницы. Внезапно вы не можете добавить в закладки текущую страницу и вернуться к ней (закладка указывает на другую версию набора фреймов), URL-адреса перестают работать, и распечатки становятся затруднительными. Еще хуже то, что предсказуемость действий пользователя выходит за рамки: кто знает, какая информация появится, когда вы нажмете на ссылку ?

Alertbox Якоба Нильсена на май 1996 года:

W3C Информация к сведению

Цитата : « Примечание. Определение набора фреймов никогда не меняется, но содержимое одного из его фреймов может. Как только начальное содержимое кадра изменяется, определение набора кадров больше не отражает текущее состояние его кадров. В настоящее время нет способа кодировать все состояние набора кадров в URI. Поэтому многие пользовательские агенты не позволяют пользователям назначать закладки для набора фреймов. Наборы фреймов могут сделать навигацию вперед и назад по истории вашего пользовательского агента более сложной для пользователей. W3C

Чтобы получить полное и полное представление о том, как проектировать с рамками , посетите W3C Frames Development стр.

Похожие

Комментарии