[css, html, wcag] Juiste tags voor juiste doeleinden *

[Rexomnium]

Ik heb een probleempje. Met enkele kennissen ben ik bezig om een website op te zetten. Ik doe dit tevens in het kader van mijn opleiding. Ik volg een studie mediamanagement en in het huidige project wordt de student vrijgelaten met het kiezen van een onderwerp voor dit betreffende project.

Goed we gaan een website bouwen.

Het is een website die artikelen over drie onderwerpen aanbiedt. Games, DVD en Anime. De bedoeling is dat de website kan worden toegespitst op een specifieke doelgroep. Dat betekent dus dat mensen ervoor kunnen kiezen om alleen de artikelen over games of alleen de artikelen over de andere twee onderwerpen te zien.

Tevens is het de bedoeling dat de bezoeker zijn of haar eigen layout kan selecteren en in de toekomst willen we zelfs in staat stellen om hun layout zelf te ontwerpen.

Ik ben niet alleen de mediamanager in dit project, want omdat ik redelijk overweg kan met HTML ben ik ook verantwoordelijk voor de uiteindelijke layout in de browser.

Ik heb ervoor gekozen om de gehele pagina in divs te ontwerpen. Naar mijn mening is het straks dan een piece of cake om de bezoekers hun eigen ontwerp te laten maken immers, er is maar één bestand om te veranderen.

De layout is bijna klaar en hij is hier te aanschouwen. Na een tijdje geëtterd met CSS te hebben kan ik redelijk trots zijn op het resultaat. De hele website is ontworpen in CSS en met behulp van divs in elkaar gezet.

De CSS en HTML zijn beide W3C certified.

Goed, so far so good.

Het content management systeem kan ik niet zelf maken. Ik heb geen kennis van PHP. Gelukkig hebben we een bedrijfje gevonden van enkele jonge, enthousiaste mensen die voor de ervaring en reclame graag mee willen doen. Het probleem is alleen dat ze mijn pagina niet goed vinden.

Zij vinden de keus voor divs niet goed. Volgens hen de website dan alleen op de nieuwere browsers correct te bezichtigen.

Nu heb ik de pagina getest in IE6.0, Mozilla Firebird 0.6, Opera 7.11 en IE5.0 op win98.

Op al deze browser is de website goed te bezichtigen. Alleen in IE5.0 geeft hij nog wat problemen, maar dat is inmiddels ook al opgelost.

Nu heb ik enkele vragen:
- Is deze pagina goed gemaakt, of ben ik veel te ver gegaan met divs.
- Is er ergens op internet iets te vinden dat voor eens en altijd een eind maakt aan de discussie tables vs divs?
- Heeft dat bedrijfje gelijk en moet ik meer met tables gaan werken?
- Hij doet het op vier verschillende browsers met diverse releasedates, op welke browsers zou hij het niet goed doen?

* het foutje in de header met die reviewplaatjes die over dat balkje staan is geen probleem. Ik heb die div een achtergrond gegeven en die is een beetje verschoven. Dat is inmiddels opgelost.

Pfff ik heb typkramp

[Genoil]

ik vind het prachtig met al die divs. daar zijn ze voor. tables zijn voor data die in drukvorm ook in een tabelvorm gepresenteerd zouden worden. tables kan je ook wel gebruiken, maar kunnen op sommige browsers bijna net zoveel problemen veroorzaken als divs. dat je het op al die browsers goed werkend hebt is toch prima, tenzij je echt 100% zeker al die gebruikers wilt bereiken met oude rommel (valt niet bepaald binnen je doelgroep).

waar mauwen die php-ers eigenlijk over? een beetje CMS interesseert het geen holio wat voor templates die uitbraakt.

[marty]

neu....ik vind het juist erg strak gedaan zo :-) mijn complimenten. Met browsercompatibiteit heb je altijd te campen. wat je ook doet. Goed..met tabellen loop je minder snel het risico dat je layout niet klopt in oudere browsers, maar je zult alsnog moeten gaan testen. Wat je je af moet vragen is wie je doelgroep is en daarop je eisen qua browser afstemmen. Zo te zien is die doelgroep redelijk 'hip' en mag je dus wel van een overgrootte meerderheid aan nieuwe browsers uitgaan. Min IE 5.0 zeg maar. Dus als ie het daar in doet dan zou ik tevreden zijn.

Ik weet wel waarom die jongens zo moeilijk doen. Ik php zelf en je bent nu eenmaal gewend om met tabellen te klooien. Ik hield me tot een paar dagen terug ook nooit écht bezig met css (alleen beperkt) en die gasten waarschijnljk ook niet. En dan moeten ze in hun dynamisch gegenereerde code ineens met divjes enzo gaan werken. Daar zijn ze waarschijnlijk van geschrokken.

[Rexomnium]

Bedankt voor de snelle replies.

Jullie zijn er zo te zijn vrij lovend over. Dat is erg mooi, maar dat bedrijfje dus niet. Sterker nog; ze willen óf tables óf stoppen met de samenwerking. Dat is redelijk K met peren, want waar vind ik in godsnaam mensen die gratis een CMS in elkaar willen zetten (niet dus).

Wat ik nodig heb is een aantal ijzersterke argumenten waarmee ik hen om de oren kan slaan.

Hebben jullie misschien tips voor die jongens. Dat ik ze daarmee kan overhalen. Ik weet zelf weinig van PHP, maar zij werken met sessions en dat schijnt niet XHTML certified te zijn. Dat is zonde van mijn werk.

Ik heb ze al aangeraden om dan een templatesysteem te ontwikkelen zodat we zélf de layout in het systeem kunnen proppen, maar dat vinden ze ook weer niet zo'n goed idee.

Plz help

[Verwijderd]

Get my point?

Ja, je bent veel te ver gegaan met div's. Ik heb er ooit eens een -bijna parodisch- topic over geopend.

Div's zijn niet heilig. Div's zijn nietig. Div's zijn HTML elementen voor als je echt niets beters hebt. Het zijn left-overs. Zo, ik hoop dat je nu al anders gaat kijken naar divs

