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

[! ] 1 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.

[! ] 2 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 ?