img: Bildo «

Oni povas enmiksi ankaŭ bildojn en XHTML-paĝojn. Por tio oni uzas img-markojn:

<img src="bildo-de-mi.png" alt="Mi estas nerimarkinda homo" />

La plej grava parto de img-marko estas la src-atributo. Ĝi indikas la nomon de bildodosiero. TTT-legilo montras la indikitan bildon anstataŭ la img-marko (se ĝi kapablas montri bildojn, kaj se ĝi estas agordita por efektive montri bildojn).

Ankaŭ la dua atributo, alt, estas grava. Ĝi enhavas alternativan tekston, kiu uziĝas, se la bildo ial ne montriĝas, ekzemple se la leganto elŝaltis montradon de bildoj, aŭ se li uzas TTT-legilon, kiu neniam montras bildojn. En tiaj okazoj la alt-teksto servu, kiom eble, anstataŭ la bildo. Oni do elpensu ian tekston, kiu povas, laŭeble, transdoni la samajn informojn, aŭ servi la saman taskon, kiel la bildo. Se la bildo estas nure ornama aŭ plene ignorebla, oni povas trankvile skribi alt="". Precipe grave estas aldoni alt-tekston, se la bildo estas la sola enhavo de a-elemento. Alie iuj uzantoj eble havos nenion sur kio alklaki, kaj la ligilo povas fariĝi neuzebla.

Noto: Oni normale ne skribu ekz. “Bildo de mi”, nek la nomon de la bildo, nek ion sensencan kiel “Logotipo” aŭ “Bildo”. Oni skribu ion, kio plenumas la saman rolon kiel la bildo. Se estas ekzemple bildo de domo, oni per la alt-teksto priskribu la domon. Oni ne parolu pri la bildo de la domo, sed rekte pri la domo mem, tiel, kiel oni farus, se oni tute ne povus uzi bildon, sed devus ĉion esprimi nur per teksto.

img-marko estas t.n. malplena elemento. (Ni jam renkontis meta-elementon, kiu ankaŭ estas malplena.) Tio signifas, ke img-elemento konsistas el unu marko, kiu estas samtempe komenca kaj fina. Rimarku la finan suprenstrekon, /, kiu montras, ke la elemento tuj finiĝas. (Malplena elemento estas malplena, ĉar ĝi ne havas enhavon inter komenca marko kaj fina marko.)

img-elemento povas esti enmiksita en teksto, ekzemple jene:

<p>Jen bildo de io bela:
<img src="bildo-de-mi.png" />.
Bele chu ne?</p>

<img src="bildoj/portreto.jpg" alt="Mi estas timema homo"
title="Foje mi rifuzas esti fotata" />

<img src="bildoj/bildo-de-mi.png" />

br: Linirompo «

Simplajn linirompojn la TTT-legiloj ignoras:

<p>
Jen iom da teksto.
Jen teksto sur nova linio.
Jen teksto sur ankorau unu linio.
</p>

Metu tiun kodon en XHTML-paĝon, kaj poste rigardu per TTT-legilo. Vi vidos, ke la legilo prezentas ĉiujn tri liniojn kiel unu, ignorante la linirompojn.

Noto: TTT-legiloj ankaŭ ignoras troajn spacetojn. Ekzemple ne gravas ĉu inter du vortoj estas unu, du, tri, kvar aŭ eĉ pli da spacetoj. TTT-legiloj montras ĉiuokaze nur unu normalan intervortan spacon. La legiloj same traktas ankaŭ tabojn (tabeligajn signojn), kiuj montriĝas tute same kiel spacetoj. Efektive linirompo, tabo kaj spaceto estas por TTT-legiloj tute egalaj. Ankaŭ ne gravas, kiom da tiaj blanksignoj oni metas ekzemple inter du p-elementoj.

Se oni volas, ke en iu loko estu linirompo, kiun la TTT-legiloj ne ignoros, oni devas uzi br-elementon:

