Perfection or Vanity

Project: Terminated

Blog nie jest już dalej prowadzony ani aktualizowany. Mimo tego, wpisy i komentarze są dalej dostępne. Możesz przeczytać pożegnalny wpis albo przejść do archiwum.

Medic!

08 września 2005

Dziś edukacyjnie, po przejrzeniu kodu nowego Allegro.

Divitis - nazwa choroby, z którą pierwszy raz spotkałem się w książce pana Zeldmana. Oznacza ono nadużywanie elementu <div> wraz z identyfikatorami i klasami. Zauważono, że część webmasterów migruje z <table> na <div>, używając ich nie tylko do layoutu - oni je upychają do wszystkiego. Czy to jest nagłówek, czy menu, czy podpis pod artykułem, czy stopka. Zapomnieli o nagłówkach, cytatach, akapitach, listach nie- oraz uporządkowanych. Koszmar.

Tagi wpisu:

Informacje i hiperłącza

To ja! Piotr Petrus 'Riddle'

Blog o projektowaniu zgodnych ze standardami stron internetowych.

Praktyczne przykłady, sztuczki CSS, sposoby obchodzenia błędów przeglądarek, lekki i nieinwazyjny JavaScript, użyteczny design, dostępność i skrypty użytkownika.

RSS

Informacje o wpisie

Napisał riddle 08 września 2005 o 23:56

Kategorie: Dostępność, HTML & Semantyka

Dodaj do:

Wpisy archiwalne

Archiwum miesięczne

Dzięki!

Dodaj bloga do Technorati Favorites Dodaj bloga do Del.icio.us Blog należy do sieci 10przykazań.com

