Alle Artikel mit dem Schlagwort “CSS3

Kommentare 37

Diskussionsanregung: Sollte man HTML5 und CSS3 heute schon in Webseiten-Projekten einsetzen?

Mit diesem Artikel möchte ich eine kleine Diskussionsanregung geben und dich nach deiner Meinung fragen, inwieweit du HTML5 und CSS3 heute schon in deinen Webseiten-Projekten einsetzt.

Aus meinen eigenen Erfahrungen ist eine der Problematiken bei der Verwendung CSS3 beispielsweise, dass die CSS3-Eigenschaften in der CSS-Validierung von W3C immer noch als Fehlermeldungen ausgegeben werden.

Außerdem ist es meiner Ansicht nach oftmals schwierig für Webdesigner und Entwickler dem eigenen Kunden zu vermitteln, warum eine Webseite nicht in jedem Browser exakt gleich aussehen muss. Denn gerade aus dem Print-Bereich ist man es natürlich gewohnt, mit millimetergenaue Maßen zu arbeiten. Da ist es für Webdesigner oftmals schwierig zu vermitteln, warum das Design im Internet Explorer 7 auf einmal keine abgerundeten Ecken mehr haben sollte. Weiterlesen

Kommentare 12

CSS-Tipp: Inputfelder mit CSS box-shadow und Leuchteffekt

Bei Eingabefeldern (z.B. in Formularen oder bei der Suche) ist es sinnvoll, einen optischen Effekt zu erzeugen, sobald der Nutzer das Input-feld anklickt. Mit Hilfe von CSS box-shadows kann man diesen Effekt sehr schön erreichen und sogar einen richtigen Leuchteffekt erzeugen. Im Artikel erkläre ich noch einmal kurz, wie die CSS box-shadow Eigenschaft funktioniert. Außerdem habe ein Beispiel (mit CSS Angaben und Demo) erstellt, um den Effekt noch einmal zu verdeutlichen. Weiterlesen

Kommentare 13

Link-Tipp: Simple Media Queries Tester von Frank Bültge

Simple Media Queries Tester von Frank Bültge

Mit dem Online-Tool “Simple Media Queries Tester” kannst du deine Webseite schnell und vor allem übersichtlich in drei verschiedlichen Bildschirmbreiten testen. Die Screen-Formate kannst du selbst anpassen und so z.B. auf 320 Pixel fürs iPhone Hochformat oder 758 Pixel fürs iPad Hochformat einstellen. Ich finde das Tool wirklich praktisch, um Webseiten mit responsive Webdesigns schnell auf einen Blick testen zu können.

Kommentare 21

HTML5 und CSS3 mit Hilfe von Modernizr verwenden

Modernizr ist eine praktische Open Source JavaScript-Library, um schon heute HTML5 und CSS3 Elemente für Webseiten-Projekte nutzen zu können. Das Script funktioniert eigentlich recht einfach. Es stellt fest, welche HTML5 und CSS3-Funktionen der jeweils verwendete Browser unterstützt und welche nicht, und fügt dann automatisch entsprechende CSS-Klassen in den html-Tag der Webseite ein. Mit Hilfe dieser CSS-Klassen kannst du dann in deinem Stylesheet arbeiten, und entsprechende Styles für moderne Browser, sowie Fallback-Lösungen für ältere Browser definieren. Modernizr ist also besonders hilfreich, um moderne Features wie @font-face, Multiple Backgrounds oder HTML5-Video zu verwenden, und dennoch alternative CSS-Styles für Browser anbieten zu können, die diese Features noch nicht unterstützen.
Weiterlesen

Kommentare 18

Was können CSS3 Media Queries wirklich leisten?

Es kommen immer mehr mobile Geräte und Tablet-PCs mit den unterschiedlichsten Screengrößen auf den Markt. Und mit dieser Entwicklung wird natürlich auch das mobile Surfen im Internet immer beliebter. Daher beginnen Webdesigner und Webentwickler immer intensiver nach Lösungen zu suchen, um auf diese Entwicklung zu reagieren und Webseiten insgesamt flexibler zu gestalten. Ein Lösungs-Ansatz, der in den letzten Monaten heiß diskutiert wurde, ist die Verwendung von CSS3 Media Queries. Denn mit Hilfe der CSS3 Media Queries ist es möglich geworden, verschiedene Bildschirmgrößen speziell anzusprechen, und das Webseiten-Layout so mit CSS auf die jeweiligen Bildschirmansichten anzupassen.
Da wir uns während der letzten Wochen und mit der Entwicklung unseres WordPress-Themes Ari selbst recht viel mit den Möglichkeiten von CSS3 Media Queries und einer flexibleren Webseiten-Gestaltung auseinandergesetzt haben, möchte ich hier auf dem Blog eine kleine Serie starten, in der ich mich noch einmal intensiver mit diesem spannenden Thema auseinander setze.
Weiterlesen