CSS
Hier siehst Du eine Übersicht aller Beiträge, die mit dem Stichwort "CSS" versehen wurden. Um nichts zu verpassen kannst du alle Beiträge zu diesem Stichwort per RSS-Feed abonnieren. Oder du nutzt den Feed mit allen Inhalten des Blogs.
Webfonts, bzw. die CSS-Technologie @font-face, ermöglichen es uns mittlerweile eine Vielzahl fantastischer Schriftarten in Websites zu verwenden. Auch dann, wenn der Besucher die Schrift selbst gar nicht auf seinem Computer oder Smartphone installiert hat. Besonders komfortabel ist der Einsatz so genannter Webfont-Bibliotheken wie beispielsweise der Google Font Directory. Die Schrift wird online gehosted und muss vom Webdesigner anschließend nur noch im Quellcode eingebunden werden.
Da die verschiedenen Schrift-Bibliotheken jedoch Unterschiede haben, und sich somit nicht für jedes Projekt gleich gut anbieten, wurde auf sprungmarker.de nun der ultimative Webfont-Vergleich veröffentlicht.
Sehr lesenswert - auch um sich einfach mal bewusst zu machen welche Unterschiede überhaupt existieren.
Diesen Beitrag zu Ende lesen
Tools zur vereinfachten und vor allem intuitiven Handhabung von CSS3 gibt es mittlerweile einige. Mit Layer Styles ist nun ein weiteres Hilfsmittel an den Start gegangen, dass die bereits wohl bekannten Funktionen, sowie das Interface der Photoshop-Ebenenstile verwendet um Elemente mit CSS3 zu gestalten.
Diesen Beitrag zu Ende lesen
Der bekannte CSS-Gradient-Generator bietet seit einiger Zeit ein tolles neues Feature an: den Import von Bildern. Mit dieser Funktion könnt Ihr Grafiken importieren, die anschließend vom System analysiert und in einen CSS-Gradient umgewandelt werden. Per Copy & Paste kann der Code anschließend in der Website verwendet werden.
Das neue Tool hat bei meinen Tests noch nicht 100%ig funktioniert; die Farbverläufe mussten häufig noch leicht angepasst werden. Nichts desto trotz hat der Gradient-Generator mir die Arbeit deutlich erleichtert.
Diesen Beitrag zu Ende lesen
CSS3 überrascht immer wieder mit interessanten Einsatzgebieten. Unter anderem bietet uns CSS3 die Möglichkeit Texte so zu gestalten, dass der Eindruck entsteht sie wären weichgezeichnet. In Photoshop würden wir einen solchen Effekt vielleicht mit dem Gaußschen Weichzeichner oder dem Weichzeichnungs-Werkzeug realisieren; in CSS3 kann die Eigenschaft text-shadow in Kombination mit einer transparenten Textfarbe dazu verwendet werden. Die Deckkraft des Textes lässt sich über die Alpha-Transparenz steuern.
Diesen Beitrag zu Ende lesen
Lea Verou hat vor einiger Zeit auf Ihrem Blog ein sehr interessantes Experiment vorgestellt: Mit Hilfe von CSS3-Gradients hat sie Hintergrund-Kacheln erzeugt, die anschließend wie eine als Grafik abgespeicherte Kachel eingesetzt werden können.
Der Vorteil liegt auf der Hand: Geringere Dateigrößen und reduzierte HTTP-Requests. Vor ein paar Tagen hat sie dann die CSS3-Pattern-Gallery ins Leben gerufen, auf der Sie die angewandte Technik kurz beschreibt und sehr ansprechende Beispiele präsentiert.
Diesen Beitrag zu Ende lesen
Wenn Ihr häufig eigene Hintergrund-Muster in Photoshop erstellt, diese anschließend als Grafik exportiert und im CSS-Dokument wieder einbettet, dann schaut euch unbedingt mal folgendes Online-Tool an.
Patternify ist ein Online-Generator zur Herstellung von Hintergrundmustern und erleichtert die Gestaltung und vor allem die Einbindung von CSS Pattern erheblich.
Diesen Beitrag zu Ende lesen
Das Web ist längst mobil geworden und moderne Websites müssen nicht nur auf dem Monitor, sondern auch auf unzähligen Ausgabemedien eine Top-Figur machen. Zwar rufen die meisten User Websites noch über einen Computer auf, aber die Zugriffe über mobile Endgeräte wie iPad, Smartphones und portable Spielekonsolen steigt stetig an. Wie soll man da eine Website für all diese Geräte optimieren können? Mit CSS3 Media Queries ist das gar nicht so schwierig.
In diesem Beitrag möchte ich Euch die Vor- und Nachteile dieser Technik erklären und an einem praktischen Beispiel zeigen wie schnell Ihr auch Eure Website für Smartphones und Tablet PCs optimieren könnt.
Diesen Beitrag zu Ende lesen