Grafika a obrázky

Jazyk HTML obsahuje prvky, které umožňují do dokumentu vkládat grafické objekty (obrázky, grafiku), které mohou být hypertextově citlivé. Specifikace není definitivní a může se měnit.

grafika
<IMG>
<IMG src=”url” lowsrc=”url” alt=”alternativní_text” align=[top|middle|bottom|right|left|texttop|absmiddle|baseline|absbottom] width=”šířka” heigth=”výška” units=jednotka vspace=”vertikální_odsazení” hspace=”horizontální_odsazení” border=”šířka_rámečku” ismap usemap=”url”>
  nepárová značka, která zařazuje do dokumentu grafický objekt (obrázek, grafiku); grafický objekt je normální součástí textu stejně jako písmeno ve slově a váže se k řádku, v němž je umístěn; většina prohlížecích programů podporuje grafické formáty GIF a JPEG (JPEG se lépe hodí pro fotografie); pokud je prvek IMG obsažen v hypertextovém kontejneru <A>…</A> a je uveden atribut ismap, je grafika považována za tzv. ”ClicableMap” (obrázek s oblastmi citlivými na poklepávání myší, čímž se umožňuje získat informace přidružené k dané oblasti obrázku); pokud je ve značce uveden atribut usemap a prohlížeč mu rozumí, pak jej upřednostní před hypertextovým odkazem <A> (prohlížeč vyhledá definici citlivých ploch dle atributu usemap a značku <A> vynechá)
  src= URL grafického objektu, který má být vložen do textu
  lowsrc= URL grafiky konceptové kvality (prohlížecí program přenese konceptový tvar grafiky, dokompletuje celý dokument a až poté začne přenášet plné verze grafiky zadané atributy src)
  alt= alternativní text, kterým se nahrazuje grafika v případě, kdy prohlížecí program neumí nebo nesmí zobrazovat grafiku
  align= umístění grafického objektu vůči okolí:
  top horní okraj grafiky bude zarovnán s horním okrajem řádky
  middle střed grafiky bude zarovnán na účaří řádku (baseline)
  bottom dolní okraj grafiky bude zarovnán se spodním okrajem řádku
  left vodorovné umístění na levý okraj (levý okraj grafiky na levý okraj řádku), text obtéká grafiku zprava
  right vodorovné umístění na pravý okraj (pravý okraj grafiky na pravý okraj řádku), text obtéká grafiku zleva
  texttop horní okraj grafiky bude zarovnán s horním okrajem textu na řádku
  absmiddle střed grafiky bude zarovnán na střed řádku
  baseline dolní okraj grafiky bude zarovnán na účaří řádku
  absbottom dolní okraj grafiky bude zarovnán se spodním okrajem textu na řádku
  width= požadovaná šířka grafiky (prohlížecí program by měl grafiku zmenšit/zvětšit tak, aby její šířka při zobrazení byla rovna zadanému počtu bodů
  height= požadovaná výška grafiky
  vspace= určuje, kolik místa bude vynecháno kolem grafiky ve svislém směru (vertikální odsazení obrázků)
  hspace= určuje, kolik místa bude vynecháno kolem grafiky ve vodorovném směru (horizontální odsazení obrázků)
  units= jednotka (implicitně pixely, viz. “Dodatky”)
  border= šířka rámečku vytvořeného kolem grafiky představujícího odkaz border=0 nebude kreslit žádný rámeček (v tom případě však uživatel obtížně pozná, že grafika je odkazem)
  ismap= označuje, že při stisknutí tlačítka myši v oblasti grafiky má prohlížecí program předat souřadnice této oblasti CGI skriptu kotvy
  usemap= URL na definici citlivých ploch obrázku (prvek MAP)
mapa citlivých oblastí
<MAP>
<MAP name=”návěští”>
vymezení_citlivých_oblastí(<AREA>)
</MAP>
  párová značka, která umožňuje definovat “hypertextově citlivé plochy” obrázků; každému atributu usemap uvedenému v prvku IMG musí odpovídat definice citlivých ploch (URL v atributu usemap musí odkazovat na prvek MAP, který může, ale nemusí být ve stejném dokumentu)
  name= jméno; vytváří v dokumentu návěští použitelné jako cíl atributu usemap uvedeného v prvku IMG; odkaz (URL) na toto návěští se zapisuje ve tvaru <IMG …usemap=”#jméno”… >
vymezení citlivé oblasti
<AREA>
<AREA shape=[default|circle|rect|polygon] coords=”souřadnice_oblasti” hraef=”url” alt=”alternativní_text” target=”cílové_okno”>
  nepárová značka, která slouží k popisu jedné citlivé plochy (oblasti) na grafickém objektu a specifikaci hypertextového odkazu svázaného s touto oblastí
  shape= definuje tvar oblasti obrázku, při jejímž zvolení má prohlížecí program předat souřadnice této oblasti CGI skriptu kotvy; další možnost jak vytvořit klikatelný obrázek
  default implicitní tvar
  circle kruh
  rect obdélník
  polygon obecný mnohoúhelník
  coords= definuje souřadnice (rozměry) oblasti obrázku
  x,y,r souřadnice středu a poloměr kruhu
  xl,yl,xp,yp souřadnice levého horního rohu a pravého dolního rohu pro obdélník
  x1,y1,x2,y2,… souřadnice jednotlivých vrcholů pro obecný mnohoúhelník
  href= URL cíle odkazu
  target= jméno okna, rámce nebo prohlížeče, ve kterém má být zobrazen dokument navázaný na tento odkaz (podrobnosti viz prvek <A>)
  alt= alternativní text, kterým se nahrazuje grafika v případě, kdy prohlížecí program neumí nebo nesmí zobrazovat grafiku
    ! řada atributů není definitivně standardizována
obrázky
<FIG>
<FIG scr=”url”>
popis_obrázku
</FIG>
  párová značka, která zařazuje do dokumentu klasický samostatný obrázek, který lze opatřit popiskem a dalšími náležitostmi; stejně jako grafický objekt i obrázek je normální součástí textu a váže se k řádku, v němž je umístěn; text obsažený uvnitř značek <FIF>…</FIG>, může obsahovat popis obrázku, jeho titulek či autora; je-li prvek FIG obsažen v kontejneru <A>…</A> je možné v obrázku definovat aktivní hyperlinkové oblasti, čímž lze vytvořit “klikatelný obrázek” (viz atribut shape ve značce <A>)
  src= URL obrázku, který má být vložen do textu
  na rozdíl od grafických objektů uváděných značkou <IMG> může prvek FIG obsahovat následující prvky:
překrytí <OVERLAY src=”url”>
<OVERLAY> nepárová značka, která umožňuje “překrývání” obrázků; atribut src určuje URL obrázku, který má být přidán k původnímu obrázku identifikovaném v src mateřské značky <FIG>
název obrázku
<CAPTION>
<CAPTION>
nadpis_obrázku
</CAPTION>
  párová značka, která umožňuje definovat nadpis obrázku nebo tabulky
původ <CREDIT>…</CREDIT>
<CREDIT> odkaz na pramen
  ! <FIG> je nestandardní prvek