Twitter Bootstrap'in duyarlı / cihaz dostu olacak şekilde tasarlandığı göz önüne alındığında, neden göreceli yazı tipi boyutlarını kullanmıyor?
Twitter Bootstrap'in duyarlı / cihaz dostu olacak şekilde tasarlandığı göz önüne alındığında, neden göreceli yazı tipi boyutlarını kullanmıyor?
Yanıtlar:
Görünüşe göre tarayıcı yakınlaştırma bahanesinin arkasına saklanıyorlar . Bu kadar yoğun kullanılan ve etkili bir çerçevenin erişilebilirlik sorunlarını ve duyarlı tasarımın temel bir köşe taşını tamamen görmezden geldiğini görmek gerçekten üzücü. Çok büyük bir sorumluluk durumundalar ve maalesef buna göre hareket etme niyetleri yok gibi görünüyor.
[Güncelleme] Yani bugün Mark Otto yukarıda bahsettiğim konuya cevap verdi. Tahmin edilebileceği gibi, erişilebilirlikten ve "mükemmel piksel" ifadesinin kullanımından söz edilmiyor:
Pekala, işte geçmiş yılların kararları ve ilerlemenin planları hakkında biraz arka plan.
Pikseller, her tarayıcıda mutlak kontrol ve tutarlı işleme sağlar.
Tasarımcılar hala çoğunlukla piksel olarak düşünüyor ve çalışıyor.
Tarayıcılar bu günlerde sayfaların tamamını ölçeklendiriyor, bu nedenle bu tür ölçekleme veya herhangi bir şeyle ilgili bir sorun değil.
Ems yuvalama tarihsel olarak bir sıkıntı olmuştur ve hesaplanan / amaçlanan piksel değerleri için fazladan matematik gerektirebilir.
Ölçüm birimlerini karıştırmak çirkin ve iç OKB'm bundan nefret ediyor. Hat yüksekliğinde birimlerin kullanılması genellikle tavsiye edilmez, ancak hesaplanan değerin ne olduğu hakkında anında bilgi sağlar. Gelecekte muhtemelen bundan uzaklaşmaya çalışacağız. Gelecekte, tür boyutlandırma için ems kullanacağız, belki de rems, ancak başka hiçbir şey için kullanmayacağız. Bu, girdiler ve benzerleri için yazı tipi boyutları konusunda da tartışmalıdır. İnsanların piksel mükemmel siteleri nasıl oluşturdukları değil.
Bu biraz tamamlanmış ve umarım yeterince tutarlıdır. Daha fazla ortaya çıktıkça bu değişiklikler hakkında blog yazmayı deneyeceğim, ancak 3.0'ın ne kadar yakın olduğundan ve bunların henüz neyi gerektireceğinden emin değilim.
Bu konuda güçlü duyguları olan herkese bu konuyu + 1'lemelerini öneririm .
[Güncelleme] V2.3 sürümünde ortaya çıkan V3 yol haritası blogpost , ems için destek eklemekten bahsetmiyor.
[Güncelleme] Mark Otto'dan aşağıdakiler de dahil olmak üzere buradaki çekme isteğinde Bootstrap V3 hakkında daha fazla bilgi bulabilirsiniz :
Rem birimlerinin piksellere göre kullanımını araştırdık, ancak kullanımlarının sonuçlarını dengelemek için çok az fayda bulduk. IE8 yine de bir piksel geri dönüşüne ihtiyaç duyacaktır ve bu çok sayıda yinelenen kod satırıdır. Üstelik her yerde piksel yerine rem kullanmak bu sorunu daha da kötüleştirecektir. Rem'leri ve pikselleri karıştırmak da şu anda bir anlam ifade etmiyor. Ancak bunu gelecekteki sürümlerde değerlendirebiliriz ve değerlendirmeye devam edeceğiz.
Sonra daha yakın zamanda (yorumlarında):
Bu noktada rems ile göndereceğimizden şüpheliyim. Yazı tipi boyutlarının ötesinde her şeyi değiştirmek çok büyük bir görevdir ve bunu dengelemek için çok az faydası vardır. Yazı tipi boyutları için kod satırlarını iki katına çıkarın, rem'leri başka herhangi bir şekilde desteklemek en iyi ihtimalle sıkıcı görünebilir. Bununla birlikte, gelecekteki bir sürümde her zaman yeniden ziyaret edebiliriz. Şimdilik piksellere bağlıyız.
Em-destek 's eksikliği değil en az biri Bootstrap özelliklerinden çok sayıda ile memnun büyüdü olması, şiddetle bakarak öneririz Susy sadece ızgaralar istiyorsanız veya Zurb Vakfı 4 bütün enchilada için. Bootstrap'in popülaritesinin yargınızı gölgelemesine izin vermeyin. Herkes Bootstrap ile bir şeyler inşa edebilir ki bu tam da onun sorunu - minimum web deneyimi olan kişiler için tasarlanmıştır. Dünyada çok sayıda McDonalds olması, yemek yemek için sağlıklı bir yer olduğu anlamına gelmez.
[Düzenle] Tamam. Bu söylenecek aptalca bir şeydi. Bunu yazdığımdan beri BS3 kullandım ve oyununu önemli ölçüde yükseltti. Böyle bir yorum yapmamalıydım, ancak yine de yazı tipi boyutlandırma için piksel kullanma konusunda kötü bir karar verdiğine inanıyorum. Erişilebilirlik sorunlarının yanı sıra, ems başka şekillerde de kullanışlıdır.
[Güncelleme] rem gibi görünüyor olacak V4 desteklenecek (YTS alıntı burada ):
Bunu takip edenler için, IE8 desteğini bıraktığımızda v4'te piksellerden REM'lere geçebileceğiz. O zamana kadar pek bir şey yapamam.
[Güncelleme Şubat '17] Bootstrap 4 Alpha hala, ancak gösteriler onun içinde rem kullanmak Tipografi docs , ama değil onun içinde rem kullanımını göstermek düzen docs .
embu tür insanlar için gereklidir, dolayısıyla "erişilebilirlik".
Bootstrap'in popülaritesinin yargınızı gölgelemesine izin vermeyin. Herkes Bootstrap ile bir şeyler inşa edebilir ki bu tam da onun sorunu - minimum web deneyimi olan kişiler için tasarlanmıştır. Dünyada çok sayıda McDonalds olması, yemek yemek için sağlıklı bir yer olduğu anlamına gelmez.
Kararınızı olumsuz bir şekilde gölgelemesine izin vermeyebilirsiniz. Bu sağlam bir çerçevedir ve zamanı nasıl etkili bir şekilde kullanacağınıza harcarsanız, argümanınızın çoğu kafasına düşer.
Genellikle minimum deneyime sahip insanlar tarafından kullanılırken - ve bunda yanlış bir şey yok - aynı zamanda çok fazla deneyime sahip kişiler tarafından da kullanılıyor .
En azından paha biçilemez bir prototip oluşturma aracıdır. En iyi ihtimalle, tamamen özelleştirilebilir. Seçebilir ve seçebilir, değiştirebilir, ekleme yapabilirsiniz - bu yüzden buna 'çerçeve' denir.
İki yılı aşkın süredir bazı projelerimde etkili bir şekilde kullanıyorum - olmasını istediğiniz kadar yalın. Sadece form çerçevesini, sadece ızgaraları, tüm kod tabanını kullandım ve ihtiyaçlarıma uyacak şekilde özelleştirdim. Birçok yönden, oyunumu 'yükseltti', beni ön işlemeye, değişkenleri kullanmaya, projeleri yapılandırma biçimimi geliştirmeye götürüyor.
Evet, bazı sorunlar var. pxyazı tipi boyutları ve Daha Az kullanımı ikidir. Bununla birlikte, tamamen açık kaynak olduğu için, her ikisini de kolayca düzeltmek için seçenekler bulabilirsiniz.
Foundation'ı araştırdım ve gördüklerimi beğendim, ancak birçok geliştirici gibi IE8'i desteklemek zorunda kalma talihsiz durumdayım. Vakıf, IE8'e olan desteğini kesti ve benim için 'hayır' yaptı. Buna rağmen bütün bir çerçeve, en spesifik olarak bir şey görevden hakkında değilim serbest kullanımı ve ücretsiz sadece birkaç konulara dayalı, değiştirmek!
Heck, bir projede, Foundation'ın bazı kısımlarını ve Bootstrap'in bazı kısımlarını kaldırdım ve kendi özel kodumu ekledim - bu, açık kaynağın güzelliği.
Hala Bootstrap'i em ve rem desteği ile tercih ediyorsanız, buna bir göz atabilirsiniz - https://github.com/ivayloc/twbs-rem-em pikselleri rem veya em birimlerine dönüştürmek için herhangi bir hesaplama yapmaya gerek yoktur, bunun için bir yapı var @mixins- @include rem(property, values)- ayrıca piksele dönüş ve kullanabileceğiniz em dönüşümü için em(value).
Bootstrap'i yoğun olarak kullanırken, erişilebilirliğin arka yazıcıyı aldığı birkaç alan var. Sanırım bu kadar yaygın kullanılan bir platformda kaçınılmaz ödünleşmeler var.
Yazı tipi boyutu için pikselleri neden korumayı seçtiklerini tamamen anlıyorum. Bir çerçevenin yazı tipleri için em'lerle ilgili kalıtım sorunları tam bir kabustur.
rems alternatif bir seçenektir, ancak tarayıcı desteği hala sorunludur.
Kendi rem karışımınızı oluşturabilir ve temel yazı tipi boyutu değişkenini kullanan her satırın yerine daha azını koyabilirsiniz.
Bootstrap'in güzelliği - ve buna benzer çerçeveler - çalışmak için sağlam bir temel.
Evet, twitter önyüklemesi için o kadar erişilebilir olmayan öğeler olduğundan bahsetmiştim - küçük bir örnek, klip kullanmak yerine 'display: none' kullanımı. Bunun geçerli bir nedeni olduğundan oldukça eminim - ve yine isterseniz bunu çok kolay bir şekilde değiştirebilirsiniz.
Bootstrap kusursuz değil, ancak o zaman, tüm gereksinimlerinize son cevap olması amaçlandığından şüpheliyim. Bu bir temel - bir 'önyükleme' - onu öğrenin ve doğru şekilde kullanın, ekleyin, hepsini karıştırın - en azından, prototip oluşturmak veya hızlı bir siteyi bir araya getirmek için harika bir çerçeve. Daha da ileri giderek, herhangi bir web sitesine uygulanabilecek gerçekten sağlam bir temel var .