window.pipedriveLeadboosterConfig = { base: leadbooster-chat.pipedrive.com', companyId: 11580370, playbookUuid: '22236db1-6d50-40c4-b48f-8b11262155be', version: 2, } ;(function () { var w = window if (w.LeadBooster) { console.warn('LeadBooster on juba olemas') } else { w.LeadBooster = { q: [], on: function (n, h) { this.q.push({ t: 'o', n: n, h: h }) }, trigger: function (n) { this.q.push({ t: 't', n: n }) }, } } })() 3 kasulikku HTML-märgistust, mille olemasolust te võib-olla isegi ei teadnud - The Codest
The Codest
  • Meie kohta
  • Teenused
    • Tarkvaraarendus
      • Frontend arendus
      • Backend arendus
    • Staff Augmentation
      • Frontend arendajad
      • Backend arendajad
      • Andmeinsenerid
      • Pilveinsenerid
      • QA insenerid
      • Muud
    • See nõuandev
      • Audit ja nõustamine
  • Tööstusharud
    • Fintech & pangandus
    • E-commerce
    • Adtech
    • Healthtech
    • Tootmine
    • Logistika
    • Autotööstus
    • IOT
  • Väärtus
    • CEO
    • CTO
    • Tarnejuht
  • Meie meeskond
  • Case Studies
  • Tea kuidas
    • Blogi
    • Kohtumised
    • Veebiseminarid
    • Ressursid
Karjäärivõimalused Võtke ühendust
  • Meie kohta
  • Teenused
    • Tarkvaraarendus
      • Frontend arendus
      • Backend arendus
    • Staff Augmentation
      • Frontend arendajad
      • Backend arendajad
      • Andmeinsenerid
      • Pilveinsenerid
      • QA insenerid
      • Muud
    • See nõuandev
      • Audit ja nõustamine
  • Väärtus
    • CEO
    • CTO
    • Tarnejuht
  • Meie meeskond
  • Case Studies
  • Tea kuidas
    • Blogi
    • Kohtumised
    • Veebiseminarid
    • Ressursid
Karjäärivõimalused Võtke ühendust
Tagasi nool TAGASI
2022-10-04
Tarkvaraarendus

3 kasulikku HTML-märgistust, mille olemasolust sa võib-olla isegi ei tea

The Codest

Jacek Ludzik

Tootedisainer

Tänapäeval on ligipääsetavus (A11y) väga oluline kõikides kohandatud tarkvaratoodete loomise etappides. Alustades UX/UI disaini osast, ulatub see koodis olevate funktsioonide ehitamise edasijõudnute tasanditele. See annab palju kasu arendajatele, kes töötavad DX-i suurendamise kallal, kuid mis veelgi olulisem, lõppkasutajatele. Üks neist a11y osadest HTML-is on semantilised sildid ja seda tahaksin siinkohal käsitleda.

Front-end arendajad peavad olema tihedalt kursis HTML-tähed kuna see on nende loomulik keskkond igapäevaselt. Vean kihla, et te kõik teate mõningaid põhilisi silte, nagu näiteks

,
,
ja nii edasi. Aga kas te teadsite näiteks, et võite soovitada sõnapausi hetke, kasutades lihtsalt HTML, ilma CSSita?

WBR

Oletame, et te töötate mõne veebilehe või rakenduse kallal Saksa kliendi jaoks. Nagu te teate, võivad saksa keele sõnad olla väga pikad. Niisiis, teil on kujundus koos teksti sisuga, mida peate reprodutseerima järgmises keeles. kood ja see sisu peab murduma väga konkreetsetel hetkedel. Siinkohal tuleb silt, et teid aidata.

Geburtstagskuchen

See on kõik! Sellise lihtsa sildi abil saate teksti sisuga manipuleerida nii, nagu soovite.

Aga kuidas on lood brauseri toetusega? Kui aus olla, siis on see päris hea. Enamik brausereid saab sellest sildist aru, kuid Androidi operatsioonisüsteemil Opera ja iOS-i Safari võivad olla probleemiks.

wbr vastavustabel

METER

Kujutage ette, et te ehitate kettahaldurirakendust. Teil on vaja kuidagi näidata kasutajaliideses, kui palju salvestusruumi veel saadaval on, ja te tahate seda tõesti võimalikult hästi kättesaadavaks teha. See on lihtsalt ideaalne kasutusjuhtum silt. See annab teile ainult väärtuse määratletud vahemikus. Teine lahe asi selle sildi juures on selle atribuudid:

  • madal → kui praegune väärtus on madalam kui seadistatud madal väärtus, muutub mõõturi tuluke punaseks;
  • optimaalne → kui praegused väärtused on suuremad kui optimaalne atribuuti väärtus, muutub mõõtja tuluke roheliseks;
  • kõrge → kui kõrge väärtus on madalam kui maksimaalne ja kõrgem kui optimaalne väärtus, siis on mõõtja tuluke oranž. Vastasel juhul on see roheline.

Te võite teada ka sarnast sildi, mis on progress. Milline on siis tegelikult nende erinevus? Sildi progress tuleks kasutada käimasolevate ülesannete puhul. Teisisõnu, kasutage progressi sildi, kui tegelete konkreetse ülesandega. Meetri sildi puhul tuleks seda kasutada ketta- või mälukasutuse näitamiseks. Teine erinevus on see, et meetri sildi ei toeta IE ja see on tegelikult selle sildi ainus puudus.

mõõtja ühilduvuse mõõtja

DEL ja INS

Kas olete kunagi mõelnud, kuidas luua juurdepääsetav indikaator kustutatud ja lisatud sisuosade kohta (dif GitHubis või Jira e-posti teated, kui pilet on uuendatud)? Teil on vaja lihtsalt pakendada kustutatud sisu koossilt. Näiteks: <del><p>Lihtsalt kustutatud sisu</p></del>. Kui soovite näidata ainult lisatud sisu osa, võite kasutada funktsiooni sildi täpselt samamoodi. See tag pakub ka kaks atribuuti:

  • cite → uri ressursist, mis selgitab, miks see osa on lisatud;
  • datetime → andmed ja muutuse aeg.
ins ühilduvustabel

Loomulikult on palju rohkem kasulikke sildid HTML-is . Ma soovitan neid kõiki kasutada, kui see on võimalik ja asjakohane. Teie kliendid ja rakenduse kasutajad tänavad teid sellise lähenemise eest. Olge siiski ettevaatlik, sest mõned sildid võivad olla amortiseerunud. Võite alati veenduda, et vähem levinud silt, mida soovite kasutada, on endiselt kehtiv ja hea tugi on olemas MDN dokumentatsioon.

Seotud artiklid

Tarkvaraarendus

Lisateave Ruby on Rails ja Pub/Sub kohta

Pub/Sub võib tuua projektile palju kasu - see võib muuta koodi puhtaks, lahutada teenuseid ja muuta need kergesti skaleeritavaks. Lisateave Pub/Subi kohta järgmises artiklis...

The Codest
Michal Pawlak Ruby vanem arendaja
Tarkvaraarendus

Javascript tööriistad tegevuses

Avastage mõningaid vahendeid JavaScript, et tõsta oma programmeerimismängu taset. Lisateave ESLint, Prettier ja Husky kohta!

The Codest
Reda Salmi React Arendaja
Tarkvaraarendus

Sise- vs. välisarendajate palkamine

Palgata sisemiselt või väljastpoolt? See on ülim dilemma! Järgnevast artiklist saate teada outsourcing eelised või ettevõttesisese meeskonna moodustamise eelised.

The Codest
Grzegorz Rozmus Java üksuse juht
Tarkvaraarendus

9 viga, mida vältida Java programmeerimisel

Milliseid vigu tuleks Java keeles programmeerimisel vältida? Järgnevas teoses vastame sellele küsimusele.

The Codest
Rafal Sawicki Java arendaja

Tellige meie teadmistebaas ja jääge kursis IT-sektori eksperditeadmistega.

    Meie kohta

    The Codest - rahvusvaheline tarkvaraarendusettevõte, mille tehnoloogiakeskused asuvad Poolas.

    Ühendkuningriik - peakorter

    • Büroo 303B, 182-184 High Street North E6 2JA
      London, Inglismaa

    Poola - kohalikud tehnoloogiakeskused

    • Fabryczna büroopark, Aleja
      Pokoju 18, 31-564 Kraków
    • Brain Embassy, Konstruktorska
      11, 02-673 Varssavi, Poola

      The Codest

    • Kodu
    • Meie kohta
    • Teenused
    • Case Studies
    • Tea kuidas
    • Karjäärivõimalused
    • Sõnastik

      Teenused

    • See nõuandev
    • Tarkvaraarendus
    • Backend arendus
    • Frontend arendus
    • Staff Augmentation
    • Backend arendajad
    • Pilveinsenerid
    • Andmeinsenerid
    • Muud
    • QA insenerid

      Ressursid

    • Faktid ja müüdid koostööst välise tarkvaraarenduspartneriga
    • USAst Euroopasse: Miks otsustavad Ameerika idufirmad Euroopasse ümber asuda?
    • Tech Offshore arenduskeskuste võrdlus: Euroopa (Poola), ASEAN (Filipiinid), Euraasia (Türgi).
    • Millised on CTO ja CIOde peamised väljakutsed?
    • The Codest
    • The Codest
    • The Codest
    • Privacy policy
    • Website terms of use

    Copyright © 2025 by The Codest. Kõik õigused kaitstud.

    etEstonian
    en_USEnglish de_DEGerman sv_SESwedish da_DKDanish nb_NONorwegian fiFinnish fr_FRFrench pl_PLPolish arArabic it_ITItalian jaJapanese ko_KRKorean es_ESSpanish nl_NLDutch elGreek etEstonian