10 przydatnych frameworkow / bibliotek CSS (RWD)

Czas czytania: 4 minut

W ciągu ostatnich kilku lat budowanie stron internetowych uległo wielu istotnym zmianą. Począwszy od sposobu w jaki się koduje po same wymogi. Przyczyn tych zmian było wiele chociaż jedną z ważniejszych było pojawienie się możliwości obsługi witryn na różnego typu urządzeniach.

Biblioteki CSS – gotowe rozwiązania

Spowodowało to, wzrost oczekiwanych wymagań jakie miała spełniać każda strona. Na początku każdy twórca nawet ja próbował to wszystko jakoś samodzielnie ogarnąć – szybko jednak okazało się to dla wielu dość skomplikowane i czasochłonne. Ratunkiem dla wielu okazały się frameworki CSS – nie tylko przyspieszające pracę ale i standaryzujące ją.

W wcześniejszych wpisach opisywałam już jeden z popularniejszych frameworków – Bootstrap tym razem jednak odstawie go na bok i pokaże wam jego konkurencje. Czyli inne biblioteki jakie mogą was zaciekawić i z jakimi możecie się spotkać w Internecie.

UWAGA: W monecie w którym będziecie czytać ten wpis część z poniższych repozytoriów może już nie istnieć. Przyczyny takiej sytuacji mogą być różne i niestety nie mamy na to większego wpływu.

Przykłady dobrych bibliotek CSS

W brew temu co mówi tytuł frameworków CSS jest zdecydowanie więcej niż 10 – postanowiłam się jednak ograniczyć do tej liczby. Pamiętajcie też, że świat serwisów internetowych ulega szybkim zmianą. Istnieje możliwość, że jedna lub kilka bibliotek poniżej opisanych nie jest już dalej rozwijana.

Framework Fundation

Foundation

Jednym z popularniejszych frameworków CSS jest Foundation. Biblioteka dysponuje 12-kolumnową responsywną siatką (RWD). Podobnie jak Bootstrap dysponuje on nie tylko bogatą biblioteką CSS (np. typografia, formularze, przyciski) ale także zbiorem użytecznych skryptów js (np. taby, nawigacja).
W Foundation posiada preprocesor SASS.

https://foundation.zurb.com/

bulma - ciekawa biblioteka CSS

Bulma

Kolejną ciekawą biblioteką jest Bulma. Bulma jest darmowym frameworkiem CSS opartym o technologię Flexbox. Oznacza to, że zastosowywany w niej mechanizm różni się dość mocno od Foundation czy Bootstrap.

https://bulma.io/

pure css do budowy stron internetowych

Purecss

Framework Pure jest jednym z najlżejszych jego waga to obecnie 3.8KB. Stanowi więc on świetne rozwiązanie do osób, którym potrzebny jest nawet bardzo skomplikowany szkielet strony.

https://purecss.io/

Materialize - ciekawa biblioteka HTML, CSS i JS z dużymi możliwościami

Materialize

Kolejną bardzo ciekawą propozycją jest Materialize. Framework zawiera w sobie wiele oryginalnych oraz bardzo pomocnych rozwiązań – nie tylko stricte CSS ale również skryptów JS.

Biblioteka korzysta z plików SASS.

http://materializecss.com/

YAML

YAML

YAML (ang. YET ANOTHER MULTICOLUMN LAYOUT) jest jednym z najdłużej dostępnych i w dalszym ciągu rozwijanym frameworków na rynku (powstał 2005 roku). Biblioteka nie jest specjalnie rozbudowana zawiera jednak podstawowe elementy niezbędne do zbudowanie strony internetowej. Również korzysta z SASS, jest też obsługiwana przez Internet Explorer 6+.

http://www.yaml.de/

HTML KickStart

HTML KickStart

Bibliotek HTML KickStart jest dość lekka i prosta w obsłudze w dużej mierze wzorująca się na Twiter Bootstrap.

http://www.99lime.com/elements/

Semantic UI

Semantic UI

Semantic to biblioteka z dosyć oryginalnym podejściem do tworzenia stron internetowych. Budowane z nią strony przypomina to z metodykami BEM lub SMACSS.

https://semantic-ui.com/

Groundwork css

Groundwork CSS

Groundwork jest kolejną ciekawą biblioteką CSS. Podobnie jak porzednicy posiada rozbudowaną strukturę. Jest również dostępny jako plugin do systemów CMS takich jak Drupal.

https://groundworkcss.github.io/

Kube

Kube

Framework Kube przeznaczony jest raczej dla profesjonalnych programistów.
Kube jest niezależny od wzornictwa (nie narzuca stylów projektowania lub decyzji kodowych) i jest bardzo lekki (około 30Kb). Zawiera wiele użytecznych komponentów – od siatek po modały – i skupia się na pionowym rytmie i zrównoważonej typografii.

https://imperavi.com/kube/

Skeleton

Skeleton

Ostatni na mojej liście zalazł się Skeleton. Skeleton jest jednym z prostszych i łatwiejszych w obsłudze frameworków. Z pewnością nie jest tak rozbudowany jak np. bootstrap, ale jest świetną łatwo rozbudowywaną podstawą dla strony internetowej.

http://getskeleton.com/


Jak do tej pory miałam okazję wykonywać strony tylko na kilku z powyżej wymienionych (Foundation, Skeleton, Materialize). Przeważnie jednak pracuje się głownie na jednym z nich (preferowanym np. przez firmę w której się pracuje) a nie zmienia się w zależności od projektu.

źródła: