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

1.5. Фреймы. Что такое фрейм?

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

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

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

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

Как работают фреймы

На первый взгляд, фреймы — это нечто сложное, но их легче понять, если провести аналогию с ячейками таблицы. Расположение фреймов на экране задается почти так же, как ячеек в таблице: таги и атрибуты работают так же, как их табличные родственники. Однако, хотя аналогия между единичным фреймом на странице и ячейкой таблицы полезна, нужно помнить, что есть и отличия. Содержимое ячейки задано в коде HTML-страницы с таблицей. Текст или графика, составляющие содержимое таблицы, фактически вводятся на той же самой странице HTML, что и таг или атрибут, описывающие таблицу. Напротив, экран с фреймами описывается в НТМL-странице, называемой (frameset ). Содержимое же фрейма — это отдельная HTML-страница, которая может находиться где угодно — в другом каталоге, на локальном сервере или на удаленном узле где-то в сети. Фреймовая структура определяет только способ организации экрана с фреймами и указывает, где находится начальное содержимое каждого фрейма. Для всех фреймов задаются URL, описывающие местонахождение их данных. Как правило, на странице с фреймовой структурой нет содержимого фреймов. Такая страница обычно невелика — она описывает только кадровую структуру экрана. Когда документ загружается в фрейм, вы можете щелкать мышкой на ссылке в этом документе, что вызовет появление связанных документов в других кадрах, заданных в фреймовой структуре.

Создание простой страницы с фреймами

Создадим, для лучшего понимания, пару простых страничек с фреймами, чтобы стало понятно, каково строение НТМL страницы с фреймами и для чего нужны основные таги и атрибуты.

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

Задание фреймовой структуры

Для начала мы должны представить себе общий вид страницы — где и какого размера будут фреймы. Затем можно подумать об их содержании. Ниже приводится код простой фреймовой структуры с использованием тага . Обратите внимание: страница с фреймовой структурой не содержит тага .

  Пример фреймов    Вы видите эту страницу браузером, не поддерживающим фреймы.

Вот и весь код, необходимый для задания фреймовой структуры. Обратите внимание на таг . Через несколько минут мы к нему вернемся. В результате мы получили экран, разделенный на два окна. Левое окно занимает 25 процентов экрана и содержит страницу с названием a.php. Окно справа займет 75 процентов и вначале покажет файл b.php. Пока у нас их нет, так что вы увидите страницу с двумя пустыми фреймами. Прежде чем она появится, нам придется пару раз щелкнуть мышкой в ответ на сообщения об ошибках, потому что броузер будет пытаться найти несуществующие страницы. Заметьте, что правую страницу мы назвали ( ) с помощью строки:

Это означает, что фрейм под именем main будет содержать страницу b.php. Заметим, что поскольку мы не собираемся показывать в левом фрейме никаких страниц, кроме menu.php, нам не нужно его называть.

Подготовка содержимого фрейма

Теперь давайте загрузим фреймы с содержимым. Зададим страницу menu.php в левом фрейме, где мы собираемся щелкать мышью, переключаясь между двумя страницами в правом фрейме. Файл menu.php — это обычная НТМL-страница, построенная как оглавление. На самом деле мы можем взять готовую страницу с оглавлением и использовать ее. Имейте в виду, что этот фрейм узкий и высокий, так что страница, которая будет в него загружаться, должна быть соответствующим образом спроектирована. Теперь мы должны определить, где будут появляться другие страницы при щелчке мышкой на ссылке. Поскольку мы хотим, чтобы они отображались в правом фрейме, добавим атрибут ТАRGET= (TARGЕТ=»main») в таг ссылки. Это означает, что когда пользователь щелкает на ссылке, вызываемая страница появляется в фрейме main. Мы отображаем все страницы в фрейме main, поэтому давайте добавим атрибут ТАRGЕТ=»main» во все таги ссылок в оглавлении. Если мы не определим атрибут ТАRGЕТ, то страница появится там, где мы щелкнули мышкой, — в левом фрейме, что нас не устраивает, хотя в какой-нибудь другой ситуации подобное поведение было бы очень кстати. Например, вы можете добавить ссылку , которая будет просто выводить следующие ссылки. Имеет смысл сделать оглавление подлиннее, чтобы читатели видели как можно больше ссылок. Но сейчас давайте ограничимся простым примером. Ниже приведен код для левого фрейма menu.php.

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

Подготовка фрейма main

