Introducere în Web Development

Capitolul 6: Grid Layout
De ce să folosim Grid Layout

E bine să țintim sus.

Poate unora, acum la început, nu vă vine să credeți că veți lucra la site-uri și aplicații ce vor fi folosite de milioane de oameni.

Toate calculatoarele din lume au resurse limitate. În Web, cea mai mare limitare vine de la lățimea de bandă (bandwidth) a rețelei.

O pagină simplă HTML poate avea câteva zeci de Kilo-Bytes, ceea ce nu e mult. Dar înmulțiți acești kB cu câteva milioane și poate veți înțelege de ce e bine să transferăm cât mai puțin cod către utilizatorii noștri.

Folosind CSS într-un mod inventiv, putem să reducem codul HTML la strictul necesar, păstrând cod CSS relativ puțin.

În această idee, metoda mea preferată de a aranja elementele într-un fișier HTML este să folosim Grid Layout.

Dacă Flexul ne permitea să distribuim elementele surori într-o singură linie, orizontală sau verticală, cel mult pe mai multe linii cu flex-wrap, cu Grid Layout putem să punem elementele în ambele direcții în același timp.

Conținutul continuă după reclamă

Grid vs. Flex

Până la un punct, va părea că Flexul și Gridul sunt două metode de a face același lucru. Însă vei vedea că sunt puțin diferite. Fiecare se va potrivi mai bine în anumite contexte, mai puțin sau deloc în altele. Treaba ta ca Web-Developer va fi să identifici pe care trebuie să îl folosești. Pentru asta, e bine să le înveți pe amândouă.

Flex-ul este de obicei mai potrivit atunci când aranjăm elementele pe o linie, orizontală sau verticală, în timp ce pentru a aranja pe două dimensiuni (orizontală și verticală) ne obligă să adăugăm mai multe elemente în HTML.

Gridul poate fi mai greu de înțeles pentru unii, deși am auzit și opinii contrare.

Designed by