{"id":2539,"date":"2011-07-19T06:32:14","date_gmt":"2011-07-19T06:32:14","guid":{"rendered":"http:\/\/www.joachimott.de\/journal\/?p=2539"},"modified":"2011-07-18T12:45:09","modified_gmt":"2011-07-18T12:45:09","slug":"css1k-viel-design-mit-wenig-code","status":"publish","type":"post","link":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/","title":{"rendered":"CSS1K: viel Design mit wenig Code"},"content":{"rendered":"<div id=\"attachment_2543\" style=\"width: 414px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-2543\" src=\"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg\" alt=\"CSS1K: Design mit kleinen CSS-Dateien\" title=\"CSS1K: Design mit kleinen CSS-Dateien\" width=\"404\" height=\"257\" class=\"size-full wp-image-2543 bildschatten\" \/><p id=\"caption-attachment-2543\" class=\"wp-caption-text\">CSS1K: Design mit kleinen CSS-Dateien<\/p><\/div>\n<p>Kann sich eigentlich noch jemand von den \u00c4lteren (h\u00fcstel) an <a href=\"http:\/\/www.csszengarden.com\/\">CSS Zengarden<\/a> erinnern? F\u00fcr viele, die an Websites arbeiten war das ja so etwas wie ein Erweckungserlebnis: Anhand der immer gleichen Inhalte konnte man da ansehen, wie einzig durch Verwendung unterschiedlicher CSS-Dateien das Layout anders gestaltet wurde. Bis dahin hatten die meisten Website-Gestalter (mich eingeschlossen) die entsprechenden Anweisungen am liebsten direkt ins HTML der Seite geschrieben.<\/p>\n<p><a href='http:\/\/css1k.com\/'>CSS1K<\/a> ist sozusagen eine Art Neuauflage dieser Idee: Nachdem sich die Auslagerung des Layout-Codes in CSS-Dateien heute etabliert hat, kommt es ja mancherorts sogar zu richtigen Orgien. Da werden nicht eine oder zwei CSS-Dateien eingebunden (und nat\u00fcrlich extra geladen) sondern manchmal auch gleich ein halbes Dutzend. Von einer schlanken L\u00f6sung kann man da nicht mehr sprechen, denn alleine die Ladezeit f\u00fcr CSS-Dateien hat es manchmal schon in sich. Zitat:<\/p>\n<blockquote><p>Popular sites have in average 27 K of CSS, but some use up to a megabyte of style sheets!<\/p><\/blockquote>\n<p>Dass es auch einfacher geht zeigt CSS1K: genau ein Kilobyte gro\u00df d\u00fcrfen hier die CSS-Dateien sein, 1024 Bytes. Daf\u00fcr wird eine ganze Menge geboten inklusiv aufklappbarer Seiteninhalte und dynamischer Elemente. <\/p>\n<p>Verwiesen wird auf der Website \u00fcbrigens auch auf ein \u00e4hnliches Projekt zum Thema Javascript: <a href=\"http:\/\/js1k.com\/\">js1k.com\/<\/a> zeigt Beispiele mit schlankem JS-Code, die Machart ist allerdings eine ganz andere. Bislang gab es wohl drei Wettbewerbe zu unterschiedlichen Themen, die ersten die Top 10 werden jeweils gezeigt. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kann sich eigentlich noch jemand von den \u00c4lteren (h\u00fcstel) an CSS Zengarden erinnern? F\u00fcr viele, die an Websites arbeiten war das ja so etwas wie ein Erweckungserlebnis: Anhand der immer gleichen Inhalte konnte man da ansehen, wie einzig durch Verwendung unterschiedlicher CSS-Dateien das Layout anders gestaltet wurde. Bis dahin hatten die meisten Website-Gestalter (mich eingeschlossen) [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[4,10,13,11],"tags":[520,521,2401,522,523],"class_list":["post-2539","post","type-post","status-publish","format-standard","hentry","category-design","category-internet","category-medien","category-multimedia","tag-css","tag-dateien","tag-design","tag-layout","tag-zengarden"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>CSS1K: viel Design mit wenig Code - joachimott journal<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS1K: viel Design mit wenig Code - joachimott journal\" \/>\n<meta property=\"og:description\" content=\"Kann sich eigentlich noch jemand von den \u00c4lteren (h\u00fcstel) an CSS Zengarden erinnern? F\u00fcr viele, die an Websites arbeiten war das ja so etwas wie ein Erweckungserlebnis: Anhand der immer gleichen Inhalte konnte man da ansehen, wie einzig durch Verwendung unterschiedlicher CSS-Dateien das Layout anders gestaltet wurde. Bis dahin hatten die meisten Website-Gestalter (mich eingeschlossen) [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/\" \/>\n<meta property=\"og:site_name\" content=\"joachimott journal\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/joachimott.de\/\" \/>\n<meta property=\"article:published_time\" content=\"2011-07-19T06:32:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg\" \/>\n<meta name=\"author\" content=\"Joachim Ott\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@joachimott\" \/>\n<meta name=\"twitter:site\" content=\"@joachimott\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Joachim Ott\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"1\u00a0Minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/\"},\"author\":{\"name\":\"Joachim Ott\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/#\\\/schema\\\/person\\\/c4aa6cc5cd818b221ccf9975bd0248c5\"},\"headline\":\"CSS1K: viel Design mit wenig Code\",\"datePublished\":\"2011-07-19T06:32:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/\"},\"wordCount\":257,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/wp-content\\\/uploads\\\/110718_css1k.jpg\",\"keywords\":[\"CSS\",\"Dateien\",\"Design\",\"Layout\",\"Zengarden\"],\"articleSection\":[\"Design\",\"Internet\",\"Medien\",\"Multimedia\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/\",\"url\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/\",\"name\":\"CSS1K: viel Design mit wenig Code - joachimott journal\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/wp-content\\\/uploads\\\/110718_css1k.jpg\",\"datePublished\":\"2011-07-19T06:32:14+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/#\\\/schema\\\/person\\\/c4aa6cc5cd818b221ccf9975bd0248c5\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/wp-content\\\/uploads\\\/110718_css1k.jpg\",\"contentUrl\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/wp-content\\\/uploads\\\/110718_css1k.jpg\",\"width\":\"404\",\"height\":\"257\",\"caption\":\"CSS1K: Design mit kleinen CSS-Dateien\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/2011\\\/07\\\/19\\\/css1k-viel-design-mit-wenig-code\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS1K: viel Design mit wenig Code\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/#website\",\"url\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/\",\"name\":\"joachimott journal\",\"description\":\"Weblog von Joachim Ott\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.joachimott.de\\\/journal\\\/#\\\/schema\\\/person\\\/c4aa6cc5cd818b221ccf9975bd0248c5\",\"name\":\"Joachim Ott\",\"sameAs\":[\"http:\\\/\\\/www.joachimott.de\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"CSS1K: viel Design mit wenig Code - joachimott journal","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/","og_locale":"de_DE","og_type":"article","og_title":"CSS1K: viel Design mit wenig Code - joachimott journal","og_description":"Kann sich eigentlich noch jemand von den \u00c4lteren (h\u00fcstel) an CSS Zengarden erinnern? F\u00fcr viele, die an Websites arbeiten war das ja so etwas wie ein Erweckungserlebnis: Anhand der immer gleichen Inhalte konnte man da ansehen, wie einzig durch Verwendung unterschiedlicher CSS-Dateien das Layout anders gestaltet wurde. Bis dahin hatten die meisten Website-Gestalter (mich eingeschlossen) [&hellip;]","og_url":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/","og_site_name":"joachimott journal","article_publisher":"https:\/\/www.facebook.com\/joachimott.de\/","article_published_time":"2011-07-19T06:32:14+00:00","og_image":[{"url":"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg","type":"","width":"","height":""}],"author":"Joachim Ott","twitter_card":"summary_large_image","twitter_creator":"@joachimott","twitter_site":"@joachimott","twitter_misc":{"Verfasst von":"Joachim Ott","Gesch\u00e4tzte Lesezeit":"1\u00a0Minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#article","isPartOf":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/"},"author":{"name":"Joachim Ott","@id":"https:\/\/www.joachimott.de\/journal\/#\/schema\/person\/c4aa6cc5cd818b221ccf9975bd0248c5"},"headline":"CSS1K: viel Design mit wenig Code","datePublished":"2011-07-19T06:32:14+00:00","mainEntityOfPage":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/"},"wordCount":257,"commentCount":0,"image":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#primaryimage"},"thumbnailUrl":"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg","keywords":["CSS","Dateien","Design","Layout","Zengarden"],"articleSection":["Design","Internet","Medien","Multimedia"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/","url":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/","name":"CSS1K: viel Design mit wenig Code - joachimott journal","isPartOf":{"@id":"https:\/\/www.joachimott.de\/journal\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#primaryimage"},"image":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#primaryimage"},"thumbnailUrl":"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg","datePublished":"2011-07-19T06:32:14+00:00","author":{"@id":"https:\/\/www.joachimott.de\/journal\/#\/schema\/person\/c4aa6cc5cd818b221ccf9975bd0248c5"},"breadcrumb":{"@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#primaryimage","url":"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg","contentUrl":"https:\/\/www.joachimott.de\/journal\/wp-content\/uploads\/110718_css1k.jpg","width":"404","height":"257","caption":"CSS1K: Design mit kleinen CSS-Dateien"},{"@type":"BreadcrumbList","@id":"https:\/\/www.joachimott.de\/journal\/2011\/07\/19\/css1k-viel-design-mit-wenig-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/www.joachimott.de\/journal\/"},{"@type":"ListItem","position":2,"name":"CSS1K: viel Design mit wenig Code"}]},{"@type":"WebSite","@id":"https:\/\/www.joachimott.de\/journal\/#website","url":"https:\/\/www.joachimott.de\/journal\/","name":"joachimott journal","description":"Weblog von Joachim Ott","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.joachimott.de\/journal\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Person","@id":"https:\/\/www.joachimott.de\/journal\/#\/schema\/person\/c4aa6cc5cd818b221ccf9975bd0248c5","name":"Joachim Ott","sameAs":["http:\/\/www.joachimott.de"]}]}},"_links":{"self":[{"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/posts\/2539","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/comments?post=2539"}],"version-history":[{"count":4,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/posts\/2539\/revisions"}],"predecessor-version":[{"id":2546,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/posts\/2539\/revisions\/2546"}],"wp:attachment":[{"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/media?parent=2539"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/categories?post=2539"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.joachimott.de\/journal\/wp-json\/wp\/v2\/tags?post=2539"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}