Табліца супраць Div - дабро, зло і пачварны - HTML - Front-end - вэб-агенцтва Blog Princi

1. Хто хто?
2. Табліца, Гадкае
3. Div, добра
4. Div, ці зло
5. Карысныя спасылкі
6. Пакінуць каментар
7. [26] Водгукі
8. Рыкарда Лопес
9. Радольфа Перэйра
10. Эдна Крыт
11. Хрыстос
12. Джозэф Дыяніё Бісэк Ракка
13. Радольфа Перэйра
14. Велінгтон В. Сантос
15. Алесандра
16. Луіз Рыкарда
17. Эліяс Ф. Радрыгес
18. Радольфа Перэйра
19. Flávio Cavalcante
20. Рэната Чэрвень
21. Рафаэль дэ Суза Дутры
22. Радольфа Перэйра
23. Марыяна
24. Cin
25. Радольфа Перэйра
26. Рафаэль
27. Радольфа Перэйра
28. Эдуарда
29. Радольфа Перэйра
30. Нілсан
31. Радольфа Перэйра
32. Нілсан

Наша команда-партнер Artmisto

У наш час шмат кажа пра адмову ад структуравання сайта на аснове табліцы і пераўтварэнне яго ў дывізіён. Але вы ведаеце, чаму рабіць гэта пераўтварэнне структуравання сайта? Гэта, вядома, не бойка Захаду, але гэта тэма, на якой перажываюць вэб-распрацоўнікаў.

Хто хто?

Перш чым сказаць што-небудзь, давайце даведаемся пра значэнне і мэта кожнага ў дакуменце HTML.

Табліца Тэг <table> вызначае табліцу ў дакуменце HTML. Ён выкарыстоўваецца для спісу таблічных дадзеных у радках і слупках. Тэг <tr> вызначае радок, а тэг <td> вызначае слупок табліцы. У табліцы выкарыстоўваюцца іншыя тэгі, такія як <thead>, <tfoot>, каб зрабіць яго больш сэнсаваным. Div Тэг <div> вызначае падзел або падзел у дакуменце HTML. Звычайна ён выкарыстоўваецца для стварэння блокаў элементаў, арганізацыі інфармацыі ў макеце, які адфарматаваны з CSS. Тэг <div> кіруецца CSS з дапамогай ID, Class або самога тэга.

Табліца, Гадкае

Даўным-даўно, у вельмі далёкай сетцы ... ці, магчыма, не так далёка (не кажучы ўжо пра бягучы), людзі выкарыстоўвалі тэг <table> для размяшчэння элементаў у HTML-старонцы. Сайт хутка быў зроблены з дапамогай візуальнай часткі HTML-рэдактара, напрыклад, напрыклад, FrontPage ці Dreamweaver, і не было неабходнасці правяраць тэставанне ў некалькіх браўзэрах, таму што браўзэры таксама інтэрпрэтавалі тэг <table>.

Аднак у гэтай хуткасці ёсць цана: код складанага абслугоўвання. Сайт, структураваны з тэгам <table>, патрабуе большага трафіку і становіцца заблытаным для абслугоўвання і пошукавых сістэм .

Яны кажуць, што калі сайт структураваны з тэгам <table>, сайт сумяшчальны з усімі браўзэрамі, і што для яго структуравання патрабуецца значна менш часу, чым структура сайта з тэгам <div> ... але гэта?

"Сайт, які вы робіце з дапамогай тэга <div> праз 5 гадзін, я зраблю гэта праз 1 гадзіну з дапамогай тэга <table>! Гэта хуткі і просты ў абслугоўванні. Проста змясціце іншую табліцу ў іншую табліцу, якая вырашана! І калі з'явіцца стол, я паставіў яшчэ адзін стол, каб выправіць іншую ".

- Вэб-майстар, які выкарыстоўвае табліцу пасля графіка сайта з 10 тысячамі радкоў кода (і гэта толькі ён разумее).

Div, добра

Сайт, структураваны з тэгі <div>, атрымлівае семантыку, прастата абслугоўвання, памяншэнне памеру старонак і паляпшае індэксаванне пошукавых сістэм. Але факт таго, што трэба пратэставаць ва ўсіх браўзэрах, усё яшчэ парушае распрацоўнікаў.

