Einer der einfachsten Effekte, die sich mit CSS umsetzen lassen, ist ein Mouse-Over durch ein :hover. Üblicherweise benutzen wir es bei Links oder vielleicht mal in Formularen. Aber natürlich ist ein hover in modernen Browsern nicht darauf beschränkt.
Quitter ist ein Service, der Nutzer von Twitter darüber informiert, wenn sie einen Follower verlieren. Abschied nehmen fällt schwer und so ist das Quitter-Maskottchen recht traurig. Zusätzlich winkt es aber zum Abschied, wenn man zufällig mit der Maus über den Arm fährt.
Der Arm ist ein transparentes png, das die zwei Zustände des Armes enthält. Das png steckt in einem div mit der id=hand. Über ein div#hand:hover wird nun einfach die Position verschoben, ein Hovereffekt mit CSS-Sprites.
Die Technik ist einfach, aber ich finde die Idee clever. Denn das Winken passt ideal zum Thema der Seite.
Die Entwickler haben sich übrigens nicht die Mühe gemacht, die Seite für den Internet Explorer 6 herzurichten. Transparente pngs und ein :hover-Effekt auf einem div lassen sich zwar mit JavaScript auch für den IE6 einrichten. In Anbetracht der Zielgruppe muss man die Seite aber evtl. auch nicht IE6-sicher machen.
Nicolai Schwarz betreibt die Agentur textformer mediendesign
in Dortmund. Dort konzipiert und gestaltet er Webseiten, die er dann mit Textpattern oder Drupal umsetzt. Er pflegt sein Faible für Comics und Character Design.
Dies ist ein Text zur Aktion Sonnenseiten: Webkrauts loben – höchst subjektiv – einzelne Details von Webseiten. Entgegen unserer Gewohnheit steht diesmal nicht der Quelltext, sondern die Idee im Mittelpunkt.
Bitte die Hausregeln beachten. Alle Kommentare werden auf werbliche Links/Nicknames geprüft und gegebenenfalls gelöscht.
Kommentar-Feed für diesen Beitrag
Die Kommentarfunktion ist zur Zeit leider deaktiviert.
Eine schöne Idee, die du da beschreibst. Aus meiner Sicht, wäre es auch bei einer größeren Anzahl Nutzer des IE6 durchaus legitim, auf diese Spielerei für den IE6 zu verzichten.
Die Seite ist nicht so hübsch im IE, aber sie bleibt bedienbar, mehr ist aus meiner Sicht nicht mehr nötig.
Kommentar von Ute - 28. Oktober 2008 um 14:54
Ist auf jeden Fall eine lustige Idee, allerdings frage ich mich, wo der Nutzwert dahiner steht. Es ist für mich ein Gag, der dem Nutzer keinen Zusatznutzen bringt und somit eigentlich nicht nötig ist. Wem es gefällt ok… für mich eine unnötige Spielerei, wenn auch technisch interessant umgesetzt.
Kommentar von Wowbagger - 3. November 2008 um 23:25
es geht ja nicht immer nur um den puren nutzen. ab und an mal ein kleines gimmick einzubauen erhöht des spaßfaktor und fördert den bekannheitsgrad. solange die funktion nicht behindert oder in den hintergrund gedrängt wird und nur vereizelt solche gags zu finden sind, finde ich so etwas sogar förderlich für die site.
denn wer außergewöhnlich, vielleicht sogar witzig ist, an den wird sich eher erinnert.
außerdem finde ich das konzept von qwitter ziemlich gut. eine einfache idee, schlicht umgesetzt mit nem kleinen spaßfaktor. tolle sache.
Kommentar von tombeta - 24. November 2008 um 23:49