Značajke Bootstrapa

U ovom drugom članku u nizu pozabavimo se značajkama Bootstrapa. To je cjelovita biblioteka resursa za dizajn web stranica i aplikacija, uključujući predloške i elemente za obrasce, fontove i izbornike, između ostalog.

U artículo prednji tvrdili smo da postoje trenuci kada upravitelji sadržaja nisu najbolja opcija i da pisanje koda od nule za web stranicu prava je alternativa. Međutim, to ne znači da moramo ponovno izumiti kotač. Korištenje okvira kao što je Bootstrap uvelike skraćuje vrijeme dizajna i olakšava postizanje rezultata.

Značajke Bootstrapa

Da bismo razumjeli značajke Bootstrapa, moramo razumjeti promjena paradigme u dizajnu web stranice.

kad 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 preferirano sredstvo pristupa za korisnike. izazov je bio učiniti da se stranice prilagode različitim ekranima, a da korisnik ne mora povećavati, smanjivati ​​ili pomicati sadržaj kako bi ga mogao vidjeti.

U načelu su usvojeni sljedeći pristupi:

• Responzivni dizajn: Dizajn je isti ali se automatski prilagođava veličini zaslona. Ovaj pristup ima neke probleme kao što je korisnik može biti prisiljen zumirati određene dijelove stranice kako bi ih vidio.
• Progresivno napredovanje: Započinje dizajniranjem stranice za uređaj s manje resursa (općenito mobilni telefon jer ima manji zaslon, preglednik s manje kompatibilnosti za napredne značajke i često zahtijeva korištenje podatkovnog plana za povezivanje). Nakon završetka, na temelju ovog dizajna, dodaju se značajke za dobivanje verzije za tablete, prijenosna i stolna računala.
• Postupna degradacija: To je obrnuti put. Prvo se kreira web-mjesto za radnu površinu, a značajke se uklanjaju dok se ne dobije verzija prilagođena mobilnim uređajima.

Kako je uvijek lakše dodati nego ukloniti, progresivno napredovanje je trend koji je uspio prevladati. B.ootstrap na primjer ima pristup "prvo mobilni"., to jest da je osnova dizajna uvijek verzija koja će biti prikazana na najmanjoj veličini zaslona, ​​a zatim se utvrđuju izmjene koje će se izvršiti kako se prenosi na sljedeće veličine.

Dodatna prednost korištenja Bootstrapa povezana je s činjenicom da Google u svojim pretraživanjima daje prioritet stranicama prilagođenim mobilnim uređajima.

Drugi koncept koji moramo uzeti u obzir je razlika između frontend i backend dizajna. Front-end dizajn brine o svemu što korisnik vidi i o svemu s čime komunicira. Backend grupira ono što se radi na poslužitelju. Primjer prvog je onaj web obrasca. Prikaz niza opcija prikazan je kao padajući izbornik je dizajn sučelja, da se odabrana opcija šalje poštom ili dodaje u bazu podataka je dizajn pozadine.

Bootstrap je okvir koji kombinira elemente CSS stila i Javascript programiranja za kontrolu renderiranja i daje interaktivnost svim komponentama stranice razvijene u HTML5.

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

• dostupnost: Komponente poput izbornika ili dijaloških okvira kompatibilne su s čitačima zaslona ili prikladne za osobe smanjene pokretljivosti.
• Gumbi: Uključujući mjere, stilove, stanja i grupiranje.
• Obrasci:  Uključujući iscrtavanje, vrste kontrola i provjeru valjanosti unosa.
• Lik: Kontrolira ishodište, poravnanje i veličinu zaslona umetnutih slika.
• Elementi navigacije: Na primjer, bočne trake koje se mogu sakriti ili okomiti ili vodoravni izbornici, ovisno o uređaju.
• Tipografija: Kontrolirajte kako se različiti dijelovi teksta prikazuju.
• Izgled: Prilagodba prikaza sadržaja ovisno o uređaju

U sljedećem ćemo članku vidjeti neke praktične primjere njegove uporabe.