З выкарыстаннем тэга <div> і CSS, тэрмін Tableless кожны дзень набывае сілы ў бразільскай сетцы. Распрацоўка сайта пасля стандарты, устаноўленыя W3C , Вы робіце гэта простым для ўсіх, незалежна ад таго, які выкарыстоўваецца браўзэр або ад асаблівай патрэбы наведвальніка, прыемны вопыт пры наведванні сайта.

Div, ці зло

Тэг <div> мае не толькі добры бок, але і дрэнны бок. Вы сёння, жадаючы перайсці ад табліцы да Div, што-то працаёмкае, і гэта, на жаль, звязана з людзьмі, якія не ведаюць Інтэрнэт. Але як?

Вядома, што браўзэр Microsoft Internet Explorer 6 ускладняе гэты пераход, паколькі ён не мае добрай сумяшчальнасці з парай Div + CSS. І, як вы ведаеце, IE6 - гэта той браўзэр, які ўжо ўсталяваны на машыне гэтага чалавека, які не мае ведаў у вылічэнні і хто думае, што Інтэрнэт зводзіцца да Orkut і па электроннай пошце, таму вы думаеце, што чалавек будзе мець працаваць, каб абнавіць браўзэр? На жаль, не.

Нават сёння, нават з выпускам Internet Explorer 8, вялікая частка людзей атрымлівае доступ да Інтэрнэту з дапамогай Internet Explorer 6 і 7, таму мы не можам сапсаваць вопыт тых карыстальнікаў, якія выкарыстоўваюць старыя браўзэры, што робіць іх немагчымым для навігацыі і выкарыстання. каб знайсці інфармацыю, якую яны шукаюць, але мы павінны заахвочваць іх абнаўляць свае браўзэры, каб яны мелі больш бяспечны і бяспечны вопыт прагляду.

"Чорт IE6! Вы не можаце зрабіць гэта, выкарыстоўваючы тэг <div> ... Я думаю, што тут буду выкарыстоўваць табліцу. Толькі адзін стол не балюча і ніхто не заўважыць. "

- Вэб-майстар, які пачаў рабіць пераход ад Table да Div

Карысныя спасылкі

Ніжэй прыведзены спіс карысных спасылак для лепшага вывучэння HTML-тэгаў. Добра вучыцца і да наступнага артыкула!

Пакінуць каментар

Мы хочам ведаць, што вы думаеце пра гэты пост! Мы будзем рады, калі вы пакінеце нам каментар :-)

Майце на ўвазе, што каментары ўмераныя, і спасылкі маюць rel = "nofollow". Калі ласка, не спам ключавыя словы, інакш ваш каментар будзе выдалены. Дзякуй!

[26] Водгукі

Роджэрыё Гомес Перэйра

Я згодны з вамі Радольфа на гэтае пытанне выкарыстання табліцы. Гэта шырока выкарыстоўваецца, і ёсць складаныя ўчасткі для тэхнічнага абслугоўвання. Сайт з вялікай колькасцю табліц практычна зашыфраваны (ніхто не разумее, як ён усталяваны) і немагчыма праводзіць любое абслугоўванне.

Рыкарда Лопес

IE - гэта вялікая праблема, на працягу многіх гадоў і не вырашана, сайты павінны ўзяць на сябе ініцыятыву забароны браўзэра.

Радольфа Перэйра

У адказ на Рыкарда Лопес

Рыкарда, я думаю, што IE6 - вялікая праблема, а IE7 - "сярэдняя" праблема. IE8 не выклікае так шмат непрыемнасцяў, калі гаворка ідзе пра структураванне сайта ў Tableless, але ён усё яшчэ знаходзіцца пад браўзэрамі Firefox, Chrome і Opera.
Ёсць сайты, якія далучыліся да кампаній, якія выступаюць за "смерць IE6?, Хе-хе ... і гэта тое, што хочуць усе распрацоўшчыкі!

Эдна Крыт

Давай, я жыву гэта ў сваёй паўсядзённым жыцці, таму што толькі бачачы, калі тое, што я ўяўляю, мае якасць і змест, і я ведаю, што я таксама палепшыцца, калі вы заўсёды разлічваеце на падтрымку Прынцы, вы добрыя, але добрыя нават у тым, што яны робяць.
Дзякуй і поспеху,
Эдна.

Хрыстос

