{"id":1175,"date":"2006-09-04T13:07:39","date_gmt":"2006-09-04T11:07:39","guid":{"rendered":"http:\/\/textundblog.de\/?p=1175"},"modified":"2006-09-10T01:41:07","modified_gmt":"2006-09-09T23:41:07","slug":"webstandards-xhtml-css-statt-tabellen","status":"publish","type":"post","link":"https:\/\/textundblog.de\/?p=1175","title":{"rendered":"Webstandards: XHTML &amp; CSS statt Tabellen"},"content":{"rendered":"<p>Jens Grochtdreis beschreibt dankenswerterweise und leicht verst\u00e4ndlich, warum Tabellen nicht zum Layouten von Webseiten gedacht sind und wie man mit CSS ganz einfach der Struktur einer XHTML-Seite Form und Gestaltung gibt: \u00ab<a href=\"http:\/\/www.webkrauts.de\/2006\/09\/01\/webseiten-sind-keine-gemaelde\/\">Webseiten sind keine Gem\u00e4lde &#8211; Modernes Webdesign mit XHTML und CSS<\/a>\u00bb.<\/p>\n<blockquote><p>Das klassische Tabellenlayout hat ausgedient. Moderne Browser &#8211; auch der Internet Explorer &#8211; k\u00f6nnen hinreichend mit CSS umgehen, dass keine Layoutkr\u00fccken mehr ben\u00f6tigt werden. Es ist Zeit, sich an die Anwendung der Webstandards zu gew\u00f6hnen und moderne Webseiten zu erstellen.<br \/>\n[&#8230;]<br \/>\nWebseiten sind Texte, keine Gem\u00e4lde. Deshalb ist die Grundlage f\u00fcr moderne Seiten ein Umdenken im Erstellungsprozess einer Webseite. Man sollte vom Inhalt, nicht von der Optik, der Pr\u00e4sentation her denken. Es ist deshalb wichtig, dem Inhalt eine semantisch korrekte Struktur durch HTML (oder XHTML) zu verpassen.<\/p><\/blockquote>\n<p>[via <a href=\"http:\/\/www.grochtdreis.de\/weblog\/index.php?id=P1094\">F &#8211; LOG &#8211; GE<\/a>]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Jens Grochtdreis beschreibt dankenswerterweise und leicht verst\u00e4ndlich, warum Tabellen nicht zum Layouten von Webseiten gedacht sind und wie man mit CSS ganz einfach der Struktur einer XHTML-Seite Form und Gestaltung gibt: \u00abWebseiten sind keine Gem\u00e4lde &#8211; Modernes Webdesign mit XHTML und CSS\u00bb. Das klassische Tabellenlayout hat ausgedient. Moderne Browser &#8211; auch der Internet Explorer &#8211; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ngg_post_thumbnail":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[13],"tags":[],"class_list":["post-1175","post","type-post","status-publish","format-standard","hentry","category-webdesign"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p4uzZ-iX","jetpack-related-posts":[{"id":145,"url":"https:\/\/textundblog.de\/?p=145","url_meta":{"origin":1175,"position":0},"title":"Webdesign mit farbigen K\u00e4sten","author":"Markus","date":"10\/1\/2005","format":false,"excerpt":"Andreas Kalt hat eine Anleitung der australischen Webdesign-Schmiede Maxdesign ins Deutsche \u00fcbersetzt: Farbige K\u00e4sten - Ein CSS-Layout erstellen. Die Gestaltung von Webseiten mit Cascading Stylesheets (CSS) erm\u00f6glicht eine Trennung von Form und Inhalt. In diesem Tutorial geht es besonders darum, keine Tabellen zu Layoutzwecken zu benutzen. Besten Dank an Andreas\u2026","rel":"","context":"In &quot;Webdesign&quot;","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1131,"url":"https:\/\/textundblog.de\/?p=1131","url_meta":{"origin":1175,"position":1},"title":"Armutszeugnis f\u00fcr Internet Explorer 7","author":"Markus","date":"9\/8\/2006","format":false,"excerpt":"Ein Armutszeugnis ist auch der kommenden Version des r\u00fcckst\u00e4ndigen Browsers Internet Explorer auszustellen, wenn man sich das geradezu frappierende Hinterherhinken hinter den wesentlichsten Webstandards betrachtet. Wer glaubt, mit der kommenden Version 7 sei Microsoft der Anschlu\u00df an moderne Zeiten gelungen, der schaue sich diese tabellarische \u00dcbersicht von Web Devout an:\u2026","rel":"","context":"In &quot;Webdesign&quot;","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"Web Devout (Vergleich Webstandards bei Browsern)","src":"https:\/\/i0.wp.com\/www.textundblog.de\/wp-content\/browserstandards.gif?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":665,"url":"https:\/\/textundblog.de\/?p=665","url_meta":{"origin":1175,"position":2},"title":"Webstandards Adventskalender","author":"Markus","date":"1\/12\/2005","format":false,"excerpt":"Wenn wir von Webstandards sprechen, meinen wir nicht nur den puren Regelsatz, wir meinen implizit auch eine Vorgehensweise bei der Entwicklung von Webseiten. Modernes Webdesign mit Webstandards wendet sich von den traditionellen Layouttabellen ab und trennt Struktur und Layout. Jawoll! Die Webkrauts bieten wieder ihren traditionellen Adventskalender an, wo man\u2026","rel":"","context":"In &quot;Webdesign&quot;","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"Webstandards Adventskalender","src":".\/wp-content\/webstandardsadventskalender.png","width":350,"height":200},"classes":[]},{"id":1352,"url":"https:\/\/textundblog.de\/?p=1352","url_meta":{"origin":1175,"position":3},"title":"CSS-Layouts: Mehrspaltiges f\u00fcr die digitale Boh\u00e8me","author":"Markus","date":"16\/12\/2006","format":false,"excerpt":"Das im Hochsommer von Dirk Jesse f\u00fcr die Weihnachtszeit angek\u00fcndigte Buch CSS-Layouts (Verlags-Infos und ausf\u00fchrliches Probekapitel) ist tats\u00e4chlich im Dezember erschienen. Spaltenlayout geh\u00f6rt seit langem zum gestalterischen Repertoire des Webdesigns. Der Wechsel vom bisherigen, tabellengest\u00fctzten Layout zu einer CSS-Layout-L\u00f6sung birgt aber viele Probleme und verlangt nach konsequenter Trennung von Textauszeichnung\u2026","rel":"","context":"In &quot;Literatur&quot;","block_context":{"text":"Literatur","link":"https:\/\/textundblog.de\/?cat=11"},"img":{"alt_text":"CSS-Layouts: Buch und Referenzkarte","src":".\/wp-content\/css-layouts.jpg","width":350,"height":200},"classes":[]},{"id":1294,"url":"https:\/\/textundblog.de\/?p=1294","url_meta":{"origin":1175,"position":4},"title":"Infos \u00fcber Mikroformate","author":"Markus","date":"14\/11\/2006","format":false,"excerpt":"Mikroformate sind ja auch bei mir schon mal im Artikel \u00abMikroformate: Semantisches Web von unten\u00bb zur Sprache gekommen: Michael Jendryschik, Autor der gut gemachten \u00abEinf\u00fchrung in XHTML, CSS und Webdesign\u00bb, hat sich dieses neuen, in der Datenstrukturierung des Netzes immer wichtiger werdenden Themas, angenommen und die fortan kontinuierlich von ihm\u2026","rel":"","context":"In &quot;Internet&quot;","block_context":{"text":"Internet","link":"https:\/\/textundblog.de\/?cat=4"},"img":{"alt_text":"Mikroformate","src":".\/wp-content\/mikroformate.jpg","width":350,"height":200},"classes":[]},{"id":1116,"url":"https:\/\/textundblog.de\/?p=1116","url_meta":{"origin":1175,"position":5},"title":"CSS-Layouts &#8211; Praxisl\u00f6sungen mit YAML","author":"Markus","date":"3\/8\/2006","format":false,"excerpt":"Foto (links): Photocase.com, (rechts): Galileo-Verlag YAML ist vielleicht keine besonders gl\u00fccklich gew\u00e4hlte Abk\u00fcrzung, weil sie sich ausgesprochen ein bi\u00dfchen nach \u00abJammer\u00bb anh\u00f6rt, aber was Dirk Jesse da auf die Beine gestellt hat, ist eine (Achtung: absichtliche Wiederholung: ausgesprochen ;-) ) feine Sache. In der Selbstbeschreibung erkl\u00e4rt sich YAML wie folgt:\u2026","rel":"","context":"In &quot;Literatur&quot;","block_context":{"text":"Literatur","link":"https:\/\/textundblog.de\/?cat=11"},"img":{"alt_text":"Weihnachtshimmel","src":"https:\/\/i0.wp.com\/www.textundblog.de\/wp-content\/weihnachtshimmel.jpg?resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts\/1175","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1175"}],"version-history":[{"count":0,"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts\/1175\/revisions"}],"wp:attachment":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1175"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1175"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1175"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}