Share
O varietate tot mai mare de cadre este disponibilă atât pentru designeri, cât și pentru dezvoltatorii din front-end, pregătiți pentru prototipuri și implementări rapide. Există o gamă largă de cadre cuprinzătoare și ușoare, și aproape totul între ele. Cu atât de multe opțiuni, puteți alege pur și simplu cele mai populare, dar acest lucru nu este cel mai bun pentru proiectul dvs..
Fiecare cadru are avantajele sale și depinde de dvs. să vă dați seama care va fi cel mai potrivit pentru nevoile dvs. Din fericire, am făcut o parte din cercetarea și experimentarea pentru dvs., analizând cu atenție patru cadre diferite. Le-am evaluat pe:
Cadrele examinate sunt Bootstrap, Concise, Foundation și Gumby. Rețineți că nu vă sfătuiesc să alegeți sau care este preferatul meu, explicând punctele forte ale fiecărui cadru, astfel încât să puteți decide care este cea mai potrivită pentru dvs. Hai să ne aruncăm!
Notă: Eu folosesc termenul Cadru, dar unii ar putea simți Bibliotecă sau boilerplate sunt mai potrivite.
Fiecare dintre cadrele pe care le-am privit are o curbă de învățare relativ prietenoasă, superioară, dar am descoperit că Concise este cel mai bun pentru un începător. Un cadru mai slab, concis este o lumină asupra caracteristicilor, permițând documentației să fie o citire rapidă și simplă.
Dacă căutați mai mult decât funcțiile de bază, există un număr de add-on-uri pe care le puteți include în proiect.
Bootstrap și Foundation au o documentație excepțională pentru a vă ghida prin configurare, module și extensii. Gama largă de caracteristici face inevitabil ca documentația să fie mai mult implicată și descurajantă pentru începător, comparativ cu Concise. Fundația are la dispoziție un fișier demo numit index.html pentru a începe să experimenteze și să servească drept punct de plecare.
Descărcarea Gumby vine de asemenea cu un fișier demo.html pentru a arăta grilele sale în acțiune, precum și ui.html cu exemple ale fiecărui element ui. Cu toate acestea, este mai dificil să configurați cu o încurajare puternică de a utiliza compilarea SASS și CSS în terminal. În timp ce acestea nu sunt esențiale pentru utilizarea Gumby, acestea reprezintă cea mai mare parte a documentației de început.
Gumby are doar o opțiune de descărcare, spre deosebire de Bootstrap și Foundation, care vă oferă opțiunea de a descărca diferite pachete pentru a vă satisface nevoile și abilitățile.
În afară de documentație, o căutare rapidă pe Google vă va oferi orice ajutor suplimentar de care aveți nevoie de-a lungul drumului. Fundația însă are propriul centru de formare și videoclipuri pentru o experiență de învățare fără probleme. Dacă doriți mai degrabă mici tidbits aici și acolo, un număr imens de bloguri și tutoriale au fost scrise cu sfaturi pentru utilizarea Fundației, inclusiv aici pe Tuts+.
Ca și Fundația, Bootstrap a fost poreclit de comunitatea de proiectare și front-end de la concepția sa. Tuts + are o serie de cursuri și multe tutoriale disponibile pe această temă. Un cadru extrem de popular, există multe bloguri, articole și forumuri la dispoziția dumneavoastră.
Gumby a fost, de asemenea, acoperită bine pe bloguri și în tutoriale, deși nu la fel de mult ca Fundația și Bootstrap. Documentația Gumby vă va îndruma și în direcția resurselor pentru a învăța Sass și instrumente utile pentru compilarea CSS.
Tocmai după ce a ajuns pe scena cadrelor, concisul nu trebuie examinat cât mai îndeaproape ca celelalte trei. Este posibil ca resursele suplimentare să nu fie la fel de necesare, având în vedere dimensiunea redusă și versatilitatea acestui cadru.
Bootstrap și Fundația sunt toate cadre foarte cuprinzătoare, cu un număr mare de caracteristici și resurse disponibile pentru tine. Fiecare dintre ele poate fi personalizat înainte de a descărca chiar fișierele, ceea ce înseamnă că mai puține CSS suprascrie pentru tine.
Ele sunt, de asemenea, versatile în modul în care pot fi utilizate, cum ar fi în combinație cu un CMS sau pentru prototipuri de aplicații. Toate cele trei au caracteristici de interfață similară, deși Bootstrap și Fundația au mai multe decât Gumby, cum ar fi tipografia, casetele de lumină și acordeoane.
Concise este construit pentru a fi un cadru restrâns, oferind doar elementele esențiale. Spre deosebire de celelalte trei, Concise vă oferă doar ceea ce este absolut necesar în descărcarea sa, dar vă permite să construiți acest lucru după cum doriți. Acest lucru este minunat dacă doriți să creați personal elementele UI, deoarece vor fi necesare mai puține suprascrieri CSS.
Toate cadrele din clasa noastră de testare sunt destul de asemănătoare în acest domeniu, respectând cele mai multe standarde. Fundația este singura care nu suportă IE8.
Compatibilitatea fundațieiBootstrap avertizează asupra anumitor proprietăți CSS3 care nu sunt acceptate în IE8.
"Internet Explorer 8 și 9 sunt, de asemenea, acceptate, totuși, rețineți că unele proprietăți CSS3 și elemente HTML5 nu sunt pe deplin acceptate de aceste browsere. - Bootstrap Docs
Documentația Bootstrap acoperă în detaliu suportul pentru browser și dispozitiv, precum și diferențele în modul în care sunt redate anumite proprietăți. Următoarea secțiune a documentației Bootstrap acoperă accesibilitatea. Fundația prezice cele mai bune practici de accesibilitate, dar Concise și Gumby nu.
Scheletul este un alt cadru ușor, similar cu cel al Concise, care a suferit o revizuire recentă. Este cel mai eficient pentru locațiile mai mici, concentrându-se în principal pe navigație și tipografie. Cu chiar mai puține stiluri decât Concise, este subțire, elegantă, ușoară și foarte ușor de început. Nu include SSS sau CSS miniaturi, spre deosebire de celelalte patru cadre examinate.
Nu există o alegere greșită pentru care cadru ar trebui să utilizați, ci doar o alegere mai bună. Scopul meu aici a fost să vă ajut să vă dați seama care este cea mai bună alegere pentru dvs., pe baza unor criterii care ar putea afecta un proiect și fluxul de lucru. Fie că sunteți nou în cadrul cadrelor, fie că sunteți mai familiarizați cu modul în care funcționează, este important să determinați care dintre acestea va corespunde nevoilor dvs. de proiect.
Iată un scurt rezumat în formă tabelară. ★ sugerează un câștigător absolut, în timp ce ☆ arată că primul loc a fost împărțit.
| bootstrap | Concis | fundație | Gumby | |
|---|---|---|---|---|
| Simplitatea de a învăța | ★ | |||
| Volumul resurselor externe | ★ | |||
| versatilitate | ☆ | ☆ | ☆ | |
| Suport pentru browser | ☆ | ☆ | ☆ | ☆ |
| Accesibilitate | ☆ | ☆ |
Dintre criteriile analizate, simplitatea de a învăța, resursele externe, versatilitatea, suportul pentru browser și accesibilitatea - una sau două vor avea o importanță mai mare pentru dvs. și ar trebui să alegeți cadrul în consecință. Pentru cei care au experiență cu Bootstrap, Concise, Foundation sau Gumby, care domenii credeți că cadrul dvs. de alegere se comportă cel mai bine? Pentru ce tip de proiecte le folosiți?
Pentru cei care vă sprijiniți pe alte cadre, cum credeți că alegerea dvs. este comparabilă cu acestea?
Accentsconagua