HTML5

Novaĵoj: Atributoŝanĝoj

En HTML5 okazis multaj diversaj ŝanĝoj, kiuj rilatas al atributoj de elementoj.

Bazaj atributoj

Pluraj atributoj, kiuj ekzistis jam en HTML 4, nun estas uzeblaj ĉe ĉiaj 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 ĉe ĉiaj elementoj (ĝi indikas, kiel spacosignojo estu traktataj).

En HTML5 aldoniĝis ankoraŭ pliaj bazaj atributoj:

  • La atributo contenteditable indikas, ke la elemento estas redaktebla. La uzanto povas ŝanĝi la elementon kaj manipuli ties HTML-markojn.
  • La atributo contextmenu povas montri kuntekstan menuon provizitan de la paĝokreinto.
  • Ĉia ajn atributo, kies nomo komenciĝas per data-, estas libere uzebla laŭ la bontrovo de la paĝokreanto por specialaj celoj. Tio estas aparte klarigita en la paĝo “Novaĵoj: data-atributoj“.
  • La atributoj draggable (= “ŝovebla”) kaj dropzone (= ”demetozono”) povas esti uzataj kune kun la nova HTML5-a aplikprograma interfaco por ŝovado kaj demetado de elementoj. Tiu interfaco jam estas sufiĉe bone regata de pluraj TTT-legiloj (sed ne de ĉiuj). Ĉi tie tamen provizore ne aperas pliaj klarigoj pri tiu temo.
  • La bulea atributo hidden indikas, ke elemento ne estas valida (ne plu valida aŭ ankoraŭ ne valida), kaj sekve ordinare kaŝita de la uzanto. Unu ekzemplo povas esti parto de paĝo, kiu estu montrata nur post kiam la uzanto ensalutis (per uzantonomo kaj pasvorto). Por neensalutintaj uzantoj tiu parto ne estas sencohavo, kaj sekve ĝi ne estu montrata.
  • La atributoj role kaj aria-* povas esti uzataj por doni instrukciojn al asistaj teĥnikoj (ekzemple helpiloj por blindaj uzantoj). La uzo de tiuj atributoj estas grava, sed tre kompleksa temo, kiun mi provizore ne klarigas ĉi tie.
  • La atributo spellcheck indikas, ĉu 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 uziĝu la defaŭlto, 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, aŭ alimaniere.