Забіце браўзэр, які 40-гадовыя людзі выкарыстоўваюць у сваіх спадчынных кампаніях? Лепш забіваць гэтыя караблі і знішчыць іх замест браузера, таму што яны не зменяцца (а таксама выйсці на забойства працоўных - гэта злачынства і ланцуг і ідзе супраць закона).
Нават кажучы ім, што калі яны выкарыстоўваюць Firefox з убудовай FasterFox, ім будзе практычна імгненны доступ, яны не вераць у гэта, нават калі гэта праўда, ідэальна зрабіць адну старонку для IE6 і іншую для астатніх, але гэта будзе падвойная стрэс і праца. , альбо выкарыстоўвайце фрэймворкі, якія забяспечваюць добрую сумяшчальнасць з большасцю браўзэраў, такіх як JQuery (які часам пакідае вас у руцэ), альбо мова сервера для стварэння старонкі ў адпаведнасці з патрэбамі PHP, Java, Ruby і Python ( што ў выпадку выкарыстання любога з іх будзе значна больш выгадным, чым старонка старонкі за старонкай), аднак ёсць шмат кліентаў, якія заплацілі за прадукцыю без гэтай падтрымкі.
Я больш за ўсё аддаю перавагу ствараць праграмы на Java для працоўнага стала або мабільнага, якія робяць дызайнерскую старонку html, так як я буду рабіць для мабільнага тэлефона або кампутара дадзенага кліента, а не старонкі для вялізнага набору незалежных браўзэраў.
Альбо кідайце ўсё ў кошык і зрабіце IE6 (шмат працы, стрэсу і смешна зламанай кодавай старонкі).

Джозэф Дыяніё Бісэк Ракка

Здаўна я прыняў рашэнне. Зрабіце простыя і прыгожыя сайты для ўсіх браўзэраў,
і ствараць складаныя сістэмы, выкарыстоўваючы максімум абмежаванняў, якія абмяжоўваюць іх толькі ў браўзэры.
І для гэтага я звычайна выкарыстоўваю IE8.
IE6 сапраўды згодны, што гэта было вельмі latráz ад канкурэнтаў, але IE8 выйграе ў дэталях, па меншай меры, у маіх праектах.
Хто выкарыстоўвае IE6, не мае паняцця Інтэрнэт, гэты тып чалавека не заслугоўвае "добрага вопыту". Не трэба забіваць нікога, каб прымусіць усіх карыстацца бягучымі браўзэрамі, людзі павінны разумець, што ўсё адбываецца ў галіне вылічэнняў, і яны павінны прытрымлівацца гэтай эвалюцыі.
Калі распрацоўшчыкі заўсёды прыязджаюць са старымі браўзэрамі, мы ніколі не будзем мець рэальнага развіцця Інтэрнэту. Мы, якія з'яўляюцца асновай Інтэрнэту, калі мы будзем развівацца да патрабавання больш браўзэра, то браўзэр больш не будзе проста інструментам, які паказвае тэксты на экране з некаторымі небяспечнымі плягінамі пачатку XXI стагоддзя.

Радольфа Перэйра

У адказ на Джозэф Дыяніё Бісэк Ракка

Джозэф, у першую чаргу, дзякуй за каментар!
Стратэгія стварэння простага і прыгожага сайта, каб у вас не было сур'ёзных галаўных боляў, калі гаворка ідзе пра праверку сайта ў старых браўзэрах, з'яўляецца добрым у залежнасці ад выпадку, таму што вы можаце абмежаваць вопыт тых, хто выкарыстоўвае больш бягучых браўзэраў, так як вы можа прапанаваць ім лепшы вопыт, выкарыстоўваючы больш прасунутыя функцыі, аднак, магчыма, досвед для тых, хто выкарыстоўвае старыя браўзэры, не вельмі добра. Гэта тое, што трэба старанна вывучыць перад тым, як зрабіць сайт, таму вы не прапаноўваеце непрыемны вопыт тым, хто выкарыстоўвае старыя браўзэры, і ў той жа час не абмяжоўваеце досвед тых, хто выкарыстоўвае бягучыя браўзэры.
У сістэмах Princi Web Agency, калі мы праводзім навучанне кліента, мы ўжо абнавілі браўзэр таго ж і паставілі праверку, каб даведацца, ці ўваходзіць карыстальнік у сістэму са старым браўзэрам ці не. Калі ён выкарыстоўвае стары браўзэр, выдаецца папярэджанне, якое дазваляе лёгка абнавіць браўзэр і скарыстацца ўсімі магчымасцямі нашых сістэм.
Гэтая практыка прадастаўлення гэтага папярэджання карыстачу пры праглядзе пэўнай старонкі са старым браўзэрам будзе выкарыстоўвацца ў будучыні на нашых сайтах, каб "прымусіць" (а не "забіць", хе-хе) карыстальніка абнавіць браўзэр, паколькі карыстальнік хто наведвае сайт, можа нават адчуваць сябе абнаўленнем вашага браўзэра, але, можа быць, ён не ведае, што ў яго ёсць больш новая версія.