Je kunt ze wel gebruiken, maar je zult ze voornamelijk nodig hebben om een basis-structuur op te zetten. Je moet gewoon gaan analyseren wat je allemaal hebt. Ik zie een soort 'header' met daarin een banner, wat tabs, je titel/logo en wat DVD's. Ik zie duidelijk links een soort navigatiesysteem met gecategoriseerde links. Ik zie korte stukjes uit artikelen, tekst dus, met kleine afbeeldingen. En ik zie nog een apart stukje om in te kunnen loggen en een banner en een artikeltje.

De opzet:

HTML:

<div id="header">
</div>
<div id="navigation">
</div>
<div id="content">
   <div id="specialcontent">
   </div>
</div>

De navigatie links kun je mooi doen met unordered lists (ul) bijvoorbeeld. Ik zou misschien zelfs een definition list gebruiken, dan wordt het zoiets:

HTML:

<dl>
   <dt>Nieuws Headlines</dt>
   <dd>
      <ul>
         <li><a href="">12:00 Half Life II aangekondigd (PC)</a></li>
         <li><a href="">11:23 Gamecube doet het beter... (GC)</a></li>
         <li><a href="">11:13 Harrison Ford spreekt zich... (PS2)</a></li>
      </ul>
   </dd>
   <dt>(P)reviews</dt>
   <dd>
      <ul>
         <li><a href="">23/06 Half Life II aangekondigd (PC)</a></li>
         <li><a href="">23/06 Gamecube doet het beter... (GC)</a></li>
         <li><a href="">22/06 Harrison Ford spreekt zich... (PS2)</a></li>
      </ul>
   </dd>
</dl>

De hoodstructuur van de artikelen kun je ook veel netter doen door gebruik te maken van headings en paragrafen:

HTML:

<h1>Dit is de titel van het nieuwsbericht</h1>
<p>Hier komt een korte intro van het betreffende nieuwsbericht.
Dit kort stukje tekst zal ongeveer uit drie regeltjes bestaan.
Dit wordt automatisch in PHP gedaan.
De tekst zal uitgelijnd (justify) worden...</p>
<a href="">Lees meer</a>

Als je een beetje met HTML hebt aangegeven wat voor content het ongeveer is, bekijk de pagina dan eens zonder stylesheet. Nu is het wel enigszins om aan te zien, maar het kan gewoon stukken beter.

[ Voor 29% gewijzigd door Verwijderd op 26-06-2003 23:23 ]

[drm]

* drm met Cheatah eensch isch

zie ook [rml]drm in "[ css] divjes 'auto' laten uitrekken"[/rml]

Overigens vraag ik me af wat nou precies de reden is dat die lui van het CMS zo graag met tables willen werken? Then again: wat hebben de tabels in vredesnaam met het CMS te maken? Daar zit al iets niet helemaal knorr, zogezegd

Dus: laat ze eens een paar argumenten geven om tabellen te gebruiken.

[Rickets]

http://www.webbuilderconf.../interview_holzschlag.asp
In dit stuk staat wel netjes uitgelegd waarom de werkwijze van veel ontwikkelaars niet is zoals het bedoeld is. Persoonlijk zie ik geen problemen, de keuze tussen table of andere elementen moet geen verschil maken voor een CMS. Ik denk juist dat het makkelijker wordt, aangezien je document beter gestructureerd is (netjes met h1 enzo, zie hierboven ).

Wat betreft sessions en XHTML, dat ligt aan de instellingen van PHP. Dat is dus geen reden om geen XHTML-valid document te maken.

[2]

Je hebt goed door dat dit soort shit inderdaad niet met tabellen gedaan moet worden, wat genoil zegt, daar zijn ze niet voor. Op zich hebben ze wel een punt dat het in tabellen nog altijd 'veiliger' werken is, maar de slimmen onder ons doen het niet meer, omdat de inefficiëntie te groot is tegenover het 'voordeel' van de 3 bezoekers per jaar die met hun archaïsche software conservatief komen doen. Dat er nadelen van div's tegenover tabellen voor een content management systeem zouden zijn is zover ik het kan zien met mijn ervaring aan zowel de voor- als de achterkant van het web absolute bullshit.

Wat ik wel vind is dat als je op deze (correcte) manier gaat werken, je het wel meteen helemaal goed moet doen. Je kent je class-namen e.d. nog niet helemaal correct toe; je moet opletten dat je elementen en hun benamingen toepast op zo'n manier dat ze aangeven wat voor data ze bevatten; niet wat hun, sja, 'visuele functie' is. Als jij het straks mogelijk wilt maken dat mensen hun eigen layout keizen. slaat een class 'leftmenulinks' natuurlijk nergens op, omdat dat gedeelte van je content in een andere layout best rechts moet kunnen staan.

Als je hier meer over wilt lezen, is dit wel een redelijk artikel:

http://www.naarvoren.nl/artikel/betekenisvolle_markup.html

[Rexomnium]

Bedankt cheatah, 2 en anderen.

Ik heb naar beide genoemde personen geluisterd en ben bezig om de structuur aan te passen. Ik geef de boxelementen een logische naam (leftside wordt navigatie, etc) en ik wil dat <li> en zo gebruiken om het menu overzichtelijk te maken.

Met dat laatste loop ik nu wel tegen enkele problemen aan. Nu ik dat heb gebruikt verschuift de gehele inhoud van die tags een heel stuk naar rechts. Ik heb het wel aangegeven in de css, maar het doet niet wat ik wil dat het doet.

Cascading Stylesheet:

dl
        {
        background-color: #fff;
        width: 247px;
        }
                
dt
        {
        color: #000;
        width: 247px;
        background-color : transparent;
        border-right: 1px solid #333;
        }
        
dd
        {
        color: #000;
        width: 247px;
        background-color : transparent;
        border-right: 1px solid #333;
        }

ul
        {
        list-style: none;
        list-style-position: inline;
        }       
        
li
        {
        list-style-position: inline;
        color: #000;
        background-color: #DBDBE2;
        padding-left: 5px;
        padding-right: 5px;
        border-bottom: 1px dashed #D6BEDA;
        padding-bottom: 1px;
        font-size: 10px;
        }