Правый фрейм main будет содержать сами HTML-страницы. Ваша задача так их спроектировать, чтобы они хорошо смотрелись в меньшем, чем обычно, окне, потому что часть экрана будет занята левым кадром оглавления. Но больше эти страницы ничем не примечательны. Ниже приводится код для страницы, упомянутой первой в оглавлении ( html-pr2-4.php).

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

Telephone (123) 12-34-56
FAX (123) 12-34-56
Почтовый адрес 123456 г. Город, ул Лесная, 106
- Общая информация: abc@abc.su
- Продажи: abc@abc.abc.su
Обратите внимание: на приведенных страницах нигде тайно не запрограммирован фрейм. Это значит, что можно без особых проблем конвертировать все документы вашего Web-сервера для использования в фреймовой структуре.

Использование тага

У многих ваших посетителей еще остались броузеры, не умеющие обращаться с фреймами. По этим причинам разумно предоставить доступ к версии ваших основных страниц без фреймов. Если читатель с устаревшим броузером окажется на вашей странице с фреймовой структурой, все, что находится на ней между тагами < NOFRAMES >и , будет выглядеть отлично — броузер просто проигнорирует фреймы. Вот почему обязательно нужно использовать таги . Возможно, вам придется иначе организовать экран без фреймов.

Можно поместить на страницу с фреймами кнопку No Frames (Без фреймов). Ее назначение очевидно. Такой вариант достаточно разумен и легко осуществим.

На тот случай, если вы неуверенно чувствуете себя при использовании < NOFRAMES >, ниже приведен пример страницы с фреймовой структурой с добавленным в конце разделом < NOFRAMES >.
```
   Пример фрейма   Вы видите эту страницу броузером не поддерживающим фреймы. Броузер поддерживающий фреймы не видит этот текст.  
```
Имейте в виду, что поддерживающий фреймы броузер проигнорирует все, что находится между тагами < NOFRAMES >и . И наоборот, не поддерживающий фреймы броузер проигнорирует все, что находится между тегами и . Код без фреймов можно поместить и в начало, и в конец страницы.

Специфические таги и атрибуты фреймов

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

Таг

Таги обрамляют текст, описывающий компоновку фреймов. Здесь размещается информация о числе фреймов, их размерах и ориентации (горизонтальной или вертикальной). У тага только два возможных атрибута: ROW=, задающий число строк, и СОLS=, задающий число столбцов. Между тагами не требуется указания тага , но его можно поместить между тагами в конце фреймовой структуры. Между тагами не должно быть никаких тегов или атрибутов, которые обычно используются между тагами . Единственными тагами, которые могут находиться между тагами и , являются таги , и < NOFRAME>. Это упрощает задачу. В основном все связано с тагами и их атрибутами. Если же вы хотите поэкспериментировать, можно сделать вложенные друг в друга таги аналогично тагам .

Атрибуты ROW= и СОLS= похожи. Имейте в виду, что для каждой строки и столбца, упомянутых в таге , должен быть свой набор тагов .
А можно сделать так:

«Волшебные» целевые фреймы

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

Имена целевых фреймов всегда начинаются с символа подчеркивания (_); никакие другие фреймы не могут так называться. < Волшебные>фреймы необязательно указывать в фреймовой структуре. Если не проявить должной аккуратности, то это — еще один повод вашему броузеру открыть кучу окон.

Фрейм «blank»

Если атрибут ТАRGЕТ= ссылается на » blank», то документ всегда будет появляться в новом пустом окне.

Фрейм «self»

Имя «self» указывает на то, что выбранная страница загружается в тот же фрейм, где была активирована ссылка. Если вы щелкнете мышкой на ссылке в фрейме оглавления, выбранная страница окажется в том же самом фрейме. Если вы задали фрейм для всего документа в атрибуте ВАSЕ=, то «self» помогает нейтрализовать ссылку в ВАSЕ=.

Фрейм «раrent»

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

Фрейм «top»

При указании ссылки «tор» документы появляются в отдельном окне вне фрейма. Независимо от вашего желания броузер откроет новое окно просмотра.

Вложенные и множественные кадровые структуры

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

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

Русский править

Происходит от англ. frame «кадр, рамка».

Фразеологизмы и устойчивые сочетания править

Перевод править

Библиография править
- Новые слова и значения. Словарь-справочник по материалам прессы и литературы 80-х годов / Под ред. Е. А. Левашова . — СПб. : Дмитрий Буланин, 1997.
- Добавить пример словоупотребления для значения с помощью >
- Добавить синонимы в секцию «Семантические свойства»
- Добавить гиперонимы в секцию «Семантические свойства»
- Добавить хотя бы один перевод в секцию «Перевод»
Посмотреть историю изменений этой страницы.

