Geräteabhängige CSS

iPhone & Co. sind auf dem Vormarsch. Waren früher kaum mehr als 3-4 unterschiedliche Bildschirmauflösungen üblich reicht die Spanne heute von der Kinoleinwand bis zur handtellergroßen Guckfläche. Wie geht man mit diesem Umstand als Webdesigner um?

Eine mögliche Lösung sind sogenannte Media-Queries, bei denen in Anhängigkeit von der Bildschirmauflösung des Webseitenbesuchers unterschieliche Stylesheets aktiv werden.

Michael Jendryschik erklärt in seinem Artikel

Geräteabhängige Stilvorgaben mit CSS Media Queries

auf heise.de wie es geht.Artikel lesen. Empfehlenswert sind auch die Diskussionsbeiträge der Leser.

Soundschnippsel erzeugen

Mit der Flash-Anwendung nudge erstellt Sound-Muster. die man auf der eigene Homepage einbinden. Zur Verfügung stehen 8 unterschiedliche Soundmuster (u.a. Rhode Bass, Orgel, Frogster).  Die Beatfolgen können unterschidelich lang sein und die Geschwindigkeit kann auch variiert werden.
http://inudge.net/

Online-Painting mit HTML5 und Canvas

Einen sehr schönen Einblick in die Funktionsmöglichkeiten von HTML5 bietet die Website MUGTUG mit dem Sketchpad.
Sketchpad ist beinahe ein voll funktionsfähiges Grafikprogramm mit einem gut gefüllten Werkzeugkasten:

• Textwerkzeug
• Gradienten
• verschiedene Formen wie z.B. Polygone und Ellipsen
• einem Stempel mit vorgefertigten Elementen.

Leider ist es nicht möglich, eine Grafik zu laden und auch mit Ebenen kann Sketchpad nicht arbeiten.

Einen Überblick über weitere Online-Grafik-Programme bietet die Übersicht zu Online-Tools bei skywalk-webdesign.

CSS - kommt CSS3 endlich mal aus den Puschen

Seit dem Jahr 2001 steht CSS3 in den Startlöchern und kommt nicht voran. Die Roadmap zur Einführung von CSS3 http://www.w3.org/TR/css3-roadmap/ wurde seitdem nicht mehr aktualisiert.
Ich habe allerdings den Eindruck, dass mit den neuen Browser-Generationen doch Bewegung in die ganze Angelegenheit zu kommen scheint.
Am Anfang sollte man zunächst mal den eigenen Browser testen: Firefox 3.5 passiert diese Testsuite http://www.css3.info/selectors-test/test.html fehlerfrei.
Wer sich anschauen will, was es mit box-sizing, border-image, text-shadow und ähnlichen CSS3-Features auf sich hat, der findet hier eine Testsuite http://www.css3.info/preview/. IE-Surfer schauen wie üblich die Röhre.
Die Nutzung wird hier http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/ erklärt. IE8-Nutzer erwartet ein kleiner Lichtblick. Allerdings muss ihnen doch noch eine kleine Extra-Wurst gebraten werden. Das dazu erfroderliche Grillgerät namens WEFT stellt Microsoft wenigstens zur Verfügung:
http://www.microsoft.com/typography/WEFT.mspx.
Wie schon erwähnt gehen die IE8-Nutzer bei den meisten CSS3-Features leer aus.Einge Dinge kann man allerdings mit sogenannten Filtern nachbauen: http://msdn.microsoft.com/en-us/library/ms673539%28VS.85%29.aspx.
Auf einige Besonderheit von Safari und Opera wird hier
http://webkit.org/blog/130/css-transforms/
http://dev.opera.com/articles/view/css3-border-background-boxshadow/
Bezug genommen.

Acai die Urwaldbeere als neue Superfrucht

Von einer Superfrucht ist mal wieder in einigen einschlägigen Webportalen die Rede: Acai (manchmal auch Assai geschreiben auch als Kohlpalme, lat.:Euterpe oleracea bezeichnet, brasilianisch eigentlich Açaí)
So sollen z.B. auf der Fachmesse BioFach 2010 einschlägige Produkte präsentiert werden.
So steht in einem Werbeartikel

Die kleine exotische Acai-Beere erlebt derzeit einen Aufschwung wie keine andere tropische Frucht. Mittlerweile gilt Acai in Südbrasilien als Fitnessfrucht und Lifestylegetränk, und eroberte von Rio aus die USA und Fernost, wo sie namhafte Sportler und Schauspieler begeistert hat.

Verschwiegen wird dabei, dass der Hype weniger aus den hier nicht bestrittenen positiven Eigenschaften der Frucht resultiert sondern vielmehr aus einer gigantischen Marketingwelle.

Wikipedia fasst die positive Wirkung wie folgt zusammen:

Der Gehalt an Antioxidantien ist nicht höher als in vielen anderen Früchten. Die versprochenen Wirkungen, von Gewichtsabnahme bis zur sexuellen Stimulation, sind nicht wissenschaftlich bewiesen.

