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.

Webhosting kostenlos bei wmw.cc

Ein interessantes Model für kostenloses Webhosting bietet http://www.webmasterwork.com/ an: kostenlosen Webspace gegen Forenbeiträge. Bereits für 2 Posts im Monat bekommt man

• 100 MB Webspace
• 5 GB Transfervolumen
• Keine Werbung
• schneller Server
• 1x MySQL Datenbanken
• 1x FTP Zugänge

Zur Begründung schreiben die Macher:

Das Webspace Paket ist vollkommen werbefrei und wir verdienen damit kein Geld. Im Gegenteil, es kostet uns etwas. Daher vergeben wir ihn nur an User die auf unserer Webseite aktiv sind, d.h. jenach Paket musst du etwas mehr oder weniger aktiv sein und die Post pro Monat im Forum schreiben. (Nicht spammen!) Das ist nicht wirklich schwer, da im Forum viele Themen diskutiert werden und jeder schnell etwas finden sollte wo er mitreden kann. Bitte lass dir bei deinen ersten Beiträgen etwas Zeit, da die Qualität der Beiträge kontrolliert wird.

 

Von PageRank & Co.

Wer sich eingehend über Pageranks Theorie informieren will, der findet in der Wikipedia wichtige Grundlagen.
Sehr interessant zu lesen sind aber auch die Webseiten von Franz Embacher (http://homepage.univie.ac.at/Franz.Embacher/Lehre/aussermathAnw/Google.html) und eFactory (http://pr.efactory.de/d-index.shtml).

Den Praxistest macht http://www.prchecker.info/. Dort gibt es einen einfachen Pagerank-Test. Der Button für die eigene Webseite wird gleich mitgeliefert. Wesentlich umfangreicher sind die Prüfungen, die auf http://www.database-search.com/ durchgeführt werden.

Dort hat man (bereits ohne Anmeldung) die Möglichkeit, einen Schnelltest durchzuführen. Dabei kann man entweder bestehende Links oder auch Seiten ohne Angabe von weiteren Linkdaten auf deren allgemeine Linktauglichkeit prüfen.

eBooks und Lernprogramme auf c't-Heft-DVD 2009

Neben umfangreichen Softwaresammlungen enthalten die DVD-Beilagen der Computerzeitschrift c't häufig auch eBooks und andere explizit für Lernzwecke aufbereitete Software.
Ich habe hier eine Auswahl derartiger Materialien zusammengestellt.

ct Heft 24/2009 Software-Kollektion 6

Die ct-Software-Kollektion 6/2009 aus dem Heft 24/2009 enthält Software zu den Themen Systemwerkzeuge und Hardware-Diagnose sowie diverse Spiele, darunter auch eine ganze Reihe von Spezialversionen und Vollversionen.

Auf dieser DVD sind keine eBooks enthalten. Es gibt jedoch eine c't-Spezialversion des Chess-Tutor mit insgesamt 4 Lektionen und einer Bonus-Lektion.

ct Heft 17/2009 Software-Kollektion 5
Die ct-Software-Kollektion 5/2009 aus dem Heft 17/2009 enthält einen kompletten Fotoworkshop nebst Software zur Fotobearbeitung.
Passend zu diesem Thema gibt es zwei Video-Tutorials:

• Techniken zur Bildmontage und -retusche mit GIMP
• Portraitretusche mit Photoshop.

ct Heft 13/2009 Software-Kollektion4
Die ct-Software-Kollektion 4/2009 aus dem Heft 13/2009 widmet sich den Themen Audio und Video sowie Internet. Die Lerninhalte konzentrieren sich auf das Thema Internet:

• es gibt Auszüge aus dem Videotraining JavaFX - Einstieg für Anspruchsvolle aus dem Hause Addison-Wesley
  
• komplett enthalten ist JavaScript und AJAX - Das umfassende Handbuch von Galileo Computing

Eine Gesamtübersicht der online lesbaren bzw. auch zum Herunterladen bereitgestellten Bücher von Galileo Computing gibt es hier:
http://www.galileocomputing.de/katalog/openbook

Softwarekollektion 6 der Compuerzeitschrift ct 24/2009

Vor wenigen Tagen erschien die Softwarekollektion Nummer 6 des Jahres 2009 im Heft 24/2009 der Computerzeitschrift ct. Diese Ausgabe widmet sich den Themen Spiele, Systemwerkzeuge und Hardwarediagnose.

Vor allem bei den Windows-Spielen gibt es, wie fast immer auf den ct-Heft-DVD üblich, etliche Spezial- und Vollversionen, so u.a. Chess Tutor, Leela, Master, Shredder Classic 4, Windchaser und Zoo Empire

Firefox mit Tarnkappe

general.useragent.locale von de auf es
general.useragent.extra.firefox von Firefox/3.0.15 auf Googlebot/2.1 (+http://www.google.com/bot.html)