Näytä HTML-elementtien sisällysluettelo Chromen verkkosivustolla

Hienostuneet web-kehitysohjelmat auttavat kirjoittamaankoodi helposti kuin jos tekisit sen ilman heitä. Sen lisäksi, että ne nopeuttavat työskentelyä ja auttavat välttämään yleisiä syntaksiongelmia, ne ovat myös loistava työkalu aloittelijoille, jotka saattavat tuntea olevansa turvostuneita yksinkertaisen HTML-sivun kirjoittamiseen tarvittavasta vaivasta. Jos ei muuta, ne voivat auttaa sinua oppimaan koodia. Ainoa puute, joka saatat kohdata verkkokehitysohjelmassa, varsinkin kun käytät sitä koodaamiseen, on se, kuinka he eivät ole valmiita analysoimaan selaimesi verkkosivustoja. Jos erityinen kiinnostava alue on HTML, niin HTML5 Outliner on hieno Chrome-laajennus, joka auttaa sinuaanalysoida verkkosivun erilaisia ​​HTML-elementtejä. Laajennus lisää neliökuvaketta URL-palkkiin, jota napsautettaessa avataan sisällysluettelonäkymä kaikista HTML 5 -otsikoista ja osioista. Laajennus toimii myös HTML 4 -elementeissä.

Näytettävät sisällysluettelon kohteetovat napsautettavissa, ja laajennus vierittää ja korostaa valitsemasi elementin. Kohokohta ei aina toimi, mutta navigointi on täysin toiminnallista.

Laajennuksella on rajoituksensa; se havaitseekaikki HTML-elementit melkein millä tahansa sivulla, mutta itse sisällysluettelo on erilainen tarina. Taulukko perustuu siihen, että koodi on kirjoitettu asianmukaisten HTML 5 -määritelmien tai ääni-HTML-jäsentelyn mukaisesti. Jos koodi ei ole näiden mukainen, laajennus ei ehkä lataa hyväksyttävää sisällysluetteloa.

Esimerkiksi; jos olet määrittänyt taulukotsivusi asettelua, et todennäköisesti näe lainkaan sisältötaulukoita. Syynä tähän on vain huonosti kirjoitettu koodi, koska asettelut määritetään parhaiten CSS: llä, ei taulukoilla. Toistaiseksi et voi käyttää laajennusta paikallisesti tallennetuissa HTML-tiedostoissa johtuen pienestä laajennuksen rajoituksesta ja Chromen käyttöoikeuksista.

HTML5 Outliner ei selvästikään ole yleistäkäyttäjä; se on tarkoitettu web-kehittäjille, sekä aloittelijoille että ammattitaitoisille. Aloittelijoille sen tulee osoittautua käteväksi, kun esikatsellaan kehitteillä olevan sivuston asettelua. Ammattitaitoisille kehittäjille se on nopea tapa navigoida verkkosivun elementtien välillä ja tarkistaa niiden takana oleva koodi.

Asenna HTML5 Outliner Chrome Web Storesta