HTML:

<div id="navigatie">
        <dt><a href="#" class="leftmenutabs">Nieuws Headlines</a></dt>
            <dd>
                <ul>        
                    <li>12:00 <a href="#" class="leftmenulinks">Half Life II aangekondigd</a>(<span style="color: #609; font-weight: bold">PC</span>)</li>
                    <li>11:23 <a href="#" class="leftmenulinks">Gamecube doet het beter...</a>(<span style="color: #00F; font-weight: bold">GC</span>)</li>
                    <li>11:13 <a href="#" class="leftmenulinks">Harrison Ford spreekt zich...</a>(<span style="color: #333; font-weight: bold">PS2</span>)</li>
                    <li>11:05 <a href="#" class="leftmenulinks">Ghostworld begint nieuwe...</a>(<span style="color: #090; font-weight: bold">XBOX</span>)</li>
                    <li>11:02 <a href="#" class="leftmenulinks">Dit is ook een headline</a>(<span style="color: #F60; font-weight: bold">GBA</span>)</li>
                    <li>10:45 <a href="#" class="leftmenulinks">Neuken doe je zo...</a>(<span style="color: #960; font-weight: bold">DVD</span>)</li>
                    <li>10:35 <a href="#" class="leftmenulinks">Red Dragon uitgebracht...</a>(<span style="color: #F00; font-weight: bold">Anime</span>)</li>
                    <li>12:00 <a href="#" class="leftmenulinks">Half Life II aangekondigd</a>(<span style="color: #609; font-weight: bold">PC</span>)</li>
                    <li>11:23 <a href="#" class="leftmenulinks">Gamecube doet het beter...</a>(<span style="color: #00F; font-weight: bold">GC</span>)</li>
                    <li>11:13 <a href="#" class="leftmenulinks">Harrison Ford spreekt zich...</a>(<span style="color: #333; font-weight: bold">PS2</span>)</li>
                    <li>11:05 <a href="#" class="leftmenulinks">Ghostworld begint nieuwe...</a>(<span style="color: #090; font-weight: bold">XBOX</span>)</li>
                    <li>11:02 <a href="#" class="leftmenulinks">Dit is ook een headline</a>(<span style="color: #F60; font-weight: bold">GBA</span>)</li>
                    <li>10:45 <a href="#" class="leftmenulinks">Neuken doe je zo...</a>(<span style="color: #960; font-weight: bold">DVD</span>)</li>
                    <li>10:35 <a href="#" class="leftmenulinks">Red Dragon uitgebracht...</a>(<span style="color: #F00; font-weight: bold">Anime</span>)</li>
                    <li>12:00 <a href="#" class="leftmenulinks">Half Life II aangekondigd</a>(<span style="color: #609; font-weight: bold">PC</span>)</li>
                </ul>
            </dd>
</div>

Zoals je kunt zien is dat dit dus niet echt helemaal correct is. Wat doe ik nu fout? Volgens deze site kan ik weinig andere waardes ingeven voor de gebruikte proporties.


Trouwens... Is het juist dat ik alleen maar globale <li>'s, <ul>'s, <dt>'s, etc. kan aangeven en ze niet alleen lid kan maken van #navigatie.
Dat ik dus #navigatie.ul krijg...

[ Voor 22% gewijzigd door Rexomnium op 27-06-2003 10:37 ]

[drm]

Zet de margin-left van je li en van je ul eens op 0 (en evt. ook van die andere elementen)

Waarschijnlijk voorbarig, maar je kunt de stijlen voor die elementen overigens het best ook contextual definieren:

Cascading Stylesheet:

div#navigatie dl {

}

div#navigatie dt {

}

etcetera. Je wilt tenslotte dat die regels alleen gelden voor de elementen die in de navigatie voorkomen

Voor de links kun je de classes dan ook het beste helemaal weghalen, want het gaat er tenslotte om waar ze staan, wat voor properties ze krijgen

Cascading Stylesheet:

div#nagivatie dt a {
   /* die in de dt staat */
}

div#navigatie dt li a {
   /* die in de li staat */
}

Ga dan wel na dat je voor de 2e de styleproperties van de eerste zult overerven , omdat de 'a' elementen die in de li's voorkomen ook in de dt staan

Je kunt daar volgens CSS2 dan ook eigenlijk beter

Cascading Stylesheet:

div#navigatie dt > a {
   /* een a die een directe child is van een dt */
}

voor gebruiken, maar IE ondersteunt dat (nog) niet goed

tot slot kun je hetzelfde doen voor de span's in de li's

---

edit:

Trouwens... Is het juist dat ik alleen maar globale <li>'s, <ul>'s, <dt>'s, etc. kan aangeven en ze niet alleen lid kan maken van #navigatie.
Dat ik dus #navigatie.ul krijg...

je had er dus al aan gedacht Nou, zo dus

[ Voor 12% gewijzigd door drm op 27-06-2003 10:44 ]

[Rickets]

Voor de span gebruik je best em of strong (ervan uitgaand dat je de tekst in de span een nadruk wilt geven).

[Rexomnium]

drm schreef op 27 June 2003 @ 10:43:
Zet de margin-left van je li en van je ul eens op 0 (en evt. ook van die andere elementen)

Dat werkt niet in mozilla firebird. Ik moet de margin-left dan op -35 zetten en in IE wordt het helemaal door elkaar gegooid...

Daarnaast krijg ik ook geen border aan de rechterkant.

[ Voor 8% gewijzigd door Rexomnium op 27-06-2003 11:26 ]

[drm]

Je hebt overigens je dt ook niet afgesloten...

edit:

* drm kijkt weer 's met z'n aars
^/edit

* drm gaat ff kijken wat de oplossing is

edit:

Ik zie dat je het dl element vergeten bent te definieren. Je kunt dan, als je niet nog meer in je navigatie wilt zetten, die hele div zelfs wel achterwege laten:

HTML:

<dl id="navigation">
   <dt> ... </dt>
   <dd>
        <ul>
            ....
        </ul>
    </dd>
