HTML5

Novajxoj: Atributosxangxoj

En HTML5 okazis multaj diversaj sxangxoj, kiuj rilatas al atributoj de elementoj.

Bazaj atributoj

Pluraj atributoj, kiuj ekzistis jam en HTML 4, nun estas uzeblaj cxe cxiaj elementoj. Tiaj atributoj estas nomataj bazaj atributoj. Ili estas accesskey, class, dir, id, lang, style, tabindex kaj title. Krome la atributo xml:space, kiu ekzistis jam en XHTML 1.0, kaj kiu havas sencon nur en XHTML5 (kaj nur en tre specialaj okazoj), estas nun principe uzebla cxe cxiaj elementoj (gxi indikas, kiel spacosignojo estu traktataj).

En HTML5 aldonigxis ankoraux pliaj bazaj atributoj:

  • La atributo contenteditable indikas, ke la elemento estas redaktebla. La uzanto povas sxangxi la elementon kaj manipuli ties HTML-markojn.
  • La atributo contextmenu povas montri kuntekstan menuon provizitan de la pagxokreinto.
  • Cxia ajn atributo, kies nomo komencigxas per data-, estas libere uzebla laux la bontrovo de la pagxokreanto por specialaj celoj. Tio estas aparte klarigita en la pagxo “Novajxoj: data-atributoj“.
  • La atributoj draggable (= “sxovebla”) kaj dropzone (= ”demetozono”) povas esti uzataj kune kun la nova HTML5-a aplikprograma interfaco por sxovado kaj demetado de elementoj. Tiu interfaco jam estas suficxe bone regata de pluraj TTT-legiloj (sed ne de cxiuj). Cxi tie tamen provizore ne aperas pliaj klarigoj pri tiu temo.
  • La bulea atributo hidden indikas, ke elemento ne estas valida (ne plu valida aux ankoraux ne valida), kaj sekve ordinare kasxita de la uzanto. Unu ekzemplo povas esti parto de pagxo, kiu estu montrata nur post kiam la uzanto ensalutis (per uzantonomo kaj pasvorto). Por neensalutintaj uzantoj tiu parto ne estas sencohavo, kaj sekve gxi ne estu montrata.
  • La atributoj role kaj aria-* povas esti uzataj por doni instrukciojn al asistaj tehxnikoj (ekzemple helpiloj por blindaj uzantoj). La uzo de tiuj atributoj estas grava, sed tre kompleksa temo, kiun mi provizore ne klarigas cxi tie.
  • La atributo spellcheck indikas, cxu la enhavo de la elemento estas submetinda al literuma kaj gramatika kontrolado. La eblaj valoroj estas true (= vera, t.e. kontrolado povas okazi), false (= falsa, t.e. kontrolado ne okazu) kaj malpleno (neniu valoro, kio signifas, ke uzigxu la defauxlto, kiu eventuale estas la valoro de la patra elemento). Tia kontrolado povas esti plenumata de funkcioj en la TTT-legilo mem, de kromprogramo, de Javaskripto, aux alimaniere.

Krome en HTML5 cxiuj eventaj atributoj de HTML4, kun la formo onEVENTO-NOMO (t.e. onclick, onmouseover, onchange k.a.), estas bazaj atributoj. Aldone HTML5 enkondukas plurajn novajn tiajn bazajn atributojn eventajn por nove difinitaj eventoj, ekzemple onplay por la evento play (= “ludigo”) uzata de la aplikprograma interfaco de elementoj kiel video kaj audio.

Novaj nebazaj atributoj

