Frame что это: Что такое фрейм простыми словами / Skillbox Media

Содержание

Фрейм (frame): что это такое для SEO, их недостатки и возможности использования

Оглавление

История технологии
Преимущества фреймов
Возможные недостатки
Индексирование фреймов поисковиками
Особенности продвижения сайтов во фреймах

Технология Frame

Что такое frame

Термин «фрейм» пришел к нам из английского языка. В переводе это слово означает «рамка» и представляет собой отдельную область окна. По своей структуре такой участок является полностью законченным HTML-документом.

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

История технологии

Сегодня можно констатировать, что решение об отходе от работы с фреймовой технологией окончательно принято. На сайте https://www.w3.org/TR/html5-diff/#obsolete-elements четко указано, что обычные теги для создания такой структуры frame, frameset и noframes являются устаревшими. В качестве аргумента приводятся данные о том, что использование такой структуры отрицательно отражается на юзабилити сайтов и их доступности в сети.

Но современные технологии поддерживают элемент IFRAME. Его использование позволяет вставлять фреймы в текстовые блоки на страницах. При этом такие элементы имеют возможность выравнивания относительно самого текста. Важный момент: изменять размеры встроенных фреймов нельзя в принципе. У них отсутствует соответствующий атрибут для изменения размеров.

В будущем без скачкообразных изменений технологии дальнейшее применение фреймов маловероятно. И стоит помнить, что ведущая организация по стандартизации интернет-технологий – W3C – явно указала на то, что такие структуры не должны использоваться разработчиками сайтов.

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

Преимущества фреймов

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

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

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

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

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

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

Неверное отображение страниц. Часто верстка страниц с такой структурой выглядит в браузерах некорректно с точки зрения дизайна. И это связано с особенностями технологии. С точки зрения SEO использование фреймов в html-верстке страницы весьма нежелательно.
Наличие единого адреса для всей структуры. В результате внутренние страницы такого сайта невозможно добавить в закладки. Это приводит к неудобствам в работе пользователей.
Некорректная индексация поисковиками. Наличие на сайте нескольких полноценных документов, из которых формируется одна страница, заметно затрудняет работу поисковых систем. Это приводит к существенным ошибкам при индексации. Как следствие – неправильное определение тематики и адресов страниц, выпадение критически важного контента из индексации.

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

Индексирование фреймов поисковиками

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

Негативный момент такой индексации – при переходе на внутреннюю часть страницы пользователь обычно не видит меню и другие навигационные механизмы.

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

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

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

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

И для просмотра страницы нужно использовать другую программу.

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

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

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

Опыт многих оптимизаторов и вебмастеров также говорит о том, что страницы на фреймах не получают высоких мест в поисковой выдаче. Это происходит даже в том случае, если они попадают в базу индексации.

Особенности продвижения сайтов во фреймах

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

Чтобы минимизировать проблемы индексации сайтов, основанных на фреймах, при их описании применяются специальные теги и параметры. Основным элементом контейнерной структуры является frameset. Именно он заменяет в исходном коде стандартный body;. Каждый отдельный контейнер в структуре описывается frame. Его количество в коде страницы отвечает числу отдельных участков, отображающихся в окне браузера при просмотре.

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

Что такое iFrame и почему его нежелательно использовать для поисковой оптимизации

105013 72

How-to

– Читать 9 минут

Прочитать позже

ЧЕК-ЛИСТ: ТЕХНИЧЕСКАЯ ЧАСТЬ — КОД СТРАНИЦ

Дмитрий Севальнев

Инструкцию одобрил Руководитель департамента SEO и рекламы, совладелец интернет-агентства «Пиксель Плюс»

iFrame или плавающий фрейм — отдельное окно, HTML-документ, который отображается вместе с другим содержимым страницы в окне браузера. Располагаться он может в любом месте, без привязки к тегу <iframe>.

Использование данного тега зачастую рискованно получением фильтра: сайт перестает полностью контролировать содержимое документа, так как его часть подгружается с другого сайта через iframe.

Поскольку мы перестаем контролировать содержимое, то через iframe возможна подгрузка нежелательного контента (18+, вирусы и прочее), что, в свою очередь, может привести к санкциям. А это отразится на продвижении в выдаче.

Содержание:

1. Зачем нужен iFrame
2. Как найти страницы с iFrame с помощью Serpstat
3. Где используют фреймы
4. Преимущества и недостатки фреймов
5. Отношение поисковых систем к фреймам
Заключение

Зачем нужен iFrame

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

iFrame нужен, чтобы встраивать традиционный фрейм, а также отдельные HTML-документы на разные страницы без применения тега <iframe>. В результате получается, что на веб-странице появляется демонстрация контента другого URL-адреса с функцией прокрутки или без нее.

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

Так выглядит простейший пример iframe: фрагмент кода с заданным размером фонового окна под баннер:

<iframe src="https://example.com"></iframe>

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

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

Например, вы вызываете кликом справку, в ответ появляется общее меню, рядом с которым в фоне открывается окошко, отвечающее за выбранный вами блок информации:

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

