Auf HTML5Please.us kann man sich sehr anschaulich vor Augen führen, welche HTML5 und CSS-Techniken in welchem Browser wie funktionieren, noch besser: Es wird vorgeschlagen, ob man es schon nutzen kann, wenn ja ob man was beachten sollte oder ob man es doch lieber komplett lassen sollte. Sehr schön gemacht, mit weiterführenden Informationen und auf jeden Fall für jeden Webdesigner und Webentwickler einen Blick wert.

HTML5Please.us

Das war es dann auch schon wieder!
Euer Wishu

Für jeden der CSS3 lernen will oder vertiefen möchte, ist dieser kleine Vortrag auf jeden Fall sinnvoll. Die Stelle mit den Schatten finde ich zum Beispiel sehr praktisch, gerade die unteren beiden. Die ganze Präsentation ist auch mit CSS3 gemacht, also versucht das Ding gar nicht erst in Browsern wie dem IE9 oder älter aufzurufen.

Viel Spaß damit. Mir hat es gut geholfen und ich wollte es einfach mal mit euch teilen.

CSS3 im praktischen Einsatz

Das war es dann auch schon wieder!
Euer Wishu

Wie so viele Infografiken ist auch diese leider nur auf englisch verfügbar, sodass sie hier wohl nicht jeder lesen kann, wer allerdings im Bereich Webdesign arbeitet, ist der englischen Sprache zumeist mehr oder weniger mächtig. Ich warne schon einmal vor, es ist wirklich recht viel Text, allerdings wie oben bereits erwähnt, wirklich interessant – zumindest wenn man sich dafür interessiert. Am Ende der Infografik finden sich dann noch Vorhersagen für die nächsten Jahre.

A Brief History of Web Standards

Das war es dann auch schon wieder!
Euer Wishu

(via)

Viel gibt es nicht zu sagen. Die Bedienung ist Kinderleicht und erinnert etwas an Photoshop. Die Möglichkeiten sind nahezu unbegrenzt und die Palette an Presets ist extrem Hilfreich und spart Arbeit. Achso ja, die Browserkompatibilität ist übrigens überragend und deckt nicht nur Chrome, Safari und Firefox ab, wie der oben erwähnte Generator. Selbst der Internet Explorer spielt da mit. Somit steht CSS-Verläufen nichts mehr im Wege!

Ultimate CSS Gradient Generator

Das war es dann auch schon wieder!
Euer Wishu

Somit kann ich recht schnell ansehnliche Verläufe erstellen und habe dabei noch nicht mal die Tipparbeit. Aber eben auch keinerlei Einschränkungen. Beim Farbwähler kann ich den HEX-Code einfügen oder per RGB einfach die Farbe bestimmen. Auch die Helligkeit kann man problemlos einstellen. Der Code wird live aktualisiert ebenso wie eine Vorschau, welche sich neben dem Farbwähler befindet, auf der sich zusätzlich noch Text befinden. Diesen kann man zwar leider nicht gestalten, doch sinnvoll ist es auf jeden Fall.

Direkt zum CSS3 Gradient Generator

Viel mehr gibt es dazu eigentlich gar nicht zu sagen. Und genau aus diesem Grund fasse ich mich auch einfach mal kurz und sage:

Das war es dann auch schon wieder!
Euer Wishu

Michael Van Daniker hat mit Axiis – einer Software zur Visualisierung von Daten – die Verbreitung der Browser von Januar 2002 bis August 2009 in einem Kreis dargestellt.

Das Interessante dabei ist, wie es letztendlich aussieht. Das erkennt man bereits auf dem kleinen Artikelbildchen. Es sieht aus wie das Firefox-Logo. Zufall oder Prophezeihung? Wer weiß…

Auf jeden Fall gibt es das ganze Teil interaktiv nochmal unter folgendem Link:

Die Visualisierung der Verbreitung von Browsern

Das wars dann auch schon wieder!
Euer Wishu

Ok, manche finden es vielleicht schick, doch hier möchte ich kurz meine Meinung dazu sagen und eine Möglichkeit geben das Fade-In auszublenden.

Nun möchte ich noch einmal genau erklären, was gemeint ist.

Auf dem Bild sieht man deutlich den Unterschied. Beim Aufruf von Google.de sieht man nur noch das Logo, das Suchfeld und die Buttons. Erst nachdem man die Maus bewegt hat (Oder auch per Tab durchnavigiert) sieht man den ganzen Rest der Seite. Ich persönlich finde das eher unangenehm und habe mich deswegen nach einer Lösung umgesehen.

