Mogelijk duplicaat:
Waarom geen tabellen gebruiken voor lay-out in HTML?
Onder welke voorwaarden moet je tabellen kiezen in plaats van DIV’s in HTML-codering?
Antwoord 1, autoriteit 100%
Het hele ‘Tafels vs. Div’-dingen slaat maar net de plank mis. Het is niet “tabel” of “div”. Het gaat om het gebruik van semantische html.
Zelfs de div-tag speelt slechts een kleine rol in een goed opgemaakte pagina. Gebruik het niet te veel. Je zou er niet zoveel nodig moeten hebben als je je html goed in elkaar zet. Dingen zoals lijsten, veldensets, legenda’s, labels, alinea’s, enz. kunnen veel vervangen van wat een div of span vaak wordt gebruikt om te bereiken. Div moet voornamelijk worden gebruikt als het zinvol is om een logische divisie aan te geven, en alleen voor extra lay-out wanneer dit absoluut noodzakelijk is. Hetzelfde geldt voor tafel; gebruik het als je tabelgegevens hebt, maar niet anders.
Dan heb je een meer semantische pagina en heb je niet zoveel klassen nodig die in je CSS zijn gedefinieerd; u kunt de tags in plaats daarvan rechtstreeks targeten. Misschien wel het belangrijkste is dat je een pagina hebt die veel beter scoort bij Google (anekdotisch) dan de equivalente tabel of div-zware pagina. Bovenal zal het je helpen om beter in contact te komen met een deel van je publiek.
Dus als we teruggaan en ernaar kijken in termen van tabel versus div, ben ik van mening dat we op het punt zijn gekomen waarop div te veel wordt gebruikt en tabel te weinig wordt gebruikt. Waarom? Want als je er echt over nadenkt, zijn er veel dingen die in de categorie ‘gegevens in tabelvorm’ vallen en die vaak over het hoofd worden gezien. Antwoorden en opmerkingen op deze webpagina bijvoorbeeld. Ze bestaan uit meerdere records, elk met dezelfde set velden. Ze zijn zelfs opgeslagen in een SQL-servertabel, om hardop te huilen. Dit is de exacte definitie van tabelgegevens. Dit betekent dat een html-tabeltag absoluut een goede semantische keuze zou zijn om zoiets als de berichten hier op Stack Overflow in te delen. Hetzelfde principe geldt ook voor veel andere dingen. Het is misschien geen goed idee om een tabeltag te gebruiken om een lay-out met drie kolommen in te stellen, maar het is zeker prima om het te gebruiken voor rasters en lijsten… behalve natuurlijk wanneer u de ol of ul ( lijst) tags.
Antwoord 2, autoriteit 26%
Als de gegevens die ik presenteer inderdaad in tabelvorm zijn.
Ik vind het belachelijk dat sommige webdesigners op sommige sites divs gebruikten voor tabelgegevens.
Een ander gebruik dat ik ervoor zou hebben, zijn formulieren, met name label: tekstvakparen. Dit zou technisch gezien in div-boxen kunnen worden gedaan, maar het is veel, veel gemakkelijker om dit in tabellen te doen, en men kan stellen dat label:textbox-paren in feite in tabelvorm van aard zijn.
Antwoord 3, autoriteit 12%
Vroeger deed ik pure CSS, maar ik heb dat streven opgegeven ten gunste van een hybride tabel/css-benadering als de meest pragmatische benadering. Ironisch genoeg is het ook vanwege de toegankelijkheid. Ooit geprobeerd CSS op Sidekick te doen? Wat een nachtmerrie! Ooit gezien hoe op CSS gebaseerde websites worden weergegeven in nieuwe browsers? Elementen zouden elkaar overlappen of gewoon niet correct weergeven dat ik de CSS moest uitschakelen. Ooit geprobeerd het formaat van op CSS gebaseerde websites te wijzigen? Ze zien er vreselijk uit en zijn vaak schadelijk voor blinden als ze zoomfuncties in de browser gebruiken! Als je dat met tabellen doet, schalen ze veel beter. Als mensen praten over toegankelijkheid, merk ik dat velen geen idee hebben en het irriteert me omdat ik gehandicapt ben en zij niet. Hebben ze echt met blinden gewerkt? De doven? Als toegankelijkheid een belangrijk punt van zorg is, waarom zijn dan in godsnaam 99% van de video’s niet ondertiteld? Veel CSS-puristen gebruiken AJAX maar realiseren zich niet dat AJAX content vaak ontoegankelijk maakt.
Pragmatisch gezien is het oké om een enkele tabel als hoofdlay-out te gebruiken, zolang je de informatie maar in een logische stroom levert als de cellen gestapeld zijn (iets wat je op mobiele telefoons zou zien). De CSS-theorie klinkt geweldig, maar gedeeltelijkwerkbaar in het echte leven met te veel hacks, iets dat indruist tegen de idealen van ‘zuiverheid’.
Sinds ik CSS met tabellen gebruik, heb ik zoveel tijd bespaard bij het ontwerpen van een website en is het onderhoud veel eenvoudiger. Minder hacks, intuïtiever. Ik krijg minder telefoontjes van mensen die zeggen: “Ik heb een DIV geplaatst en nu ziet het er allemaal verpest uit!” En nog belangrijker, absoluut GEEN toegankelijkheidsproblemen.
Antwoord 4, autoriteit 11%
Meestal wanneer u de tabel niet gebruikt om een lay-out aan te bieden.
Tabellen -> gegevens
Div’s -> lay-out
(voornamelijk)
Antwoord 5, autoriteit 10%
Opmerking: op het moment dat de vraag werd gesteld, waren er praktische redenen om tabellen te gebruiken voor sommige lay-outdoeleinden. Dit is niet meer nodig vanwege browserverbeteringen, dus ik heb het antwoord bijgewerkt.
HTML <table>-elementen moeten worden gebruikt wanneer de gegevens logischerwijs een tweedimensionale structuur hebben. Als de gegevens in rijen en kolommen kunnen worden gestructureerd en u kopteksten zinvol kunt toepassen op zowel rijen als kolommen, heeft u waarschijnlijk tabelgegevens.
Als je maar een enkele rij of enkele kolom met gegevens hebt, dan zijn het geen tabelgegevens – het is gewoon lineaire inhoud. U hebt minimaal twee rijen en twee kolommen nodig voordat het als tabelgegevens kan worden beschouwd.
Enkele voorbeelden:
Tabellen gebruiken voor het plaatsen van zijbalken en paginakop-/voetteksten. Dit zijn geen tabelgegevens maar paginalay-out. Iets als css-raster of flexbox is meer geschikt.
Tabellen gebruiken voor kolommen in krantenstijl. Dit zijn geen tabelgegevens – je zou het nog steeds lineair lezen. Iets als CSS-kolommen is meer geschikt.
Antwoord 6, autoriteit 7%
Ik zou een onderscheid maken tussen HTML voor openbare websites (tabellen nee-nee-nee, divs ja-ja-ja) en HTML voor semi-openbare of particuliere webapplicaties, waar ik de neiging heb om tabellen te verkiezen, zelfs voor pagina-indeling.
De meeste respectabele redenen waarom ‘Tabellen slecht zijn’ zijn meestal alleen een probleem voor openbare websites, maar niet zozeer een probleem met webapps. Als ik dezelfde lay-out kan krijgen en een meer consistente weergave in alle browsers kan krijgen door een TABEL te gebruiken dan een gecompliceerde CSS+DIV, dan ga ik meestal door en keur ik de TABEL goed.
Antwoord 7, autoriteit 6%
Zoals veel posters al hebben vermeld, moet u tabellen gebruiken om tabelgegevens weer te geven.
Tabellen zijn geïntroduceerd in HTML 3.2hier is de relevante paragraaf uit de specificatie van hun gebruik:
[tabellen] kunnen worden gebruikt om tabelmateriaal te markeren of voor lay-outdoeleinden…
Antwoord 8, autoriteit 4%
Ik ben het eens met Thomas — de algemene vuistregel is dat als het logisch is op een spreadsheet, je een tabel kunt gebruiken. Anders niet.
Gebruik tabellen gewoon niet als lay-out voor de pagina, dat is het grootste probleem dat mensen ermee hebben.
Antwoord 9, autoriteit 4%
Ik begrijp het argument voor tabellen voor formulieren, maar er is een leuker alternatief… je hoeft alleen maar je mouwen op te stropen en CSS te leren.
bijvoorbeeld:
<fieldset>
<legend>New Blog Post</legend>
<label for="title">Title:</label>
<input type="text" name="title" />
<label for="body">Body:</label>
<textarea name="body" rows="6" cols="40">
</textarea>
</fieldset>
Je kunt die html nemen en het formulier naast elkaar plaatsen, of labels bovenop de tekstvakken (wat makkelijker is). De flexibiliteit hebben helpt echt. Het is ook minder HTML dan het tabelequivalent van beide.
Voor enkele uitstekende voorbeelden van CSS-formulieren, bekijk deze uitstekende voorbeelden:
http://jeffhowden.com/code/css/forms/
http://www.sitepoint.com/article/fancy- form-design-css/
http://www.smashingmagazine. com/2006/11/11/css-based-forms-modern-solutions/
Antwoord 10, autoriteit 3%
Ik zal meestal kiezen voor tabellen om informatie over het formuliertype weer te geven (voornaam, achternaam, adres, enz.), waarbij het belangrijk is om labels en velden over meerdere rijen te plaatsen. DIV’s die ik gebruik voor lay-out.
Natuurlijk is de tafel ingepakt in een DIV 🙂
Antwoord 11, autoriteit 2%
Tabellen zijn ontworpen voor inhoud in tabelvorm, niet voor lay-out.
Dus, voel je nooit slecht als je ze gebruikt om gegevens weer te geven.
Antwoord 12, autoriteit 2%
Ik gebruik tabellen in twee gevallen:
1) Tabelgegevens
2) Elke keer als ik wil dat mijn lay-out zichzelf dynamisch aanpast aan de inhoud
Antwoord 13, autoriteit 2%
Als uw gegevens in een tweedimensionaal raster kunnen worden ingedeeld, gebruikt u <table>. Als het niet kan, niet doen. Het gebruik van <table>voor iets anders is een hack (hoewel vaak niet een met de juiste alternatieven, vooral als het gaat om compatibiliteit met oudere browsers). Niet<table>voorgebruiken voor iets dat er duidelijk een zou moeten zijn, is even slecht. <div>en <span>zijn niet voor alles; in feite zijn ze volkomen zinloos op semantisch niveau en moeten ze koste wat kost worden vermeden ten gunste van meer semantische alternatieven.
Antwoord 14, autoriteit 2%
Over dit onderwerp vond ik dezesite best grappig.
Antwoord 15
1) Voor het weergeven van tabelgegevens. Een kalender is een voorbeeld van tabelgegevens die in het begin niet altijd duidelijk zijn.
2) Ik werk voor een medisch factureringsbedrijf en bijna alle lay-out voor ons interne werk wordt gedaan met CSS. Van tijd tot tijd krijgen we echter papieren formulieren van verzekeringsmaatschappijen die onze rekeninghouders moeten gebruiken, en een programma zal ze converteren naar een html-formaat dat ze kunnen invullen en afdrukken via het intranet. Om ervoor te zorgen dat de formulieren worden geaccepteerd, moeten ze nauw overeenkomen met de originele papieren versie. Hiervoor is het eenvoudig om terug te vallen op tafels.
Antwoord 16
Tabellen worden gebruikt voor tabelgegevens. Als het zinvol is om het in een spreadsheet te plaatsen, gebruik dan een tabel. Anders is er een betere tag die u kunt gebruiken, zoals div, span, ul, enz.
Antwoord 17
Ik geloof alleen inhoud in tabelvorm. Als u bijvoorbeeld een databasetabel of spreadsheetachtige gegevens naar HTML hebt afgedrukt.
Antwoord 18
Als u semantisch correcte HTML wilt hebben, moet u tabellen alleen gebruiken voor tabelgegevens.
Anders gebruik je tabellen voor alles wat je wilt, maar er is waarschijnlijk een manier om hetzelfde te doen met divs en CSS.
Antwoord 19
@Marius:
Bestaat de lay-out in tabelvorm? Nee, een paar jaar geleden was het standaard, maar nu niet meer 🙂
Een ander gebruik dat ik ervoor zou hebben, zijn formulieren, met name label: tekstvakparen. Dit zou technisch gezien in div-boxen kunnen worden gedaan, maar het is veel, veel gemakkelijker om dit in tabellen te doen, en men kan stellen dat label:textbox-paren in feite in tabelvorm van aard zijn.
Ik heb de neiging om het label een vaste breedte te geven, of het op de regel erboven weer te geven.
Antwoord 20
@Jon Limjap
Voor label : textbox zijn divs en tabellen niet geschikt: <dl>s zijn
Antwoord 21
Nog een ander gebruik dat ik ervoor zou hebben
zou vormen, in het bijzonder label:
tekstbox-paren. Dit zou technisch gezien kunnen
worden gedaan in div-boxen, maar het is veel,
veel gemakkelijker om dit in tabellen te doen, en
men kan stellen dat label:textbox-paren
zijn in feite in tabelvorm van aard.
Ik zie dat nogal wat, vooral onder MS-ontwikkelaars. En ik heb het in het verleden al aardig wat gedaan. Het werkt, maar het negeert enkele toegankelijkheids- en best-practice-factoren. U moet labels, invoer, veldensets, legenda’s en CSS gebruiken om uw formulieren op te maken. Waarom? Want daar zijn ze voor, het is efficiënter en ik vind toegankelijkheid belangrijk. Maar dat is slechts mijn persoonlijke voorkeur. Ik denk dat iedereen het eerst op die manier moet proberen voordat hij het veroordeelt. Het is snel, gemakkelijk en schoon.
Antwoord 22
Als een pagina met tabellen door een browser wordt geladen, duurt het langer voordat de browser de tag correct weergeeft. Waar het lijkt alsof de div wordt gebruikt, kost de browser minder tijd omdat deze lichter is. En bovendien kunnen we de css toepassen om de divs als tabel te laten verschijnen,
De tafels zijn normaal gesproken zwaar en div zijn licht van gewicht.
Antwoord 23
Het is duidelijk dat de DIV worden gebruikt voor de lay-out, maar het gebeurde me dat ik om deze redenen werd “gedwongen” om spreadsheets te gebruiken om een rasterlay-out te maken binnen een div-structuur:
de toevoeging van percentagewaarden maakte een juiste uitlijning met de div niet mogelijk, terwijl dezelfde waarden uitgedrukt in cellen van tabellen het verwachte resultaat gaven.
Dus ik denk dat tabellen nog steeds niet alleen nuttig zijn voor gegevens, maar ook voor de bovenstaande situatie, bovendien zijn tabellen nog steeds W3C-compatibele browser en interpreteren alternatieve browsers (bijvoorbeeld voor gehandicapten) die van hen correct.
p>
Antwoord 24
Div’s zijn eenvoudige divisions, ze zijn niet bedoeld om secties van de pagina te groeperen die in semantische zin met elkaar verbonden zijn. Ze hebben geen andere impliciete betekenis.
Tabellen waren oorspronkelijk bedoeld om wetenschappelijke gegevens, zoals laboratoriumresultaten, op het scherm weer te geven. Het was zeker niet de bedoeling van Dave Raggett dat ze gewend zouden raken aan het implementeren van lay-out.
Ik vind dat het je vrij helder voor de geest houdt als je je het bovenstaande herinnert, als het iets is dat je normaal zou verwachten te lezen in een tabel, dan is dat de juiste tag, als het pure lay-out is, gebruik dan iets anders om je behoeften.