Dato che Twitter Bootstrap è progettato per essere reattivo / adatto al dispositivo, perché non utilizza le dimensioni dei caratteri relative?
Dato che Twitter Bootstrap è progettato per essere reattivo / adatto al dispositivo, perché non utilizza le dimensioni dei caratteri relative?
Risposte:
Beh, sembra che si stiano nascondendo dietro la scusa dello zoom del browser . Davvero triste vedere un framework così utilizzato e influente ignorare completamente i problemi di accessibilità e una pietra angolare fondamentale del responsive design. Si trovano in una posizione di grande responsabilità e purtroppo sembrano non avere alcuna intenzione di agire di conseguenza.
[Aggiornamento] Così oggi Mark Otto ha risposto al thread a cui ho fatto riferimento sopra. Com'era prevedibile, non si fa menzione dell'accessibilità e dell'uso della frase "pixel perfetti":
Ok, quindi ecco un po 'di informazioni sulle decisioni del passato e sui piani per andare avanti.
I pixel forniscono un controllo assoluto e un rendering coerente su ogni browser.
I designer pensano e operano ancora principalmente in pixel.
I browser ingrandiscono intere pagine in questi giorni, quindi non è un problema con il ridimensionamento del tipo o altro.
La nidificazione degli ems storicamente è stata una seccatura e può richiedere calcoli aggiuntivi per i valori dei pixel calcolati / previsti.
Mischiare unità di misura è brutto e il mio disturbo ossessivo compulsivo interiore lo odia. L'utilizzo di unità sull'altezza della riga è generalmente sconsigliato, ma fornisce una conoscenza immediata di quale sia il valore calcolato. Probabilmente in futuro cercheremo di evitare questo. In futuro, probabilmente useremo ems per il dimensionamento del tipo, forse anche per i rems, ma non per nient'altro. Questo è anche discutibile sulle dimensioni dei caratteri per gli input e simili. Non è solo il modo in cui le persone costruiscono siti pixel perfetti.
È un po 'tutto e si spera abbastanza coerente. Cercherò di scrivere un blog su questi cambiamenti man mano che si presentano di più, ma non sono sicuro di quanto sia vicino 3.0 e cosa comporterà ancora tutto ciò.
Suggerirei a chiunque abbia forti sentimenti su questo andare e fare +1 su questo thread .
[Aggiornamento] La roadmap V3 definita nel post sul blog della versione V2.3 non fa menzione dell'aggiunta del supporto per ems.
[Aggiornamento] Molte più informazioni su Bootstrap V3 disponibili nella richiesta pull qui, incluse le seguenti di Mark Otto:
Abbiamo esplorato l'uso delle unità rem sui pixel, ma abbiamo riscontrato pochi vantaggi per compensare le implicazioni del loro utilizzo. IE8 avrebbe ancora bisogno di un pixel fallback, e questo è un sacco di righe di codice duplicate. Inoltre, l'utilizzo di rem ovunque invece dei pixel aggraverebbe il problema. Mescolare Remms e Pixel non sembra avere senso neanche adesso. Tuttavia, possiamo e continueremo a valutarlo nelle versioni future.
Poi più recentemente (nei suoi commenti):
Dubito fortemente che spediremo con i rems a questo punto. Cambiare tutto, oltre alle dimensioni dei caratteri, è un compito enorme e viene fornito con pochi vantaggi per compensarlo. Raddoppiare le righe di codice per la dimensione dei caratteri a parte, supportare i rem in qualsiasi altro modo sembra noioso nella migliore delle ipotesi. Detto questo, possiamo sempre rivisitare in una versione futura. Per ora, ci limitiamo ai pixel.
Essendo diventato insoddisfatto di un gran numero di funzionalità di Bootstrap, non ultima la mancanza di supporto em, consiglio vivamente di guardare Susy se vuoi solo le griglie, o Zurb Foundation 4 per l'intera enchilada. Non lasciare che la popolarità di Bootstrap offuschi il tuo giudizio. Chiunque può creare qualcosa con Bootstrap, che è esattamente il suo problema: è progettato per le persone con un'esperienza web minima. Solo perché ci sono molti McDonald's nel mondo non significa che sia un posto sano dove mangiare.
[Modifica] OK. Questa era una cosa sciocca da dire. Da quando ho scritto questo, ho usato BS3 e ha migliorato notevolmente il suo gioco. Non avrei dovuto fare un commento così usa e getta, ma credo ancora che abbia preso una cattiva decisione nell'usare i pixel per il dimensionamento dei caratteri. Oltre ai problemi di accessibilità, gli em sono utili in altri modi.
[Aggiornamento] Sembra che i rems saranno supportati nella V4 (Mdo citato da qui ):
Per coloro che seguono, saremo in grado di passare da pixel a REM nella v4 quando abbandoneremo il supporto IE8. Non posso fare molto fino ad allora.
[Aggiornamento febbraio '17] Bootstrap 4 è ancora in Alpha, ma mostra l'uso di rems nei suoi documenti di tipografia , ma non mostra l'uso di rems nei suoi documenti di layout .
emè richiesto per queste persone, quindi "accessibilità".
Non lasciare che la popolarità di Bootstrap offuschi il tuo giudizio. Chiunque può creare qualcosa con Bootstrap, che è esattamente il suo problema: è progettato per le persone con un'esperienza web minima. Solo perché ci sono molti McDonald's nel mondo non significa che sia un posto sano dove mangiare.
Potresti sostenere di non lasciare che offuschi il tuo giudizio in modo negativo. È una struttura solida e se ti preoccupi di investire il tempo su come usarla in modo efficace, la maggior parte delle tue argomentazioni ricade sulla sua testa.
Sebbene sia spesso utilizzato da persone con una minima esperienza - e non c'è niente di sbagliato in questo - è utilizzato anche da persone con molta esperienza.
Almeno, è uno strumento di prototipazione inestimabile. Nella migliore delle ipotesi, è completamente personalizzabile. Puoi scegliere e scegliere, modificare, aggiungere - motivo per cui si chiama "framework".
Lo uso in modo efficace su alcuni dei miei progetti da oltre due anni: è snello come vuoi che sia. Ho usato solo il framework dei form, solo le griglie, l'intera base di codice e l'ho personalizzato in base alle mie esigenze. In molti modi, ha "migliorato" il mio gioco, portandomi ulteriormente nella preelaborazione, utilizzando variabili, affinando il modo in cui strutturo i progetti.
Sì, ci sono alcuni problemi. pxper le dimensioni dei caratteri e l'utilizzo di Meno sono due. Tuttavia, poiché è interamente open source, puoi trovare opzioni per rimediare a entrambi facilmente.
Ho studiato Foundation e quello che ho visto mi è piaciuto, ma sono nella sfortunata posizione di dover supportare IE8, come lo sono molti sviluppatori. Foundation ha abbandonato il supporto per IE8, rendendolo un "no go" per me. Nonostante ciò, non sto per eliminare un intero framework, in particolare qualcosa che è gratuito da usare e libero di modificare basandosi esclusivamente su alcuni problemi!
Diamine, in un progetto, ho sollevato parti di Foundation e parti di Bootstrap e ho aggiunto il mio codice personalizzato: questa è la bellezza dell'open source.
Se preferisci ancora Bootstrap con supporto em e rem puoi dare un'occhiata a questo - https://github.com/ivayloc/twbs-rem-em non è necessario fare alcun calcolo per convertire i pixel in unità rem o em, c'è un build in @mixinsper questo - @include rem(property, values)- anche il fallback a px e per la conversione em che puoi usare em(value).
Anche se utilizzo ampiamente Bootstrap, ci sono alcune aree in cui l'accessibilità prende il sopravvento. Immagino che ci siano inevitabili compromessi con una piattaforma così ampiamente utilizzata.
Capisco perfettamente perché hanno scelto di mantenere i pixel per la dimensione del carattere. I problemi di ereditarietà con em per i font di un framework sono un incubo totale.
rems sono un'opzione alternativa, ma il supporto del browser è ancora problematico.
Puoi creare il tuo rems mixin e sostituire ogni riga di less che utilizza la variabile di dimensione del carattere di base.
Questa è la bellezza di bootstrap - e di framework simili - è una solida base su cui lavorare.
Sì, ho detto che ci sono elementi nel bootstrap di Twitter che non sono così accessibili - un piccolo esempio, l'uso di "display: none" invece di usare clip. Sono dannatamente sicuro che ci sia una ragione valida per questo - e di nuovo, puoi modificarlo molto facilmente se lo desideri.
Bootstrap non è impeccabile, ma dubito che sia mai stato pensato per essere la risposta finale a tutte le tue esigenze. È una base - un "bootstrap" - imparalo e usalo correttamente, aggiungi ad esso, mescola tutto - per lo meno, è un framework fantastico con cui prototipare o creare un sito veloce. Andando oltre, ci sono alcune basi davvero solide che possono essere applicate a qualsiasi sito web.