Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Wracajmy do tabelek!
bigZbig
post 21.06.2006, 08:25:26
Post #1





Grupa: Zarejestrowani
Postów: 740
Pomógł: 15
Dołączył: 23.08.2004
Skąd: Poznań

Ostrzeżenie: (0%)
-----


Siedziałeś, męczyłeś się starając się usilnie przebudować swoją stronę opartą o tabele zgodnie z najnowszymi trendami zalecającymi używanie do konstruowania struktury strony divów. I co? Przeciętny użytkownik nie doceni Twojej pracy bo się na tym nie zna, a witryna w najlepszym wypadku wygląda tak samo.

Ile razy słyszałeś, że strukturę strony nie powinno się konstruować w oparciu o tabelki:
  • bo to nie jest tabelka,
  • bo produkujesz nadmiarowy kod,
  • bo to jest rozwiązanie nieelastyczne i trudne do przebudowy,
  • bo tagi tabeli są preformatowane.
Ile razy słyszałeś te argumenty? Zapewne wiele - no i w końcu uwierzyłeś. Ja też uwierzyłem. Zatriumfowała stara Goebbelowskiej zasada, że często powtarzane kłamstwo w końcu staje się prawdą.

Zadajmy sobie pytanie, czy struktura strony faktycznie nie ma nic wspólnego z tabelką? Zapewne są takie strony, w odniesieniu do których powyższe zdanie jest prawdziwe, ale zdecydowana większość szkieletów stron jest mniej lub bardziej złożoną tabelą i choć nie widać granic poszczególnych komórek nie dajcie sobie wmówić, że tak nie jest. Utalentowany designer potrafi w swoim projekcie wyjść poza ramy tabeli sięgając w przypadku wybranych elementów do pozycjonowania tudzież innych technik umożliwiających uzyskanie efektu niemożliwego do osiągnięcia przy zastosowaniu tradycyjnych tabel, ale czy te przemyślne techniki powinny być używane do emulowania struktury tabelarycznej?

Ponoć wraz ze stosowaniem tabel zmniejsza się czytelność kodu i produkuje się nadmiarowe tagi. Pomijając to, że w przypadku stosowania divów część formatująca kodu zostaje przeniesiona do arkusza styli mógłbym się zgodzić z poglądem, że na wczesnym etapie projektu kod strony opartej o divy jest czytelniejszy. Proszę zwrócić szczególną uwagę na sformułowanie „na wczesnym etapie projektu”. Z czasem projekt zaczyna się komplikować, rozrastać – szkielet strony wypełniany jest treścią, która również często zorganizowana jest w jakąś hierarchię, jakiś układ. Divy się zagnieżdżają. Z czasem zaczynasz odkrywać potrzebę stosowania dodatkowych kontenerów i nim się spostrzeżesz Twój kod staje się śmietnikiem, który trzyma się kupy dzięki różnego rodzaju trikom, hakom i obejściom. A miało być tak przyjaźnie i elastycznie.

Przesadziłem. Nikt nie twierdzi – przynajmniej ja się z taką opinią nie spotkałem – że używanie divów do budowy układu tabelarycznego jest prostsze od bezpośredniego zastosowania tabel. Co do elastyczności i łatwości ewentualnej przebudowy struktury strony opartej o divy to ja się proponuję zastanowić indywidualnie każdemu, kto taki twór stworzył. Prosty przykład. Masz klasyczny trójkolumnowy podział strony z nagłówkiem na górze i stopką jak sama nazwa wskazuje na dole. Zrób tak aby tak skonstruowana tabela zajmowała określoną szerokość, i aby szerokość każdej z kolumn był z góry określony. Proste prawda? No to teraz przerób ten układ w ten sposób aby tabela dostosowywała się do wielkości okna przeglądarki poprzez poszerzenie środkowej kolumny. Jeśli przewidziałeś taki manewr to obeszło się bez ingerencji we wzajemne położenie divów. Ok. to teraz zamień kolumny miejscami ;). Czy robisz to przy pomocy tabel czy divów musisz przebudować strukturę strony. Możesz co prawda zastosować pozycjonowanie i w sposób dowolny przemieszczać elementy w oknie przeglądarki, ale tylko pod warunkiem ustalenia z góry ich szerokości i wysokości. W innym przypadku nie ma to większego sensu.

