16.10.2011 Development 0

animate.css – Animationen mit CSS3 statt mit Javascript

Animationen mit z.B. jQuery sind zwar browserunabhängiger als welche mit CSS3. Dafür schlagen diese ganz schön auf die Performance. Warum also nicht für moderne Browser CSS3 Animationen verwenden? Genau diese bündelt animate.css in jeweilige Klassen, welche dann per JavaScript angesteuert werden können:

animate.css is actually built to compliment tools like jQuery. CSS animations are pretty frickin’ awesome – they use hardware acceleration natively, unlike JavaScript-powered animations. Use something like Modernizr to detect support for CSS3 animations, then use jQuery or another library to provide fallback animations for the browsers that don’t support them. It’s a win-win situation.

Klingt interessant und kann man mal ausprobieren.

12.10.2011 Development 3

PrefixFree – mein CSS3-Wunschzettel an die Browser-Entwickler

Wir sind uns einig, wenn ich sage, dass CSS3 der heiße Scheiß ist. Runde Ecken hier, Schatten dort, Transparenzen überall und bewegen kann sich das auch noch alles. Wir sehen mit einem lachenden Auge den Zeiten von Flash hinterher, das man bald nur noch vom Hörensagen her kennt. CSS3 ist so derbe, dass es vielen Browsern einfach zu krass ist und sie es entweder gar nicht können wollen oder sich eigene Prefixes ausgedacht haben. Auf Deutsch: wenn man nicht jeden Browser persönlich einlädt, passiert da nüscht.

In der Praxis sieht das bei einer Klasse, die runde Ecken, Schlagschatten und vielleicht noch etwas geneigt ist, so aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
.dings {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   -webkit-box-shadow: 2px 2px 6px #333;
   -moz-box-shadow: 2px 2px 6px #333;
   box-shadow: 2px 2px 6px #333;
   -ms-transform: rotate(15deg);
   -webkit-transform: rotate(15deg);
   -moz-transform: rotate(15deg);
   -o-transform: rotate(15deg);
   -ms-transform: rotate(15deg);
   transform: rotate(15deg);
   -webkit-animation: none;
   -moz-animation: none;
   animation: none;
}

Hinzu kommt noch der andere Schmock, was am Ende einen Haufen CSS verursacht. Zwar habe ich mir in Coda und in der Codebox ein paar Snippets dafür angelegt, der Wartungsaufwand bleibt aber immer noch immens.

Weiterlesen »

22.08.2011 mah interwebz 0

Iron für OS X nun in der 13er Version erhältlich

Über meinen Lieblingsbrowser Iron erzählte ich schon bereits etwas. Nun gibt es die Version 13.0.800.0 zum Download, der dann auch die Probleme unter OS X Lion beheben sollte. So ließ sich Iron bisher unter Lion nicht schließen und auch Chrome Apps ließen sich nicht mehr richtig installieren.

Weitere Verbesserungen sind:

  • gesteigerte Performance
  • Instant Pages wenn “Netzwerkaktionen voraussehen, um die Ladegeschwindigkeit zu verbessern” aktiviert
  • Hardware beschleunigtes 3D CSS
  • Safe Browsing-Schutz gegen Downloads, die Malware enthalten
  • Flash Cookies können innerhalb des Browsers gelöscht werden
  • über 30 Sicherheitspachtes
  • Multi-Profile (Beta)

Zudem gibt es die Ansage, in Zukunft die Releases für Mac zeitnah zu den Windows/Linux-Releases zu binden. Freuen würde es mich.

15.08.2011 Development Web Design 2

Wieso Cross-Browser-Optimierung oft Stillstand bedeutet

Wer im Front-end unterwegs ist und für große Kunden arbeitet, kennt das Problem: die Website soll geil werden, aber auch auf alten Browsern gut aussehen. Natürlich soll es auch auf allen Browser gleich funktionieren. Je größer der Kunde ist, desto größer ist auch die Wahrscheinlichkeit, dass dieser auch mit einem Uralt-Browser unterwegs ist. Die interne IT hält es nämlich für zu kostenaufwendig, die Firma mit einem modernen Browser auszustatten, da interne Software auch modernisiert werden muss. Am Ende bricht man gute Ideen dann so weit runter, dass man einen gemeinsamen Nenner findet. Und der ist meistens klein.

Ich weiß nicht, wer einmal festgelegt hat, dass eine Seite auf allen Browsern gleich aussehen und funktionieren muss. Denn es gibt zwar Standards dank W3C, aber es gibt auch Entwicklungen, wo nicht alle Browser gleich schnell hinterher kommen. So funktioniert aber das Internet. Innovationen kommen aus dem Nichts und leben oder sterben mit ihrer Akzeptanz. Während WebKit und Mozilla schnell nachziehen und viele dieser Innovationen implementieren, gibt es eben noch Browser, die einfach darauf scheißen, die Web-Entwicklung zu fördern.

Weiterlesen »

Seite 4 von 23««...345...20...»»