Frameworki CSS – Bueprint i 960 Grid System

Czasami potrzebujemy zrobić na szybko jakąś stronę, bez tracenia czasu na zabawę z HTML, CSS i układaniem wszystkiego. Każda strona składa się z tych samych elementów: mamy nagłówek, potem może być menu, po lewej, po prawej, albo poziome. Jest miejsce na treść – w układzie jednym lub wielu kolumn, a potem stopka. Jeżeli nie mamy czasu na ręczne kodowanie całgo CSS, a dokładność „co do piksela” nie jest krytyczna – wtedy z pomocą przychodzą nam gotowe Frameworki CSS3. Niektóre są bardzo proste – zawierają tylko style do wyzerowania wszystkich wartości CSS (tak żeby bazować na tym samym dla każdej przeglądarki), inne zawierają gotowe predefinowane ustawienia kolumn i wierszy (wklejamy tylko treść w odpowiednią kolumnę). Ostatnia grupa to tzw. „grid system”, które umożlwiają dowolne ustawianie elementów w systemie siatki.

Reset CSS

Pierwsza grupa to kasowacze ustawień, jest ich całe mnóstwo i nie mam specjalnych rekomendacji na ten temat. Osobiście używam reset.css z paczki Blueprinta, o którym napiszę trochę dalej. Najbardziej popularnym zerowaczem jest chyba YUI 2: Reset CSS należący do programu Yahoo Developer Network. Zasadniczo skryptów tego typu nie brakuje – wpiszcie z googlach „reset.css” – na pewno znajdzie się ich kilkadziesiąt.

Primary CSS

To framework należący do grupy drugiej – zawiera 22 najbardziej popularne układy strony, które mogą się przydać do szybkiego towrzenia stron. Primary CSS jest oczywiście darmowy.

Prawdziwe frameworki

Pisząc prawdziwe mam na myśli pełne rozwiązania, które umożliwiają faktycznie już jakąś pracę z CSS3. Faworytem dla mnie jest Blueprint, który posiada naprawdę spory zestaw gotowych komponentów do użycia. Bazuje on na domyślnej szerokości 960px, ale za pomocą dostarczonych skryptów można to zmienić na dowolną inną. Dodatkowo w pakiecie znajdziemy skrypty z domyślną typografią, stylami dla formularzy a nawet klasę z ikonami do linków w postaci spriteów. Zdecydowanie ciekawa propozycja zachwalana na licznych konferencjach developerów.

Drugi popularny framework do 960 Grid System, który jak sama nazwa wskazuje bazuje również na układzie 960px. Dodatkowo na stronie znajdziemy narzędzia online, które pozwolą nam na wygenerowanie CSS dla naszych potrzeb. Narzędzia to np: Custom CSS Generator który pozwala na zmianę siatki na inną (zmiana szerokości i odstępów pomiędzy kolumnami) natomiast 960 Layout System – umożliwa wygenerowanie gotowego kodu HTML dla naszego układu kolumn i wierszy,

A jak wy rozwiązujecie sprawę CSS ? Korzystanie z własnych CSSów czy frameworków ?