Creare layout Bootstrap online e senza codice
Alcuni giorni fa abbiamo parlato di come creare APP Android e iOS in HTML5 CSS3. Nell’articolo ho citato Bootstrap come possibile Framework HTML CSS per creare layout responsive. Non tutti sanno che è possibile usare Bootstrap in maniera del tutto visuale con il drag and drop, cioè trascinando i vari blocchi che ci servono all’interno di un interfaccia e poi scaricare tutto già bello e pronto. In poche parole è possibile creare layout Bootstrap online e senza codice. Ovviamente dopo dovrete lavorare un pochino in HTML e CSS per adattare il lavoro alla vostra idea di base, ma non avrete a che fare con il Framework, ovvero con la creazione delle righe, delle colonne, dei bottini ecc.
Bootstrap non offe solo la possibilità di creare vari blocchi e di disporli a piacimento, permette anche di inserire componenti in Javascript come modali, caroselli di immagini tab e molto altro. Anche questo potrà essere fatto in maniera visuale.
Bootstrap online e senza codice con layoutit
Layoutit è un’applicazione online gratuita e che non necessita nemmeno di registrazione. Tutto quello che dovrete fare è andare al seguente indirizzo http://www.layoutit.com/build e cominciare a plasmare il layout secondo le vostre esigenze. Sulla sinistra avrete un menù:
- Grid system
- Base CSS
- Component
- Javascript
In Grid system ci sono gli elementi della griglia, basta scegliere cosa vogliamo e trascinare nel progetto, possiamo inserire tre blocchi uno di fianco all’altro in una riga, oppure due. Oppure uno più grande e due più piccole ed aggiungere tutte le righe che vogliamo.
In Base CSS andremo a prelevare i titoli, i paragrafi, Blockquote, elenchi puntati e numerati e tutto ciò che è necessario.
I Component, sono molto interessanti, ci sono moltissimi elementi, come menù, bottoni, blocchi di immagini con testo ecc.
Infine i Javascript che consentono ad esempio di creare slideshow in un secondo. Semplicemente trascinandoli nel progetto.
Una volta terminato in alto avrete il pulsante per l’anteprima e ovviamente il download dell’intero progetto.
