Rámy na webu

Rámům se anglicky říká frames a dnes jsou neodmyslitelnou součástí webových stránek. V tomto textu se snažím na příkladu znázornit, jak to funguje, a objasnit základní syntaxi.

Jak to vypadá - Tři soubory - Příklad - Odkazy v rámech - Záludnosti - Jistota navigace

Jak to vypadá

Okno prohlížeče je rozděleno na několik obdélníkových částí (rámů). V každém rámu je (třebaže to nemusí být vidět) samostatná HTML stránka. Zpravidla je jeden z rámů obsahem s odkazy, které se zobrazují v jiném, hlavním okně. Nejčastěji to vypadá nějak takhle:

 

Obsah:
odkaz
jiný odkaz
zase odkaz
Rám s texty

sem ty odkazy z levého rámu vedou

Text text: viděli jste mojí stránku o rébusech? (skrytá reklama)

Takových rámů může být v okně mnoho (prakticky neomezeně), nejčastěji se používají dva nebo tři. Mohou být vedle sebe i nad sebou, ale vždy to musí být obdélníky. (Zobrazte si příklad v prohlížeči.)

Poznámka o nejednotnosti:

Protože se historicky definice rámů vyvíjela dost chaoticky, každý prohlížeč je zobrazuje poněkud po svém. Budu se snažit popsat jakýsi standard.

Tři soubory

Jak to tedy udělat: Je to jednoduché, ale trochu těžké na pochopení. Vezmeme si předchozí příklad se dvěma svislými rámy vedle sebe. Vyskytují se tu tři soubory. 

  1. Jeden soubor je obsah levého rámu, 
  2. druhý soubor je obsah pravého rámu. To jsou zatím úplně normální HTML stránky. 
  3. A třetí (nadřazený) soubor v sobě obsahuje definici toho, jak se ty rámy do okna sestaví. I to je HTML soubor, ale místo těla s textem stránky (tagu <body>) obsahuje nastavení rámů -- "frameset".

Příklad

Do souboru priklad10.htm s definicí rámů jsem napsal tento kód:

<html>

<head>

<title>Příklad s definicí rámů</title>

</head>

 

<frameset cols="215,*">

<frame name="obsah" src="priklad9.htm">

<frame name="text" src="priklad8.htm">

</frameset>

</html>

 

Zároveň jsem si vytvořil soubory priklad8.htm a priklad9.htm. Zobrazte si příklad v prohlížeči. Co znamenají jednotlivé tagy:

Frameset
začíná deklaraci rámů. Vlastně nahrazuje tag <body>. Musí mít právě jeden atribut cols (sloupce), nebo rows (řádky).
Cols="215, *"
tento zápis atributu znamená, že rámy budou vedle sebe (budou to sloupce; u řádků by místo "cols" bylo "rows"). První rám bude mít šířku 215 obrazovkových bodů, druhý bude široký tak, aby vyplnil zbývající šířku okna (to je ta hvězdička). Je také možné zadávat procenta. Rámy mohou být třeba čtyři (i tři).
Frame
Po framesetu následuje popis rámů, každý z nich je zastoupen tagem frame. Tento tag mívá mnoho atributů, které vyjadřují vlastnosti rámu, zmiňuji jen ty hlavní:
Name="obsah"
Atribut name u rámu jej pojmenovává. V tomto případě se rám jmenuje "obsah". To se později použije pro adresování odkazů. (Např. <a ... target="obsah"> bude odkaz přepínající do rámu se jménem "obsah".)
Src="priklad9.htm"
Atribut src u frame označuje HTML stránku, která se na začátku načte do daného rámu. V tomto případě to bude soubor priklad9.htm

Nakonec dodejme, že namísto tagu frame může být další (vnořený) frameset, který opět rozdělí rám na několik menších. Tímto končím popis jednoduché výstavby rámů, přestože problematika obsahuje ještě další špeky.

Odkazy v rámech

Jestliže mám vytvořenou rámovou strukturu, mohu kterýkoliv odkaz nasměrovat do libovolného rámu. Nyní se budou hodit jména rámů (nadeklarovaná atributem name v tagu frame). V tagu A (odkaz) se použije nový atribut target (cíl) rovný jménu cílového rámu.

<a href="priklad8.htm" target="text">

Po kliknutí na takový odkaz se v rámu jménem "text" objeví stránka priklad8.htm.

Jména speciálních rámů

Někdy je potřeba odkazovanou stránku zobrazit v novém okně nebo v celém prohlížeči. Proto existují speciální jména rámů:

Základní cíl (default target)

