Wikipedia

Bootstrap (framework): differenze tra le versioni

Naviga nella cronologia in modo interattivo
← Differenza precedente
Contenuto cancellato Contenuto aggiunto
VisualeWikitesto
FrescoBot (discussione | contributi)
Bot
3 578 440 modifiche
m Bot: pubblicare anziché rilasciare e modifiche minori
AdertBot (discussione | contributi)
Bot
29 225 modifiche
m Utilizzo {{formatnum:}} o {{M}}
 
(34 versioni intermedie di 26 utenti non mostrate)
Riga 4:
|SistemaOperativo = Multipiattaforma
|NotaSistemaOperativo = {{sp}}(su [[web browser]])
|UltimaVersione= 4.0.0=
|DataUltimaVersione= {{Data|18|01|2018}}=
|Linguaggio = HTML
|Linguaggio2 = CSS
|Linguaggio3 = JavaScript
|LinguaggioAltri = [[Sass]], [[LESS]]
|Genere = web framework
|Licenza = [[Licenza MIT|MIT]] ([[Apache License|Apache]] 2.0 per versioni precedenti la 3.1.0)
|Lingua = Inglese
|SoftwareLibero = sì
|Sviluppatore =
|SitoWeb =
}}
 
'''Bootstrap''' è una raccoltalibreria di strumenti [[Software libero|liberi]] per la creazione di [[Sito web|siti]] e [[Applicazione web|applicazioni]] per il [[World Wide Web|Web]].
Essa contiene [[template|modelli]] di progettazione basati su [[HTML]] e [[CSS]], sia per la [[tipografia]], che per le varie componenti dell'interfaccia, come [[Form|moduli]], pulsanti e navigazione, così come alcune estensioni opzionali di [[JavaScript]].
 