Как найти страницы с iFrame с помощью Serpstat

С помощью инструмента Аудит сайта в Serpstat можно проверить сайт или его отдельную страницу на наличие технических ошибок. Кроме того, инструмент дает рекомендации по их исправлению и возможность оценить результаты проведенных работ по SEO.

В нашем случае, мы будем проверять сайт https://tinypng.com/, чтобы найти тег <iframe>.

Для начала работы создайте новый проект. Перейдите в Список проектов и нажмите Добавить новый проект. Если ваш сайт уже добавлен, просто нажмите на Аудит сайта.

После проведения проверки Serpstat покажет Суммарный отчет, то есть краткую сводку по ошибкам на сайте.

Чтобы увидеть полный перечень проблем и рекомендации по их исправлению, нажмите на Все проверки.

В разделе Индексация мы видим ошибку о наличие тега <iframe> и все соответствующие URL страниц, а также рекомендации по устранению этой проблемы.

Если проверяемый сайт не использует iFrame, то в перечне ошибок никаких данных не будет.

Если ошибка на страницах есть, то в отчете вы найдете:

описание проблемы;
подсказка, как ее устранить;
история проверки;
URL, на котором обнаружена ошибка.

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

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

Где используют фреймы

Встроенные видео, презентации и прочий визуальный контент.

Для оптимизации внешнего вида приложений служб поддержки, как на предыдущем скрине.

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

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

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

Например, так выглядит фрагмент кода, который подгружает видео с YouTube:

<iframe src="https://www.youtube.com/example" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Для чего практикуют использование фреймов

встраивание медиаконтента — как своего, так и стороннего;
встраивание примеров фрагментов кода;
встраивание апплетов — приложений, работающих в контексте веб-сайта, например, формы оплаты или интерактивные карты. Так Яндекс предоставляет возможность запускать Яндекс.Карты через iFrame.

Для чего нежелательно использовать фреймы

фотогалереи;
окно чата;
навигация;
накрутка фонового трафика.

Фотогалерея и чат — обычно самостоятельные документы, которые не стоит встраивать в тело другого документа. Для навигации предпочтительнее применять карту сайта и хлебные крошки. А накрутка рано или поздно заканчивается наложением фильтров.

А самое главное — это подгружать контент только из доверенных источников!

Преимущества и недостатки фреймов

Преимущества:

Быстрая подгрузка видеоматериалов, карт, презентаций и прочего контента.

Фреймы в HTML позволяют показать посетителю одновременно несколько страниц, которые абсолютно самостоятельны.

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

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

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

А теперь подробнее о возможных рисках:

Существует вероятность, что индексирование веб-сайта поисковыми роботами будет прерываться при переходе на фрейм.

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

Угроза фильтров. Санкции от поисковых систем возможны, когда во фреймах находится контент запрещенного характера.

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

С технической точки зрения получается следующий код:

Содержимое тега <noframes> показывается в браузере, когда он не поддерживает вставку iFrame. В то же время остальные браузеры, умеющие обрабатывать окна с фреймами, не обращают на него внимания. Описание следует раскрывать более полно, чтобы удержать пользователя на веб-сайте.

Хотите обнаружить ошибки на сайте, которые мешают продвижению с помощью Serpstat?

Заказывайте бесплатную персональную демонстрацию сервиса, и наши специалисты вам все расскажут! 😉

Оставить заявку!

Узнать подробнее!

Отношение поисковых систем к фреймам

Есть два фундаментальных правила, которые нужно помнить:

iFrame можно встраивать только с проверенных и надежных источников, которым вы лично доверяете.

Учтите, что подгружаемый контент не будет проиндексирован, как часть документа.

«Google поддерживает фреймы и iframe в той мере, в какой это возможно. iFrame могут создавать проблемы для поисковых систем, потому что они не соответствуют концептуальной модели Интернета», — сказано в справке Google.

«Для корректного ранжирования документа не рекомендуется использовать тег <iframe>, так как поисковый робот Яндекса не индексирует документы, подгружаемые в него», — отмечает Яндекс.Помощь.

Причина, по которой iFrames не соответствуют концептуальной модели, в том, что страницы с iFrames имеют более одного URL-адреса. Один — для страницы, на которой размещается вставка iFrame, а другой — для страницы, из которой он извлекает контент. Неудивительно, что роботы могут запутаться.

Заключение

iFrame — это тег, который позволяет внутри другого HTML-документа отображать другой. В результате при запуске страницы, на которой присутствует фрейм, фоново подгружается еще одна самостоятельная страница.

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

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

Задавайте вопросы в комментариях или пишите в техподдержку.:) А также вступайте в чат любителей Серпстатить и подписывайтесь на наш канал в Telegram.

Serpstat — набор инструментов для поискового маркетинга!

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

Набор инструментов для экономии времени на выполнение SEO-задач.

Получить бесплатный доступ на 7 дней

Оцените статью по 5-бальной шкале

3.43 из 5 на основе 52 оценок

Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.