<p>
Jen iom da teksto.<br />
Jen teksto sur nova linio.<br />
Jen teksto sur ankorau unu linio.<br />
</p>

Provu tiun kodon anstataŭe. Vi vidos, ke la TTT-legilo aldonas linirompojn en la indikitaj lokoj.

Se vi bone atentis tion, kion mi skribis en la leciono “Kio vere estas XHTML?”, vi eble iom surpriziĝis, ke ekzistas br-markoj. Rompado de linioj ŝajnas esti tia prezenta detaleto, pri kiu oni ne zorgu en XHTML. Efektive br-elementoj estas iom suspektindaj. Normale, kiam oni pripensas uzi br-elementon, temas logike pri nova alineo, kaj oni prefere uzu p-elementojn: Anstataŭ <br /> oni finu la alineon per </p>, kaj komencu novan alineon per <p>. Eble oni ial ne deziras, ke la legiloj montru spacon inter tiuj du alineoj, sed tio estas afero de prezentado, kaj pri tio oni poste zorgu per CSS. Alifoje povas esti, ke vere temas pri listo, kaj por tio oni uzu ul-elementon aŭ ol-elementon. Nur en malmultaj tre specialaj okazoj br-elementoj estas la ĝusta elekto. Unu ekzemplo estas poemoj. Estas tute en ordo meti br post linio de poemo.

hr: Horizontala streko «

Alia malplena elemento estas la elemento hr, kiu reprezentas horizontalan strekon. Tia streko montras dividon, limon, inter du sekcioj:

<p>Jen alineo.</p>
<hr />
<p>Jen alia alineo.</p>

Provu tiun kodon en TTT-legilo. Vi verŝajne vidos, ke la legilo prezentas horizontalan strekon.

Efektive hr estas, same kiel br, iom suspektinda elemento. Ofte estas preferinde uzi CSS-on por laŭbezone krei similajn strekojn inter sekcioj. (Oni povas krome demandi sin, kian sencon hr-elemento havas en voĉlegilo.) Normale la diversaj titoloj, h1, h2, h3 k.t.p. sufiĉas por indiki, kie komenciĝas nova sekcio, sed en iaj specialaj okazoj aldona indikado pri dividado de la materialo povas esti bezonata, kaj tiam hr povas esti taŭga ilo. (Eble voĉlegilo povas indiki tian sekcilimon per aparte longa paŭzo.)

Iom pli pri malplenaj elementoj

Ĉiuj tri elementoj klarigitaj ĉi-antaŭe, img, br kaj hr, estas malplenaj elementoj. Tiaj elementoj havas finan suprenstrekon, /, en la komenca (kaj sola) marko. Ĉi-antaŭe mi skribis tiujn suprenstrekojn ĉiam kun antaŭa spaceto: <img src="bildo.png" />, <br  />, <hr />. Efektive tia spaceto laŭ la reguloj de XHTML tute ne estas bezonata, kaj efektive signifas nenion. La reguloj tute permesas skribi ankaŭ jene: <img src="bildo.png"/>, <br/>, <hr/>. Iuj tre malnovaj legiloj konfuziĝis, se oni ne skribis tian spaceton, kaj siatempe estis rekomendinde ĉiam aldoni la spaceton. Sed laŭ miaj esploroj la lasta TTT-legilo, kiu havis problemojn pri tiaj suprenstrekoj, estis “Netscape 4”, kaj tiu TTT-legilo nun estas praktike tute formortinta.

Iafoje povas okazi, ke elemento, kiu normale ne estas malplena, tamen ne havas enhavon. Eble oni havas alineon sen teksto: <p></p>. La reguloj de XHTML principe permesas tiam skribi simple <p /> aŭ <p/> (kun aŭ sen spaceto), sed malnovaj legiloj tion tute ne komprenas, kaj tial oni ĉiam skribu <p></p>. Aliflanke alineo sen enhavo estas sufiĉe sensenca afero, kaj tial plej bone estas simple forigi tiajn sensencajn p-elementojn.