</dl>

Het is in dergelijke gevallen het best om even wat opvallende border-kleurtjes en background-kleurtjes in te stellen zodat je er achter komt welk(e) element(en) precies de ruimte veroorza(a)k(t)en. In dit geval was het dus niet de ul of de li

[ Voor 87% gewijzigd door drm op 27-06-2003 12:10 ]

[Rexomnium]

Waarom moet ik eigenlijk dat <ul> en <li> gebruiken, want ik zie dat het met dit ook werkt:

HTML:

<dl id="navigatie">
    <dt>Kopje</dt>
    <dd>test 1</dd>
    <dd>test 1</dd>
    <dd>test 1</dd>
    <dd>test 1</dd>
    <dd>test 1</dd>
</dl>

Voorbeeld kun je hier zien.

[ Voor 38% gewijzigd door Rexomnium op 27-06-2003 12:53 ]

[drm]

Goeie vraag. Daar is niks op tegen afaik mag het volgens de specificaties ook gewoon.

edit:

Het nadeel is wel dat je dan geen container hebt om je dd's heen. Daar kan je dan bijvoorbeeld wat lastiger 1 achtergrondkleur met een bordertje omheen zetten, o.i.d.

[ Voor 51% gewijzigd door drm op 27-06-2003 13:05 ]

[djluc]

Ik vind het een interessant topic worden!
Maar even nu serieus hè, waar hebben we het nou eigenlijk over. Er zijn een stel PHP programmeurs die zich gaan bemoeien met zaken waar ze zich helemaal niet mee moeten bemoeien. Uiteindelijk doen we met z'n allen dus toch wat hij zegt.

Verder is het maken van een cms inderdaad niet zo heel eenvoudig maar als je op zoek gaat dan denk ik dat je nog best wel wat programmeurs zult vinden die je willen helpen. Bijvoorbeeld als ze een pagina krijgen op jouw site met een verhaaltje over het CMS en hun naam er bij.

[Rexomnium]

djluc schreef op 28 juni 2003 @ 11:01:
Ik vind het een interessant topic worden!
Maar even nu serieus hè, waar hebben we het nou eigenlijk over. Er zijn een stel PHP programmeurs die zich gaan bemoeien met zaken waar ze zich helemaal niet mee moeten bemoeien. Uiteindelijk doen we met z'n allen dus toch wat hij zegt.

Verder is het maken van een cms inderdaad niet zo heel eenvoudig maar als je op zoek gaat dan denk ik dat je nog best wel wat programmeurs zult vinden die je willen helpen. Bijvoorbeeld als ze een pagina krijgen op jouw site met een verhaaltje over het CMS en hun naam er bij.

Dank je, djluc...

Hey drm, ik krijg nu nog steeds een probleem. Als ik de padding wil instellen om bijvoorbeeld de tekst in de kopjes een stukje naar rechts te verschuiven, verschuift in Mozilla de hele kop een stuk naar rechts. Dat is uiteraard niet de bedoeling.

Ik heb nu ook de <li> en <ul> geprobeerd, maar wat ik ook doe; het blijf óf in IE óf in Mozilla fout lopen. De hele inhoud wordt een flink eind naar rechts verschoven.

Ik moet wel zeggen (oh ja, van wie?) dat de oplossing met die kleine tags zoals <dd>, <dt>, <li>, etc. een stuk mooier is dan louter divs gebruiken. De code wordt een stuk overzichtelijker. Bedankt dus daarvoor.

Misschien dat een modje zo vriendelijk wilt zijn om de titel enigszins aan te passen? (edit: dank je, Cheatah) Dan kunnen we weer meer on-topic blijven. Ik heb nu wel door dat ik meer gelijk heb dan hen (al heb ik in de oude only-div versie nog niet helemaal alles goed gedaan), maar ik wil ook dus graag weten hoe ik mijn code zo goed mogelijk kan maken.

Alvast en wederom bedankt

Ik wil trouwens nog steeds een overzichtslijstje met daarin de voordelen van divs ten opzichte van tables. Ik kan uiteraard wel een paar punten zelf verzinnen, maar voor de volledigheid is dat mooier.(edit: dank je, Cheatah)

[ Voor 12% gewijzigd door Rexomnium op 28-06-2003 12:25 . Reden: Laatste alineaatje toegevoegd ]

[Verwijderd]

1. Refereer naar de HTML reccommendation

Zij horen deze documentatie te kennen als ze jou durven te zeggen wat je wel en niet moet doen. In de inleiding mbt. tabellen wordt expliciet verteld dat je geen tabellen moet misbruiken.

2. Refereer naar de WCAG

Veel, veel informatie, maar het wordt je vanzelf duidelijk waarom je HTML netjes moet gebruiken zoals het bedoeld is.

[drm]

Hey drm, ik krijg nu nog steeds een probleem. Als ik de padding wil instellen om bijvoorbeeld de tekst in de kopjes een stukje naar rechts te verschuiven, verschuift in Mozilla de hele kop een stuk naar rechts. Dat is uiteraard niet de bedoeling.

Ik kom er net achter dat IE standaard voor een ul een text-indent van een paar pixels heeft.

Als je die expliciet op 0 zet, inclusief de padding en de margin, dan staat alles helemaal links. Wil je dan de onderdelen in een dd een stukje naar rechts hebben, zet dan de padding van de dd op het aantal pixels (of andere eenheid).

Nogmaals: hier kom je het beste uit door erachter te komen welke elementen nou precies de ruimte veroorzaken, door bijvoorbeeld even in elke rule stap voor stap een regel

Cascading Stylesheet:

border:3px solid #f00;

te zetten. 't Is ook af en toe wel handig om dan even door de css reference op w3schools te bladeren om te zien welke css properties er ook alweer allemaal voor de ruimte kunnen zorgen (of andere issues).

Ga daarbij nooit uit van default waardes van browsers want die verschillen (klaarblijkelijk) nog al 's

[coubertin119]

Deze mag je in je lijstje zetten, tegen het gebruik van tables.