Языки
- Эта страница в последний раз была отредактирована 24 июля 2017 в 20:27.
- Если не указано иное, содержание доступно по лицензии CC BY-SA 4.0.
- Политика конфиденциальности
- Описание Викисловаря
- Отказ от ответственности
- Кодекс поведения
- Разработчики
- Статистика
- Заявление о куки
- Условия использования
- Настольная версия
Простыми словами: что такое фрейм?

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

Простыми словами объясняют, что такое модуль, эксперт в продуктовом дизайне Ольга Лопатина и эксперт во frontend-разработке Миша Березин.

Ольга Лопатина

Продуктовый дизайнер в «Альфа-Банке», влюблена в дизайн интерфейсов

Ссылки

Ольга Лопатина о фрейме на продакт-дизайнерском

Фрейм — это инструмент в Figma, а Figma — это стандарт, поэтому объясню, что это и как в Figma.

Что такое фрейм в дизайне?

Фрейм — это структура, которая содержит некоторую информацию.

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

Образно: рабочая область — холст, а внутренние элементы — это сгруппированные части рисунка.

На всякий случай: в других графических редакторах чаще применяется слово «артборд».

Как делают фреймы в Figma?

В отличие от артбордов, в Figma можно создавать любое количество фреймов внутри фрейма — нам это необходимо для более сложного дизайна. К примеру, внешний фрейм может быть экраном iPhone 14, а внутренние фреймы уже будут содержать графические или текстовые элементы.

Фрейм создаём с помощью клавиши F или инструмента Frame.

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

Фрейм и из существующих объектов можно создать с помощью Option + Command (Ctrl) + G.

Существующие объекты можно объединять и в «Группы» (Command (Ctrl) + G). Это хорошее решение для работы с похожими элементами — я так делаю, чтобы уменьшить количество слоёв в макете. Так легче поддерживать чистоту в нём. Помни: правильный нейминг и группировка помогут тебе не запутаться.

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

Миша Березин

Ссылки

Миша Березин о фрейме на фронтендском

Что такое фрейм в разработке?

В веб-разработке слово «фрейм» используют в разных контекстах.

Обычно подразумевают HTML-элемент , который позволяет внутрь одной веб-страницы встроить другую веб-страницу. Сейчас объясню.

Когда вы открываете сайт, браузер создаёт так называемое окно (window), в контексте которого формируется структура документа, применяются стили, выполняется JS-код, и в результате вы видите, например, эту статью.

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

Для чего нужен фрейм при разработке сайта?

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

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

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

Больше интересного про дизайн в нашем телеграм-канале. Подписывайтесь!

фрейм

(англ. frame — остов) — категория когнитивной психологии и инженерии знаний, введенная М. Минским. Ф. представляет собой форму интерпретации реальных объектов в виде хранимого в памяти пакета знаний. Специфика Ф. состоит в его смысловой иерархической организации: Ф. начинается с ответов на вопросы «что» и «почему». Ф. описывает реальность вне ее субъективной динамики, составляющей содержание сценария. В то же время Ф. образует контекстуальную основу сценария и систему предпосылок процесса решения задач .

Краткий психологический словарь. — Ростов-на-Дону: «ФЕНИКС» . Л.А.Карпенко, А.В.Петровский, М. Г. Ярошевский . 1998 .

1. Минимальное описание некоего явления, факта или объекта, обладающее свойством целостности: удаление из этого описания любой составляющей приводит к тому, что данное явление перестает правильно опознаваться (классифицироваться).

2. Эталон, с коим сравниваются изображения, подлежащие классификации — фрейм-классификатор.

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

1) осознает образы зрительные — фреймы восприятия визуального;
2) понимает слова — фреймы семантические;
3) понимает рассуждения, действия — фреймы-сценарии;
4) понимает повествования — фреймы-рассказы.

Фрейм — это «идеальный» образ реального предмета или явления, удобное упрощение действительности. Его можно представить как сеть, состоящую из узлов и связей между ними. В конкретной социально-психологической ситуации узлы могут представлять собой отдельных людей или группы, а связи могут характеризовать те или иные отношения либо воздействия. С помощью фреймов описывается поведение людей, характеризуются отдельные поступки и пр. Группа фреймов может объединяться в систему. Результаты характерных действий отражаются с помощью трансформации между фреймами системы.

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

Словарь практического психолога. — М.: АСТ, Харвест . С. Ю. Головин . 1998 .

Большой психологический словарь. — М.: Прайм-ЕВРОЗНАК . Под ред. Б.Г. Мещерякова, акад. В.П. Зинченко . 2003 .
Похожие публикации: