Что такое фрейм? Как создать фрейм в HTML? Фреймы что это такое

Фреймы и фреймовая структура. Организация фреймовой структуры

Фреймы - средство для разделения экрана на несколько областей, в каждой из которых отображается содержимое отдельной Web - страницы или Web - сайта.

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

Тег <FRAMESET>

Тег <FRAMESET> определяет структуру фреймов на Web - странице. Фреймы разделяют окно браузера на отдельные области, расположенные вплотную друг к другу. В каждую из таких областей загружается самостоятельная веб-страница определяемая с помощью тега <FRAME>. С помощью фреймов Web - страница делится на два или более документа, которые обычно содержат навигацию по сайту и его контент. Механизм фреймов позволяет открывать документ в одном фрейме, по ссылке, нажатой в совершенно другом фрейме. Тег <FRAMESET> заменяет тег <BODY> и используется для разделения экрана. Имеет закрывающий тег </FRAMESET>. Допустимо использовать вложенную структуру элементов, это позволяет разбить один фрейм на две и более области.

Примерфреймовой структуры(Рис. 1).

<HTML>

<HEAD>

<TITLE> ФРЕЙМЫ В HTML</TITLE>

</HEAD>

<FRAME>

</FRAMESET>

</HTML>

Рисунок 1.

Окно браузера разделено на 3 части. Это единственный случай, когда в HTML - документе отсутствуют теги <BODY> </BODY>. Вместо них используются теги, которые и указывают браузеру разбить окно на несколько областей - фреймов.

Атрибуты тега <FRAMESET>

Cols	Подразделяет экран на определенное количество колонок (вертикальных).
Rows	Подразделяет экран на определенное количество колонок (горизонтальных).
Bordercolor	Устанавливает цвет границы между фреймами.
Border	Устанавливает ширину границы между фреймами.
Frameborder	Определяет, отображать границу между фреймами или нет.
Framespacing	Аналог атрибута border. Устанавливает ширину границы между фреймами.

Пример. Организация фреймовой структуры (Рис. 2).

<HTML>

<HEAD>

<TITLE>Фреймы в HTML</TITLE>

</HEAD>

<FRAME>

</FRAMESET>

<FRAME>

</FRAMESET>

</HTML>

Рисунок 2.

Используя сразу оба атрибута – Cols, и Rows в одном теге <FRAMESET>, нельзя получить такое разбиение экрана.

Тег <FRAME>.

Внутри тегов <FRAMESET> </FRAMESET> располагаются одиночные теги <FRAME>, причем их должно быть столько, сколько задано областей. Без параметров эти теги бесполезны.

Тег <FRAME> определяет свойства отдельного фрейма, на которые делится окно браузера. Этот элемент должен располагаться в контейнере <FRAMESET>, который к тому же задает способ разметки страницы на отдельные области. В каждую из таких областей загружается самостоятельная Web – страница, определяемая с помощью атрибута Src. Хотя обязательных атрибутов у тега <FRAME> и нет, рекомендуется задавать каждому фрейму его имя через атрибут Name. Это особенно важно, если требуется по ссылке из одного фрейма загружать документ в другой.

<FRAME> Тег для описания рамки (<FRAME SRC="file.htm">).

Атрибуты тега<FRAME>

Bordercolor	Устанавливает цвет границы фрейма
Frameborder	Определяет, отображать рамку вокруг фрейма или нет.
Name	Задает уникальное имя фрейма.
Noresize	Определяет, можно изменять размер фрейма пользователю или нет.
Scrolling	Определяет присутствие в окне фрейма полосы прокрутки. Может принимать значения "yes", "no" и "auto"(по умолчанию)
Src	Путь к файлу, предназначенному для загрузки во фрейме.
Marginwidht	Определяет расстояние между содержимым фрейма и его границами справа и слева.
Marginheight	Определяет расстояние между содержимым фрейма и его границами сверху и снизу.
Target	Устанавливает связь между фреймами. Определяет имя фрейма, в который будет загружен новый документ. Имеет несколько значений: - _blank загружает содержимое страницы, заданной ссылкой, в новое пустое окно. - _self загружает содержимое страницы, заданной ссылкой, в то же окно, которое содержит ссылку. - _parent загружает содержимое страницы, заданной ссылкой, в окно, являющееся непосредственным владельцем набора фреймов. - _top загружает содержимое страницы, заданной ссылкой, в полное окно, игнорируя используемые фреймы.

Что такое фреймовый сайт | Советы веб-мастера

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

Фреймовый сайт