Browsers voor blinden, die dus alles voorlezen, gaan er vanuit dat tables gebruikt worden om het structeren van data. Bijvoorbeeld het lessenrooster van een school oid. Doordat ze ervan uitgaan dat tables gebruikt worden voor gestructureerde data, gaan ze die methode ook toepassen bij sites waar tables gebruikt worden voor de lay-out, wat dus niet echt handig is voor diegene die met een browser voor blinden surft .

Ook het gebruik van colgroup, summary en aanverwanten zijn aan te raden als er ook maar een kleine kans bestaat dat een blinde je site bezoekt, hiervoor verwijs ik naar http://www.w3.org/TR/WCAG...ifying-table-rows-columns waar duidelijk uitgelegd staat hoe een speechbrowser tables "rendert" en waarom deze attributen handig kunnen zijn. En beeldt je dan maar eens in hoe een speechbrowser een site met tables zou "renderen" .

_{Als je echt een lijstje hiervan wil maken, ik wil gerust helpen}

[ Voor 3% gewijzigd door coubertin119 op 28-06-2003 12:49 ]

[djluc]

Als je zo naar de onderwerpen op de site, dvd films, videogames kijkt denk ik niet dat de site echt voor blinden bedoeld zal zijn. Alleen voor het nieuws misschie maar dat is ergens anders ook nog wel te vinden.

[coubertin119]

Als iets ergens anders te vinden is, is 't nog geen reden om het niet toegankelijk te maken voor blinden/slechtzienden. Alles is wel ergens te vinden, deze discussie is waarschijnlijk al ettelijke andere keren gevoerd op andere discussiefora, slinger anders eens de Google aan en tuf wat rond in het grote World Wide Web waar je je nu op bevindt .

Een forum als GoT is er zeker ook nog ergens anders te vinden, al zal je wel dan Engels moeten gaan lezen/schrijven, een site als de zijne, die er imho erg goed uitziet, en mits de nodige aanpassingen ook 't erg goed zal doen in speechbrowsers kan een goede uitvalsbasis worden voor blinden die wat willen weten over de nieuwste games etcetera. Er zijn zelfs games voor blinden, zulke content kan hij dan toch ook gaan aanbieden ?

/offtopic .

[Rexomnium]

coubertin119 schreef op 28 June 2003 @ 12:48:
Deze mag je in je lijstje zetten, tegen het gebruik van tables.

Browsers voor blinden, die dus alles voorlezen, gaan er vanuit dat tables gebruikt worden om het structeren van data. Bijvoorbeeld het lessenrooster van een school oid. Doordat ze ervan uitgaan dat tables gebruikt worden voor gestructureerde data, gaan ze die methode ook toepassen bij sites waar tables gebruikt worden voor de lay-out, wat dus niet echt handig is voor diegene die met een browser voor blinden surft .

Ook het gebruik van colgroup, summary en aanverwanten zijn aan te raden als er ook maar een kleine kans bestaat dat een blinde je site bezoekt, hiervoor verwijs ik naar http://www.w3.org/TR/WCAG...ifying-table-rows-columns waar duidelijk uitgelegd staat hoe een speechbrowser tables "rendert" en waarom deze attributen handig kunnen zijn. En beeldt je dan maar eens in hoe een speechbrowser een site met tables zou "renderen" .

Dat zou inderdaad een goed argument zijn als de website een onderwerp aanbiedt, dat ook blinden interesseert. Helaas denk ik dat nieuws met betrekking tot visuele zaken als DVD-films, games en animination die mensen weinig tot absoluut niet kunnen interesseren.

Maar als je gewoon objectief naar het waarom van CSS kijkt, is het een uitstekend argument.

_{Als je echt een lijstje hiervan wil maken, ik wil gerust helpen}