== Origine ==
Bootstrap è stato sviluppato da Mark Otto e Jacob Thornton presso [[Twitter]] come un [[Framework_per_applicazioni_webFramework per applicazioni web|framework]] che uniformasse i vari componenti che ne realizzavano l'interfaccia web, dato che la presenza di diverse librerie aveva portato ad incoerenze ed elevati oneri di manutenzione. Lo stesso Otto racconta:
{{Citazione|Io e un piccolissimo gruppo di sviluppatori ci riunimmo per progettare e implementare un nuovo componente interno e notammo l'opportunità di fare qualcosa in più. Durante il processo, infatti, ci ritrovammo a costruire qualcosa di ben più sostanzioso. Mesi dopo concludevamo la prima versione di Bootstrap nell'ottica di documentare e condividere comuni modelli di progettazione e attività all'interno della società".|<ref>{{cita web |titolo=Bootstrap in A List Apart No. 342 |autore=Mark Otto |lingua=Inglese |sito=@mdo (sito personale di Mark Otto) |url=http://markdotto.com/2012/01/17/bootstrap-in-a-list-apart-342/ |data=17 gennaio 2012 |accesso=9 luglio 2015}}</ref>}}
È stato impiegato per la prima volta in condizioni reali durante la prima [[Hackweek]] di Twitter, quando Otto ha mostrato ad alcuni colleghi come lo sviluppo dei loro progetti potesse essere accelerato grazie al Bootstrap.
Dopo quell'occasione decine di squadre di sviluppo di Twitter sono passate a questo strumento.
 
Nell'agosto 2011 Twitter ha rilasciatolanciato Bootstrap come [[open source]], invitando tutti gli sviluppatori a partecipare al progetto e a dare il loro contributo alla piattaforma.
Nel febbraio 2012, è stato il progetto di sviluppo che sulla piattaforma [[GitHub]] ha ricevuto il maggior numero di apprezzamenti, ottenendo, al febbraio 2018, 122.000{{formatnum:122000}} stelle e 58.000{{formatnum:58000}} fork.
 
Il 31 gennaio 2012 è uscito Bootstrap 2. Questa versione aggiunge un layout a griglia a dodici colonne e componenti reattivi e molti componenti sono stati modificati<ref>{{Cita web|url=https://github.com/|titolo=Build software better, together|sito=GitHub|lingua=en|accesso=2021-03-16}}</ref>. Bootstrap 3 è uscito il 19 agosto 2013. Ha iniziato a dare la priorità ai dispositivi mobili come criterio e ha iniziato a utilizzare il [[Flat design|design piatto]].
 
Il 23 aprile 2015, Mark Otto ha annunciato che Bootstrap 4 è in fase di sviluppo<ref>{{Cita web|url=https://blog.getbootstrap.com/2014/10/29/bootstrap-3-3-0-released/|titolo=Bootstrap 3.3.0 released|autore=Mark Otto|sito=Bootstrap Blog|data=2014-10-29|lingua=en|accesso=2021-03-16}}</ref>. La prima versione alpha di Bootstrap 4 è stata distribuita il 19 agosto 2015<ref>{{Cita web|url=https://blog.getbootstrap.com/2015/08/19/bootstrap-4-alpha/|titolo=Bootstrap 4 alpha|autore=Mark Otto|sito=Bootstrap Blog|data=2015-08-19|lingua=en|accesso=2021-03-16}}</ref>.
 
Bootstrap 5 è stato rilasciato il 21 maggio 2021<ref>{{Cita web|url=https://github.com/twbs/bootstrap/pull/34050|titolo=Bootstrap 5 - mergecommit|sito=Github - Bootstrap|lingua=en|accesso=2024-05-30}}</ref>.
 
== Caratteristiche ==
[[File:Twitter Bootstrap Under Firefox 32.png|alt=Esempio di utilizzo di Twitter Boostrap|miniatura|340x340px|Esempio di utilizzo di Twitter Bootstrap<ref>{{Cita web|url=https://bootstrapdocs.com/v2.0.2/docs/|titolo=Twitter Bootstrap 2.0.2 Documentation - BootstrapDocs|sito=bootstrapdocs.com|accesso=2021-02-15}}</ref>]]
Bootstrap è compatibile con le ultime versioni di tutti i principali [[browser]].
 
Dalla versione 2.0 supporta anche il [[Design responsivo|responsive web design]]. Ciò significa che il layout delle pagine web si regola dinamicamente, tenendo conto delle caratteristiche del dispositivo utilizzato, sia esso desktop, tablet o [[telefono cellulare]]. A partire dalla versione 3.0, Bootstrap ha adottato il responsive design come impostazione predefinita, sottolineando il suo essere nata come libreria multidispositivo e [[multipiattaforma]].
 
I membri della comunità hanno tradotto la [[documentazione del software]] di Bootstrap in varie lingue (tra cui [[Lingua cinese|cinese]], [[Lingua spagnola|spagnolo]] e [[Lingua russa|russo]]). La qualità della documentazione e degli esempi d'uso pratico è considerato uno dei punti di forza di Bootstrap.
Line 38 ⟶ 47:
 
* Cessato supporto di browser obsoleti, come [[Internet Explorer]] 8 e 9 e quelli integrati nei primi [[iPhone]]
* Adozione di SASS<ref>{{Cita web|url=https://sass-lang.com/|titolo=Sass: Syntactically Awesome Style Sheets|sito=sass-lang.com|lingua=en|accesso=2018-11-17 novembre 2018}}</ref> invece di LESS<ref>{{Cita web|url=http://lesscss.org/|titolo=Getting started {{!}} Less.js|autore=The Core Less Team|sito=lesscss.org|lingua=en|accesso=2018-11-17 novembre 2018}}</ref> e di Reboot.css<ref>{{Cita web|url=https://getbootstrap.com/docs/4.1/content/reboot/|titolo=Reboot|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=2018-11-17 novembre 2018}}</ref> invece di Normalize.css<ref>{{Cita web|url=https://getbootstrap.com/docs/3.3/css/#overview-normalize|titolo=CSS · Bootstrap|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=2018-11-17 novembre 2018}}</ref> per la gestione dinamica organica e dinamica dei [[CSS]]
* Tutti i [[Plugin (informatica)|plugin]] JavaScript sono stati resi compatibili con ES6<ref>{{Cita web|url=http://es6-features.org/#Constants|titolo=ECMAScript 6: New Features: Overview and Comparison|sito=es6-features.org|accesso=2018-11-17 novembre 2018}}</ref> e risultarerisultano più veloci e leggeri
* Sostituzione dell'oggetto Panel<ref>{{Cita web|url=https://getbootstrap.com/docs/3.3/components/#panels|titolo=Components · Bootstrap|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=2018-11-17 novembre 2018}}</ref> con Cards<ref>{{Cita web|url=https://getbootstrap.com/docs/4.0/components/card/|titolo=Cards|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=2018-11-17 novembre 2018}}</ref>, che risultano più flessibili e potenti ma richiedono ovviamente la riscrittura di codici nati per Bootstrap 3
* Eliminazione dei Glyphicons<ref>{{Cita web|url=https://www.glyphicons.com/|titolo=Sharp and clean symbols - GLYPHICONS|autore=Design and content - Jan Kovařík, Code - Petr Urbánek|sito=www.glyphicons.com|lingua=cs|accesso=17 novembre 2018-11-17}}</ref> integrati e agevolazione per l'uso di font esterni, come per esempio [[Font Awesome]].
 
Naturalmente la versione 4 di Bootstrap prevede molte altre funzionalità e modifiche, documentate sul sito del progetto<ref>{{Cita web|url=https://getbootstrap.com/docs/4.0/migration/|titolo=Migrating to v4|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=2018-11-17}}</ref> stesso.
 
Naturalmente la versione 4 di Bootstrap prevede molte altre funzionalità e modifiche, documentate sul sito del progetto<ref>{{Cita web|url=https://getbootstrap.com/docs/4.0/migration/|titolo=Migrating to v4|autore=Mark Otto, Jacob Thornton, and Bootstrap contributors|sito=getbootstrap.com|lingua=en|accesso=17 novembre 2018}}</ref> stesso.
== Alternative ==
Tra le alternative si trovano:
 
Di seguito i Colori Bootstrap predefiniti rispetto ai [[colori Web]] anonimi. In [[HTML]], [[CSS]], [[Scalable Vector Graphics|SVG]] e [[Canvas (elemento HTML)|Canvas]] non si possono tradurre i colori, vanno mantenuti in [[lingua inglese]]. Ad esempio non si può scrivere <code>color: rosso</code> ma si deve scrivere <code>color: red</code>
* [http://bulma.io/ Bulma] basato su flexbox;
{| class="wikitable sortable"
* [http://foundation.zurb.com/ Foundation], responsive e avanzato;
|+Colori Bootstrap predefiniti rispetto ai [[colori Web]] con lo stesso nome
* [http://milligram.io/ Milligram], minimalista per fogli di stile a cascata;
!Nome
* [https://purecss.io/ Pure.css], un insieme di moduli di fogli di stile a cascata che sono piccoli e responsive;
!Esadecimale
* [https://semantic-ui.com/ SemanticUI] permette di creare siti più facilmente leggibili da umani;
<small>(RGB)</small>
* [https://getuikit.com/ UIkit], leggero e modulare.
!Rosso
<small>(RGB)</small>
!Verde
<small>(RGB)</small>
!Blu
<small>(RGB)</small>
!Tonalità
<small>(HSL/HSV)</small>
!Saturazione
<small>(HSL)</small>
!Luce
<small>(HSL)</small>
!Satur.
<small>(HSV)</small>
!Valore
<small>(HSV)</small>
!Alternative
|-
!Bootstrap White
|#FFFFFF
|100%
|100%
|100%
|0°
|0%
|100%
|0%
|100%
|White
|-
!Bootstrap Gray 100
|#F8F9FA
|97%
|98%
|98%
|210°
|17%
|98%
|1%
|98%
|-
!Bootstrap Gray 200
|#E9ECEF
|91%
|93%
|94%
|210°
|16%
|93%
|3%
|94%
|-
!Bootstrap Gray 300
|#DEE2E6
|87%
|89%
|90%
|210°
|14%
|89%
|4%
|90%
|-
!Bootstrap Gray 400
|#CED4DA
|81%
|83%
|85%
|210°
|14%
|83%
|6%
|86%
|-
!Bootstrap Gray 500
|#ADB5BD
|68%
|71%
|74%
|210°
|11%
|71%
|9%
|74%
|-
!Bootstrap Gray 600
|#6C757D
|42%
|46%
|49%
|208°
|7%
|46%
|14%
|49%
|Bootstrap Gray
|-
!Bootstrap Gray 700
|#495057
|29%
|31%
|34%
|210°
|9%
|31%
|16%
|34%
|-
!Bootstrap Gray 800
|#343A40
|20%
|23%
|25%
|210°
|10%
|23%
|19%
|25%
|Bootstrap Dark Gray
|-
!Bootstrap Gray 900
|#212529
|13%
|15%
|16%
|210°
|11%
|15%
|20%
|16%
|-
!Bootstrap Black
|#000000
|0%
|0%
|0%
|0°
|0%
|0%
|0%
|0%
|Black
|-
!Bootstrap Blue
|#0D6EFD
|5%
|43%
|99%
|216°
|98%
|52%
|95%
|99%
|-
!Bootstrap Indigo
|#6610F2
|40%
|6%
|95%
|263°
|90%
|51%
|93%
|95%
|-
!Bootstrap Purple
|#6F42C1
|44%
|26%
|76%
|261°
|51%
|51%
|66%
|76%
|-
!Bootstrap Pink
|#D63384
|84%
|20%
|52%
|330°
|67%
|52%
|76%
|84%
|-
!Bootstrap Red
|#DC3545
|86%
|21%
|27%
|354°
|71%
|54%
|76%
|86%
|-
!Bootstrap Orange
|#FD7E14
|99%
|49%
|8%
|27°
|98%
|54%
|92%
|99%
|-
!Bootstrap Yellow
|#FFC107
|100%
|76%
|3%
|45°
|100%
|51%
|97%
|100%
|-
!Bootstrap Green
|#198754
|10%
|53%
|33%
|152°
|69%
|31%
|82%
|53%
|-
!Bootstrap Teal
|#20C997
|13%
|79%
|59%
|162°
|73%
|46%
|84%
|79%
|-
!Bootstrap Cyan
|#0DCAF0
|5%
|79%
|94%
|190°
|90%
|50%
|95%
|94%
|-
!Gray
|#808080
|50%
|50%
|50%
|0°
|0%
|50%
|0%
|50%
|Grey
|-
!Blue
|#0000FF
|0%
|0%
|100%
|240°
|100%
|50%
|100%
|100%
|-
!Indigo
|#4B0082
|29%
|0%
|51%
|275°
|100%
|26%
|100%
|51%
|-
!Purple
|#800080
|50%
|0%
|50%
|300°
|100%
|25%
|100%
|50%
|-
!Pink
|#FFC0CB
|100%
|75%
|80%
|350°
|100%
|88%
|25%
|100%
|-
!Red
|#FF0000
|100%
|0%
|0%
|0°
|100%
|50%
|100%
|100%
|-
!Orange
|#FFA500
|100%
|65%
|0%
|39°
|100%
|50%
|100%
|100%
|-
!Yellow
|#FFFF00
|100%
|100%
|0%
|60°
|100%
|50%
|100%
|100%
|-
!Green
|#008000
|0%
|50%
|0%
|120°
|100%
|25%
|100%
|50%
|-
!Teal
|#008080
|0%
|50%
|50%
|180°
|100%
|25%
|100%
|50%
|-
!Cyan
|#00FFFF
|0%
|100%
|100%
|180°
|100%
|50%
|100%
|100%
|Aqua
|}
 
== Note ==
Line 65 ⟶ 447:
 
{{Controllo di autorità}}
{{portale|internet}}
 
[[Categoria:Framework per applicazioni web]]
[[Categoria:Web design]]
Estratto da "https://it.wikipedia.org/wiki/Bootstrap_(framework)"