Mittwoch, 1. Februar 2012

Linktipp CSS: Geometrische Figuren mit reinem CSS gestalten

Das ist ein Beitrag ganz nach meinem Geschmack: "CSS: Geometrische Figuren mit reinem CSS gestalten" von Denis Potschin. Mit einigen Kniffen lassen sich nicht nur Kreise und Dreiecke, sondern auch komplexe Figuren wie Sterne und Herzen zeichnen. Der Artikel selbst ist knapp und keine umfassende Behandlung des Themas, das ich schon seit über 10 Jahren verfolge



Ich möchte alle anregen, solche Experimente nicht einfach als "Spielerei" abzutun, sondern als eine vieler Möglichkeiten aus der Philosophie des "b-creative" - sei kreativ! Auch wenn Du keinen Nutzen darin siehst, denn Kreativität macht Spaß, fördert das Denken und führt zu neuen Ideen.

Das Thema wird wieder modern, wie ich sehe; z.B. bei Matthias Schütz, Martin Kiesewetter (wo ich neue Varianten entdeckt, siehe Experiment mit border-dotted), oben genannten Artikel von Denis Potschien und mehr.




Die ersten Experimente sind aber sehr alt. Legendär sind die Experimente von Lasse Reichstein Nielsen (http://www.infimum.dk/HTML/slantinfo.html), die ich damals über drweb.de entdeckt habe.



Ich habe damals selbst experimentiert und Elemente in meine php-Lernkartei sowie den css-slider verwendet; vgl. die Dokumentation auf http://user-archiv.de/projekt_css_schieberegler/ (dort verwendet in den Varianten HEUREKA 4 und HEUREKA 5)

 



Was man noch alles mit reinem CSS (ohne Grafikelemente) machen könnte, zeigt diese CSS-Variante eines php-Lernkartei-Skins:

 Quelle: http://user-archiv.de/projekt_css_schieberegler/demo-lernkartei.php

Wer das immer noch für reine Spielrei hält, sollte folgendes bedenken: Heute, wo Tablet-Besitzer in alte modem-Zeiten zurückversetzt werden, als das Bilderladen noch zeitraubend war, sind solche CSS-Kenntnisse bzw. der Verzicht auf normale Grafiken wieder gefragt.

Aber auch auf dem Desktop haben CSS-Pseudo-Grafiken ihren Sinn. Denn wer eine solche Seite abspeichert und dabei (wie so oft) vergisst, die komplette Seite samt Grafiken abzuspeichern, hat trotzdem keinen Salat, sondern eine komplett funktionsfähige Seite.

Aus diesem Grund habe ich stets versucht, auf Grafikelemente zu verzichten, wo man CSS verwenden könnte. Ein Beispiel ist auch der Schatteneffekt auf meiner Seite burkes.de:



 
Für die Lösung musste ich lange recherchieren. Eigentlich hatte ich die Suche schon aufgegeben, als ich zufällig eine Lösung fand (gut, dass ich sie auch in der Datenbank des User-Archivs abgespeichert habe, denn über google hätte ich die quelle nicht mehr gefunden):

http://theshapeofdays.com/2005/11/my_contribution.html
Rubrik: Webseiten; Typ: Sonstige_Literatur
http://www.thestyleworks.de/tut-art/schatten.shtml
Rubrik: Webseiten; Typ: Sonstige_Literatur

(Quelle: User Archiv; Suchbegriffe: CSS+Schatten)

  © Blogger template 'Fly Away' by Ourblogtemplates.com 2008

Back to TOP