ХТМЛ се лако учи и претраживачи углавном опраштају грешке. Али ипак треба да покушате да елиминишете грешке и испоручите ефикасне веб странице.
Основа сваке веб странице је ХТМЛ—то је примарни језик за структурирање и представљање садржаја на веб страницама.
Међутим, чак и искусни ХТМЛ кодери могу направити једноставне грешке које резултирају лоше оптимизованим веб локацијама. А овакве грешке могу створити проблеме са перформансама, употребљивошћу и приступачношћу.
Да бисте их избегли, покушајте да проучите следеће уобичајене ХТМЛ грешке и откријте савете како да их спречите.
1. Коришћење застарелих ХТМЛ елемената
ХТМЛ се временом мењао, тако да су неки елементи и атрибути сада сувишни. Модерни претраживачи не подржавају застареле елементе и атрибуте, а њихова употреба може негативно утицати на брзину ваше веб странице.
Тхе ознака за центрирање текста, тхе ознаку за форматирање текста и таг за прецртани текст су неки од најчешће коришћених застарелих ХТМЛ елемената. Требало би да користите модерне еквиваленте за ове компоненте.
На пример, можете користите ЦСС за центрирање садржаја, а не таг. Поред тога, можете поставити стилове фонта користећи ЦСС, а не таг.
2. Не укључује алтернативни текст за слике
Иако су слике важна компонента онлајн дизајна, гледаоци са оштећеним видом не могу да их виде. Као такав, требало би да додате описни алтернативни текст на фотографије како бисте их учинили доступнијим.
Алтернативни текст омогућава машинама за претварање текста у говор да прочитају опис слике корисницима. Међутим, није само за читаче екрана; алтернативни текст може користити оптимизацији претраживача. Већина претраживача ће такође приказати алтернативни текст ако се слика не учита.
3. Неправилно угнежђивање ХТМЛ елемената
Да би се гарантовао прихватљив код и правилан рад веб локације, ХТМЛ елементи би требало да се правилно угнезде. Неадекватно угнежђивање може имати неочекиване ефекте, укључујући неисправне изгледе, садржај који недостаје и неисправне везе.
На пример, требало би да затворите сваку див ознаку пре него што отворите нову. Слично томе, никада не би требало да ознака изван уређене или неуређене листе.
Ознака „див“ је флексибилан ХТМЛ елемент који се користи за груписање и стилизовање садржаја. Међутим, прекомерна употреба ове ознаке може довести до лоше организоване веб локације и отежати одржавање кода.
Требало би да користите семантичке ХТМЛ елементе који садржају дају значење, а не див ознаке за све. Можете користити ознаку за заглавље, а не ознаку див. Исто тако, требало би да користите ознаку за траку за навигацију уместо таг.
5. Не користи семантички ХТМЛ
Без употребе семантичких елемената попут
Ваша веб локација такође може бити ниже рангирана странице резултата претраживача (СЕРП) ако претраживачи имају проблема са индексирањем садржаја.
6. Коришћење уметнутих стилова уместо ЦСС-а
Можете да примените инлине ЦСС стилове директно на ХТМЛ елемент користећи атрибут стиле. Иако су ови стилови корисни за брзе промене, њихово прекомерно коришћење може отежати одржавање кода и наштетити ефикасности веб локације.
Сходно томе, требало би да користите екстерне ЦСС датотеке које примењују стилове на веб локацију глобално, а не уграђене стилове. Они побољшавају перформансе веб локације смањујући код који се шаље претраживачу, а такође поједностављују одржавање веб локације.
7. Не користите прилагодљиве дизајне
Респонзивни дизајн је стратегија веб дизајна која омогућава веб локацијама да се прилагоде различитим величинама екрана и уређајима. Овај приступ је од суштинског значаја за побољшање приступачности веб странице и корисничко искуство, с обзиром на све већу употребу мобилних уређаја.
Требало би да користите ЦСС медијске упите да бисте применили различите стилове на основу величине екрана уређаја. Ово побољшава корисничко искуство јер веб локацију чини приступачном на различитим уређајима.
8. Провера ХТМЛ-а није успела
Веб развој мора почети са ХТМЛ валидацијом како би се осигурало да код нема грешака и да је у складу са веб стандардима. Неважећи ХТМЛ може довести до неисправних распореда, недостајућих садржаја, неисправних веза и многих других проблема.
Требало би да користите ХТМЛ валидаторе да пронађете и исправите грешке у вашем коду. Осим исправности, валидација такође побољшава перформансе, приступачност и оптимизацију претраживача.
Коришћење модерног ХТМЛ-а и ЦСС-а
Са новим функцијама на хоризонту, ХТМЛ5 и ЦСС3 дају програмерима више ресурса него икада за прављење занимљивих веб локација. Такође, развој стандарда веб приступачности ће побољшати корисничко искуство за особе са инвалидитетом.
Као такав, важно је да будете у току са најновијим ХТМЛ стандардима и најбољим праксама ако желите да направите боље, инвентивније веб локације које задовољавају тренутне и будуће потребе корисника. Ово вам омогућава да препознате и избегнете уобичајене замке које би негативно утицале на ваш рад.