De dingen die ik zelf heb verzonnen zijn:
- De code is overzichterlijker;
- Website wordt sneller (omdat er minder code nodig is en omdat browsers dergelijke HTML sneller renderen;
- Het is eenvoudig om snel van layout te veranderen. Daarbij is het veranderen van de gehele look en feel v/d website eenvoudig te veranderen;
- Tabellen zijn eenvoudigweg niet voor dergelijke layoutdoeleinden bedoeld;
- Betere controle over de posities van de verschillende elemten in de website;
- Zoekmachines kunnen er beter mee omgaan (?);
en jouw punt erbij:
- Website is ook meer voor blinden geschikt.

Wie weet er meer?

coubertin119 schreef op 28 June 2003 @ 13:01:
Als iets ergens anders te vinden is, is 't nog geen reden om het niet toegankelijk te maken voor blinden/slechtzienden. Alles is wel ergens te vinden, deze discussie is waarschijnlijk al ettelijke andere keren gevoerd op andere discussiefora, slinger anders eens de Google aan en tuf wat rond in het grote World Wide Web waar je je nu op bevindt .

Een forum als GoT is er zeker ook nog ergens anders te vinden, al zal je wel dan Engels moeten gaan lezen/schrijven, een site als de zijne, die er imho erg goed uitziet, en mits de nodige aanpassingen ook 't erg goed zal doen in speechbrowsers kan een goede uitvalsbasis worden voor blinden die wat willen weten over de nieuwste games etcetera. Er zijn zelfs games voor blinden, zulke content kan hij dan toch ook gaan aanbieden ?

/offtopic .

Ergens heb je wel gelijk en ik heb ook wel gezocht, maar ik voer deze discussie nu liever op GoT. Dan hebben de mensen er hier ook nog wat aan

drm schreef op 28 June 2003 @ 12:32:
[...]

Ik kom er net achter dat IE standaard voor een ul een text-indent van een paar pixels heeft.

Als je die expliciet op 0 zet, inclusief de padding en de margin, dan staat alles helemaal links. Wil je dan de onderdelen in een dd een stukje naar rechts hebben, zet dan de padding van de dd op het aantal pixels (of andere eenheid).

Nogmaals: hier kom je het beste uit door erachter te komen welke elementen nou precies de ruimte veroorzaken, door bijvoorbeeld even in elke rule stap voor stap een regel

Cascading Stylesheet:

border:3px solid #f00;

te zetten. 't Is ook af en toe wel handig om dan even door de css reference op w3schools te bladeren om te zien welke css properties er ook alweer allemaal voor de ruimte kunnen zorgen (of andere issues).

Ga daarbij nooit uit van default waardes van browsers want die verschillen (klaarblijkelijk) nog al 's

Ga ik thuis even proberen. Helaas zit ik nu op mijn werk en heb hier geen tijd voor te HTML-en

Dank je

Reactie op die gozer onder mij
Is een goed idee. Heb alleen niet de beschikking over MSN hier en ik kan ze dus niet bereiken.

Maar ik stuur ze wel even een mailtje.

[ Voor 3% gewijzigd door Rexomnium op 28-06-2003 13:34 ]

[drm]

Ik zou het wel interessant vinden als de jongens die jouw CMS gaan maken in deze discussie deel willen nemen Kan je ze niet uitnodigen om hier te registreren om hun eigen standpunten te verdedigen?

[Verwijderd]

marty schreef op 26 June 2003 @ 23:07:
Ik weet wel waarom die jongens zo moeilijk doen. Ik php zelf en je bent nu eenmaal gewend om met tabellen te klooien. Ik hield me tot een paar dagen terug ook nooit écht bezig met css (alleen beperkt) en die gasten waarschijnljk ook niet. En dan moeten ze in hun dynamisch gegenereerde code ineens met divjes enzo gaan werken. Daar zijn ze waarschijnlijk van geschrokken.

Ik ben dus een van die php'ers, en ik wil even zeggen dat Marty gelijk heeft.
Ik heb geen ervaring met divs, ik ben zelf bekend met de standaard html tags.
Het probleem was voor mij ook dat ik al best ver was in het script en toen moest er ineens persee een template systeem komen, ik heb nog nooit met een template systeem gewerkt, ik zou het wel kunnen gaan uitzoeken allemaal maar er was een deadline van 3 weken en de eissen waren vrij hoog, dus om dan ook nog de hele code te gaan vervormen voor een template systeem zou veel te veel tijd in beslag nemen. En aangezien ik dus niet bekend ben met divs wou ik gewoon op mijn manier (met tables) werken. En dan kan iedereen wel gaan zeggen dat tables slecht zijn voor het maken van een layout, zelf heb ik er geen problemen mee, er zijn zat grote bekende sites die met tables werken en ik heb er zelf nog niet echt problemen mee gehad. En dat iedereen dan zegt dat de code onoverzichtelijk word, dat vind ik ook helemaal nergens op slaan, als je het gewoon netjes neerzet dan kun je het makkelijk terug vinden. Ik heb toen gezegd zoek iemand die gewoon op jou manier wil meewerken en die meer ervaring heeft.

[coubertin119]

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
De dingen die ik zelf heb verzonnen zijn:
- De code is overzichterlijker;

Zo'n groot verschil vind ik 't niet, maar de scheiding tussen lay-out en data wordt, en dat is de bedoeling . HTML is (in mijn opinie) een taal om data te bevatten, en om aan te geven wat er met die data moet gebeuren. CSS is nodig om dit geheel een mooi uiterlijk te geven, als je tables gebruikt is de scheiding tussen data en opmaak er niet meer, en dat wil ik (en andere mensen met gezond verstand) niet .

---

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
- Website wordt sneller (omdat er minder code nodig is en omdat browsers dergelijke HTML sneller renderen;

Zo'n groot verschil zit er niet in denk ik . Alleen kunnen divs op voorhand gerenderd worden, als de andere divs nog geladen moeten worden, terwijl een table helemaal op 't einde gerenderd wordt, dat is een klein voordeel voor het gebruik van divs .

---

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
- Het is eenvoudig om snel van layout te veranderen. Daarbij is het veranderen van de gehele look en feel v/d website eenvoudig te veranderen;

Wat je hiermee bedoelt vat ik niet, maar dat zal dan weer wel mijn schuld zijn . Divs zijn wel makkelijker van plaats te veranderen ja, gewoon wat cijfertjes aanpassen in je CSS en je bent er, bij tables heb ik geen flauw idee hoe 't te veranderen, aangezien ik nog nooit een lay-out met tables gemaakt heb .

---

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
- Tabellen zijn eenvoudigweg niet voor dergelijke layoutdoeleinden bedoeld;

Geen opmerkingen, is gewoon zo, en dat bewijzen we met dit alles

---

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
- Betere controle over de posities van de verschillende elemten in de website;

Zie twee punten terug .

---

quote: http://gathering.tweakers...message/18173145#18173145

RexomniuM
- Zoekmachines kunnen er beter mee omgaan (?);

Dat zijn frames, waar zoekmachines niets van begrijpen . Volgens mij boeien tables/divs niets in zoekmachines

---

Verwijderd schreef op 28 juni 2003 @ 14:20:
[...]


Ik ben dus een van die php'ers, en ik wil even zeggen dat Marty gelijk heeft.
Ik heb geen ervaring met divs, ik ben zelf bekend met de standaard html tags.
Het probleem was voor mij ook dat ik al best ver was in het script en toen moest er ineens persee een template systeem komen, ik heb nog nooit met een template systeem gewerkt, ik zou het wel kunnen gaan uitzoeken allemaal maar er was een deadline van 3 weken en de eissen waren vrij hoog, dus om dan ook nog de hele code te gaan vervormen voor een template systeem zou veel te veel tijd in beslag nemen. En aangezien ik dus niet bekend ben met divs wou ik gewoon op mijn manier (met tables) werken. En dan kan iedereen wel gaan zeggen dat tables slecht zijn voor het maken van een layout, zelf heb ik er geen problemen mee, er zijn zat grote bekende sites die met tables werken en ik heb er zelf nog niet echt problemen mee gehad. En dat iedereen dan zegt dat de code onoverzichtelijk word, dat vind ik ook helemaal nergens op slaan, als je het gewoon netjes neerzet dan kun je het makkelijk terug vinden. Ik heb toen gezegd zoek iemand die gewoon op jou manier wil meewerken en die meer ervaring heeft.

Als je niet bekend bent met divs moet je hoognodig op een bijscholingscursusje van een uur of 2, HTML is echt niet zo moeilijk dat je enkel om 't gebruik van divs, wat ik trouwens aanmoedig, een site niet moet maken. Trouwens, als je een site in divs kan voorzien van de nodige serverside oplossingen, staat dat goed op je palmares (of hoe noemt zo'n ding? )

offtopic:
Grootste reply ooit ofzo

[ Voor 27% gewijzigd door coubertin119 op 28-06-2003 14:30 ]

[drm]

Twistt:
Ik ben dus een van die php'ers, en ik wil even zeggen dat Marty gelijk heeft.
Ik heb geen ervaring met divs, ik ben zelf bekend met de standaard html tags.

Wat er niet standaard is aan een div ontgaat mij even, maar goed

Het probleem was voor mij ook dat ik al best ver was in het script en toen moest er ineens persee een template systeem komen, ik heb nog nooit met een template systeem gewerkt, ik zou het wel kunnen gaan uitzoeken allemaal maar er was een deadline van 3 weken en de eissen waren vrij hoog, dus om dan ook nog de hele code te gaan vervormen voor een template systeem zou veel te veel tijd in beslag nemen.

Maar een template-systeem aan de front-end maakt toch geen bal verschil voor je CMS? Of er zit volgens mij iets goed scheef...

En aangezien ik dus niet bekend ben met divs wou ik gewoon op mijn manier (met tables) werken. En dan kan iedereen wel gaan zeggen dat tables slecht zijn voor het maken van een layout, zelf heb ik er geen problemen mee, er zijn zat grote bekende sites die met tables werken en ik heb er zelf nog niet echt problemen mee gehad. En dat iedereen dan zegt dat de code onoverzichtelijk word, dat vind ik ook helemaal nergens op slaan, als je het gewoon netjes neerzet dan kun je het makkelijk terug vinden.

Dat is makkelijk gezegd voor degene die het zelf gemaakt heeft. Je zou voor de grap eens het verschil moeten zien tussen 2 lappen code van marty (gebaseerd op tables) en mij (gebaseerd op divs) in resp. deze en deze post. Je gaat me niet vertellen dat de eerste snippet net zo duidelijk is als de andere.
_{niks ten nadele van marty, want die was gewoon niet op de hoogte van de mogelijkheden, volgens mij, wellicht jij ook niet...}

edit:
In mijn stukje code staat trouwens voor het gemak alles in div's. Voor hetzelfde geld had ik daar ook wat beter een list voor die links en die buttons gemaakt, maar goed

Ik heb toen gezegd zoek iemand die gewoon op jou manier wil meewerken en die meer ervaring heeft.

Dat is zonde, want volgens mij is het voor jou de ideale gelegenheid je meer te richten op de client-side van de zaak en meer bij te leren over hoe je een goede documentstructuur opzet en die vormgeeft met CSS

Nog afgezien van het feit dat ik nog steeds niet begrijp hoe het CMS invloed kan uitoefenen op hoe je je site vormgeeft ...

[ Voor 4% gewijzigd door drm op 28-06-2003 14:44 ]

[Eärendil]

Verwijderd schreef op 28 juni 2003 @ 14:20:
[...]
Het probleem was voor mij ook dat ik al best ver was in het script en toen moest er ineens persee een template systeem komen, ik heb nog nooit met een template systeem gewerkt, ik zou het wel kunnen gaan uitzoeken allemaal maar er was een deadline van 3 weken en de eissen waren vrij hoog, dus om dan ook nog de hele code te gaan vervormen voor een template systeem zou veel te veel tijd in beslag nemen. En aangezien ik dus niet bekend ben met divs wou ik gewoon op mijn manier (met tables) werken.

Hebben jullie dan geen overleg gehad wie wat zou doen? Als je een aparte PHP- en HTML-codert heb zou ik me kunnen voorstellen dat de HTML'er vooraf aan de PHP'er een soort template geeft (dus zoiets als in de TS) en dat de PHP'er dan zorgt dat dit werkt met de DB en de backend enzo. Als je bijvoorbeeld de source van http://www.laatmenou.nl/test/ bekijkt lijkt het me duidelijk welk deel dynamisch is en wat dus door de PHP'er uit de backend gehaald moet worden

[edit]
Over het verkeerd (te veel) gebruik van de <div>-tag: het is met XHMTL 1.1 mogelijk om eigen tags toe te voegen aan de XHTML-DTD. Meer info op http://www.w3.org/TR/2000...020/dtd_module_rules.html
Weet niet of browsers het ook ondersteunen, misschien laten die het wel niet zien.

[ Voor 29% gewijzigd door Eärendil op 28-06-2003 15:26 ]

[marty]

drm schreef op 28 June 2003 @ 14:42:
_{niks ten nadele van marty, want die was gewoon niet op de hoogte van de mogelijkheden, volgens mij, wellicht jij ook niet...}

offtopic:
bel horen luiden enzo....
Ben nu met een nieuw projectje bezig en me gelijk in alle ins & outs aan het verdiepen

[ontopic]
twistt: De suggestie deze kans aan te grijpen om je wat in CSS te verdiepen is zo'n slechte nog niet hoor. Je heb nu iemand tot je beschikking via MSN die je er alles over kan vertellen - tenminste ik neem aan dat ie daar niet te beroerd voor is aangezien jij dit ook kosteloos voor hem doet . Ideaal lijkt me!
En wellicht dat je dit van een mede-phpër aan wil nemen: het is echt een verademing. Ik weet nog dat ik ca 2 jaar terug CSS begon te gebruiken, maar op een heel laag niveau. Zodat je van al die font tags enzo af was. De verademing die dat gaf heb ik nu weer. Ik weet nog dat ik toen dacht: dit heeft me maar een paar uurtjes gekost om me in te verdiepen en heb er zoveel plezier van, stom dat ik dit niet eerder heb gedaan. Hardleers als ik ben zit ik nu weer met dat zelfde gevoel
/me marty denkt bijvoorbeeld terug aan aan een tabel, genest in een andere tabel met de cellspacing op 1 en de achtergrond kleur op zwart om een mooie dunne border te krijgen
Misschien dat je, net als ik, gewoon een hekel heb aan designen en liever aan het coden bent en er daarom een beetje tegen aan hikt. Maar je ontkomt er zo af en toe toch niet aan. En dan kun je maar beter ff de moeite nemen het 1x goed uit te zoeken....
[/ontopic]

[Verwijderd]

wat jullie allemaal van tables vinden kan me ook niet erg veel schelen zoals ik al zei, ik doe gewoon wat php voor mijn lol maar ben echt niet vanplan er groot mee te worden ofzo.
Als ik een site kan maken die overal goed werkt en er uit ziet zoals ik dat in gedachte had is dat toch gewoon goed. laat justplay maar lekker met divs werken, kan me ook niet erg veel schelen. Er is gewoon teveel menings verschil tussen mij en lars dat werkt gewoon niet, en dat is niet alleen met divs. zijn eisen zijn gewoon te hoog voor mij, en vooral als er dan ook nog eens tijdsdruk bovenop komt. ik doe pas 3 maanden php (en heb nog nooit een andere programmeer taal gedaan) moet ik dan al meteen alles kunnen?

[Rexomnium]

Helaas pindakaas.

Ondanks de argumenten en het nut van dergelijk überCSS willen de heren niet verder werken met en voor Justplay. Ik heb zojuist een e-mail gekregen.

Goed, dat zal jullie verder redelijk aan de bipsen oxideren, maar ik heb hoe dan ook zeer veel aan dit topic. Het is ook niet verkeerd om verder te discusseren over correct en mooi (X)HTML gebruik.

Eärendil schreef op 28 juni 2003 @ 15:14:
[...]
Hebben jullie dan geen overleg gehad wie wat zou doen? Als je een aparte PHP- en HTML-codert heb zou ik me kunnen voorstellen dat de HTML'er vooraf aan de PHP'er een soort template geeft (dus zoiets als in de TS) en dat de PHP'er dan zorgt dat dit werkt met de DB en de backend enzo. Als je bijvoorbeeld de source van http://www.laatmenou.nl/test/ bekijkt lijkt het me duidelijk welk deel dynamisch is en wat dus door de PHP'er uit de backend gehaald moet worden

Je hebt gelijk. Dat noemen we een...
...
...
leermoment

Het ging ook allemaal zo snel ineens dat we (ik) nauwelijks de tijd hebben gehad om alles goed op papier te krijgen zodat de phpërs (schrijf je dat zo?) ook niet echt goed een beeld hadden waar ze aan toe waren.

Over naar plan B:

www.hotscripts.com hmmmm

Verwijderd schreef op 28 June 2003 @ 16:20:
(...)Er is gewoon teveel menings verschil tussen mij en lars dat werkt gewoon niet(...)

offtopic:
Ik ben niet Lars.... Ik ben RexomniuM, Koning van het heelal! :B

[ Voor 11% gewijzigd door Rexomnium op 28-06-2003 16:36 ]

[marty]

surf anders ff naar www.phpfreakz.nl en zet daar een verzoekje in het scriptrequest of overige forum. Daar zitten genoeg phpjertjes met zeeën van tijd die zichzelf graag willen bewijzen en het wellicht ook gratis willen doen in ruil voor de credentials.
Ik heb dit soort dingen daar wel vaker voorbij zien komen

[LaZZ]

Had ik ook al even rondgekeken Lars, dat is opzich best een goede optie.. Die mensen daar kunnen zonder meer onze eisen wel inwilligen.. Hebben genoeg ervaring om weet ik veel wat allemaal wel niet te scripten..

Kom vanavond ff online, wel zo handig....

[Clay]

Helaas pindakaas.

Ondanks de argumenten en het nut van dergelijk überCSS willen de heren niet verder werken met en voor Justplay. Ik heb zojuist een e-mail gekregen.

Ik vind het behoorlijk triest voor een organisatie om vooraf eisen te gaan stellen aan de html code van een site, zelfs nog afgezien van os/browser ondersteunings eisen. Maar als ze echt per se achter de feiten aan willen blijven lopen en uit onwetendheid en angst voor de "oude vertrouwde" manier willen gaan moeten ze dat dan zelf maar weten.

Een beetje poken en testen levert met gemak html op die voornamelijk met css gelayout wordt die werkt vanaf Ie5.0, win/mac, opera, mozilla en aanverwanten etc. Eigenlijk is de enige browser die het _niet_ kan Netscape 4, en die is nou echt toch wel overleden. Voor die paar achterlopers ga je daar geen rekening mee houden.

Je bent altijd gebonden aan de technieken die de browser je toestsaat te gebruiken, en die veranderen dus over tijd. De manier waarop je html't verandert dus ook (gelukkig), en dat kan inderdaad betekenen dat een oudere browser troep laat zien. Als het percentage gebruikers die dat krijgt maar laag genoeg is is dat prima te accepteren, en dat moet je een klant ook duidelijk maken. Procentueel kan je alleen maar 100% van je bezoekers bedienen in een text only site, dus dat is hoe dan ook een onwerkelijke eis.
Wil de klant ondanks alles dan TOCH per se "browser X" ondersteunen? best. Maar dan mag die er ook meer voor betalen; extra service heet dat. Dan moet de klant alleen wel snappen wat het ueberhaupt inhoudt als de devver vraagt of browser X ondersteund moet worden. En dat is doorgaans niet zo.

Verder houdt al die oude shit de ontwikkelingen ook nog tegen. Een gebruiker die een prima site in zijn oude browser te zien krijgt zal allicht minder snel op een nieuwe overstappen, en dat moet juist wel.
Html is niet zomaar "gewoon" html. Het is een techniek die groeit en verandert. Als je die nieuwe technieken nooit zou kunnen gebruiken omdat alle vorige browsers ook nog wat moeten laten zien zou er nooit wat veranderen. Nou is het nieuwe niet altijd beter, en veranderen is niet verplicht, maar het oude is in dit geval brak, en het nieuwe is goed (althans een STUK minder brak).