Mnoho stránek, zejména takové, které fungují jako obsahy v levém rámu, všechny své odkazy posílá do jiného rámu. Aby se u každého odkazu nemusel nastavovat stále stejný cíl, může se nastavit základní cílový rám, do kterého se budou přepínat odkazy na stránce, pokud nebude stanoveno jinak. Dělá se to tagem <base>, který se umístí do hlavičky stránky:

<base target="jméno_základního_rámu">

Používá se to zejména u obsahu malých rámů se seznamem odkazů (takové ty levé proužky).

Neexistující rám

Pokud má odkaz zamířit do rámu, který neexistuje, otevře se nové okno prohlížeče a stránka se zobrazí v něm. Ale toto okno si podrží jméno onoho neexistujícího rámu, takže případné další odkazy se stejným targetem se budou zobrazovat v tomto okně.

Záludnosti

Problematika rámů je velmi široká. Zatím jsem nezmínil, jak se definují okraje rámů, jejich proměnlivá velikost, zobrazení lišt a podobné špeky. U nich je problém ten, že každý prohlížeč (Netscape a Microsoft) vyžaduje jinou deklaraci stejných věcí.

V poslední době mnoho webových tvůrců (včetně mě) od rámů upouští, protože jsou pomalé, nevyzpytatelné, graficky omezené, špatně se ukládají, ovládají a tisknou. (Vizte podrobný popis problémů.)Ale hlavně, dá se bez nich obejít!

Úplně jinou (a málo používanou) oblastí je používání takzvaných inline frames (vložených rámů), které se dávají do stránky tagem <iframe>. Jsou málo podporované (pouze IE 4 a výše) a já s nimi nemám jednoznačné zkušenosti.

Jistota navigace

Autoři rámovaných stránek dělají základní chybu, když se domnívají, že každý uživatel začne číst stránky vždycky z té hlavní - rámované. Existují totiž vyhledávací stroje a roboti, které definice rámů ignorují. Uživatel Altavisty tak obvykle začíná četbu na některé vnořené stránce webu, která rámovaná není. U nerámovaných stránek je zvykem uvádět odkazy na příbuzné stránky -- autor rámovaných stránek to opomíjí v domnění, že odkazy na sousední stránky jsou v levém rámu. Jenomže levý rám se cestou z Altavisty nezobrazí!

Nejjednodušším řešením je umístit na každou stránku odkaz na tu hlavní.

Další: Detaily rámů, Proč nepoužívat rámy
Vizte též: správa souborů, zdokonalení odkazů, design pomocí tabulek, Barvení rolovací lišty, Iframe, rychlost stránek

Píše Yuhů
dusan@pc-slany.cz
mail formulářem
Jak psát web O tvorbě, údržbě a zlepšování internetových stránek.

Základy HTML CSS FrontPage Hledání

Obsah

Hlavní stránka

Novinky

FAQ

Download

Zdroje

Hledání


Rozšířené

Základní kurs

Jak udělat stránku

Základy HTML

Publikování

Zásady psaní

Editory

Různé prohlížeče

Editory

FrontPage 2000

FP Editor 98

Word 97

FrontPage Express

HTML tipy

Příprava obrázků

Obrázky

Pozadí

Odkazy

Vychytávky odkazů

Záložky

Aktivní mail

Tabulky

Úprava tabulek

Novinky tabulek

Design tabulkami

Rámy

Formátování rámů

Rámy nepoužívat

Iframe

Formuláře

Formuláře v HTML

Dokonalé formuláře

Zápis barev

Definice

Formátovací chyby

Jak udělat levé menu

Vytěžování stránek

Provoz webu

Rychlost stránek

Vzdálené služby

Vyhledávače

Katalogy

Správa souborů

Ikona stránky

Obsah / forma

Čeština

Chyby češtiny

Tabulky kódování

Meta tagy

Nastavení serveru

Programování stránek

Začátky PHP

Možnosti PHP

Používání prohlížeče

CSS styly

CSS styly

Úvod do CSS

Struktura textu

CSS prakticky

PŘEHLED VLASTNOSTÍ CSS

Složitější deklarace

Délkové jednotky

Pozicování

Sloupce pozicováním

Okraje objektů

Odlišení prohlížečů

Omezení CSS

Odlišný tisk

Dynamické HTML

Filtry

Příklady filtrů

Různé barvy odkazů

Barva rolovací lišty

 


Jak psát web: http://dusan.pc-slany.cz/internet/

Píše Yuhů: autorova stránka, mail: dusan@pc-slany.cz

Poslední aktualizace 08.12.2001