Krome en HTML5 ĉiuj 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 ankoraŭ ne funkcias en la hodiaŭaj TTT-legiloj. (Tie, kie temos ĉi-poste pri atributoj de formularaj elementoj, pliaj detaloj ofte troviĝas en la paĝo 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 ĉe la elementoj input (krom kiam ties type-atributo havas la valoron hidden), select, textarea kaj button. Ĝi indikas ke la koncerna elemento aŭtomate ricevu fokuson ĉe la unua ŝargo de la paĝo.
  • La nova atributo placeholder povas esti uzata ĉe la elementoj input kaj textarea; Ĝi indikas helpan sugeston pri enmetado de datumoj. Ekzemple:

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

    <label>Retpoŝto: 
      <input type="email" form="miaformularo" name="retposhto"/>
    </label>
    [...]
    <form id="miaformularo">[...]</form>
  • La nova atributo required povas esti uzata ĉe la elementoj input (krom kiam ties atributo type havas la valoron hidden, image, submit aŭ alian butonecan valoron), select kaj textarea. Ĝi 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>Ruĝo</option>
      <option>Verd</option>
      <option>Bluo</option>
    </select></label>
  • La nova bulea atributo disabled povas esti uzata ĉe la elemento fieldset. Ĝi malaktivigas ĉiujn formularajn ilojn ene de tiu fieldset; krome fieldset-elemento povas nun havi la atributon name, kiu povas utili ĉe 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 uziĝi kunlabore kun la nova elemento datalist. input-elementoj nun havas ankaŭ la atributojn width kaj height, kiuj povas indiki (en bilderoj) respektive la larĝon 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 aŭtomate aldonota al tiuj kampoj, kiuj estos senditaj kun la formularo. La valoro de tiu plia kampo estos la tekstodirekto (ltr, = “demaldestre-dekstren” aŭ rlt = “dedekstre-maldekstren”) de tiuj datumoj, kiujn enhavas la baza input-elemento aŭ textarea-elemento (tiuj valoroj povas esti ŝanĝataj 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 malŝalti aŭtomatan kontroladon de la formularo antaŭ la forsendo.
  • La elementoj input kaj button havas la novajn atributojn formaction, formenctype, formmethod, formnovalidate kaj formtarget. Se tia atributo ĉeestas, ties valoro superregas la respondan valoron de la atributoj action, enctype, method, novalidate kaj target ĉe la responda form-elemento.
  • La elemento menu havas la du novajn atributojn type kaj label. type indikas la tipon de la menuo: list (la defaŭlta 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 ĉiuj ties idaj elementoj.
  • La elemento script havas la novan atributon async, kiu povas (kunlabore kun la malnova bulea atributo defer) influi la ŝargadon de kaj plenumadon de la Javaskripta kodo de la script-elemento: Ĝenerale, se ĉeestas async, la programkodo estos plenumita, kiam ĝi estos havebla; se mankas async, sed ĉeestas defer, tiam la programkodo estos plenumita nur post plena ŝargo de la paĝo; se mankas kaj async kaj defer, tiam la programkodo estos ŝargita kaj plenumita antaŭ ol la paĝoŝargado estos daŭrigata. 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 paĝo estas programeca kaj sekvas la nova HTML5-a aplikprograma interfaco por senkonektaj TTT-aplikaĵoj (TTT-paĝaj programoj uzeblaj ankaŭ 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 aŭ simboli la paĝon, 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. ĝi 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 ĝi 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 kvazaŭ ĝi estus parto de la patra paĝo (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-paĝo 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. Apenaŭ iu TTT-legilo nun (en Junio 2011) komprenas srcdoc-on, sed jen tamen testopaĝo, 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 danĝeraĵojn, precipe se ĝi venas de alia servilo). Ĉar tiu sekureco-temo estas tre kompleksa kaj malfacila, kaj ĉar ankoraŭ (en Junio 2011) apenaŭ iu TTT-legilo komprenas tiun atributon (la sola escepto estas la legilo Chrome), mi provizore ne donas ĉi tie pliajn klarigojn de tiu temo.

Forigitaj atributoj

Multaj malnovaj atributoj estis tute forigitaj en HTML5:

  • rev kaj charset ĉe la elementoj link kaj a.
  • shape kaj coords ĉe la elemento a.
  • longdesc ĉe la elementoj img kaj iframe.
  • target ĉe la elemento link.
  • nohref ĉe la elemento area.
  • profile ĉe la elemento head.
  • version ĉe la elemento html.
  • name ĉe la elemento img (uzu anstataŭe la atributon id).
  • scheme ĉe la elemento meta.
  • archive, classid, codebase, codetype, declare kaj standby ĉe la elemento object.
  • valuetype kaj type ĉe la elemento param.
  • axis kaj abbr ĉe la elementoj td kaj th.
  • scope ĉe la elemento td.
  • summary ĉe la elemento table.
  • align ĉe 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 ĉe la elemento body.
  • background ĉe la elemento body.
  • bgcolor ĉe la elementoj table, tr, td, th kaj body.
  • border ĉe la elemento object.
  • cellpadding kaj cellspacing ĉe la elemento table.
  • char kaj charoff ĉe la elementoj col, colgroup, tbody, td, tfoot, th, thead kaj tr.
  • clear ĉe la elemento br.
  • compact ĉe la elementoj dl, menu, ol kaj ul.
  • frame ĉe la elemento table.
  • frameborder ĉe la elemento iframe.
  • height ĉe la elementoj td kaj th.
  • hspace kaj vspace ĉe la elementoj img kaj object.
  • marginheight kaj marginwidth ĉe la elemento iframe.
  • noshade ĉe la elemento hr.
  • nowrap ĉe la elementoj td kaj th.
  • rules ĉe la elemento table.
  • scrolling ĉe la elemento iframe.
  • size ĉe la elemento hr.
  • type ĉe la elementoj li, ol kaj ul.
  • valign ĉe la elementoj col, colgroup, tbody, td, tfoot, th, thead kaj tr.
  • width ĉe 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 ĉe la elemento img: se oni uzas tiun atributon ĝi devas havi la valoron 0 (sed prefere oni uzu stilfolion).
  • language ĉe la elemento script: se oni uzas tiun atributon, ĉi devas havi la valoron JavaScript (kun ajna uskleco), kaj ĝi ne rajtas konflikti kun la atributo type.
  • name ĉe la elemento a: uzu antataŭe la atributon id.
  • summary ĉe la elemento table.

Aliaj atributaj ŝanĝoj

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

Al la sekva parto, “Novaĵoj: data-atributoj”