Не буду описывать термины и так далее, забивать голову не нужными вещами, а постараюсь объяснить просто и доступно. Если же у Вас есть желание, то можете почитать мануал о том, что такое фреймы, в сети полно объяснений. Я же Вам расскажу о том, как именно создавать фреймовые сайты, применительно к партнерским программам. Чтобы не ходить вокруг да около, перейдем сразу к делу. Ниже Вы видите ссылку размещенную на моем домене, вот ее адрес:

https://sovetywebmastera.ru/disc2.htm

Если Вы на нее нажмете, то Вы попадете на продающий сайт Евгения Попова, где рекламируется курс «Как создать информационный бестселлер», нажмите и проверьте ,что отличий нет никаких, хотя в строке браузера не сайт Евгения, а мой. Это и есть работа фрейма. Сейчас на сайте установлен сертификат SSL и чтобы фрейм сработал, разрешите загрузку скриптов после перехода по ссылке выше.

Зачем нужен фреймовый сайт

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

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

Как сделать фреймовый сайт с партнерской ссылкой

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

Скачать код можно здесь >>>

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

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

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

С уважением, Евгений Вергус.

Рубрика: Как сделать сайт

Загрузка...

Подпишитесь на RSS-рассылку и будьте в курсе всех новых статей

sovetywebmastera.ru

۞ → Читать Урок фреймы.

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

Суть фреймов в принципе проста: страница делится на несколько окон, в каждое из которых загружается своя страничка (или картинка), со своим собственным адресом. К примеру, в левом окне - "vasja.html", а в правом - "pupkin.html" (которая физически может находиться где-нибудь на другом сервере). Как и любые страницы в Интернете, они могут ссылаться на другие страницы и друг на друга. Кроме этих двух страниц вы должны написать третью, в которой и будут определяться размеры и свойства этих окон. Для этого используются только два тега - <FRAMESET> и <FRAME>. Чтобы их объяснить, рассмотрим пример:

Во-первых, создадим два файла - vasja.html и pupkin.html:

<html> <head> <title>фрейм</title> </head> <body> Меня зовут Вася! </body> </html>

<html> <head> <title>фрейм</title> </head> <body> А фамилия моя Пупкин. Это звучит круто! </body> </html>

Теперь делаем третий файл, назовем его index.html (назвать можно и по другому):

<html> <head> <title>Страница с фреймами!</title> </head> <frameset cols="50%,50%"> <frame src="vasja.html"> <frame src="pupkin.html"> </frameset> </html>

Вот его-то мы и рассмотрим подробнее. Во-первых, в нем отсутствуют теги <body> и </body>. Можно сказать, их роль выполняет тег <frameset>, хотя это не совсем верно. Тег <frameset> (переводится как "набор фреймов") с атрибутом cols="50%,50%" указывает браузеру, что страница должна быть поделена на два окна (фрейма), каждый шириной в 50% от ширины страницы. Тег <frame> определяет содержимое и свойства каждого фрейма (заметьте, что он не имеет закрывающего тега). В данном случае указано, что содержимым первого фрейма является файл vasja.html, второго - файл pupkin.html (фреймы считаются слева направо и сверху вниз. Здесь - этот пример в действии (откроется в новом окне). Все просто! Еще несколько примеров:

	Три фрейма разной ширины. <frameset cols="20%,30%,50%"> <frame src="page1.html"> <frame src="page2.html"> <frame src="page3.html"> </frameset>
	Фреймы можно расположить рядами так же легко, как и столбцами. Просто меняем атрибут cols на rows: <frameset rows="25%,75%"> <frame src="page1.html"> <frame src="page2.html"> </frameset>

Значения атрибутов cols и rows могут выражаться не только в процентах. cols="150,*,100" - страница разделена на три столбца, где ширина левого 150 пикселов, правого - 100 пикселов, а средний столбец - это все оставшееся между ними место (знак *). Если вы будете размеры фреймов устанавливать в пикселах, то желательно ширину (или высоту) одного из них определить значком *. Можно, например, написать cols="150,550,100", и все будет выглядеть отлично на вашем мониторе с разрешением 600*800. Но стоит только изменить разрешение, и картина полностью изменится. Потому-то и рекомендуется использовать "звездочку".

	Пример: <frameset cols="200,*,100"> <frame src="page1.html"> <frame src="page2.html"> <frame src="page3.html"> </frameset>
	Можно устанавливать пропорции для окон. В этом примере левый фрейм будет шириной в 150 пикселов, а остальную часть страницы поделят между собой 2-й и 3-й фреймы, причем третий фрейм будет в 2 раза шире первого. <frameset cols="150,,2"> <frame src="page1.html"> <frame src="page2.html"> <frame src="page3.html"> </frameset>
	То же, но для рядов: 2-й фрейм занимает 15% от высоты окна, а 1-й и 3-й - все остальное в пропорции 1:3. <frameset rows=",15%,3"> <frame src="page1.html"> <frame src="page2.html"> <frame src="page3.html"> </frameset>

Фреймы могут быть вложенными друг в друга. Это позволяет создавать более сложные конструкции страниц. Рассмотрим несколько примеров:

ramech.net

фрейм - это... Что такое фрейм?

фрейм — фрейм, а … Русский орфографический словарь

фрейм — фрейм/ … Морфемно-орфографический словарь

фрейм — Контекст, окружение, метауровень, способ воспринимать что либо (например, фрейм результата, фрейм как если бы , фрейм возвращения и т. д.). Краткий толковый психолого психиатрический словарь. Под ред. igisheva. 2008. фрейм … Большая психологическая энциклопедия

Фрейм — (англ. frame кадр, рамка) в самом общем случае данное слово обозначает структуру, содержащую некоторую информацию. Фрейм (инженерия знаний) в системном анализе, искусственном интеллекте, инженерии знаний: структура,… … Википедия

Фрейм — по М.Минскому структура данных для представления стереотипной ситуации. Фрейм логическая запись, каждому полю (слоту) которой соответствует основные элементы понятия. В формальных фреймовых моделях слотам ставятся в соответствие значения,… … Финансовый словарь

ФРЕЙМ — [англ. frame рамка, схема] 1) инф. структура данных, предназначенная для представления стереотипной ситуации; минимальное описание какого л. явления, факта или объекта, представленное таким образом, что удаление любой составляющей разрушает это… … Словарь иностранных слов русского языка