Велінгтон В. Сантос

Віншую пост, вельмі тлумачальны, я проста ў гэтым пераходзе паміж і і, нягледзячы на ​​складанасці прымусіць divs зразумець і прымусіць іх працаваць у розных браўзэрах, мне цікава, дзе я быў з галавой, што я гэтага не рабіў. У любым выпадку, хутчэй, чым пазней. Дзякуй, абдымаю.

Алесандра

Выдатны пост, дзякуй!
Тэкст мне падабаўся.

Луіз Рыкарда

Ваша артыкул ставіць пад сумнеў тое, што я распрацоўваю, але ў маім выпадку гэта не складаныя вэб-старонкі, а хутчэй формы, у выпадку, калі гэта прыкладанне для вэб-базы дадзеных.
Я адчуваю цяжкасці з тым, у маім выпадку я проста выраўноўваю сетку дадзеных і іншы элемент кіравання, што вы параіце?
адзін просты ў выкарыстанні, і калі мне трэба размясціць элементы ў якасці сеткі дадзеных побач адзін з адным, узнікае пэўная складанасць, папаўненне ў пэўных сітуацыях не працуе або працуе ў адным браўзэры, а не ў іншым.
Я не вэб-распрацоўшчык, ды працоўны стол.
Калі вы зможаце даць мне нейкую інфармацыю з крыніц даследавання, а менавіта ў дачыненні да распрацоўкі вэб-формаў, я буду ўдзячны.

Эліяс Ф. Радрыгес

Я распрацоўваю Інтэрнэт на працягу некаторага часу, і я збольшага згодны. Аб стварэнні макетаў з div значна больш падатлівым.
На імператрыцы "непрыгожы і складана падтрымліваць табліцу" сайт, які выкарыстоўвае табліцы, прасцей падтрымліваць, таму што мы кантралюем, дзе частка сайта і яго становішча пачынаюцца і заканчваюцца. Я веру, што спалучэнне div і табліцы без найлепшага варыянту.

Радольфа Перэйра

У адказ на Эліяс Ф. Радрыгес

Эліяс, дзякуй за ваш каментар!
Аб выкарыстанні табліц для структуравання сайтаў, я лічу, што яна мае больш нізкую падтрымку, таму што вы будзеце пісаць больш радкоў кода, чым калі б вы структуравалі сайт праз div. Для адлюстравання таблічных дадзеных няма нічога лепшага, чым сама табліца.
Дзякуй!

Flávio Cavalcante

Я выкарыстоўваю толькі сайты, зробленыя з таблічкамі. Я думаю, што табліцы могуць быць выкарыстаны ў артыкулах, у канчатковым рахунку, для нешта ізаляванага, акрамя гэтага, я больш не бачу неабходнасці, бо ўсё магчыма зрабіць з дапамогай divs і css.
Дзякуй.

Рэната Чэрвень

Я пакідаю свой досвед працы ў якасці распрацоўшчыка на працягу 20 гадоў, пачынаючы з ўзросту, які быў перадrrsrsr! Я заўсёды вырашаў свае плюсы з табліцамі, выглядаю, што сайты, якія я прадаю, складаныя, хуткія і сэнсавыя. Цяпер з правіламі w3c я раблю некалькі ў div + css без профі, гэта занадта павольна, але выглядае выдатна! Што тычыцца кодаў, якія з гэтым сапсаваліся, гаворыцца, што гульня вакол стала або дывів, у рэшце рэшт, падыходзіць для круглага дызайну. Дзякуй.

Рафаэль дэ Суза Дутры

