Freitag, 10. Dezember 2010

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.

Samstag, 15. Mai 2010

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/

Donnerstag, 25. März 2010

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.

Montag, 15. Februar 2010

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.

Dienstag, 19. Januar 2010

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.

Montag, 18. Januar 2010

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

Samstag, 16. Januar 2010

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.

Freitag, 15. Januar 2010

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.

Montag, 11. Januar 2010

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

Donnerstag, 7. Januar 2010

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;
}