HTML-i on lihtne õppida ja brauserid on üldiselt vigade suhtes andestavad. Kuid peaksite siiski proovima vead kõrvaldada ja pakkuda tõhusaid veebilehti.
Iga veebisaidi aluseks on HTML – see on veebilehtede sisu struktureerimise ja esitamise peamine keel.
Kuid isegi kogenud HTML-i kodeerijad võivad teha lihtsaid vigu, mille tulemuseks on halvasti optimeeritud veebisaidid. Ja sellised vead võivad tekitada probleeme jõudluse, kasutatavuse ja juurdepääsetavusega.
Nende vältimiseks proovige uurida järgmisi levinumaid HTML-i vigu ja leida näpunäiteid nende vältimiseks.
1. Aegunud HTML-i elementide kasutamine
HTML on aja jooksul muutunud, nii et mõned elemendid ja atribuudid on nüüd üleliigsed. Kaasaegsed brauserid ei toeta aegunud elemente ja atribuute ning nende kasutamine võib teie veebisaidi kiirust negatiivselt mõjutada.
The silt teksti tsentreerimiseks märgend teksti vormindamiseks ja läbikriipsutatud teksti sildid on mõned kõige sagedamini kasutatavad aegunud HTML-i elemendid. Nende komponentide jaoks peaksite kasutama kaasaegseid vasteid.
Näiteks võite kasutage sisu tsentreerimiseks CSS-i, mitte tag. Lisaks saate fondistiile määrata CSS-i, mitte tag.
2. Ei sisalda piltide alternatiivteksti
Kuigi pildid on veebidisaini oluline komponent, ei näe nägemispuudega vaatajad neid. Sellisena peaksite lisama kirjeldav alternatiivtekst fotodele, et muuta need paremini kättesaadavaks.
Alternatiivne tekst võimaldab teksti kõneks muutmise mootoritel lugeda kasutajatele ette pildikirjelduse. See pole siiski mõeldud ainult ekraanilugejatele; alt tekst võib olla kasulik otsingumootori optimeerimisel. Enamik brausereid kuvab ka alternatiivteksti, kui pildi laadimine ebaõnnestub.
3. HTML-i elementide vale pesastamine
Vastuvõetava koodi ja veebisaidi nõuetekohase toimimise tagamiseks peaksid HTML-i elemendid korralikult pesitsema. Ebapiisaval pesastamisel võivad olla ettenägematud tagajärjed, sealhulgas katkised paigutused, puuduv sisu ja katkised lingid.
Näiteks peaksite enne uue avamist sulgema iga div sildi. Samamoodi ei tohiks te kunagi silt väljaspool järjestatud või järjestamata loendit.
Silt "div" on paindlik HTML-i element, mida kasutatakse sisu rühmitamiseks ja kujundamiseks. Selle sildi liigne kasutamine võib aga kaasa tuua halvasti organiseeritud veebisaidi ja muuta koodi hooldamise keeruliseks.
Peaksite kasutama HTML-i semantilisi elemente, mis annavad sisule tähenduse, mitte kõige jaoks div-märgendeid. Võite kasutada päise, mitte div-märgendi jaoks. Samuti peaksite kasutama asemel navigeerimisriba silt tag.
5. Ei kasuta semantilist HTML-i
Ilma selliseid semantilisi elemente nagu
Teie veebisait võib olla ka madalamal kohal otsingumootori tulemuste lehed (SERP-d) kui otsingumootoritel on probleeme sisu indekseerimisega.
6. Tekstisiseste stiilide kasutamine CSS-i asemel
Saate rakendada tekstisiseseid CSS-i stiile otse HTML-i elemendile, kasutades stiiliatribuuti. Kuigi need stiilid on abiks kiirete muudatuste tegemiseks, võib nende liigne kasutamine muuta koodi hooldamise raskemaks ja kahjustada veebisaidi tõhusust.
Seetõttu peaksite kasutama väliseid CSS-faile, mis rakendavad veebisaidile globaalselt stiile, mitte tekstisiseseid stiile. Need parandavad veebisaidi jõudlust, vähendades brauserisse saadetavat koodi, ja lihtsustavad ka veebisaidi hooldust.
7. Ei kasuta reageerivaid kujundusi
Responsive disain on veebidisaini strateegia, mis võimaldab veebisaitidel kohaneda erinevate ekraanisuuruste ja seadmetega. See lähenemine on hädavajalik veebisaidi juurdepääsetavuse parandamine ja kasutajakogemust, arvestades mobiilseadmete kasvavat kasutamist.
Erinevate stiilide rakendamiseks seadme ekraani suurusest lähtuvalt peaksite kasutama CSS-meediumipäringuid. See parandab kasutajakogemust, kuna muudab veebisaidi juurdepääsetavaks erinevates seadmetes.
8. HTML-i valideerimine ebaõnnestus
Veebiarendus peab algama HTML-i valideerimisega, et kood oleks veatu ja vastaks veebistandarditele. Kehtetu HTML võib põhjustada katkiseid paigutusi, puuduvat sisu, katkisi linke ja palju muid probleeme.
Koodis vigade leidmiseks ja parandamiseks peaksite kasutama HTML-i validaatorit. Lisaks korrektsusele parandab valideerimine ka jõudlust, juurdepääsetavust ja otsingumootori optimeerimist.
Kaasaegse HTML-i ja CSS-i kasutamine
Kuna silmapiiril on uued funktsioonid, annavad HTML5 ja CSS3 arendajatele rohkem ressursse kui kunagi varem, et luua köitvaid veebisaite. Samuti parandab veebi juurdepääsetavuse standardite väljatöötamine puuetega inimeste kasutuskogemust.
Seetõttu on oluline järgida uusimaid HTML-i standardeid ja parimaid tavasid, kui soovite luua paremaid ja leidlikumaid veebisaite, mis vastavad praegustele ja tulevastele kasutajate vajadustele. See võimaldab teil ära tunda ja vältida levinud lõkse, mis teie tööd negatiivselt mõjutavad.