En HTML5 estis enkondukitaj pluraj novaj atributoj de jamaj elementoj. Multaj el tiuj novaj atributoj ankoraux ne funkcias en la hodiauxaj TTT-legiloj. (Tie, kie temos cxi-poste pri atributoj de formularaj elementoj, pliaj detaloj ofte trovigxas en la pagxo pri formularoj.)

  • La elementoj a kaj area nun povas havi la atributon media.
  • La elemento area nun havas la novajn atributojn hreflang, type kaj rel.
  • La elemento base povas havi la atributon target.
  • La elemento meta povas havi la atributon charset.
  • La nova atributo autofocus povas esti uzata cxe la elementoj input (krom kiam ties type-atributo havas la valoron hidden), select, textarea kaj button. Gxi indikas ke la koncerna elemento auxtomate ricevu fokuson cxe la unua sxargo de la pagxo.
  • La nova atributo placeholder povas esti uzata cxe la elementoj input kaj textarea; Gxi indikas helpan sugeston pri enmetado de datumoj. Ekzemple:

    <input type="email" placeholder="iu@example.com"/>
  • La nova atributo form povas esti uzata cxe la elementoj input, output, select, textarea, button, label, object kaj fieldset. Per gxi eblas ligi tian elementon al formularo (en HTML5 formularaj elementoj rajtas esti metitaj ien ajn, ne nur ene de form-elemento). Ekzemple:

    <label>Retposxto: 
      <input type="email" form="miaformularo" name="retposhto"/>
    </label>
    [...]
    <form id="miaformularo">[...]</form>
  • La nova atributo required povas esti uzata cxe la elementoj input (krom kiam ties atributo type havas la valoron hidden, image, submit aux alian butonecan valoron), select kaj textarea. Gxi indikas, ke la uzanto devas enmeti ian valoron en tiun formularan kampon por povi forsendi la formularon; en la okazo de select-elemento ties unua option-elemento tiam devas havi malplenan valoron. Ekzemple:

    <label>Koloro: <select name="koloro" required="required">
      <option value="">Bv. elekti koloron</option>
      <option>Rugxo</option>
      <option>Verd</option>
      <option>Bluo</option>
    </select></label>
  • La nova bulea atributo disabled povas esti uzata cxe la elemento fieldset. Gxi malaktivigas cxiujn formularajn ilojn ene de tiu fieldset; krome fieldset-elemento povas nun havi la atributon name, kiu povas utili cxe manipulado per Javaskripto.
  • La elemento input havas plurajn novajn atributojn, kiuj diversmaniere limigas la eblajn valorojn kaj uzojn: autocomplete, min, max, multiple, pattern kaj step. Krome input havas la novan atributon list, kiu povas uzigxi kunlabore kun la nova elemento datalist. input-elementoj nun havas ankaux la atributojn width kaj height, kiuj povas indiki (en bilderoj) respektive la largxon kaj la alton de la koncerna bildo, kiam la type-atributo de la input-elemento havas la valoron image.
  • La elementoj input kaj textarea havas novan atributon dirname, kiu specifas nomon de plia kampo auxtomate aldonota al tiuj kampoj, kiuj estos senditaj kun la formularo. La valoro de tiu plia kampo estos la tekstodirekto (ltr, = “demaldestre-dekstren” aux rlt = “dedekstre-maldekstren”) de tiuj datumoj, kiujn enhavas la baza input-elemento aux textarea-elemento (tiuj valoroj povas esti sxangxataj de la uzanto, kiam tiu enskribas la datumojn).
  • La elemento textarea havas la du novajn atributojn maxlength kaj wrap, kiuj indikas respektive la maksimuman datumlongon kaj la linifaldan konduton de la textarea-elemento.
  • La elemento form havas novan bulean atributon novalidate, kiu povas esti uzata por malsxalti auxtomatan kontroladon de la formularo antaux la forsendo.
  • La elementoj input kaj button havas la novajn atributojn formaction, formenctype, formmethod, formnovalidate kaj formtarget. Se tia atributo cxeestas, ties valoro superregas la respondan valoron de la atributoj action, enctype, method, novalidate kaj target cxe la responda form-elemento.
  • La elemento menu havas la du novajn atributojn type kaj label. type indikas la tipon de la menuo: list (la defauxlta valoro) = lista menuo, context = kunteksta menuo, toolbar = ilobreta menuo. label indikas etikedon uzotan, kiam la koncerna menuo aperas kiel submenuo en plurnivela menuo.
  • La elemento style havas la novan bulean atributon scoped, kiu povas esti uzata por limigi la validecon de la koncernaj stilreguloj al tiu elemento, kiu estas patro de la koncerna style-elemento, kaj al cxiuj ties idaj elementoj.
  • La elemento script havas la novan atributon async, kiu povas (kunlabore kun la malnova bulea atributo defer) influi la sxargadon de kaj plenumadon de la Javaskripta kodo de la script-elemento: Gxenerale, se cxeestas async, la programkodo estos plenumita, kiam gxi estos havebla; se mankas async, sed cxeestas defer, tiam la programkodo estos plenumita nur post plena sxargo de la pagxo; se mankas kaj async kaj defer, tiam la programkodo estos sxargita kaj plenumita antaux ol la pagxosxargado estos dauxrigata. async povas esti uzata nur, se la Javaskripta kodo estas indikita pere de src-atributo.
  • La elemento html havas la novan atributon manifest, kiu indikas manifesto-dosieron uzotan, kiam la pagxo estas programeca kaj sekvas la nova HTML5-a aplikprograma interfaco por senkonektaj TTT-aplikajxoj (TTT-pagxaj programoj uzeblaj ankaux sen Interreta konekto).
  • La elemento link havas la novan atributon sizes, kiu povas esti uzata, kiam la rel-atributo de la link-elemento havas la valoron icon. Tiam la href-atributo indikas piktogramon, kiu povas esti uzata por reprezenti aux simboli la pagxon, kaj la sizes-atributo indikas la haveblajn grandojn de tiu piktogramo. Ekzemple:

    <head>
    <title>Ekzemplo</title>
    <link rel="icon" href="favicon.png" sizes="16x16" type="image/png"/>
    <link rel="icon" href="windows.ico" sizes="32x32 48x48" type="image/vnd.microsoft.icon"/>
    <link rel="icon" href="mac.icns" sizes="128x128 512x512 8192x8192 32768x32768"/>
    <link rel="icon" href="iphone.png" sizes="57x57" type="image/png"/>
    <link rel="icon" href="gnome.svg" sizes="any" type="image/svg+xml"/>
    </head>

    sizes="any" signifas, ke la koncerna piktogramo estas skalebla (t.e. gxi povas esti transformita al ajna grando sen kvalitoperdo).

  • La elemento ol havas la novan bulean atributon reversed, kiu indikas, ke la listordo estas malkreska (alie gxi estas kreska). La komencan numeron tiam indikas la atributo start.
  • La elemento iframe havas la novan bulean atributon seamless, kiu indikas, ke la enhavo de la iframe estu prezentata kvazaux gxi estus parto de la patra pagxo (t.e. sen videblaj limoj).
  • La elemento iframe havas la novan atributon srcdoc, kiu enhavas HTML-kodon, kiu estu la enhavo de la koncerna iframe. Normale oni indikas tiun enhavon per url-o (adreso) de HTML-pagxo en src-atributo. Oni povas uzi srcdoc kaj src samtempe. Tiam tiaj TTT-legiloj, kiuj komprenas scrdoc, uzas tiun HTML-kodon, dum aliaj TTT-legiloj uzas la dokumenton indikitan per src. Apenaux iu TTT-legilo nun (en Junio 2011) komprenas srcdoc-on, sed jen tamen testopagxo, kiu provas uzi la atributon srcdoc.
  • La elemento iframe havas la novan atributon sandbox, kiu povas indiki diversajn limigojn pri la uzo de la enhavo de la iframe (kiu povas enteni dangxerajxojn, precipe se gxi venas de alia servilo). Cxar tiu sekureco-temo estas tre kompleksa kaj malfacila, kaj cxar ankoraux (en Junio 2011) apenaux iu TTT-legilo komprenas tiun atributon (la sola escepto estas la legilo Chrome), mi provizore ne donas cxi tie pliajn klarigojn de tiu temo.

