Ähnliche Beiträge
- Im Working Draft
- Simple Media Queries Debugging
- Promote MDN | Mozilla Developer Network
- Git Cheat Sheet Interaktiv
- php-Console mit Chrome und WordPress
- Schriftarten für Coder unter Linux
Journal
- Trend. Meiner.
- WordPress mehrsprachig nutzen – ein Lösungsvorschlag
- Besser die Wahrheit?
- Einschränken der Daten-typen im WordPress Upload
- Trenne Logik von der Ausgabe, mittels Hooks in WordPress
Projekte
Abonniere die neusten Artikel via Sidebar
ein-/ausblenden
3. CSS Naked Day, 9.April 2008
Anzeige
Das dritte Jahr in folge findet der CSS Naked Day statt. Das erste und zweite Jahr der Aktion waren gute Erfolge und nun rückt der dritte Termin an.
German, English, Spanish, Thai, Chinese, [Korean 01, Korean 02]
Die Idee
Hinter dieser Aktion steht die Idee die Webstandards zu fördern. Dazu gehören der korrekte Gebrauch von (x)HTML, semantisches Markup, hierarchische Struktur und zu letzt das Spiel der Wörter - der Inhalt. Es ist an der Zeit, deinen <body> der Öffentlichkeit zu zeigen. Damit zeigt man, dass gute Webseiten auch ohne Design leserlich sind.
Wie macht man mit?
Fülle das kleine Formular aus und deine Webseite wird in die offizielle Liste aufgenommen.
Am 9.April 2008 werden alle Formatierungen der Webseite entfernt, völlige Befreiung vom Design.
(optional): Setze den folgenden Hinweis am obersten Punkt deiner Seite.
<h3>What happened to the design?</h3>
<p>To know more about why styles are disabled on this website visit the
<a href="http://naked.dustindiaz.com" title="Web Standards Naked Day Host Website">
Annual CSS Naked Day</a> website for more information.</p>
Dieser Hinweis dient unter anderem als Hinweis für deine Besucher und sie wissen schnell warum und wieso dein <body> nackt ist.
Warum wieder?
Einige Leser sind interessiert und wollen wissen, warum es am 9.April zu dieser Aktion kommt.
- Die Aktion soll auf einen Dienstag, Mittwoch oder Donnerstag fallen (Viel-Traffic-Tage)
- Möglichst in der ersten Woche des April
- Es soll nie am 1.April sein (internationaler Scherz- und Streichtag)
- Es soll ausreichend Zeit zur Ankündigung sein
Einbinden via PHP
Um die nackten Tatsachen zu zeigen, kann man mittels PHP-Funktion den Naked Day automatisch einleiten. Folgende Funktion dient dieser Aufgabe.
WordPress User hinterlegen diese Funktion beispielsweis ein der Datei functions.php oder direkt im Template, die header.php. Alternativ kann auch das Plugin „WordPress Naked Day“ genutzt werden.
<?php
function is_naked_day($d) {
$start = date('U', mktime(-12, 0, 0, 04, $d, date('Y')));
$end = date('U', mktime(36, 0, 0, 04, $d, date('Y')));
$z = date('Z') * -1;
$now = time() + $z;
if ( $now >= $start && $now <= $end ) {
return TRUE;
}
return FALSE;
}
?>
Die Funktion gibt TRUE aus, wenn es sich um den 9.April 2008 handelt. Daher gilt es nun die Funktion auszuwerten und jeweils zu reagieren. Dazu muss der Link zum Stylesheet in die if-Abfrage.
<head>
...
<?php
if ( is_naked_day(9) ) {
echo '<!-- Naked Day hat kein Style -->';
} else {
echo '<link rel="stylesheet" type="text/css" href="styles.css" />';
}
?>
...
</head>
In WordPress sollte das dann in der header.php eingepflegt werden. Das könnte dann beispielsweise so aussehen:
<?php
if ( is_naked_day(9) ) {
echo '<!-- Naked Day hat kein Style -->';
} else {
<style type="text/css" media="screen">
@import url(<?php bloginfo('stylesheet_url'); ?>);
</style>
}
?>
Tools und Plugins
Die Aktion ist unter einer ganzer Reihe von Entwicklern bekannt und so gibt es auch eine große Anzahl von Tools und Plugins um die Aktion zu unterstützen. Schau die auf der Aktions-Seite um, dort findet man eine aktuelle Liste der Tools und Plugins; um nur Einige zu nennen: WordPress Plugin, PHP class, Rails Helper, Serendipity Plugin, LifeType Plugin, ...
34 Kommentare und 19 Trackbacks zu „3. CSS Naked Day, 9.April 2008“
Kommentar schreiben
Kommentar-Hilfe
händischer Spam:
Beachte die Kommentarregeln, jede Form von versuchtem Spam wird gelöscht. Warum und wieso steht in einem meiner Beiträge.
Bezug auf Textstellen:
Du kannst direkt bezug auf Textstellen im Beitrag nehmen. Dazu muss lediglich der Bereich im Artikel markiert werden; daraufhin erscheint ein Button, der den markierten Text in das Kommentarfeld übernimmt und als Zitat auszeichnet. Die Funktion ist nur bei aktivem JavaScript nutzbar.
xHTML:
Du kannst folgende Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <blockquote cite=""> <code> <pre> <em> <strong> <strike> <ul> <ul> <li>
Achte darauf, wenn du Code im Kommentar hinterlegen willst, dann muss der Code maskiert sein. Dann wird er nicht interpretiert. Der Code muss mit Hilfe von HTML-Entities dargestellt werden, d.h. dass man z.B. < als < und > als > einfügt.
E-Mail-Benachrichtigung bei neuen Kommentaren ?
Wenn der Haken in der Checkbox gesetzt ist, dann wirst du über neue Kommentare vie E-Mail informiert. Der Versand erfolgt nur, wenn du die URL in der Bestätigungs-E-Mail genutzt hast oder schon Abonnent hier im Blog bist.
Kommentar erscheint nicht:
Alle Kommentare werden manuell geprüft, freigegeben und nach Möglichkeit beantwortet. Bitte um etwas Geduld und Nachsicht.
Identifikationsbilder (Avatare):
Auf Gravatar.com kann man sich mit seiner E-Mail-Adresse registrieren und ein Bild hochladen, dann erscheint dieses Gravatar hier und in vielen weiteren Blogs.
Spamschutz:
Das Kommentarformular ist mit einem Spamschutz ausgerüstet. Solltest du diesen Artikel ohne JavaScript besuchen und kommentieren wollen, so muss du die Frage beantworten und das jeweilige Wort in das Textfeld eingeben.
Das Weblog wird angetrieben von
8. April 2008 um 00:00
8. April 2008 um 07:27
8. April 2008 um 09:55
WordPress schaut aber ohne CSS sche.. aus!!!
8. April 2008 um 12:17
Ein "Disable Styles" in der Webdeveloper Toolbar des FF tuts auch... ich überlasse es lieber den User mich "auszuziehen" und verwirre andere nicht unnötig damit.
8. April 2008 um 16:43
8. April 2008 um 16:49
Muss man das als "meme" oder "hype" verstehen? Finds absurt, da nur die Leute das Konzept dahinter verstehen, die sich eh mit CSS auseinander setzen. Alle anderen (zahlenden Auftraggeber) gehen warscheinlich verwirrt weiter...
8. April 2008 um 16:50
Calaelen, Gnome an die Macht » womit du sicher recht hast, aber das ist der Vorteil, wenn man das Blog als Hobby betreibt - man kann sich solchen Ideen hingeben
8. April 2008 um 17:37
Kannte die Aktion noch gar nicht. Prinzipiell natürlich eine gute Idee, nur werden die meisten wirklich nicht verstehen, was dahinter steckt.
Dennoch hast du Recht - als privater Blog kann man das schonmal machen. Bei meinen kommerziellen wäre mir der Verlust du groß.
8. April 2008 um 18:48
Es gibt Hypes, denen muss man nicht folgen. Gerade so etwas ist doch einfach nur "unlustig", da genau die Menschen, die sich Webseiten anschauen, meistens nicht die sind, die so eine Aktion überhaupt werten können. Anstatt eines HTML-Unlayouts denken die meisten, die Seite sei kaputt und gehen wieder.
8. April 2008 um 18:58
8. April 2008 um 19:07
Ähm, ich glaube, dass „It's time to show off your <body>.“ nicht ganz korrekt übersetzt ist. Heißt es nicht eher „Es ist Zeit, Dein(en) <body> zu zeigen.“
8. April 2008 um 19:33
Christian Heß-Grünig » korrekt, aber ich habe lediglich die Idee und den Inhalt wieder geben wollen, keine Übersetzung im wörtlichen Sinne liefern, dazu ist mein leider Englisch zu schlecht.
8. April 2008 um 20:22
Oh man. Ich dachte im ersten Moment der Firefox hat nen CSS-Bug oder aber das deine Seite nur noch mit JS schön aussieht... *g*
8. April 2008 um 20:37
8. April 2008 um 20:49
8. April 2008 um 23:00
das ist der allergrösste quatsch. aufwand betreiben damit die webseite nicht mehr funktioniert, also nicht mehr zu gebrauchen. man kann auch alles weiss machem, also vordergrund- und hintergrundfarbe weiss einstellen, dazu alle bilder weiss machen, ebenso die filme. warum? weil mans kann - spring doch aus dem fenster raus, nur weil alle anderen auch rausspringen - (bitte NICHT!) dumme können nicht anders, besonders dumme müssen die extrawurst aufhängen.
die aktion ist der allerletzte schrott.
8. April 2008 um 23:19
8. April 2008 um 23:31
roland » Deine Vorschläge haben aber nichts mit Webstandards oder Barrierefreiheit zu tun.
9. April 2008 um 00:00
9. April 2008 um 00:16
Sehr gut, ich mach mit!
9. April 2008 um 07:12
9. April 2008 um 07:45
9. April 2008 um 07:49
Prinzipiell ist das eine ganz gute Idee, auch wenn es tatsächlich ein wenig Preaching To The Coven ist - es verstehen erstmal nur die, die sich sowieso mit Webstandards und Semantik auseinandersetzen. Die anderen reagieren so wie Roland. Tatsächlich ist es aber sinnvoll, sich mal mit der Struktur der Seite auseinanderzusetzen. Bei den meisten Seiten ist auch die Navigation eines der ersten Elemente im Quelltext, so wie auch hier - und was mir auffällt, ist, dass man mit der nackten Seite grössere Schwierigkeiten hat, den eigentlichen Inhalt zu finden. Ich muss erst einmal eine recht lange Navigation (im visuellen Design die linke Spalte) wegscrollen, bevor die Artikel lesbar sind.
Als Konsequenz aus dieser Beobachtung habe ich bei mir die Navigation im Quelltext nach den Inhalten positioniert und hole sie mit entsprechenden float-Anweisungen für die visuelle Ausgabe nach links. Auch macht der Einsatz von [hr] Tags für die Strukturabgrenzungen ohne CSS Sinn, die dann durch display:none im "visuellen" CSS rausgenommen werden.
Aber die wenigsten "normalen" Besucher der Website werden verstehen, was das soll und wieso es eine gute Idee ist, obwohl es vermeindlich hässlich aussieht.
9. April 2008 um 08:19
was soll dieser Unsinn? Soll man jetzt zu der Aktion sagen sagen "Willkommen HTML 1.0"
. Man gibt sich immer Mühe die Webseite grafisch mit Bildern und CSS so umzusetzten das es einen gefällt und dann soll ich alles ausschalten. Ne ich glaube nicht. Das ist ja als ob man alle Klamotten auszieht und dann auf die Straße rennt. OK manche Menschen machen das, aber ich gehöre nicht dazu.
9. April 2008 um 08:23
Webrocker » Die Navi vor den Inhalt zu holen macht aber SEO- und Besuchertechnisch sinn. Die Erweiterung via hr ist eine klasse Lösung und oft vergessen. Aber da zeigt sich ja, dass die Aktion auch positive Seiten hat - man denkt drüber nach.
9. April 2008 um 08:38
9. April 2008 um 09:42
9. April 2008 um 09:55
@Frank (12):
)
Sollte auch keine bösartige Kritik sein. Wenn Du nicht darüber berichtet hättest, hätte ich ja nicht einmal von der Aktion mitbekommen. Und das, wo ich wirklich häufig Webstandards predige
Ich hatte es auch nur deswegen erwähnt, weil Deine Übersetzung meines Erachtens ziemlich das Gegenteil aussagt. (Meine Englischkenntnisse sind beileibe auch nicht perfekt, aber gerade deshalb dachte ich mir, wäre ein kurzer Hinweis gern gesehen.)
9. April 2008 um 11:10
9. April 2008 um 13:22
9. April 2008 um 13:37
Und, wie viele Besucher verlassen aufgrund dessen nun vorzeitig die Seite? Wahrscheinlich ein vielfaches mehr an Abbrüchen, würde ich mal behaupten.
Gruß,
Steini
9. April 2008 um 14:10
9. April 2008 um 15:04
@Steini » Eventuell kann ich später was dazu sagen, wenn ich es auswerte sollte.
9. April 2008 um 15:05
Christian Heß-Grünig » Ich schau drüber und ändere es, danke dir!
9. April 2008 um 15:16
@Frank - wäre mit Sicherheit mal interessant zu sehen, wie das Besucherverhalten auf ein CSS freies System ist.
9. April 2008 um 15:46
9. April 2008 um 19:50
10. April 2008 um 07:57
10. April 2008 um 09:33
Hallo Frank,
wenn Du für die Suchmaschinen schon unbedingt die Navi zuerst haben musst, dann wäre es für die Besucher wirklich sinnvoll, einen Link gleich oben vorzufinden, der da heißt "Direkt zum Seiteninhalt" - auch der kann ja per css visuell versteckt werden.
)
Alternativ und das finde ich noch ein Stück eleganter und sinniger, die ich Webseiten prinzipiell zuerst für die Menschen und dann für die Maschinen mache
, zuerst den Inhalt auszugeben und die Suchmaschinen per Link zur Navigation zu führen, die dann später im Code auftaucht.
Übrigens: der Naked CSS-Day ist vorbei
Es grüßt
Freddy
10. April 2008 um 10:24
@Freddy » Danke für die nützlichen Hinweise, die ich auch voll verstehe und unterstütze. Leider mangelt es an zeit um sie umzusetzen, das ist eben nur Hobby.
Naked Day ist noch nicht vorbei, denn auf Grund der Zeitverschiebung ist er noch aktiv.
10. April 2008 um 10:26
Naja, wenn nicht Du, dann vielleicht andere. Kommen ja viele hier vorbei.
Und ich hoffe, die Zeitverschiebung bringt dann bald das Ende des Naked CSS-Days...
Herzlich grüßt: Freddy
10. April 2008 um 10:30
@Freddy: Aber das ist eigentlich das schöne, dass man mal die Defizite sieht.
Ebenso herzliche Grüße.
Nur mal als Anmerkung: ich möchte das Design vieler Seiten nicht missen, dazu gibt es viel zu schöne Seiten, aber die Aktion gefällt mir und zeigt eine ganze Reihe von Problemen und meiner Diskussion mit Leuten, die noch immer via Drag&Drop Seiten bauen ist verständlicher, wenn auch nicht fruchtend, denn die reden immer über den Preis.
10. April 2008 um 15:10
Absoluter Mumpitz! Ziel der Aktion soll doch u. a. "der korrekte Gebrauch von (x)HTML" sein. Tatsächlich enthält die Seite
http://naked.dustindiaz.com/lauthttp://validator.w3.org/zur Zeit 42 Validierungsfehler. Oder habe ich da was missverstanden?10. April 2008 um 15:35
Ich find’s auch an sich eine gute Idee, aber tatsächlich verstehen werden es doch die wenigsten, eben die, die sich mit diesen Dingen auch ständig beschäftigen. Aber an die ist das ja auch adressiert. Den normalen User wird es wohl eher irritieren, wenn er auf eine Seite ohne Design gelangt, und er wird die wohl schnell wieder verlassen. Vielleicht gibt es ja bald einen neuen Trend zu CSS-freien Seiten
10. April 2008 um 15:38
Die Startseite hier ist auch nicht valid...
11. April 2008 um 11:39
25. August 2008 um 23:09
Ist zwar schon ne Weile her, aber bei solchen (guten) Aktionen wissen die meisten Leute leider nicht den Grund, warum diese stattfinden. Wie gesagt, leider.
10. Februar 2009 um 00:18
ahje...der titel hatte mir mehr verpsrochen
aerb trotzdem, geniale idee sollman öfter weiderholen!
27. Februar 2009 um 16:19
Na ja, 9. April 2008 war doch aber schon...
27. Februar 2009 um 16:21
Korrekt, es gibt aber wieder einen neuen Naked Day, am 9.April 2009, siehe aktueller Beitrag.
2. März 2009 um 21:08
Moin! Feiner Gedanke, weil er zum Nachdenken anregt, aber mit konzeptionellen Fehlern:
Natürlich kann man seine Besucher vor eine nackte Seite stellen und den Codeschnipsel von Dustin zur Erläuterung einsetzen. Die Texte auf Dustins Zielseite und auf den Übersetzungen sind aber nur was für Geeks und nix für Kunden. Wenn ich das unseren Agenturkunden vorsetze, erklären uns die Kunden für verrückt. Es müssen also taugliche Texte her, die in einem einfachen Deutsch erklären, was das soll.
Außerdem halte ich eine moderne Webseite ohne Styles schlicht für unzumutbar. Durch die heute anerkannten und üblichen Markup-Techniken werden zB Navigationsmenüs zu echten Monstern, die nur durch unzählige Springmarken und eben gerade Design zu zähmen sind. Webseiten also nackig machen wird dem (sehenden) Laien also nichts demonstrieren außer der Feststellung, dass sie sich auf der Seite vorher "irgendwie besser zurechtgefunden haben".
Viele Grüße,
Carsten.
8. April 2009 um 19:55
Hehe ich dachte erst das die Seite kaputt ist oder meine Cache mal wieder Kaputt
Ich verstehe nicht ganz wozu es dient aber mal was neues.
12. Mai 2009 um 11:29
Danke für den Informativen Artikel. Grundsätzlich Top Idee, allerdings können nur Leute was damit anfangen die sich auch in der Materie auskennen, alle anderen dürfte es nur noch mehr verwirren.