Ich hab mir mal wieder was gebastelt…
Und zwar eine Seite mit Inspirationen aus dem ganzen Netz. Das Ding zieht sich per YQL (Yahoo Query Language) aus 11 verschiedenen RSS-Feeds alle Bilder und listet sie auf chaotisch-geordnete Weise (mithilfe von jQuery Masonry) auf.
Jede Stunde kommen etliche neue Inspirationen dazu – aktueller Stand: 723 45.000 Bilder.
Wer es selbst sehen will: vizlinspiritin.eigenstil.de
Von wegen flash wäre nicht für mobile Geräte geeignet… ihr bei Apple seid doch blöd, erzählt nicht so einen quatsch. Man ernsthaft, ihr nervt irgendwie langsam…
Wieso? Antwort hier: golem.de/1005/75111.html
Hier auch noch mal eine Notiz (für mich selber) wie das mit CSS 3 und dem Text-Schatten funktioniert.
text-shadow: 2px 2p 2px #000;
Dabei stehen die Werte für folgende Eigenschaften:
Und hier noch 2 ganz schicke Beispiele (geklaut von kremalicious.com)
Beispiel 1:
color: #000; background: #666; text-shadow: 0px 1px 1px #fff;
Ich sehe ein wenig aus, wie eingravierter Text.
Beispiel 2:
color: #666; background: #000; text-shadow: 0px 1px 0px #ccc;
Ich bin grauer Text mit weißem Schatten auf fast schwarzem Hintergrund.
Da ich in letzter Zeit jedes mal wieder bei google suchen musste, wie nun die genaue Syntax für abgerundete Ecken mit CSS 3 ist, werde ich mir das hier mal selber notieren.
Hinzu kommt auch noch, dass jeder echte Browser das zwar schon interpretiert, allerdings ist da auch für (fast) jeden die Syntax anders. Opera beispielsweise hält sich schon jetzt an das vom w3c vorgeschlagene „border-radius“, während Mozilla und Webkit da (noch) ihr eigenes Süppchen brauen.
CSS 3 Standard (Opera 10.5):
border-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px;
Mozilla (Firefox):
-moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px;
Webkit (Safari, Chrome):
-webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px;
und alles zusammen:
border-radius: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px;
Das funktioniert, wenn man die in diesem Artikel beschriebenen simplen Schritte durchführt:
http://briancray.com/2009/12/29/understanding-user-behavior-google-analytics-event-tracking-jquery/
Alles was man braucht ist google analytics, jQuery und ein wenig Quellcode, den man im <head> einfügen muss. Sehr interessanter Ansatz auf jeden Fall.
(via konigi.com)
So sieht’s bei mir momentan aus, besonders interessant finde ich die ganzen Überlappungen von den Fenstern. Mit sowas bschäftige ich mich den lieben langen Tag, und ich liebe es:
… ist die ganze Arbeit die „dahintersteckt“. Doch wie kann man das dem Kunden begreifbar machen? Wie es wäre, wenn Kunden immer so argumentieren würden, wie beim Bezahlen für das Webdesign sieht man in diesem Video:
[youtube]http://www.youtube.com/watch?v=JI3Df7-KFtw[/youtube]
(via Yenni)
Für unser Public-Display und Digital-Signage Produkt EVISION5 habe ich gerade mal ein paar Icons designt, die als Button fungieren um direkt in die jeweiligen Bereiche einzusteigen. Die Icons kommen auf der Startseite des Administrationsbereichs zum Einsatz.
Die Icons sind NICHT frei verfügbar und unterliegen meinem Copyright. Ich verbiete hiermit ausdrücklich die weitere Verwendung der gezeigten Icons.
Vor kurzem haben mich zwei Freundinnen aus der Uni gebeten, dass ich ihnen beim Erstellen einer Webseite helfe. Die Mädels nehmen am Business Wettbewerb der FU Berlin teil und haben sich für das Bestempeln von Babystramplern und anderen Baby-Textilien entschieden. Ich drück‘ euch natürlich die Daumen!
Mit dem durchaus schönen Logo (entworfen von Michaela Dehne) haben wir dann gemeinsam das Webdesign erarbeitet.
Das fertige Webdesign gibt es unter www.zimtbaer.com zu sehen. Friederike, Anne und Luisa sind gerade noch am Vervollständigen der Texte und Bilder – habt also bitte ein wenig Einsehen, falls noch nicht allzuviele Inhalte online sind.
Als Content Management System (CMS) kommt hier redaxo zum Einsatz, das XHTML/CSS-Layout basiert auf YAML.
Soeben bei Jens Grochtdreis folgendes Zitat zur Website-Gestaltung und Konzeptionierung von Gerrit van Aaken gelesen:
Die Website ist nicht für den Betreiber des Angebotes gemacht. Und auch nicht für die ausführende Agentur. Der User muss letztlich die Website bedienen. Und ich schreibe ganz bewusst „bedienen“, nicht „erkunden“, „spielen“ oder „erleben. Und damit nähern wir uns dem Kern des großen Missverständnisses, das streng genommen schon seit Erfindung der Multimedia-CD-ROM existiert:
Der Anbieter will den User emotional beeindrucken. Der User aber scheißt auf emotionale Beeindruckung – er will schnell und einfach informiert werden.
So dogmatisch es klingen mag: Eine aufwändige äußere Form ist wertlos, wenn die dahinter liegenden Inhalte belanglos sind. Wenn die Inhalte hingegen hochinteressant sind, lenkt die äußere Form nur unnötig ab. Gute Inhalte brauchen keinen Affenzirkus zur Untermalung, sondern sind ihrer selbst Willen begehrt. Und wollen dann weiterverbreitet werden!
Notiz an mich selber: immer schön im Hinterkopf behalten und dem Kunden erklären/verständlich machen, wenn wieder irgendwelche fancy Spielereien gewünscht sind, die niemandem was bringen (außer, dass sie Eyecatcher sind, die aber auf einer informativen Webseite nur wohlüberlegt und bedingt eingesetzt werden sollten).
Wie vor Kurzem schon beschrieben, habe ich mich in der letzten Zeit intensiv mit den Browser-Anteilen beschäftigt. In der vorherigen Auswertung habe ich leider den IE8 vergessen und war noch nicht so wirklich zufrieden mit der Analyse bzw. Regression für den Internet Explorer 7. Dies möchte ich nun an dieser Stelle kurz nachreichen.
Auch für diese Analyse gelten dieselben Vorraussetzungen, Vorüberlegungen und Anmerkungen, wie beim letzten Mal:
Zuerst die Grafik, dann die Worte:
Wie man sieht, habe ich den IE8 zusammen mit den weniger stark verbreiteten Browsern in eine Grafik gelegt. Das erschien mir angesichts des „Alters“ und der Anteile als sehr sinnvoll. Was man auf jeden Fall erkennen kann, ist das der IE8-Anteil schneller wachsen wird, als Chrome (die Linie vom IE8 ist steiler als von Chrome). Wann der IE8 die anderen Browser überholt, habe ich bis jetzt noch nicht ausgerechnet, werde das aber schleunigst nachreichen.
Bei der ersten Analyse hatte ich angemerkt, das mir eine lineare Trendlinie für den IE7 nicht sinnvoll erscheint, da die Anteile mittlerweile rückläufig sind. Aufgrunddessen habe ich mich mal an eine „quadratische“ Regression gesetzt. Das Ergebnis dieser Analyse finde ich wesentlich besser:
Die Kreise sind die tatsächlichen Beobachtungen bei w3schools.org, die Linie ist die Vorhersage bzw. Analyse. Wie man sieht, ist der IE7 auf dem absteigenden Ast (Zeitpunkt 39 ist April 2009). Allerdings repräsentiert die Kurve (insbesondere ab Zeitpunkt 28/29) nicht mehr sonderlich befriedigend die Beobachtungen. Die Abwärtsbewegung scheint mir zu schwach, bzw. die Breite der Kurve zu groß. Nichtsdestotrotz sieht man – wie erwähnt – deutlich die Abwärtsbewegung in der wir uns derzeit befinden.
Eine weitere Möglichkeit zur Verbesserung der Genauigkeit, wäre die Splittung der Daten. Hier würde sich meines Erachtens der Zeitpunkt 28 oder 29 anbieten. Danach ist es mit Sicherheit nicht falsch, wieder einen linearen Zusammenhang zu unterstellen. Eine schicke Grafik muss ich allerdings an dieser Stelle noch schuldig bleiben.
browser-anteile, browser-trends und „zukünftige entwicklung“ (IE7, IE6, Opera, Safari & Chrome)
als webdesigner stellt sich immer mal wieder die frage „in welchen browsern soll ich mir das design anschauen und ggf. fehler korrigieren?“. diese frage treibt mich nun schon seit geraumer zeit um und nun habe ich mir mal wieder ein wenig zeit genommen, um das ganze etwas genauer unter die lupe zu nehmen.
dazu habe ich mir die browser-statistiken von w3schools.com angeschaut (www.w3schools.com/browsers/browsers_stats.asp). mir ist vollkommen klar, dass man sich nicht auf eine einzelne auszählung verlassen sollte. allerdings habe ich mir mal die komplette seite durchgelesen und unter anderem auch diesen absatz gefunden:
„The statistics above are extracted from W3Schools‘ log-files, but we are also monitoring other sources around the Internet to assure the quality of these figures.“
von daher denke ich, dass diese werte relativ aussagekräftig sind und man damit arbeiten kann. nichtsdestotrotz sollte man im hinterkopf haben, dass es eher einen ausschnitt bietet. am liebsten wären mir natürlich die browser-statistiken von www.google.de. darauf könnte man sich meiner meinung nach am besten verlassen, um einen querschnitt der besucher zu erhalten.
außerdem sind die browser-statistiken natürlich extrem zielgruppen-abhängig: eine webseite, die sich mit CSS und XHTML beschäftigt wird definitiv eine andere browser-verteilung aufweisen, als eine dating-plattform oder eine news-seite.
man sollte also den entstehungspunkt der daten immer im hinterkopf haben.
nachdem ich mir nun ein paar daten beschafft habe (monatsdaten von januar 2006 bis april 2009), habe ich das ganze mal durch eine lineare regression gejagt (durchgeführt mit der tabellenkalkulation von open-office). daraus habe ich dann 2 streudiagramme erstellt und die die trendlinien bzw. regressions-geraden eingezeichnet.
zuerst der vergleich zwischen internet explorer 7 (IE7), internet explorer 6 (IE6) und firefox in allen versionen (FFx).
hier mal ein paar gedanken dazu:
anscheinend haben die leute verstanden, dass der firefox eine gute alternative zum internet explorer (sowohl 7 als auch 6) ist.
etwa im september/oktober 2007 (zeitpunkt 21 oder 22) benutzten erstmals mehr leute den firefox als den IE6.
der IE6 wird aussterben: wenn man der trendlinie glauben schenkt, dann wird das im April 2010 (zeitpunkt 51) der fall sein.
im september 2008 (zeitpunkt 32) gibt es erstmals mehr IE7-nutzer als IE6-nutzer. immerhin eine kleine verbesserung, der IE7 hält sich ja bekannterweise „eher“ an die webstandards als der IE6.
die trendlinie für den IE7 ist mit vorsicht zu genießen. wie man sieht, geht der anteil langsam wieder zurück. eigentlich müsste man hier etwa ab dem zeitpunkt 33 eine neue regression ansetzen.
in zeitpunkt 123 benutzen mehr als 100% der user den firefox, wenn man der trendlinie uneingeschränkt glauben schenkt. das ist natürlich quatsch, die entwicklung kann so nicht weitergehen. irgendwann wird sich der effekt abschwächen.
jeden monat steigt der anteil der firefox-surfer um etwa 0,6%, die IE6-user schrumpfen jeden monat um 1,2%.
mehr fällt mir zum vergleich zwischen IE7, IE6 und FF nicht ein. kommen wir nun also zum vergleich zwischen den browsern, die eher eine koexistenz neben den branchengrößen führen (zumindest noch): Chrome, Opera und Safari. hier habe ich exakt die gleichen daten genommen, wie für den ersten vergleich (monatsdaten für den zeitraum januar 2006 bis april 2009).
hinweis: die skalierung der y-achse ist hier anders: das maximum ist bei 6% (zum vergleich: die erste grafik reichte bis zu 70%)!
es fällt sofort ins auge, dass chrome einen rasanten markt-einstieg hatte. glaubt man der trendlinie, dann kommen jeden monat 0,2% mehr chrome-user dazu. allerdings ist auch das mit vorsicht zu genießen, da es sehr wenig daten für chrome gibt. schließlich ist er erst im september 2008 „geboren“ worden.
chrome hatte schon zu markteinführung mehr benutzer als der safari.
bei safari hat es zum jahreswechsel 2006/2007 einen großen sprung gegeben. was genau da los war, kann ich nicht sagen und habe ich nicht recherchiert.
im september/oktober 2008 (zeitpunkt 21/22) gibt es erstmals mehr safari-nutzer als opera-nutzer.
opera fristet ein beständiges dasein. ein übermäßiger trend ist nicht zu erkennen. eigentlich sehr schade, da ich opera für den besten und schnellsten browser halte.
monatliche zuwächse: chrome +0,2%, Safari +0,08%, opera +0,02%. da tut sich also nicht allzuviel.
für interessierte stelle ich hier die tabellen-kalkulation zur verfügung:
bald steht der closed-beta-launch von artist8.com vor der tür. unter der haube haben wir viel gewerkelt und geschraubt. heute habe ich mir auf einer sonnigen bank ein paar gedanken zur verbesserung der usabilty gemacht. das ganze werden wir dann während der beta-phase immer weiter optimieren und einbauen.
ich erwarte nicht, dass das jemand versteht. achja: das habe tatsächlich ich gezeichnet hingekrakelt und nicht mein 6-jähriger kleiner cousin 🙂
dailydesign.eigenstil.de hat eine neue haut bekommen. sowohl optisch als auch vom einsatz bzw. der verwendung her.
die seite hatte ich mir eigentlich gebaut, um täglich oder zumindest dann, wenn ich zeit finde meine aktuellen arbeiten hochzuladen. aber wie das immer so ist, am anfang klappt das alles ganz gut, nur irgendwann wird es weniger und dann schläft es ganz ein. genauso ist es eben mal wieder gelaufen.
zusätzlich war bei dailydesign auch noch platz für em (zum musik-hochladen), doch wirklich genutzt hat er das ganze nie. der einzige, der regelmäßig dort etwas hochgeladen hat, war maks.
also habe ich ihm kurzerhand die seite vermacht (um genau zu sein, seit weihnachten). nun hat er eine plattform, um tägliche scribbles oder auch fertige grafitti-aufträge auszustellen.
gestern abend haben wir dann ein redesign der seite gemacht und das ganze mal aktualisiert.