Komentarze

  1. citizen 1 09 września 2005, 00:01

    Ja tam nie widzę różnicy pomiędzy cytatem czy div'em stylizowanym na cytat, czy też nagłówkiem a div'em z ustalonym przez nas rozmiarem czcionki.

  2. marcoos 2 09 września 2005, 00:04

    citizen: różnica jest _cholernie_ istotna. Zrobienie czegoś na divach z divitisem nie jest wcale lepsze niż na tabelach - jest dokładnie tym samym: używaniem danego narzędzia wbrew jego przeznaczeniu.

  3. riddle 3 09 września 2005, 00:04

    Google widzi. Bez strukturalnych znaczników masz coś pokroju pliku tekstowego dla takiego robota.
    Bez CSS widać.
    Łatwiej się w kodzie połapać.

    I najważniejsze: bo tak działa HTML, więc i XHTML też tak działa. Jak ktoś nie umie HTML, to niech się nie bierze za XHTML… takie moje zdanie.

  4. citizen 4 09 września 2005, 00:14

    Myślę że z div'ami jest o tyle łatwiej, że nie trzeba pamiętać nazw innych znaczników. A to że powinno używać się innych znaczników dlatego, że wtedy kod jest czytelniejszy dla kogoś kto zamiast oglądać stronę w przeglądarce podgląda ją w notatniku chyba nie jest najmocniejszym argumentem. Poza tym chyba nie sugerujesz, że używanie div'ów jest niezgodne z XHTML'em.

  5. riddle 5 09 września 2005, 00:16

    Oczywiście że jest niezgodne. :)

  6. riddle 6 09 września 2005, 00:22

    Rozszerzę to trochę:

    W takim przypadku oczywiście że jest niezgodne. Strukturalność, semantyka… gdyby tak nie było, do DTD wpisanoby tylko div | span zamiast dziesiątek innych znaczników.

    Po co? Bo XHTML jest językiem opartym na XML. Struktura ma odzwierciedlać sposób w jaki będziemy ją prezentować.

    Jak w XML napiszesz

    <znacznik1>T-Shirt: <znacznikklasaBC>czarny</znacznikklasaBC></znacznik1> to czy o to chodziło twórcom XMLa?

  7. citizen 7 09 września 2005, 00:23

    Validator pokazuje co innego.

  8. riddle 8 09 września 2005, 00:24

    Walidator zaakceptuje też alt="plik.jpg, 20KB". Sądzisz, że po to jest alt?

  9. citizen 9 09 września 2005, 00:27

    Myśle że dla kogoś kto ma wyłączone obrazki bo płąci za ściagane Kb to może być cenna informacja.

  10. riddle 10 09 września 2005, 00:31

    A wiesz do czego służy title?

    …

    I tak można w nieskończoność. Niestety nie wiesz co to HTML i liczę, że kiedyś sięgniesz po książkę Zeldmana bądź jakieś arty na necie.

    I sory, za wywyższający się ton, ale czas zrozumieć, że walidator nie wyznacza poprawności strony. Ludzie są jak owce… i dlatego Interię mamy w XHTML 1.1 serwowanym jako text/html. Chociaż Ty pewnie nie widzisz różnicy, bo validator.w3.org pokazuje Passed.

  11. citizen 11 09 września 2005, 00:44

    Title pokazuje się dopiero po najechaniu a alt widać od razu no, w końcu to alternatywa dla braku pliku.

    Z serwowanie jako text/html nie wiem czy dobrze kojarzę, ale czy chodzi o brak doctype'a ?

  12. ech 12 09 września 2005, 01:22

    citizen: Skoro nie rozumiesz abstrakcyjnie to na przykladze.
    HTML jest jezykiem opisu struktury dokumentu, wiesz co to jest struktura? Wyobraz sobie strone WWW gdzie naglowki (wlacznie z tytulem), paragrafy, listy (tez sie da) i caly ten strukturalny staff wrzucone sa w div-y, wylacznie w divy. Teraz wylacz CSS - widzisz strukture? Odpowiem za Ciebie: nie widzisz nic poza sekwencja tego staffu.
    Po to sa wlasnie naglowki, paragrafy, listy (i to trzech rodzajow), oznaczenia cytatow, zaznaczenia (strong, em), zeby ujac content w wyrazna, przejrzysta *strukture*, ktora ma byc widziana (ogolniej: przetwarzalna) i zrozumiala bez CSS i parametrow prezentacyjnych.
    Po to wlasnie jest HTML, a jesli tych kilkanascie naprawde niezbednych znacznikow to dla kogos jest za duzo do nauczenia niech sie zajmie czyms innym.
    Pierwszym etapem robienia dokumentu HTML jest tworzenie liniowego (zgodnego z przebiegiem tresci) ukladu umieszczonego wylacznie w srukturalnych znacznikach HTML (sprobuje wyliczyc, wcale nie ma ich tak wiele: H1-H6, P, listy (OL, UL, DL), A, IMG, EM, STRONG, CITE, TABLE (dla danych tabelarycznych wylacznie) i to wszystko (moglem cos pominac ze wzgledu na pore). I to trzeba zwalidowac i zobaczyc czy wyglada sensownie, a dopiero potem podzielic na bloki zawartosci (DIV, SPAN) i CSS-em zrobic layout i prezentacje.
    A validator nie jest wyrocznia w tej kwestii, nie odwoluj sie do niego jesli nie wiesz co robi. On sprawdza tylko formalna poprawnosc skladni, a nie sensownosc czy poprawnosc kodu.

  13. ech 13 09 września 2005, 01:41

    Jeszcze jedno, bylo oczywiste i dlatego pominalem, ale moze dla Ciebie nie jest to oczywiste.
    To wszystko co pisalem o HTML dotyczy XHTML w duzo wiekszym stopniu niz HTML. Tworzenie kodu XHTML gdzie pomijasz strukture danych jest sprzeczne z podstawowymi zalozeniami XHTML.
    I zapewnie to mial na mysli riddle. Jesli uwazasz ze mozna zrobic dokument (X)HTML samymi DIV-ami to czemu nie mozna by do tego uzyc pojedynczego IMG z mapa odnosnikow? Da sie to zrobic tak, zeby walidator powiedzial: OK. Ale przeciez nie o to w tym chodzi.

  14. Yano 14 09 września 2005, 02:16

    Ech…
    @citizen:
    1) Walidator to nie wyrocznia. On sprawdza tylko poprawność „montażu” strony – czy wszystkie śrubki podokręcane i czy nic nie odpada. Od zadbania o semantyczną część to jest twórca strony (koder). Ortografii walidator też nie sprawdza. To co? Można walić byki jeden po drugim?

    2) Owszem, atrybut alt jest alternatywą dla obrazka. Ale nie jest to miejsce na umieszczenie nazwy i rozmiaru pliku. Co da Ci taka informacja:
    [sf1.jpg, 12kb] [m1.gif, 3kb] [m2.gif, 2kb] [m3.gif, 3kb]
    Nic, oprócz tego, jak się nazywają obrazki (i ile „ważą”). A teraz popatrz na to:
    [Logo sklepu] [O nas] [Oferta] [Kontakt]
    Widzisz tę subtelną różnicę? I nie trzeba ściągać obrazków, żeby się połapać na stronie.

    3) Jeśli komuś trudno zapamiętać tych kilka znaczników to niech sie nie bierze za strony WWW. Aby być mechanikiem, księgowym, pilotem, kierowcą itd. trzeba ukończyć odpowiednie szkoły/kursy, jednak utarło się, że aby być programistą/webmasterem/grafikiem wystarczy kupić komputer (ew. dostać na komunię, urodziny, pod choinkę). Niestety szkoły webmasterskie nie istnieją, a to co uczą na wydziałach informatyki można OKDP. Nie zwalnia to jednak z obowiązku znajomości (x)html-a, css-a czy innych standardów jeśli ktoś aspiruje do tego zawodu. To, że wiem, który koniec lutownicy chwycić nie upoważnia mnie jeszcze do pracy w serwisie elektronicznym, choć na _własne_ potrzeby mogę skorzystać z tej umiejętności do przylutowania kabelka.

    I tyle samo mogę powiedzieć o przerażająco sporej ilości „webmasterów” zajmujących się tworzeniem „profesjonalnych” serwisów – wiedzą z której strony uderzać w klawiaturę, żeby się literki na ekranie pojawiły.

  15. Ktos 15 09 września 2005, 09:30

    "można OKDP" - fajne :) muszę zapamiętać :)

    Ale właśnie wczoraj tworzyłem ostatnie kawałki CSS dla pewnej strony internetowej. I się po przeczytaniu tego zacząłem zastanawiać, czy ciut rzeczywiście nie nadużyliśmy wraz z osobą, która się zajmowała tworzeniem kodu HTML divów i klas.

    Bo na przykład news jest opisany w taki sposób:

    <div class="newsitem">
    <div class="news_author">
    Adam Pilorz
    </div>
    <div class="news_data">
    08.09.05 14:08:17
    </div>
    <div class="news_text">
    <p>
    Witamy na super bajeranckiej nowej stronie.
    </p>
    </div>
    </div>

    Z drugiej strony wszystko inne jest zrobione już z użyciem <h(n)>, <p>, <code>, <blockquote> itp.

    Nie ma jakiegoś zautomatyzowanego sprawdzacza przeciwko divits? ;)

  16. citizen 16 09 września 2005, 11:09

    Dobra, dobra... Już zrozumiałem, dzięki.

    Pieprzone cwaniaki :P Też kiedyś będę tyle wiedział.

  17. riddle 17 09 września 2005, 11:45

    Ktos: zarzucaj do mnie jak coś. ;)
    A tak btw, to te miscelany można zrobić na <p class=""> albo <h4> | <h5> | <h6>. Wtedy bez CSS ładnie się to oddziela. :)

  18. Aule 18 09 września 2005, 12:42

    ktos: miałem podobny schemat newsów, ale został z niego tylko <div> najwyższy, wewnątrz same <h(n)>, <p> i jakiś <span> :). A to dzięki Riddle'owi :)

  19. Pastuch 19 09 września 2005, 16:46

    O rany! Ale zupa znacznikowa. Przeglądając na szybko widzę same tylko DIV i TD, czasami jakiś IMG.

    Straszne. Ciekawe skąd się biorą tacy "webmasterzy"?

    Dobrze chociaż, że nie chcą być "trendi" i nie dają doctype XHTML 1.1

  20. qvist 20 10 września 2005, 00:56

    OKDP - prosze mi to rozwinac

  21. Yano 21 10 września 2005, 01:11

    W przybliżeniu: do kitu ;)

  22. Aule 22 10 września 2005, 01:13

    Dokładniej: O Kant Du** P????? . Nie wiem jaki jest ostatni wyraz, ale te 3 słowa i tak juz obrazują znaczenie.

  23. Yano 23 10 września 2005, 01:16

    Potłuc! Kurka, a myślałem, że zdecydowana większość Polaków ma ten tekst świetnie opanowany. ;)

  24. Aule 24 10 września 2005, 01:18

    W moich stronach się mówi rozbić, przynajmniej to mi sie bardziej kojarzyło. Tego wyrażenia niezwykle rzadko używam, więc wybacie niewiedzę.

  25. qvist 25 10 września 2005, 01:23

    pierwsze 3 slowa rozszyfrowalem, ale czwartego bym sie nie domyslil :/

    wracajac do tematu - jesli chodzi o komercje, ktora niewatpliwie jest Allegro, to tutaj nie liczy sie semantycznisc kodu, czy inne szczytne idee, ale odwzorowanie pixel do pixela projektu grafika. nawet jakby ten design pocial i zakodowal czlowiek "swiadomy" to i tak dalej po przez "srajacy" zlym kodem "CMS" ten projekt nigdy by nie byl w 100% zgodny z zalecaniami W3C.

  26. riddle 26 10 września 2005, 07:10

    Człowiek wyjedzie na całą noc i mu już burdel robią z komentarzy. ;)

  27. Yano 27 10 września 2005, 12:15

    Umieść tekst: „Jeśli chcesz dać komentarz — kliknij w banner”. I możesz nie pracować. ;)

  28. faxeWylogowany 28 10 września 2005, 22:52

    apostrof musi odejść!
    http://tnij.org/apo

  29. samurai_jack 29 22 marca 2007, 10:51

    Wiem że nic nie wiem ;(

Dodaj komentarz

Do formatowania komentarzy używaj Textile (HTML nie działa). Szczególnie jeśli wklejasz większe fragmenty kodu. W razie niepewności użyj podglądu komentarza.

Wypowiedzi obraźliwe, infantylne oraz nie na temat będą moderowane – pisząc postaraj się zwiększyć wartość dyskusji.

Komentarze nie służą do wysyłania wiadomości albo informowania o błędach, itd. Chcesz coś mi napisać – skontaktuj się.