Wenn man im Internet nach dieser sicher sehr leckkeren Bbeere recherchiert, dann findet man immer die gleichen Namen. Einer von ihnen scheint Karl-Heinz Smuda zu sein.

Impressum

Zum Thema Impressum, insbesondere auch die Art des Impressums der folgende, auf
http://www.linksandlaw.info/Impressumspflicht-Notwendige-Angaben.html

Nicht genügend ist es, wenn der Link in Form einer Grafik auf die Angaben verweist, weil die Darstellung von Graphiken im Browser deaktiviert sein könnte (Stickelbrock, Barbara, "Impressumspflicht" im Internet - eine kritische Analyse der neueren Rechtsprechung zur Anbieterkennzeichnung nach § 6 TDG, GRUR 2004, 111, 114; Woitke, Thomas, Das "Wie" der Anbieterkennzeichnung gemäß § 6 TDG, NJW 2003, 871, 873).

Zwar ist hier komischerweise nur vom Link die Rede, die Aussage dürfte erst recht aber auch für das Impressum selbst gelten.

In der Hauptsache geht es ja um die E-Mail-Adresse, die man schützen möchte, dazu kann man dieses genrator verwenden
http://www.vision-impress.de/eta-generator.php

Schriftarten auf Webseiten

Internetbenutzer, die noch wenig Erfahrung mit der Gestaltung von Webseiten haben, neigen dazu, möglichst außergewöhnliche Schriftarten bei der Gestaltung ihrer Homepage zu verwenden. Abgesehen von den ästhetischen Aspekten wird dabei oft nicht bedacht, dass das nur selten sinnvoll ist, denn angezeigt werden auf normalen HTML-Seiten nur Schriftarten, die auch auf dem PC des Webseiten installiert sind.

Wenn man sich einen Überblick über die Häufigkeit der Installation bestimmter Schriftarten machen will, dann ist die Übersicht auf
http://www.codestyle.org/css/font-family/sampler-WindowsResults.shtml
sehr hilfreich.

Dort kann man sich auch eine Schriftartenzusammenstellung für die CSS-Datei zusammenbasteln.

Gimp-Tutorials 3D-Logo erstellen

In der schier unerschöpflichen Welt der GIMP-Tutorials habe ich eine qulitativ wirklich hochwertige Website ausfindig gemacht:
http://www.gimpusers.de/tutorials.php
Ich bin auf dieses Tutorial gestoßen, weil ich ein
3D-Logo erstellen wollte. Daneben gibt es eine Reihe Tutorials verschiedenster Art, z.B. um glühende Augen zu erzeugen oder jede Menge Texteffekte.

Thingamablog - Offline-Programm zum Bloggen

Für Internetnutzer, die nicht über PHP-fähigen Webspace verfügen, ist es nicht so einfach Blog-artige Webinhalte ins Netz zu stellen. Das es doch möglich ist beweist Thingamablog.
Nachdem es längere Zeit ruhig bei Thingama war, wurde Ende vorigen Jahres die Version 1.5.1 dieses interessanten Programmes veröffentlicht.
Mit Thingameblog werden die Bloginhalte zunächst auf dem PC lokal erstellt und dann via FTP auf den Webspace übertragen. Thingamablog bietet sogar die Option, via E-Mail zu bloggen (habe ich allerdings noch nicht getestet).
Thingamablog benötigt eine Java-Laufzeitumgebung, ist somit aber eben auch weitgehend betriebssystemunabhängig einsetzbar.
Den Download sollte man auf jeden Fall auf der Projektseite von Thingamablog erledigen, da auf einigen deutschsprachigen Websites noch veraltete Versionen kursieren.
Anleitung, Hile und Tricks zu Thingamablog in deutscher Sprache bietet:
Der Thingamablog-Blog

getElementsByClassName

Es gibt zwar getElementById, getElementsByName und getElementsByTagName aber ein getElementsByClassName wäre manchmal auch nicht schlecht.

Herr Dr. Thomas Meinike hat sich die Mühe gemacht und eine entsprechende Funktion nachgebildet. Das Beispiel dazu gibt es hier:
http://www.styleassistant.de/tips/beispiel100.htm. Die in diesem Beispiel verwendete Funktion sieht so aus

function getElementsByClassName(class_name)

