Использование фреймов в HTML. Создание фреймов Seo использование фреймов в html
8.9K
Элемент
Frames
Что же делает
Как вставить страницу в страницу HTML
? Для этого нужно использовать
Отображение
Display block.
Пример кода
Мощный, но легкий в использовании
Еще в старые недобрые времена веб-дизайна было много элементов, портящих жизнь каждого разработчика. Они почти всегда были плохим подходом к дизайну. К счастью, элемент был объявлен устаревшим в HTML5
. Но
Сходства и различия
Оба этих элемента позволяют создать отдельный HTML-документ
. Ссылка на содержимое документа, на который ссылается текущая веб-страница, указывается в атрибуте src
.
Основное различие между
Видео явно на HTML
странице, а не на какой-то отдельной панели. элемент сломал эту парадигму и позволил документу осуществлять контроль над окном браузера, разбив его на несколько мелких панелей (фреймов
), каждая из которых отображает отдельный документ. Все другие различия между и вытекают из этого основного различия.
Не переделывайте макеты на основе фреймов с помощью iframe
Когда-нибудь вам может попасться задача по обновлению старого сайта, который был построен с использованием фреймов. Возможно, вы захотите использовать и фиксированную ширину макета, чтобы воссоздать тот же кошмар из независимых панелей и подокон. Но вы не сможете использовать атрибут target
, чтобы открыть ссылку в отдельном фрейме. Вы можете начать искать решения на JavaScript
. Пожалуйста, не делайте этого.
Удачное (и ужасное) применение
Существует несколько допустимых вариантов использования для создания HTML
страницы:
встраивание стороннего медиа контента;
встраивание собственного медиа контента через кроссплатформенный документ;
встраивание примеров кода;
встраивание сторонних «апплетов
» в качестве форм оплаты.
А вот некоторые ужасные варианты использования :
Фотогалерея;
форум или чат.
Если вам нужно встроить независимые, уже существующие HTML-документы
в текущий, используйте . Если же вы строите все с нуля, нет никаких причин разбивать дизайн страницы на несколько самостоятельных документов. Особенно если они на самом деле не являются независимыми частями контента.
Данная публикация представляет собой перевод статьи «
» , подготовленной дружной командой проекта
Как мы знаем, в одном окне просмотра браузера мы не можем одновременно
загрузить два HTML-документа. Таким образом, если у нас на всех страницах
есть одинаковое меню навигации, то абсолютно одинаковый фрагмент кода
пользователь будет загружать каждый раз, когда будет переходить с одной
Web-страницы сайта на другую. Даже если само меню невелико, это не самый
удобный вариант, так как те каналы связи, которые есть у российских пользователей,
не слишком велики, и загрузка меню может занять как минимум несколько
секунд. Можем ли мы сделать так, чтобы неизменяемые элементы сайта всегда
оставались в окне просмотра пользователя без перезагрузки? Можем.
Мы можем создать документ, который разобьет одно окно просмотра на несколько
прямоугольных областей, в каждой из которых будет отображаться один HTML-документ.
Эти прямоугольные области, каждая из которых является, по сути, отдельным
окном просмотра, и называются фреймами.
Таким образом, мы можем оставить левое и/или верхнее меню навигации постоянно
находиться в окне просмотра, а перезагружать только ту часть сайта, которая
необходима.
Как любое окно просмотра, фреймы могут обладать полосами прокрутки, которые
позволяют пользователю увидеть все содержимое фрейма, если оно не умещается
полностью в видимой зоне. Именно эта особенность фреймов и вызывает постоянные
споры между Web-мастерами. Кто-то утверждает, что подобные элементы управления
не должны находиться во внутреннем пространстве основного окна просмотра,
так как они занимают бесценное пространство и рассеивают внимание пользователя.
Кто-то утверждает, что эти недостатки не слишком большая цена за облегчение
перезагрузки Web-страниц в условиях медленных каналов связи. Так или иначе,
вопрос о возможности применения фреймов каждый должен решать самостоятельно.
В HTML предусмотрено два вида фреймов: обычные, и, так называемые, "плавающие".
Если мы применяем обычные фреймы, то создается документ, который все окно
просмотра разбивает на фреймы, и в них уже отображаются те или иные HTML-документы.
Если же мы используем плавающий фрейм, то его можно включать в обычный
HTML-документ без каких-либо особых ухищрений. Разницу между двумя этими
типами фреймов мы увидим на примере.
Документ с фреймовой структурой создается при помощи тега и его закрывающего близнеца .
Внутри этих двух тегов размещаются конструкции объявления отдельных фреймов
и информация, отображаемая в окне просмотра браузера, если тот не распознает
фреймы. Отдельные фреймы создаются при помощи пары тегов
и . А информация, отображаемая,
когда браузер не поддерживает фреймы, закладывается в HTML-документ при
помощи тега . Но все по
порядку.
Основой тега является разбиение
окна просмотра на несколько частей. Для этого у тега есть два основных
параметра: rows и cols, которые указывают количество и размеры фреймов
по вертикали и горизонтали. При этом задается прямоугольная табличная
структура. Если нам необходимо сделать более детальное разбиение, например,
один фрейм в левой части окна по вертикали и два фрейма, отделенных друг
от друга горизонтальной границей в правой части окна, то можно создать
два тега , один внутри другого.
Но все-таки, рассмотрим параметры тега
более детально.
Параметр cols
предназначен для указания
количества и размеров фреймов по горизонтали в окне просмотра. В качестве
значения параметра используется список размеров фреймов, разделенных
запятыми. Как обычно, для указания размера мы можем использовать абсолютные
и кратные величины, а также процентные соотношения. По умолчанию используется
значение 100%, т. е. основное окно просмотра по вертикали не разбивается.
Параметр rows
позволяет указывать количество
и размеры фреймов по вертикали в окне просмотра, Специфика задания значений
полностью совпадает с параметром cols.
Но рассмотрим на примере, как будет выглядеть создание HTML-документов
с фреймовой структурой. Предположим, что нам необходимо один фрейм слева
выделить под навигационное меню, а оставшееся пространство использовать
для отображения информации с основных страниц Web-сайта. В этом случае,
мы разделим окно просмотра на две части. Для меню мы выделим фрейм шириной
в сто пятьдесят пикселов, а оставшееся пространство должен занять второй
фрейм. Подобная структура Web-страницы реализуется при помощи кода, приведенного
в листинге 1.31.