фрейм — Кадр данных, обычно фиксированного формата [ГОСТ Р 52872 2007] фрейм Фрагмент web страницы, чаще всего являющийся отдельным файлом. [http://www.lexikon.ru/rekl/a eng.html] Тематики информационные технологии в целом EN frame … Справочник технического переводчика

фрейм — м. Универсальный носитель информации в ЭВМ, который при заполнении структуры способен описать факт, событие, процесс. Толковый словарь Ефремовой. Т. Ф. Ефремова. 2000 … Современный толковый словарь русского языка Ефремовой

фрейм — образец, структура Словарь русских синонимов … Словарь синонимов

Фрейм — (frame): кадр данных, обычно фиксированного формата... Источник: ИНТЕРНЕТ РЕСУРСЫ. ТРЕБОВАНИЯ ДОСТУПНОСТИ ДЛЯ ИНВАЛИДОВ ПО ЗРЕНИЮ. ГОСТ Р 52872 2007 (утв. Приказом Ростехрегулирования от 27.12.2007 N 548 ст) … Официальная терминология

фрейм — [фрейм] му, м. (на) м і, мн. мие, м іў … Орфоепічний словник української мови

all_words.academic.ru

Что такое фрейм? Как создать фрейм в HTML?

Как запустить видеоурок:

Разархивировать скачанный файл.
Открыть папку index.
Запустить файл index.html в браузере.

В данном видеоуроке мы поговорим о фреймах. Три года назад я изучал HTML по электронному учебнику. Не помню, какого автора. Уникальность учебника заключалась в том, что он был построен по фреймам. Слева вверху был логотип. Чуть ниже — меню. Справа — контент. Впрочем, казалось бы, ничем не отличается от таблиц. Но у такой верстки были преимущества. Например, при прокрутке страницы, меню фиксировалось и оставалось на месте. Меня это заинтересовало, и я начал вплотную изучать фреймы.

Недостатки фреймов

Я не буду давать про них много информации, так как тема сама по себе и так объемная, но недостатки фреймов я вам сейчас приведу:

При использовании фреймов, в контенте обычно нет ссылок, а это плохо сказывается на индексировании сайта поисковиками.
Второй минус для пользователей. Заключается он в том, что фреймы показывают лишь title (название) одной страницы. Из-за этого пользователь не сможет поместить понравившуюся ему страницу в избранное.
Поисковики индексируют только те страницы, которые заложены в страничку «Главная» — в страничку фреймов. Поэтому пользователь, переходящий через поисковик на какую-нибудь страничку вашего сайта, откроет ее, и у него не будет показана ни навигация, ни логотип, то есть будет показан не только контент.
Последний минус появляется при большом количестве страниц во фрейме. То есть если у нас в фрейм страницы заложены и логотип, и меню, и контент, и второе меню, и футер, и еще какие-нибудь фреймы, то это дает очень большую нагрузку на браузер пользователя и требует больше информации. В итоге расходуется больше памяти — это тоже доставляет неудобство.

Что такое фрейм?

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

Как создать фрейм в HTML?

Перейдем на наш рабочий стол. Создадим еще папку. Назовем ее Frames. Откроем ее и свернем. Зайдем в папку site2. Скопируем из нее индексный файл и вставим его в папку Frames. Откроем файл через notepad и удалим все ненужное, в том числе и тег <body>.

<!DOCTYPE HTML Public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Главная страница</title> <meta http-equiv="Content-Language" content="ru"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <meta name="keywords" content="Мой, личная, страница, info, line, net, рассказ, сайт"> <meta name="description" content="Моя личная страница! Сказ о том, зачем я создал сайт info-line.net"> </head> </html>

— Эй, Олег, где мое тело?— Мы тебя трансформируем.

Прописываем <frameset></frameset>. Про тег <body> мы забываем.

Сохраним наш документ и создадим еще один. Копируем в него какой-нибудь индексный файл. Удаляем здесь все, что находится в теге <body>. Тег <body> не трогаем. И пишем сюда изображение.

Давайте сохраним нашу страничку в папку Frames. Назовем ее header.html.

Перейдем на рабочий стол, зайдем в папку site2, скопируем изображение info- line из папки img, переименуем в logo и закроем папку site2.

Теперь создаем еще один документ. Это будет меню. Копируем все, что находится в документе header.html и «img src» меняем на меню, которое мы прописывали в таблице в 12 уроке.

Сохраняем как menu.html. Создадим третью страничку — контент. Копируем из того же файла наш контент. Сохраним как content.html.

Мы все сделали. Теперь перейдем в файл index.html. Тег <frameset> имеет атрибут rows, означающий высоту. Высота указывается по порядку тех фреймов, которые будут прописаны ниже. Прописываются они с помощью тега <frame> и атрибуда src. Тег <frame> закрывающего тега не имеет. В кавычках указывается путь к документу. Первым пусть идет логотип, потом меню и третьим — контент.

Давайте теперь укажем высоту. Поясню. Страница будет выглядеть так: сначала идет логотип, потом меню, остальное занимает контент. Пропишем это. Например, под логотип выделим 150 пикселей. Ставим запятую. На меню выделяем 200 пикселей. Снова ставим запятую. И на контент мы не можем выделить конкретное число пикселей, потому что не знаем точно, сколько он займет, поэтому поставим звездочку. Она означает «все остальное пространство».

Сохраним. Проверим в браузере. Смотрим, что у нас получилось. Идет логотип (можно было фрейм для логотипа сделать больше либо уменьшить сам логотип). Потом — меню (с ним все нормально). Далее — контент с полосой прокрутки. Кстати, мы можем двигать наши фреймы: некоторые делать шире, некоторые — уже.

Давайте теперь сделаем нашу страничку следующего вида: слева — логотип, потом меню, оставшееся место — контент. Грубо говоря, мы повернем страницу на 90 градусов.

Перейдем в код и заменим атрибут rows на cols. Значения оставим те же.

Сохраняем, переходим в браузер. Проверяем. У нас получилось то, что мы задумали.

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

Давайте перейдем в наш код и разберемся, как это делать. Подводный камень тега <frameset> заключается в том, что мы не можем использовать вместе атрибут cols и rows. Как же нам поступить в этом случае? Мы добавим еще один фрейм в наш настоящий фрейм. Но сначала перейдем в хедер и уменьшим логотип. Мы уже знаем, как это делать.

Сохраняем. Перейдем снова в index.html. Прописываем еще один тег <frameset> . В ширине указываем ширину наших полей: хедера и меню. Она у нас будет равна 150, допустим. Потом идет ширина контента — это оставшаяся часть. Она равна звездочке. В следующем теге <frameset> мы указываем высоту логотипа — 150 пикселей, потом идет запятая и звездочка. То есть menu.html будет занимать оставшееся место на странице.

Давайте сохраним и проверим в браузере. Обновим страницу — получили то, что хотели. Давайте только увеличим расстояние до двухсот.

Сохраним и посмотрим. Именно такой макет был у учебника, по которому я учил HTML. Прокручивая контент, меню остается на месте. При нажатии по ссылке «Обратная связь», если мы добавим страничку «Обратная связь» в папку с фреймом, то она должна отобразиться на месте контента.

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

info-line.net

Что такое фрейм? Как создать фрейм в HTML? Фреймы что это такое

Фреймы и фреймовая структура. Организация фреймовой структуры

Похожие статьи:

Что такое фреймовый сайт | Советы веб-мастера

Фреймовый сайт

Зачем нужен фреймовый сайт

Как сделать фреймовый сайт с партнерской ссылкой

۞ → Читать Урок фреймы.

фрейм - это... Что такое фрейм?

Что такое фрейм? Как создать фрейм в HTML?

Недостатки фреймов

Что такое фрейм?

Как создать фрейм в HTML?