{

var all_obj,ret_obj=new Array(),j=0,teststr;

if(document.all)all_obj=document.all;

else if(document.getElementsByTagName && !document.all)

all_obj=document.getElementsByTagName("*");

for(i=0;i
{
if(all_obj[i].className.indexOf(class_name)!=-1)
{
teststr=","+all_obj[i].className.split(" ").join(",")+",";
if(teststr.indexOf(","+class_name+",")!=-1)
{
ret_obj[j]=all_obj[i];
j++;
}
}
}
return ret_obj;
}

Die 1 Euro-Website bei InterNetWORX

Für einen symbolischen EURO bekommt man werbefreien WEBSPACE bei InterNetWORX. Eine auf  InterNetWORX gehostete Beispielwebseite findet man hier: http://bolivien.i-networx.de/. Für diesen symbolischen Beitrag bekommt man:

• 5 MB Webspace
• für 1000 Dateien
• unbegrenztem Traffic
• ohne Werbung
• mit FTP-Zugriff
• mit PHP. Das Angebot beinhaltet allerdings keine MYSQL-Datenbank. Es reicht aber für einfache PHP-Anwendungen und man kann sogar ein CMS einrichten, wenn man z.B. mociloCMS verwendet.
  Dazu hier ein Beispiel: mociloCMS bei InterNetWORX
  

Weitere Einrichtungsgebühren fallen nicht an.

Zusätzlich

• gibt es einen kostenlosen Chat, den man auf der eigenen Website (auch bei einem anderen Hoster) einbauen kann. So sieht der Chat aus: http://bolivien.i-networx.de/chat.htm.
  
• gibt es einen grafischen Counter
• kann man bis zu 10 kostenlose E-Mail-Adressen mit unterschiedlichen Domainendungen einrichten. Diese Freemail-Adressen können an eine schon bestehende E-Mail-Adresse weitergeleitete werden.
• wird eine kostenlose Form2Mail-Funktion angeboten.
• gibt es ein Gästebuch, das in die eigenen HP eingebaut werden kann. Die Startseite des Gästebuches sieht so aus http://bolivien.i-networx.de/gaestebuch.htm.
  
• kann man einen Newsletterservice einrichten. Beispielseite zum Eintrag/Austragen für den Newsletter
  
• kann man Subdomains einrichten unter denen mittels Frame-Redirekt auf bestehende Webseiten verwiesen wird.
• 
  

Suche für die eigene Website

Viele Website-Macher wünschen sich eine Suchfunktion für die eigene Webseite. Es gibt zunächst eine ganz einfache Möglichkeit, so etwas umzusetzen: Man erstellt einfach einen Blog bei Blogspot.com. Eine weitere Möglichkeit bietet das neue Angebot von Google namens Sites. Auch dort ist eine Suchfunktion ganz selbstverständlich bereits eingebaut. Ein Beispiel gibt es hier: Flashmaster-Webseite.
Ansonsten bietet sich der externe Dienst an, den http://www.crawl-it.de/ bereitstellt.
Dort kann man zwischen 6 verschiedenen Tarfifen von 0 bis 229 Euro/Jahr wählen. Die beiden kostenlosen Tarife sind werbefinanziert.

Webdesignerkummerbeheber: IE8 IE7 IE6 und IE5.5

Auch wenn sich mit der Version 8 einigees getan hat bleibt der IE Webdesigners größter Kummer. Das ganze wird durch die vielen versionen nicht leichter. Anders als bei FF, Opera und wie sie alle heißen scheinen nämlich die IE-Nutzer irgendwie update-faul zu sein. Obwohl IE8 ja nun schon geraume Zeit zu haben ist, kamen z.B. im November 2009 immer noch fast 12% mit IE7 und knapp 4% mit IE6 auf meine Webseiten.

Was macht nun der leidgeprüfte Webentwickler, um diese ganze Browservielfalt zu testen? Eine geniale Hilfe ist IE Tester. Mit diesem Tool hat man Zugriff auf IE 5.5, IE6, IE7 und IE8. Herunterladen hier:
http://www.my-debugbar.com/wiki/IETester/HomePage

Geschichte - Wissen von Profis

Eine Vielzahl übergreifender und regionaler geschichtlicher Themen werden auf der Wiki-Seite der Lernwerkstatt Geschichte des Historischen Seminars der Leibnitz Universität Hannover behandelt. Die Texte sind oft sehr speziell, aber ungeheuer informativ und interessant zu lesen.
Unter der Überschrift

Danach sah ich ein riesiges dunkles Gebilde wie ein Ei

gibt es zum Beispiel eine Artikel über die Kosmischen Visionen der Hildegard von Bingen.
Auch zur Geschichte Afrikas gibt viele Artikel, z.B. über Transatlantischen Sklavenhandel. Zu meinem Leidwesen musste ich jedoch feststellen, dass Lateinamerikanische Geschichte, obwohl angeblich ein Schwerpunkt der Einrichtung, bisher nur mit einem Linkverzeichnis behandelt wird.
Alles in Allem aber eine ausgesprochen interessante Website, die unter dieser Adresse
http://www.lwg.uni-hannover.de/
zu finden ist.

HTTP-Header auslesen

Ein Online-Tool zum Auslesen des HTTP-Headers findet man auf der Webseite der Full Service Agentur für Internet Projekte open-eye.
Der Direktzugriff erfolgt über http://elmar-eigner.de/_freetools/http-header-auslesen.php.
Außerdem findet man auf dieser Webseite einige mäßig aufregende Tutorials. Möglicherweise interessant scheint mir allerdings das Tutorial XHTML und target=_blank in Links.
Interessanter scheinen mir da einige weitere Online-Tools, so u.a. ein Tool zu Codieren von Strings, (für Base64, UTF-8 und URL).
Den GoogleMap Script Generator konnte ich leider nicht testen. Die Seite kam einfach nicht hoch.