Der Fade-in auf Google.de lässt sich ganz einfach deaktivieren. Google bietet sogar selbst eine Möglichkeit den Fade-in zu deaktivieren. Nein ich meine dort nicht den Tipp mit dem JavaScript deaktivieren. Ich meine den zweiten Punkt – das Greasemonkey-Skript.

Google erklärt sogar für alle Browser, wie dies einzufügen ist. Wer kein Englisch kann, hier eine kurze Anleitung.

Firefox: Mit Firefox lässt sich das Skript einfach in das Add-On Greasemonkey einfügen und man sieht sofort den Unterschied.
Safari: Für Safari gibt es das so genannte GreaseKit. Ich habe damit jetzt keine Erfahrung, denke aber, dass es das gleiche wie Greasemonkey ist.
Opera: Das wird hier erklärt: How to Install User java script in Opera.
Chrome: Um es in Chrome zu integrieren muss man in den dev Channel wechseln.
Internet Explorer: Zu schlechter Letzt noch der unsägliche IE. Dafür muss man den IE7Pro installieren. Das ist in sofern schon mal schlecht, weil es nicht der IE8 ist. Dann muss man das Skript als nogooglefade.ieuser.js in C:\Program Files\IEPro\userscripts abgelegt werden. Nun muss das Skript nur noch aktiviert werden.

Schlusswort

Sicherlich ist das Fade-in von Google gewöhnungsbedürftig und Geschmackssache. Ich mag es aber nicht. Genau aus diesem Grund habe ich es deaktiviert und bin glücklich damit.

Das war es dann auch schon wieder!
Euer Wishu

Ich hoffe euch gefällt diese Idee, Vorschläge zur Verbesserung sind gern gesehen.

Den Anfang möchte ich mit 5 Links machen, welche ich beim surfen und lesen meiner Feeds gefunden habe.

Wirkung einzelner Farben im Web Design

Beginnen möchte ich mit einer Beitragsreihe, welche auf Selbstständig im Netz zu finden war. Ist zwar nun schon etwas her, doch ist es auf jeden Fall lesenswert. In der 3-teiligen Serie geht es um die Wirkung einzelner Farben im Webdesign. Ein Thema, welches leider immer wieder vernachlässigt wird. Da man die weiterführenden Links in dem Beitrag findet, werde ich hier nur den Link zum ersten Artikel einstellen.

Zum Artikel

Konfigurationsmöglichkeiten mittels .htaccess Datei

Weiter geht es mit einem kleinen Beitrag aus dem Webwork Magazin. Hier geht es darum einige Grundlagen zum Thema .htaccess zu erklären. Eine Datei, die viele kennen, aber wenige richtig benutzen können. In diesem Beitrag wird etwas Abhilfe geschafft.

Zum Artikel

Warum uns Web-Statistiken belügen

Ein weiterer Artikel aus dem Webwork Magazin beschäftigt sich mit Web-Statistiken und warum uns diese belügen. Hauptbeispiel ist hierbei Google Analytics. Auch dies ist eine Artikelreihe aus 3 Beiträgen. Ich kann wirklich nur empfehlen das man durchzulesen, es ist ziemlich interessant und vor allem sehr aufklärend. Nun weiß man auch, warum jedes Statistikprogramm etwas anderes sagt.

Zum Artikel

Little Boxes kostenlos online lesen

Das berühmte Webdesign-Buch Little Boxes gibt es nun kostenlos im Internet. Dabei ist allerdings nur das erste Buch gemeint. Den zweiten Teil muss man sich nach wie vor gedruckt kaufen. Ich persönlich habe jetzt noch nicht rein gelesen, aber man hört aus allen Ecken, dass diese Buch einfach fantastisch ist. Also solltet ihr mal einen Blick drauf werfen.

Zum Online-Buch

Was ist eigentlich ein Browser?

Diese Frage will Google mit der Domain whatbrowser.org beantworten. Schade nur, dass das ganze Projekt auf Englisch ist. So kann man einigen nervigen Leuten das immer noch nicht einfach verständlich machen. Aber der Anfang ist getan.

Zur Website

Schlusswort

Ich hoffe euch hat diese kleine Linksammlung gefallen. Die nächste gibt es dann am Samstag den 12.12. um die gleiche Zeit.

Das war es denn auch schon wieder!
Euer Wishu

Anlässlich eines Beitrages bei heise.de mit dem Titel “Webmaster-Aufstand gegen alte Internet Explorer” möchte ich noch einmal darauf aufmerksam machen, dass der IE6 mittlerweile 7 Jahre alt ist und im August diesen Jahres 8 wird. Eindeutig zu alt um diesen tatsächlich noch zu unterstützen – oder nicht zumindest gegen diese Nutzung vorzugehen.

