Wer Websites erstellt muss testen, testen und noch mehr testen. Eine kleine Hilfe und Themenübersicht bietet dabei www.seitwert.de. Die Seite wertet andere Homepages anhand bestimmter Kriterien wie z.B. Platzierung bei Google, Fehleranzahl, Referenzierung bei DMOZ usw. aus. Man erhält eine gute Übersicht über häufig gemachte Fehler und kann so auch bessere Einträge in Suchmaschinen erzielen.
Tagclouds sind heutzutage auf (fast) jeder Seite zu finden. Zum Einen erhöhen Sie die Wahrscheinlichkeit bei google und Co eine gute Platzierung zu erreichen und zum Anderen erlauben sie dem Besucher schnell an bestimmte Themen zu kommen.
Hier ist nun ein Script für eine einfache Tagcloud, wie sie auch auf dieser Website zu finden ist.
Die ganze Geschichte benötigt lediglich eine Datenbank in der die Tags drin gespeichert sind. In diesem Beipiel sind sie durch ein einfaches Leerzeichen voneinander getrennt.
$res = mysql_query ("SELECT tags FROM your_database"); $num = mysql_num_rows ($res); while ($row = mysql_fetch_array ($res)){ $data[] = $row['tags'].' ';} $data = implode('',$data); $words = explode(" ", $data); $acv = array_count_values( $words ); $bannedwords = array(''); $i = 0; $count = 0; foreach($acv as $k=>$v) { if (!array_search(strtolower($k),$bannedwords) and eregi("[a-zA-Z]",$k) and $i<=40 and strlen($k)>2) { if (isset($new_acv[strtolower($k)] )) $new_acv[strtolower($k)] += $v; else $new_acv[strtolower($k)] = $v; $i++; $count++; } } ksort( $new_acv ); $i = 0; foreach( $new_acv as $k=>$v) { $size = ($v / $count )* 500; /*Dieser Wert kann je nach Anzahl der Tags Variiert werden*/ $weight = $v*10; $color = '#ccc'; if ($size >= 250) {$size = 250; $color = '#ff9900';} if ($size <= 35) {$size = 40;} $kurl = urlencode("$k"); if ($i < 20){ echo '<a href="index.php?req=search&begriff='.$k.'" style="border: 0px none ; float: left">'.$k.'</a>'; } $i++; } ?>
In Suchfeldern findet man oft die Funktion, dass der Value des input-Feldes verschwindet sobald man hineinklickt. Diese Funktionalität ist aus einer Kombination der Attribute onblur und onfocus realisierbar:
<input name="search" value="Suchbegriff" onfocus="javascript:if (this.value == 'Suchbegriff') this.value = '';" onblur="javascript:if (this.value == '') this.value = 'Suchbegriff';" title="Suchbegriff"/>
XHTML hat den Vorteil, dass eine mit XHTML erstellte Web-Seite einfach auf ihre Gültigkeit überprüft, validiert, werden kann. Mit einem einfachen XML-Parser wird man zum Beispiel darauf hingewiesen, wenn man vergessen hat ein HTML-Tag zu schließen. XHTML im Browser überprüfen XHTML hat den Vorteil, dass eine mit XHTML erstellte Web-Seite einfach auf ihre Gültigkeit überprüft, validiert, werden kann. Mit einem einfachen XML-Parser wird man zum Beispiel darauf hingewiesen, wenn man vergessen hat ein HTML-Tag zu schließen.
<tr>
<td>asdf</td>
<td>muh<td> <!-- Fehler -->
</tr>
Wie man hier sieht, sind solche Fehler nicht immer leicht zu sehen. Hier könnte ein XML-Parser darauf hinweisen, dass das zweite TD-Tag nicht ordnungsgemäß geschlossen wurde. Wie brigen wir aber unseren Browser dazu, einen XML-Parser zu verwenden und uns unsere Fehler anzuzeigen? Die Lösung des Problems ist es, im HTTP-Header mitzuteilen, um was für ein Dokumenten-Typ es sich bei unserer Web-Seite handelt. Normalerweise ist dieser Dokument-Typ text/html. Für XHTML sollte application/xhtml+xml verwendet werden. Wir bedienen uns dazu PHP.
<?php
$charset = UTF-8;
header( 'Content-Type: application/xhtml+xml; charset=' . $charset );
echo '<?xml version=1.0 encoding=UTF-8?>';
?><!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
Dieser Code am Anfang der PHP-Seite sorgt dafür, dass der Browser weis, dass es sich um XHTML handelt. Browser, wie Firefox und Opera, werden uns von nun an anzeigen, wenn unsere HTML-Seite fehlerhaft ist. Wenn einen anderen Zeichensatz als UTF-8 verwendet werden soll, müssen wir die Variable $charset entsprechend anpassen. Meistens verwendet man statt UTF-8 den Zeichensatz ISO-8559-1. Einen Haken hat die Sache allerdings noch. Der Internet-Explorer (zumindest in der Version 6) hat keinen Plan von XHTML. Wenn er den Dokument-Typ application/xhtml+xml sieht, weis er nicht, was er machen soll und bietet die Datei zum Download an, statt sie anzuzeigen. Wir müssen also überprüfen, ob unser Browser weis, was XHTML ist.
<?php
$charset = UTF-8; // Check if browser supports XHTML. IE does not!!!
$does_xhtml = stristr( $_SERVER['HTTP_ACCEPT'], 'application/xhtml+xml' );
if ($does_xhtml) {
header( 'Content-Type: application/xhtml+xml; charset=' . $charset );
} else {
header( 'Content-Type: text/html; charset=' . $charset );
}
echo '<?xml version=1.0 encoding=UTF-8?>';
?><!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
Noch ein weiteres Problem taucht mit dem Internet Explorer auf. Wenn er am Anfang des Dokuments <?xml version=1.0 encoding=UTF-8?> findet, verfällt er in den Quirks-Modus. Dieser Modus ist normalerweise dazu gedacht, um Webseiten anzuzeigen, die nicht standard-konform sind. Das Problem dabei ist, dass der Internet Explorer, dann auch sein eigenes Box-Model verwendet. Das bedeutet, dass die Abstände in CSS-Style-Angaben falsch dargestellt werde. Also unser Layout nicht mehr richtig angezeit wird. Um das zu verhindern geben wir die erste Zeile nur aus, wenn wir sicher sind, dass unser Browser XHTML kann. Unsere Seite sieht nun also folgendermaßen aus.
<?php
$charset = UTF-8; // Check if browser supports XHTML. IE does not!!!
$does_xhtml = stristr( $_SERVER['HTTP_ACCEPT'], 'application/xhtml+xml' );
if ($does_xhtml) {
header( 'Content-Type: application/xhtml+xml; charset=' . $charset );
} else {
header( 'Content-Type: text/html; charset=' . $charset );
}
if ($does_xhtml) {
echo '<?xml version=1.0 encoding=UTF-8?>'
}
?><!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
<html xmlns=http://www.w3.org/1999/xhtml xml:lang=en lang=en>
<head>
<title>Neue Seite</title>
</head>
<body> Text </body>
</html>
Mit diesem Grundgerüst und eine XHTML-Kompatieblen Browser, wie z.B. Firefox, kriegen wir die meisten Fehler die wir machen, angezeit, was die Qualität unseres HTML-Codes deutlich erhöht. Manche Fehler bleiben aber auch für den XML-Parser unentdeckt.
Eine Suchanfrage bei Google verbraucht soviel Strom wie der Betrieb von einer Glühsparlampe in einer Stunde. Aus diesem Grunde stellt Strato nun alle Server auf billigen Öko-Strom um. Ein wichtiger Faktor ist der weiße Hintergrund, der etwa 74 Watt benötigt. Würde Google den Hintergrund schwarz färben so wäre der Verbrauch mit 59 Watt möglich. Zu diesem Ergebnis kam [url=ecoiron.blogspot.com/]EcoIron-Blogs[/url]. Das Ergebnis der Rechnerei wäre ein Stromersparnis von etwa 3000 Megawatt im Jahr. Was gibts da noch zu sagen...
Wer auf seiner Homepage Bilder braucht, aber nicht viel (oder besser noch gar kein) Geld dafür bezahlen will kann sich mal auf [url=www.aboutpixel.de/]www.aboutpixel.de[/url] umsehen. Die AGB's drücken unmissverständlich aus, dass die Bilder sowohl für den kommerziellen als auch nicht kommerziellen Bereich kostenlos sind. Beim durchklicken sind mir eingie gute Bilder aufgefallen. Die Seite scheint sich über den Verkauf von Kunstdrucken zu finanzieren.
Wer Websites erstellt muss Barrierefrei bleiben. Das heißt man muss die erstellt Seite auf Herz und Nieren prüfen. Um diese Testphase zu erleichtern gibt es sehr gute Tools sowohl für den Firefox als auch für den IE. Für den Firefox empfiehlt sich die Web Developer Toolbar, die mit dem w3C Validator verlinkt ist und sehr viele Bedienmöglichkeiten bietet [url=addons.mozilla.org/de/firefox/addon/60] Web Developer[/url] Für den IE gibt es die Web Accessibility Toolbar, die ein ähnliches Spektrum an Funktionalität aufweist [url=www.webforall.info/html/deutsch/aistoolbar.php] Accessibility Toolbar[/url] Desweiteren empfiehlt es sich Multiple IE zu installieren, welches Alle Internetexplorer auf Basis der vorinstallierten dll´s Emuliert. [url=tredosoft.com/Multiple_IE]Multiple IE[/url] [b]UPDATE:[/b] Ich habe jetzt vor kurzem noch ein sehr sehr gutes Tool gefunden. Es ist der Firebug. Ein Plugin für Firefox, dass sehr mächtig ist und ein erfolgreiches Debugging im Firefox ermöglicht. Man findet ihn am besten über die Add-On Funktion im Firefox
Wer schon immer mal wissen wollte, was wirklich hinter dem Platzhalter Text Lorem Ipsum ... steckt, den wird diese Seite intersessieren... www.loremipsum.deWen es nicht interessiert kann auch einfach den guten Generator auf der Seite benutzen...
Eine interessante Ansammlung von Video-Reportagen mit dem Namen Elektrischer Reporter über Computer-Themen findet man auf YouTube. Die Videos finden sich hier. Besonders interessant ist Episode 6 - Hacker und Cracker über die Anfänge von Computer-Enthusiasten (und über die ursprüngliche Bedeutung des Wortes Hackers).
Zwar ist Javascript verpöhnt, da es zuviele Sicherheitsrisiken bürgt, doch wer nicht darauf verzichten will und seine Seite etwas anschaulicher darstellen will, dem empfehle ich [url=mootools.net]mootools.net[/url] Es ist ein sehr gutes xhtml konformes Javascript/Ajax Framework, dass frei benutzbar ist. Unter Demos lassen sich einige Beispielcodes direkt anschauen.