Forigitaj atributoj

Multaj malnovaj atributoj estis tute forigitaj en HTML5:

  • rev kaj charset cxe la elementoj link kaj a.
  • shape kaj coords cxe la elemento a.
  • longdesc cxe la elementoj img kaj iframe.
  • target cxe la elemento link.
  • nohref cxe la elemento area.
  • profile cxe la elemento head.
  • version cxe la elemento html.
  • name cxe la elemento img (uzu anstatauxe la atributon id).
  • scheme cxe la elemento meta.
  • archive, classid, codebase, codetype, declare kaj standby cxe la elemento object.
  • valuetype kaj type cxe la elemento param.
  • axis kaj abbr cxe la elementoj td kaj th.
  • scope cxe la elemento td.
  • summary cxe la elemento table.
  • align cxe la elementoj caption, iframe, img, input, object, legend, table, hr, div, h1, h2, h3, h4, h5, h6, p, col, colgroup, tbody, td, tfoot, th, thead kaj tr.
  • alink, link, text kaj vlink cxe la elemento body.
  • background cxe la elemento body.
  • bgcolor cxe la elementoj table, tr, td, th kaj body.
  • border cxe la elemento object.
  • cellpadding kaj cellspacing cxe la elemento table.
  • char kaj charoff cxe la elementoj col, colgroup, tbody, td, tfoot, th, thead kaj tr.
  • clear cxe la elemento br.
  • compact cxe la elementoj dl, menu, ol kaj ul.
  • frame cxe la elemento table.
  • frameborder cxe la elemento iframe.
  • height cxe la elementoj td kaj th.
  • hspace kaj vspace cxe la elementoj img kaj object.
  • marginheight kaj marginwidth cxe la elemento iframe.
  • noshade cxe la elemento hr.
  • nowrap cxe la elementoj td kaj th.
  • rules cxe la elemento table.
  • scrolling cxe la elemento iframe.
  • size cxe la elemento hr.
  • type cxe la elementoj li, ol kaj ul.
  • valign cxe la elementoj col, colgroup, tbody, td, tfoot, th, thead kaj tr.
  • width cxe la elementoj hr, table, td, th, col, colgroup kaj pre.

