Bootstrap karakteristike

U ovom drugom članku u nizu hajde da se pozabavimo Bootstrap funkcijama. To je kompletna biblioteka resursa za dizajn web stranica i aplikacija, uključujući šablone i elemente za obrasce, fontove i menije, između ostalog.

U prethodni članak tvrdili smo da postoje trenuci kada menadžeri sadržaja nisu najbolja opcija i to pisanje koda od nule za web stranicu je prava alternativa. Međutim, to ne znači da moramo ponovo izmisliti točak. Korištenje okvira kao što je Bootstrap uvelike smanjuje vrijeme dizajna i olakšava postizanje rezultata.

Bootstrap karakteristike

Da bismo razumjeli karakteristike Bootstrapa, moramo razumjeti promjena paradigme u dizajnu web stranica.

kada su se pojavili web stranice su se jednostavno morale prilagoditi različitim veličinama monitora. No, s vremenom su mobilni telefoni i tableti sve više postali poželjna sredstva pristupa za korisnike. Izazov je bio da se stranice prilagode različitim ekranima, a da korisnik ne mora da povećava, smanjuje ili pomera sadržaj da bi mogao da ga vidi.

U principu su usvojeni sljedeći pristupi:

• Responzivni dizajn: Dizajn je isti, ali se automatski prilagođava veličini ekrana. Ovaj pristup ima neke probleme kao što je korisnik možda prisiljen da zumira određene dijelove stranice kako bi ih vidio.
• Progresivni napredak: Počinje dizajniranjem stranice za uređaj sa manje resursa (obično mobilni telefon jer ima manji ekran, pretraživač sa manje kompatibilnosti za napredne funkcije i često zahtijeva korištenje podatkovnog plana za povezivanje). Kada se završi, na osnovu ovog dizajna, dodaju se funkcije za dobijanje verzije za tablete, notebook i desktop računare.
• Postepena degradacija: To je obrnuti put. Desktop stranica se prvo kreira i funkcije se uklanjaju dok se ne dobije verzija prilagođena mobilnim uređajima.

Kako je uvijek lakše dodati nego ukloniti, progresivni napredak je trend koji je uspio prevladati. B.ootstrap, na primjer, koristi pristup „prvo mobilno“., što znači da je osnova dizajna uvijek verzija koja će biti prikazana na najmanjoj veličini ekrana, a zatim se utvrđuju modifikacije koje će se vršiti kako bude proslijeđen na veličine koje slijede.

Dodatna prednost korištenja Bootstrapa ima veze sa činjenicom da Google u svojim pretragama daje prioritet web lokacijama prilagođenim mobilnim uređajima.

Drugi koncept koji moramo uzeti u obzir je razlika između frontend i backend dizajna. Front-end dizajn vodi računa o svemu što korisnik vidi i o svemu sa čim komunicira. Backend grupiše ono što se radi na serveru. Primjer prvog je web obrazac. Prikazivanje niza opcija je prikazano kao padajući meni je dizajn frontenda, da se odabrana opcija šalje poštom ili dodaje u bazu podataka je backend dizajn.

Bootstrap je okvir koji kombinuje elemente CSS stila i Javascript programiranja da kontroliše renderovanje i daje interaktivnost svim komponentama stranice razvijene u HTML5.

Među stvarima koje možemo kontrolisati pomoću Bootstrapa su:

• Pristupačnost: Komponente kao što su meniji ili dijalozi su kompatibilni sa čitačima ekrana ili su pogodni za upotrebu od strane osoba sa smanjenom pokretljivošću.
• Dugmad: Uključujući mjere, stilove, stanja i grupiranje.
• Obrasci:  Uključujući renderiranje, vrste kontrola i validaciju unosa.
• lik: Kontroliše poreklo, poravnanje i veličinu ekrana umetnutih slika.
• Navigacijski elementi: Na primjer, bočne trake koje se mogu sakriti ili vertikalni ili horizontalni meniji ovisno o uređaju.
• Tipografija: Kontrolirajte kako se različiti dijelovi teksta prikazuju.
• Izgled: Podešavanje prikaza sadržaja ovisno o uređaju

U sljedećem članku ćemo vidjeti nekoliko praktičnih primjera njegove upotrebe.