Podążając w stronę słusznie lansowanej idei by oddzielić treść strony od sposobu jej prezentowania konsorcjum W3C stworzyło XHTMLa, jako standard przejściowy pomiędzy HTMLem a czystym XMLem, w którym nie ma z góry zdefiniowanych tagów, a sposób ich formatowania zależy tylko i wyłącznie od definicji zawartych w arkuszach styli CSS czy XSL. Chcąc być jak najbardziej po drodze z wyżej wspomnianą ideą powinniśmy unikać predefiniowanych tagów, a więc na dobre wszystkiego oprócz divów i znaczników span (choć i te są predefiniowane – w końcu jedne są wyświetlane blokowo a drugie liniowo. Bądźmy konsekwentni – skoro unikamy <table> do konstruowania struktur tabelarycznych to powinniśmy także wystrzegać się <ul> do konstruowania list, a <p> do oznaczania paragrafów. Dlaczego łamiemy tekst przy pomocy znacznika <br> a wyróżniamy go tagiem <strong>. Miłośników divów chciałbym zapytać dlaczego do tworzenia horyzontalnego menu używają listy? Przecież menu nie jest listą.

Nie jestem zagorzałym przeciwnikiem techniki opływania czy pozycjonowania, ale uważam, że w chwili obecnej są one nadużywane. W końcu ideą opływania miało być otoczenie obrazka lub niewielkiego bloku tekstem, a nie konstruowanie układów tabelarycznych. Myślę, że nie do tego zostało również wymyślone pozycjonowanie. To prawda, że kreatywny programista, czy designer nie zawsze używa technologii zgodnie z ich pierwotnym przeznaczeniem, tylko znajduje dla niech zastosowanie tam gdzie nikt by się nie spodziewał, ale w tym wypadku opływanie i pozycjonowanie to nie łyżka stołowa, która nadaje się do kopania równie dobrze jak łopatka.


--------------------
bigZbig (Zbigniew Heintze) | blog.heintze.pl
Go to the top of the page
+Quote Post

Posty w temacie
- bigZbig   Wracajmy do tabelek!   21.06.2006, 08:25:26
- - Kuziu   Cytat(bigZbig @ 21.06.2006, 09:25 ) Bądźm...   21.06.2006, 08:38:19
- - sf   Dla mnie budowanie na divach jest tak oczywista ja...   21.06.2006, 08:39:30
- - bigZbig   CytatI dlaczego menu nie jest listą ? Z takiego sa...   21.06.2006, 08:40:42
- - mike_mech   Przenoszę na Hydepark. Jak zjem śniadanie to odpis...   21.06.2006, 08:41:45
- - bigZbig   @mike_mech - zerknalem w źródło strony, dodałem do...   21.06.2006, 09:06:04
- - mike_mech   Nawet stosując tabelki trzeba pisać dla bardzIEwia...   21.06.2006, 09:18:04
- - revyag   http://osiolki.net/tabelki/index.html   21.06.2006, 09:52:22
- - bigZbig   @revyag - znam ten artykul bardzo dobrze. CytatT...   21.06.2006, 10:55:27
- - ens0re   I podsumowując to wszystko, nie stosuje sie tabele...   21.06.2006, 12:17:24
- - bigZbig   @ens0re - czy chcesz przez to powiedzieć, że <t...   21.06.2006, 12:37:51
|- - mike_mech   Cytat(bigZbig @ 21.06.2006, 13:37 ) (...)...   21.06.2006, 12:42:54
|- - bigZbig   Cytat(mike_mech @ 21.06.2006, 13:42 ) Je...   21.06.2006, 13:05:53
|- - mike_mech   Cytat(bigZbig @ 21.06.2006, 14:05 ) Mo...   21.06.2006, 13:11:38
- - ens0re   Cytatczy chcesz przez to powiedzieć, że <table...   21.06.2006, 12:46:28
- - ActivePlayer   ja przypomne ze dane tabelaryczne, to dane prezent...   21.06.2006, 12:49:57
- - mike_mech   A jeszcze jedno dodam, uczę tworzenia stron o...   21.06.2006, 12:54:41
- - ens0re   Dokładnie, gdyby wszyscy od samego poczatku uczyli...   21.06.2006, 13:00:05
- - dr_bonzo   CytatZnajdz mi zapis na stronach W3C, ze uzywanie ...   21.06.2006, 13:04:54
- - bigZbig   Przykład problemu z jakim się spotkałem przy proje...   21.06.2006, 13:30:16
- - athabus   No to i ja dorzuce swoje 3 grosze. Nie będę nikog...   21.06.2006, 13:59:18
- - bigZbig   @athabus - ja sie z Tobą w zupełności zgadzam. Wcz...   21.06.2006, 14:03:14
- - athabus   @bigZbig - to nie było do Ciebie bezpośrednio - to...   21.06.2006, 14:12:27
- - mike_mech   http://michalmech.pl/projects/seth/lynx.gif ~bigZ...   21.06.2006, 14:27:09
- - Master Miko   bigZbig... Twój post jest cholernie długi ja sko...   21.06.2006, 15:54:45
- - DeyV   Hmm - faktem jest, że na tabelach prosty rozkład j...   21.06.2006, 15:58:46
- - spenalzo   Nie znam sie na programach dla neiwidomych i nie w...   21.06.2006, 17:18:44
|- - Kuziu   Cytat(spenalzo @ 21.06.2006, 18:18 ) Rozm...   21.06.2006, 20:44:27
|- - mike_mech   Cytat(spenalzo @ 21.06.2006, 18:18 ) Jak ...   21.06.2006, 20:58:15
- - athabus   CytatNie znam sie na programach dla neiwidomych i ...   21.06.2006, 18:46:11
- - spenalzo   Cytat(athabus @ 21.06.2006, 19:46 ) Progr...   21.06.2006, 18:58:30
- - athabus   Znam tylko z opowieści... mama zamiar sprawdzić w ...   21.06.2006, 19:23:06
- - spenalzo   No właśnie o to mi chodzi - dopoki nie masz setek ...   21.06.2006, 20:58:30
- - mike_mech   A jednak faktycznie nie rozumiesz. Tak dla Ciebie...   21.06.2006, 20:59:24
- - Master Miko   Mike'owi o to chodzi, że masz MODEM TPSA i wch...   21.06.2006, 22:01:40
- - Seth   Nie przeczytalem calego tematu, ale zanim zgubie s...   21.06.2006, 22:08:22
- - hwao   Ja buduje na div'ach poniewaz jest do dla mnie...   22.06.2006, 06:52:57
- - bigZbig   Cytat(Master Miko @ 21.06.2006, 16:54 ) A...   22.06.2006, 08:07:38
|- - hwao   Cytat(bigZbig @ 22.06.2006, 09:07 ) @hwao...   23.06.2006, 08:13:12
- - Vertical   IMHO lepiej jednak używać divów od tabel...   22.06.2006, 08:35:48
- - ens0re   Cytat(...)jesli program werbalizujacy tresc nie po...   22.06.2006, 08:56:11
- - DeyV   Cytat(bigZbig @ 22.06.2006, 09:07 ) Wybac...   22.06.2006, 08:57:15
|- - bigZbig   Cytat(DeyV @ 22.06.2006, 09:57 ) Praktycz...   22.06.2006, 11:13:20
- - athabus   @bigZbig - ja nie napisałem, ze odejscie od tabele...   22.06.2006, 08:57:41
- - revyag   CytatNo a czy float zostalo zaprojektowane do budo...   22.06.2006, 09:35:34
- - nasto   To jest dyskusja ktora moze trwac na zawsze . Jesl...   22.06.2006, 10:42:48
- - DeyV   Heh - przypomniało mi się, że ktoś ostatnio zarzuc...   22.06.2006, 11:37:15
- - ens0re   Trzeba też zwrócić uwage na to, że nie zawsze stos...   22.06.2006, 11:53:19
- - Sh4dow   Ja tutaj widze ciagnięcie jednej brzydkiej przypda...   22.06.2006, 12:55:05
- - shpyo   Ludzie po co ta dyskusja? Już tyle się nadyskutowa...   22.06.2006, 13:28:56
- - Master Miko   Podsumowanie: - zgadzam się z shpyo że "dysk...   22.06.2006, 16:50:51
- - bigZbig   shpyo i Master Miko - ten temat jest dla ludzi, kt...   22.06.2006, 17:19:15
- - ens0re   Cytat(...) tzn NIE używać DIVÓW do wszystkiego co ...   22.06.2006, 18:35:32
|- - athabus   Cytat(ens0re @ 22.06.2006, 17:35 ) Tu nie...   22.06.2006, 18:50:12
- - ens0re   Tak samo czesto ludzie mają strone na tabelka...   22.06.2006, 19:26:25
- - bigZbig   ensOre - o ile wiem, na tym forum nie jest zabroni...   22.06.2006, 19:43:53
- - spenalzo   Cytat(ens0re @ 22.06.2006, 20:26 ) P.S. S...   22.06.2006, 19:54:54
- - ens0re   Mam tylko tą książke Zeldmana, ale jest ona godna ...   22.06.2006, 19:58:31
- - ens0re   @hwao: bredzisz http://www.republika.pl/ens0re/in...   23.06.2006, 09:59:18
- - Vogel   ensore - mowimy o jednym pliku HTML i KOMPLETNEJ z...   23.06.2006, 10:33:53
- - bigZbig   @hwao - przekonales mnie, ze potencjal jaki drzemi...   23.06.2006, 11:15:04
- - no-name   wiecie co? Jakby nie spojrzeć to jednokomórko...   29.06.2006, 08:28:05
- - bigZbig   @no-name - ale co Ci daje jednokomórkowa tabela?   29.06.2006, 09:09:37
- - hwao   taka "jedno komorkowa" tabela jest po pr...   29.06.2006, 09:15:54
|- - MalCom   Cytat(hwao @ 29.06.2006, 08:15 ) taka ...   8.07.2006, 14:29:28
- - no-name   jak mi ktoś jeszcze powie, że rozwiązania typy ...   8.08.2006, 09:35:59
|- - mike_mech   Cytat(no-name @ 8.08.2006, 10:35 ) j...   8.08.2006, 10:02:34
|- - hwao   Cytat(no-name @ 8.08.2006, 10:35 ) j...   8.08.2006, 10:33:11
- - no-name   Tak, tu się zgodzę. Dają znacznie w...   8.08.2006, 10:36:30
|- - mike_mech   Cytat(no-name @ 8.08.2006, 11:36 ) T...   8.08.2006, 10:41:30
- - no-name   No wiesz... Jeśli masz układ na tabelkac...   8.08.2006, 17:59:48
- - hwao   Po prostu nie umiesz pojac tego, no i jak ja Ci to...   8.08.2006, 19:49:25
- - Turgon   No muszę tutaj przyznać częściowo rację fanom tabe...   8.08.2006, 19:51:41
|- - mike_mech   Cytat(Turgon @ 8.08.2006, 20:51 ) No musz...   8.08.2006, 19:57:58
- - Turgon   Według mnie zwyczajnie się odzwyczaiłeś .   8.08.2006, 20:02:51
- - no-name   mike_mech: sorry, ale poza stwierdzeniem mojej ni...   8.08.2006, 20:11:07
- - ens0re   Cytat(no-name @ 8.08.2006, 21:11 ) (...   8.08.2006, 20:27:14
- - no-name   Twoja wypowiedź byłaby prawdziwa w idealnym świeci...   8.08.2006, 20:43:00
- - kaczuuur   Witam Moim skromnym zdaniem budowanie stron opart...   8.08.2006, 21:05:41
- - ens0re   Może nie robiłem skomplikowanych układów i jakiś n...   8.08.2006, 21:21:54
- - mike_mech   Bzdury gadacie. Wszystko da się zrobic na wszystki...   8.08.2006, 21:58:36
- - revyag   CytatNajważniejszy jest projekt i zachowanie ...   8.08.2006, 22:17:00
- - occulkot   osobiscie juz z rok temu przenioslem sie na XHTML ...   9.08.2006, 19:42:01
- - s_w_ir   ...Refresh... Kilka spraw po przeczytaniu całego ...   10.09.2006, 02:08:31
- - gWd   Ponieważ jestem żywo zainteresowany tym ...   1.10.2006, 11:19:34
- - shpyo   http://shpyo.net/div.html - to do celów edukacyjny...   1.10.2006, 12:01:37
- - gWd   shpyo --> Nawet nie postarałeś się, żeby Twoja...   1.10.2006, 12:44:59
- - shpyo   lol, to sobie zmodyfikuj style. Przecież to trudne...   1.10.2006, 13:59:45
|- - gWd   Cytat(shpyo @ 1.10.2006, 14:59:45 ) Z...   1.10.2006, 14:11:36
- - shpyo   układ się zgadza, zachowanie równie...   1.10.2006, 14:46:21
|- - gWd   Cytat(shpyo @ 1.10.2006, 15:46:21 ) u...   1.10.2006, 14:58:37
|- - shpyo   Cytat(gWd @ 1.10.2006, 15:58:37 ) Wid...   1.10.2006, 15:04:48
- - s_w_ir   gWd daj prawdziwy layout a nie klocki to się wszys...   1.10.2006, 21:07:58
|- - gWd   Cytat(s_w_ir @ 1.10.2006, 22:07:58 ) ...   1.10.2006, 21:39:02
|- - mike_mech   Cytat(gWd @ 1.10.2006, 22:39:02 ) Jed...   2.10.2006, 09:37:08
|- - Marusz   Cytat(mike_mech @ 2.10.2006, 08:37:08...   2.10.2006, 18:50:29
- - MatheW   CytatChciałbym jednak dowiedzieć się czy jest możl...   1.10.2006, 21:49:26
- - s_w_ir   No właśnie chodzi o grafiki w tle które to udają ż...   1.10.2006, 21:58:32
- - slammer   Strony na DIVach wyglądają kozacko jak się patrzy ...   2.10.2006, 20:57:58
3 Stron V   1 2 3 >


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 15.08.2025 - 01:45