In dem Beitrag von heise.de geht es um eine norwegische Seite, welche einen Hinweis für alle IE6-Nutzer einblendet um die User auf “ihren Fehler” hinzuweisen. Nicht immer ist es der Fehler des Benutzers, doch dazu später mehr.
Die Seite genießt – laut heise.de – in Norwegen großes Ansehen und wird auch dementsprechend oft besucht. Mit Erfolg – denn viele Seiten zogen nach, sodass noch mehr User darauf aufmerksam gemacht werden und der Hinweis irgendwann nervt.

Ein IE6-User wird sich dann sicherlich 2 Mal überlegen, wie lange er mit diesem Teil noch surft. Freundlich wie wir Webmaster sind, bieten diese Leute auch immer noch einen Download zur neuen Version des Internet Explorer an. Meist auch noch die Downloads zu Firefox, Opera und Co., da diese ja bekanntlich besser sind – für uns Webmaster und auch für den Nutzer.

Warum also nicht mit den norwegischen Kollegen mitmachen? Warum nicht auch einen Hinweis einbauen und zu einer Seite verlinken, welche näheres erläutert? Warum nicht auch etwas gegen dieses Steinzeitmodell von Microsoft tun?

Einige mögen jetzt vielleicht denken “Wieso soll ich mit meine Site mitmachen? Ich hab eh so wenige Besucher.” – Klar, man hat vielleicht nur 20 Besucher, aber auch darunter können IE6-Nutzer sein, welche von dem Risiko dieses Browsers noch gar nichts wissen. Welche nicht wissen, dass es das Internet auch in einer benutzerfreundlichen und sicheren Version gibt.

Diesen Leuten ist zu helfen – undzwar von uns.

Es ist schon richtig, dass die meisten nicht wissen, was ein Browser ist, doch wozu gibt es Links und Wikipedia mit einer passenden Erklärung? Warum sollte man IE6-Nutzern nicht erklären, was ein Browser ist – wozu er gedacht ist und warum der IE6 streng genommen nicht zu Ihnen gehört. Denn ein Browser zeigt Websites an, Tags die er nicht kennt, lässt er aus bzw. formatiert sie nicht extra – doch das tut der IE6 nicht. Er interpretiert Tags die er nicht kennt so wie er möchte. Ein Fehlverhalten, welches es fraglich macht, ob der IE6 tatsächlich Browser genannt werden darf.

Jetzt kommen natürlich die Leute die sagen “Ja aber es sind doch auch Leute in einem Netzwerk, auf Arbeit zum Beispiel. Die können dafür doch gar nichts.”. Doch sie können etwas dagegen tun. Sie können dem Admin – welcher wahrscheinlich selbst mit Firefox unterwegs ist – auf sein Kabel treten und mit Nachdruck verlangen, dass der IE6 geupdatet wird. Denn irgendwann werden auch diesen Usern diese Hinweise auf den Keks gehen. Und was spricht schon gegen ein bisschen Fortschritt und Entwicklung?

Wenn man nichts machen möchte – OK, doch dann hört bitte auf zu meckern. Und vor Allem, schaut in eure Statistiken. Habt ihr wirklich IE-Nutzer, welche ihr berücksichtigen müsst? Ich bei einem Projekt von mir nicht. WishuLoad läuft gut auf allen modernen Browsern und auch im IE7. Da ich nur noch 4% IE6-Nutzer habe – wovon sicherlich noch mal 2% Testuser sind – brauche ich diesen auch nicht mehr zu unterstützen. Ich kenne auch mehrere Projekte, in dessen Statistiken der IE6 gar nicht mehr auftaucht, also warum die wertvolle Zeit opfern?

Meine Sites werden auf jeden Fall alle diesen Hinweis bekommen, welcher zu einem Blogbeitrag hier verweist, welchen ich diese Woche noch schreiben werde. Dieser wird aufklären, warum der IE6 nicht mehr benutzt werden sollte, warum selbst der IE7 nicht das gelbe vom Ei ist und welche Alternativen es gibt.

Man kann jetzt auch noch äußern “Ich arbeite als Webdesigner, ich muss die Seite für alle Browser optimieren, mein Kunde will es so”. OK schön, dagegen spricht ja auch gar nichts, doch das ist zusätzliche Zeit, welche ihr nicht vergütet bekommt. Es spricht also nichts dagegen auf euren Rechnungen eine “IE6-Optimierung” auszuschreiben. Was denkt ihr wie viele Kunden dann noch unbedingt ein Steinzeitmodell unterstützen wollen?

Ich möchte bitten, mir gleich zu tun. Helft euren Nutzern sich selbst zu helfen. Helft ihnen ein besseres Erlebnis im Internet zu bekommen. Helft ihnen sicherer unterwegs zu sein. Und außerdem – helft euch selbst Zeit und Geld zu sparen.