Malrekomendataj atributoj

Kelkaj atributoj plu restas en HTML5, sed oni tamen malrekomendas ilian uzon:

  • border cxe la elemento img: se oni uzas tiun atributon gxi devas havi la valoron 0 (sed prefere oni uzu stilfolion).
  • language cxe la elemento script: se oni uzas tiun atributon, cxi devas havi la valoron JavaScript (kun ajna uskleco), kaj gxi ne rajtas konflikti kun la atributo type.
  • name cxe la elemento a: uzu antatauxe la atributon id.
  • summary cxe la elemento table.

Aliaj atributaj sxangxoj

  • La atributo for cxe li-elementoj ne plu estas malrekomendata.
  • La atributo start cxe ol-elementoj ne plu estas malrekomendata.
  • La atributo target cxe la elementoj a kaj area ne plu estas malrekomendata.
  • La atributo type cxe la elemento script ne plu estas bezonata, se la uzata programolingvo estas ECMAScript (t.e. Javaskripto).
  • La atributo type cxe la elemento style ne plu estas bezonata, se la uzata stilfolia lingvo estas CSS.
  • La atributo border cxe la elemento table rajtas havi nur la valoron 1 aux malplenan valoron.
  • La atributoj width kaj height cxe img kaj aliaj elementoj ne plu rajtas havi procentajxon kiel valoron, sed nur nombron (de bilderoj).

Al la sekva parto, “Novajxoj: data-atributoj”