Разумевање ХТМЛ5 СЕЦТИОН Елемента
Када се ХТМЛ5 налазио на сцену пре више година, додао је гомилу нових елемента за секцију на лангауге, укључујући елемент СЕЦТИОН. Већина нових елемената које ХТМЛ5 уводи имају јасну употребу. На примјер, елемент се користи за дефинисање чланака и главних дијелова веб странице, елемент се користи за дефинисање сродног садржаја који није критичан за остатак странице, а хеадер, нав, и фоотер су прилично јасни. Међутим, ново додати елемент СЕЦТИОН је мало мање јасан.
Многи људи верују да су ХТМЛ елементи СЕЦТИОН и стварно исте ствари - генерички елементи контејнера који се користе за садржај на веб страници. Реалност је, међутим, да су ова два елемента, иако су оба елементи контејнера, нешто друго осим генеричног. Постоје специфични разлози за кориштење елемента СЕЦТИОН и ДИВ елемента - и овај чланак ће објаснити те разлике.
Секције и Дивови
Елемент СЕЦТИОН је дефинисан као семантички одељак веб странице или сајта који није још један специфичнији тип (попут чланка или у страну). Навикао сам да користим овај елемент када обележавам посебан одјељак странице - одјељак који се на велику велицину може помјерати и користити на другим страницама или дијеловима сајта. То је засебан део садржаја, или "секција" садржаја, ако желите.
Насупрот томе, користите ДИВ елемент за делове странице које желите да поделите, али за друге сврхе осим семантике . Заменио бих подручје садржаја у подели ако то радим чисто да бих себи дала "куку" за кориштење с ЦСС-ом. То можда није посебан део садржаја заснован на семантици, али је нешто што ја диктирам како бих постигао изглед који желим за своју страницу.
То је Алл Абоут Семантицс
Ово је тежак концепт који треба разумјети, али једина разлика између ДИВ елемента и елемента СЕЦТИОН је семантика. Другим речима, то је значење деонице кода који делите.
Било који садржај који се налази унутар ДИВ елемента нема никакво инхерентно значење. Најбоље се користи за ствари као што су:
- ЦСС стилове и куке за ЦСС стилове
- Контејнери за постављање
- ЈаваСцрипт куке
- Одјељења за ХТМЛ да олакшају читање
Елемент ДИВ је био једини елемент који смо имали за додавање кукица у стилу наших докумената и креирање колона и украсних распореда. Због тога смо завршили са ХТМЛ-ом који је преплављен са ДИВ елементима - што веб дизајнери могу назвати "дивитис". Било је чак и ВИСИВИГ уредника који су искључиво користили ДИВ елемент. Заправо сам покренуо ХТМЛ који користи ДИВ елемент уместо за параграфе!
Са ХТМЛ5-ом, можемо почети да користимо елементе за секцију да креирамо више семантички дескриптивних докумената (користећи за навигацију и за дескриптивне бројке и тако даље), а такође дефинишемо стилове на тим елементима.
Шта је СПАН елемент?
Други елемент који већина људи мисли када помисле на ДИВ елемент је елемент. Овај елемент, као што је ДИВ, није семантички елемент. То је инлине елемент који можете користити за додавање кукица за стилове и скрипте око инлине блокова садржаја (обично текст). У том смислу то је управо као ДИВ елемент, само инлајн, а не блоковни елемент . На неки начин, можда би било лакше размислити о ДИВ-у као елементу СПАН елемента на блока и користити га на исти начин као СПАН само за читаве блокове ХТМЛ садржаја.
Не постоји упоредиви елеменат елемента за секцију у ХТМЛ5.
За старије верзије Интернет Екплорер-а
Чак и ако подржавате драматично старије верзије ИЕ-а (као ИЕ 8 и ниже) које не поуздано препознају ХТМЛ5, не бисте се требали плашити кориштења семантички исправних ХТМЛ ознака. Семантика ће вам помоћи и ваш тим да управљају страном у будућности (јер ћете знати да је тај одељак чланак ако је окружен елементом АРТИЦЛЕ). Плус, прегледачи који препознају те ознаке ће их боље подржавати.
Још увек можете користити ХТМЛ5 елементе семантичке секције са Интернет Екплорер-ом, само је потребно додати скриптирање и можда неколико околних ДИВ елемената како би их препознали као ХТМЛ.
Коришћење ДИВ и СЕЦТИОН Елементс
Ако их правилно користите, можете заједно користити елементе ДИВ и СЕЦТИОН у важећем ХТМЛ5 документу. Као што сте видели овде у овом чланку, користите СЕЦТИОН елемент за дефинисање семантички дискретних дијелова садржаја, а ви користите ДИВ елемент као куке за ЦСС и ЈаваСцрипт, као и дефинисање распореда који нема семантичко значење.
Оригинални чланак Јеннифер Кринин. Уредио Јереми Гирард 15.3.17