Я не ведаю, як гэта зрабіць, але я не ведаю, як гэта зрабіць.

Радольфа Перэйра

У адказ на Рафаэль дэ Суза Дутры

У вас ёсць код, каб паказаць нам?

Марыяна

Я люблю размяшчаць, я стаў прыхільнікам блога ... але добра, што Бразілія любіла хуткую табліцу ... мы заўсёды шукаем больш прыгожы і карысны Інтэрнэт.

Cin

Прывітанне Радольфа, як справы?
Я чытаў вашу артыкул на дыві і табліцу ў блогу Прынцыбава, і я быў здзіўлены ў адзін момант. Вы кажаце, што браўзэры інтэрпрэтуюць тэг табліцы, але крыху ніжэй вы кажаце: "У гэтай хуткасці цана: код цяжкага абслугоўвання і абмежавання браўзэраў".
Калі ўсе браўзэры інтэрпрэтуюць гэты тэг, як можа быць абмежаванне ў браўзэры?
Не маглі б вы растлумачыць гэты пункт лепш?

Радольфа Перэйра

У адказ на Cin

Прывітанне Cin, добра і з табой?

Ну, фактычна няма ніякіх абмежаванняў на браўзэры, бо, як вы ўжо сказалі, усе браўзэры трактуюць гэты тэг.

Я абнавіў пост, заснаваны на вашым каментарыі, дзякуй! : D.

Рафаэль

У адказ на Радольфа Перэйра

Прывітанне Радольфа, усё добра?
Я павінен стварыць форму, я думаў, што выкарыстоўваць divs, таму што я павінен пакінуць тое ж малюнак ніжэй, але гэта костка, каб усталяваць свае арыентацыі на старонцы, але з дапамогай табліц tbm я не ведаю, калі гэта лепшы спосаб, дзе я б павялічыць памер слупкоў і радкі ... Вы маглі б паглядзець на гэтую мадэль і, магчыма, даць сваё меркаванне?
http://i58.tinypic.com/2lkblad.jpg
Калі вы не можаце бачыць малюнак, скарыстайцеся спасылкай:
http://www.guj.com.br/java/308793-layout-de-tela

Радольфа Перэйра

У адказ на Рафаэль

Ну, мабыць, вы пасяліліся, ці не так?

Malz затрымка хе-хе. Abs!

Эдуарда

Як наконт выкарыстання сумесі з кадрамі і divs? Лепш ці больш дэзарганізаваны? Я ў пачатку свайго курса ІТ, і ў цяперашні час я распрацаваў толькі фрэйм-сайты, мне спадабаўся вынік, як ідуць рэчы і сумяшчальнасць, а таксама быць вельмі падатлівым і цяжка недахопам. Звычайна я выкарыстоўваю кадр для загалоўка, адзін для меню, а другі для цела сайта, дзе будуць адлюстроўвацца старонкі. Калі гэта сайт, у якім ёсць паведамленні ў блогу, я выкарыстоўваю div, які будзе вобласці.

Радольфа Перэйра

У адказ на Эдуарда

Хм, у гэтым выпадку вы апісалі, што не рэкамендуецца выкарыстоўваць кадры.

Я рэкамендую вам паглядзець на зыходны код гэтага сайта http://www.medicamenta.com.br/ даць вывучаны.

Abs!

Нілсан

Што адбудзецца, калі я змантую макет сайта ўнутры табліц з дапамогай DREAMWEAVER CS6, а потым пераўтварыць табліцы ў AP DIV?
Для мабільнага прыкладання я магу таксама выкарыстоўваць гэты метад?
Гэта тое, што ў мяне ёсць цяжкасці ў Інтэрнэце, і ў мяне яшчэ ёсць праблемы з css і г.д ... і яны не складаныя сайты і прыкладанні, яны вельмі простыя
Дзякуй

Радольфа Перэйра

У адказ на Нілсан

Нільсан кажа:

Такім чынам, я не ведаю спосабу пераўтварэння табліц у div. Шчыра кажучы, я думаю, што вам лепш выдаткаваць трохі часу, каб навучыцца не выкарыстоўваць табліцы для стварэння старонкі ... Вы можаце: D

Abs!

Нілсан

У адказ на Радольфа Перэйра

Dreamweaver робіць гэта ... табліцы для DiV App ...