
CSS


less
LESS to procesor CSS. Idea jest prosta – CSS jest coraz bardziej skomplikowany, LESS to narzędzie które pozwala na uproszczenie i wprowadzenie dodatkowych funkcji do CSS. Jakich funkcji – jakich jak zmienne, zagnieżdzanie styli, mixins (nie mam pojęcia jak to przetłumaczyć) i kilku innych dobrodziejstw jak np. funkcje. Można go używać na kilka różnych sposobów – jednym z nich jest załączenie less.js w kodzie strony który kompiluje pliki .less w locie, albo kompilowanie ich przy pomocy kompilatora.

reset.css
CSS Transitions (przejścia) i JavaScript
CSS Transitions – nie wiem jak to przetłumaczyć poprawnie na język polski, więc będę trzymał się oryginalnej wymowy.
Definicja CSS3 definiuje transitions jako możliwość zmian wartości CSS w płynny sposób, w określonym czasie. Idea jest prosta – przy pomocy transitions możemy robić to samo co wcześniej korzystając ze zmiany wartości takich jak “left” czy “top” tyle, że w bardzo płynny sposób i z wykorzystaniem akceleracji sprzętowej. Mamy dostęp do ograniczonej liczby właściwości takich jak:

Jak kodować HTML w newsletterze
Podstawowe narzędzie marketingowe współczesnego internetu – newsletter, w niektórych krajach znane jako EDM . Kto chociaż raz próbował, wie że nie jest to specjalnie łatwe zadanie. Znajomość HTML’a i CSS nie wystarczy, trzeba znać odpowiednie sztuczki i posiadać doświadczenie. Na czym polega problem? Na tym, że w przeciwieństwie do zwykłych stron musimy zwrócić uwagę “jedynie” na 3 głównej przeglądarki i ich wariacje. Zakładając jednak że kodujemy poprawnie i nie szalejemy ze stylami strona będzie mniej więcej wyglądać poprawnie. W przypadku EDMów liczba klientów jest praktycznie nieograniczona, a większość z nich ma swoją własną interpretacje HTML CSS i świata 😉

Uwolnij się od prefixów CSS
Bardzo ciekawe rozwiązanie uwalniające od tworzenia specjalnych reguł CSS dla każdej z przeglądarek. Piszę tutaj o rozwiązaniach pozwalających na tworzenie gradientów w tle, czy okrągłych narożników: -webkit-border-radius: 50%; -moz-border-radius: 50%; [
. Żeby było ciekawiej – rozwiązanie to działa client-side, czyli cała zabawa jest po stronie przeglądarki i nie wymaga instalowania niczego na serwerze. Wystarczy zaimportować 2KB JavaScript i problem z głowy. Zapomniałbym o odnośniku do serwisu:
-prefix-free
. Przykład zastosowania poniżej:
InstaCSS czyli porządna dokumentacja CSS
Nie wiem jak wy, ale ja nie pamiętam wszystkich parametrów i możliwych właściwości paremetrów CSS. Zwykle gdy mam jakiś problem zaczynam googlować i czasami wynik trafia się od razu, czasami… po chwili. Dobra dokumentacja to podstawa, dlatego polecam projekt Instant CSS – w jednym miejscu zebrano opisy właściwości CSS3. Do tego mamy bardzo wygodną wyszukiwarkę, która pozwala szybko odnaleźć zadany parametr.
Frameworki HTML5
Nigdy nie byłem specjalnym fanem frameworków HTML5. Wprawdzie zdarzyło mi się kilka razy użyć Blueprint ale finalnie kończyło się zawsze na pisaniu wszystkiego od podstaw. Potem wchodziła do gry optymalizacja pod IE i po pewnym czasie strona wyglądała przyzwoicie. Niestety w dobie dzisiejszych technologii, gdzie nasza strona musi wyglądać dobrze zarówno na zwykłym PC, jak i na każdym urządzeniu mobilnym począwszy od telefonu, przez pady skończywszy na duuużych ekranach.

WebPutty edytor CSS online
Nazwa serwisu jest odrobinę myląca – początkowo myślałem, że w końcu doczekałem się porządnej realizacji terminala SSH przez przeglądarkę. Okazuje się jednak, że WebPutty to całkiem przyzwoity edytor CSS online. Cały serwis jest w fazie beta, ale wygląda bardzo przyzwoicie. System pozwala na edycję plików CSS z rzeczywistem podglądem zmian na edytowanej stronie. Aby go wypróbować niezbędne jest konto w serwisie gmail.