Das war es dann auch schon wieder!
Euer Wishu

Weitere Links zu diesem Thema:

• Weg mit dem IE – her mit modernen Browsern
• Weg mit dem IE – her mit modernen Browsern – Teil 2
• Firefox ist sicherer als der IE
• Webmaster-Aufstand gegen alte Internet Explorer – heise.de
• IE Death March – iedeathmarch.org
  
• Internet Explorer 6 “Muss draußen bleiben”

Seitdem 2004 von 2 Mozilla-Entwicklern namens Stuart Parmenter und Vladimir Vukicevic das Format und gleichzeitig die Erweiterung für PNG, APNG (Wikipedia: Animated Portable Network Graphics [APNG, engl. animierte, portierbare Netzwerkgrafiken]) vorgestellt wurde, kann sich auch PNG bewegen. Zugegebener Maßen sieht es besser aus, doch es verstößt gegen einen einfachen Grundgedanken im Internet. Alles hat still zu stehen, es sei denn man macht etwas.

Ich verzichte in diesem Beitrag mit Absicht auf das direkte Einbinden von APNG-Grafiken um das Lesen einfacher zu machen, denn letztendlich würden diese Bewegung nur stören. Zumindest für diejenigen, die Firefox oder Opera in ihren neueren Versionen benutzen.

Denn Firefox 3 und Opera ab der Version 9.50 Beta 1, sind bisher die einzigen Browser, welche dieses Format unterstützen. So hat zumindest diesmal der IE etwas Gutes, denn in diesem Browser muss man sich diese Bewegungen nicht antun. Doch glücklicherweise sieht man die Grafiken trotzdem.

Denn APNG, welches mit der Dateiendung PNG abgespeichert wird, ist vollkommen abwärtskompatibel. Der IE zeigt die Grafiken an, nur bewegen sie sich eben nicht. Lediglich der erste Frame (also das erste Bild) wird angezeigt und somit bleibt – im besten Fall – zumindest die Grundinformation erhalten.

Die eigentlichen PNG-Entwickler sind ebenfalls gegen das APNG-Format. PNG hatte sich bewusst von Bewegung abgegrenzt und so sollte es auch bleiben. Allerdings haben die PNG-Entwickler ein anderes Format entwickelt, welches ähnliche Eigenschaften wie APNG hat. Das MNG-Format (Wikipedia: Multiple-image Network Graphics [Akronym MNG /mɪŋ/, engl. Netzwerkgrafiken mit mehreren Bildern]).

Dieses wird allerdings AFAIK bisher nur im Konqueror mit seiner KHTML-Engine Unterstützt. Mozilla hatte zwar bereits den Support angekündigt, setzte dies jedoch nie um.

Der große Nachteil von MNG Grafiken im Gegensatz zu APNG ist, dass MNG nicht abwärtskompatibel ist und die Grafiken somit nicht angezeigt werden, sollte das Anzeigemedium dies nicht unterstützen.

APNG konzentriert sich speziell auf das Web, weswegen es zum Beispiel (noch) nicht möglich ist APNG außerhalb eines Browsers richtig darzustellen sofern man nicht die Programme KSquirrel ab Version 0.7.2 oder XnView ab Version 1.92 verwendet. Man bekommt  ohne eines dieser Programme nur den ersten Frame zu Gesicht, genauso wie es auch wäre, wenn der Browser das Format nicht unterstützt.

Einerseits kann man mit APNG einige Sachen gut illustrieren, doch wird es ähnlich wie GIF dafür wahrscheinlich nicht verwendet. Sobald ein junger Webmaster eine solche Grafik sieht, wird er wahrscheinlich alles mögliche dransetzen um seine Seite mit diesen qualitativ hochwertigen Bildern zu bestücken und einige werden ihm folgen.
Auch werden wohl APNG-Sammelseiten dank der Unterstützung in zwei Browsern nicht mehr lange auf sich warten lassen.

Positiv ist daran jedoch, dass der IE, welcher diese Grafiken bisher nicht unterstützt so wieder einige Marktanteile verlieren könnte.

Man ist gespannt, wann sich dieses – schon 4 Jahre alte – Format durchsetzen wird. Es wird auf jeden Fall eine komplett neue Erfahrung im Web. Ob positiv oder negativ, kann wohl kaum jemand sagen.

Das war es dann auch schon wieder!
Euer Wishu

Links zum Thema:

• Wikipediaartikel zum Thema ‘APNG’
• Mozilla Demoseite
• Beispiele
• APNG-Editor
• offizielle APNG-Seite