Mengingat bahwa Twitter Bootstrap dirancang agar responsif / ramah perangkat, mengapa tidak menggunakan ukuran font relatif?
Mengingat bahwa Twitter Bootstrap dirancang agar responsif / ramah perangkat, mengapa tidak menggunakan ukuran font relatif?
Jawaban:
Yah sepertinya mereka bersembunyi di balik alasan zoom browser . Sangat menyedihkan melihat kerangka kerja yang banyak digunakan dan berpengaruh seperti itu sepenuhnya mengabaikan masalah aksesibilitas dan landasan mendasar dari desain responsif. Mereka berada dalam posisi dengan tanggung jawab besar dan sayangnya tampaknya tidak memiliki niat untuk bertindak sesuai dengan itu.
[Pembaruan] Jadi hari ini Mark Otto menjawab di utas yang saya rujuk di atas. Bisa ditebak tidak ada penyebutan aksesibilitas dan penggunaan frase 'pixel-perfect':
Oke, jadi inilah sedikit latar belakang tentang keputusan di masa lalu dan rencana untuk bergerak maju.
Piksel memberikan kontrol mutlak dan rendering yang konsisten di setiap browser.
Desainer kebanyakan masih berpikir dan beroperasi dalam piksel.
Browser meningkatkan seluruh halaman hari ini, jadi ini bukan masalah dengan penskalaan jenis atau apa pun.
Menyarangkan ems secara historis sangat merepotkan dan dapat memerlukan matematika tambahan untuk nilai piksel yang dihitung / diinginkan.
Unit pengukuran pencampuran itu jelek dan OCD batin saya membencinya. Menggunakan satuan pada ketinggian baris umumnya tidak disarankan, tetapi memberikan pengetahuan langsung tentang nilai yang dihitung. Kami mungkin akan mencoba menghindari ini di masa depan. Di masa mendatang, kami mungkin akan menggunakan ems untuk ukuran jenis, bahkan mungkin rem, tetapi tidak untuk hal lain. Ini juga bisa diperdebatkan pada ukuran font untuk input dan sejenisnya. Ini bukan cara orang membuat situs dengan piksel sempurna.
Itu sudah selesai dan mudah-mudahan cukup koheren. Saya akan mencoba untuk blog tentang perubahan ini saat mereka muncul lebih banyak, tetapi saya tidak yakin seberapa dekat 3.0 dan apa yang akan mencakup semua itu.
Saya akan menyarankan siapa pun yang memiliki perasaan kuat tentang perjalanan ini dan memberi +1 pada utas ini .
[Update] Roadmap V3 yang beredar di blogpost rilis V2.3 tidak menyebutkan tentang penambahan dukungan untuk ems.
[Pembaruan] Banyak informasi lebih lanjut tentang Bootstrap V3 tersedia di permintaan tarik di sini termasuk yang berikut dari Mark Otto:
Kami menjelajahi penggunaan unit rem melalui piksel, tetapi menemukan sedikit manfaat untuk mengimbangi implikasi penggunaannya. IE8 masih membutuhkan penggantian piksel, dan itu adalah banyak baris kode duplikat. Selain itu, menggunakan rem di mana-mana alih-alih piksel akan memperburuk masalah itu. Mencampur rem dan piksel sepertinya tidak masuk akal saat ini. Namun, kami dapat dan akan terus mengevaluasi ini di rilis mendatang.
Kemudian baru-baru ini (dalam komentarnya):
Saya sangat ragu kami akan pengiriman dengan rem pada saat ini. Mengubah segalanya — di luar ukuran font — adalah tugas yang sangat besar dan memiliki sedikit manfaat untuk mengimbanginya. Gandakan baris kode untuk ukuran font samping, mendukung rem dengan cara lain tampaknya membosankan. Karena itu, kami selalu dapat mengunjungi kembali di rilis mendatang. Untuk saat ini, kami menggunakan piksel.
Setelah merasa tidak puas dengan sejumlah besar fitur Bootstrap, yang tidak kalah pentingnya adalah kurangnya dukungan em, saya sangat menyarankan untuk melihat Susy jika Anda hanya ingin grid, atau Zurb Foundation 4 untuk seluruh enchilada. Jangan biarkan popularitas Bootstrap mengaburkan penilaian Anda. Siapa pun dapat membangun sesuatu dengan Bootstrap, itulah masalahnya - ini dirancang untuk orang-orang dengan pengalaman web minimal. Hanya karena ada banyak McDonalds di dunia, bukan berarti ini adalah tempat makan yang sehat.
[Edit] Oke. Ini adalah hal yang konyol untuk dikatakan. Sejak saya menulis ini, saya telah menggunakan BS3 dan telah meningkatkan permainannya secara signifikan. Saya seharusnya tidak membuat komentar sekali pakai, tetapi saya masih percaya bahwa itu telah membuat keputusan yang buruk dalam menggunakan piksel untuk ukuran font. Selain masalah aksesibilitas, ems berguna dalam hal lain.
[Pembaruan] Sepertinya rem akan didukung di V4 (Mdo dikutip dari sini ):
Bagi mereka yang mengikuti, kami akan dapat mengubah dari piksel ke REM di v4 saat kami melepaskan dukungan IE8. Tidak bisa berbuat banyak sampai saat itu.
[Perbarui Feb '17] Bootstrap 4 masih dalam versi Alfa, tetapi menunjukkan penggunaan rem dalam dokumen Tipografi , tetapi tidak menunjukkan penggunaan rem dalam dokumen tata letaknya .
emdiperlukan untuk orang-orang seperti itu, maka "aksesibilitas".
Jangan biarkan popularitas Bootstrap mengaburkan penilaian Anda. Siapa pun dapat membangun sesuatu dengan Bootstrap, itulah masalahnya - ini dirancang untuk orang-orang dengan pengalaman web minimal. Hanya karena ada banyak McDonalds di dunia, bukan berarti ini adalah tempat makan yang sehat.
Anda dapat membantah untuk tidak membiarkannya mengaburkan penilaian Anda dengan cara yang negatif. Ini adalah kerangka kerja yang solid dan jika Anda repot-repot menginvestasikan waktu untuk bagaimana menggunakannya secara efektif, sebagian besar argumen Anda akan berada di kepalanya.
Meskipun sering digunakan oleh orang-orang dengan pengalaman minimal - dan tidak ada yang salah dengan itu - ini juga digunakan oleh orang-orang dengan banyak pengalaman.
Setidaknya, ini adalah alat pembuatan prototipe yang sangat berharga. Paling-paling, itu sepenuhnya dapat disesuaikan. Anda dapat memilih, memodifikasi, menambah - itulah sebabnya ini disebut 'kerangka kerja'.
Saya telah menggunakannya secara efektif pada beberapa proyek saya selama lebih dari dua tahun - sesingkat yang Anda inginkan. Saya hanya menggunakan kerangka formulir, hanya kisi-kisi, seluruh basis kode dan menyesuaikannya dengan kebutuhan saya. Dalam banyak hal, ini 'meningkatkan' permainan saya, membawa saya lebih jauh ke dalam pemrosesan awal, menggunakan variabel, mengasah cara saya menyusun proyek.
Ya, ada beberapa masalah. pxuntuk ukuran font dan menggunakan Less adalah dua. Namun, karena sepenuhnya open source, Anda dapat menemukan opsi untuk memperbaiki keduanya dengan mudah.
Saya menyelidiki Foundation dan menyukai apa yang saya lihat, tetapi saya dalam posisi yang tidak menguntungkan karena harus mendukung IE8, seperti halnya banyak pengembang. Foundation telah menghentikan dukungan untuk IE8, menjadikannya 'tidak bisa' bagi saya. Meskipun demikian, saya tidak akan mengabaikan keseluruhan kerangka kerja, terutama sesuatu yang gratis untuk digunakan dan bebas untuk dimodifikasi hanya berdasarkan beberapa masalah!
Heck, dalam satu proyek, saya mengangkat bagian Foundation dan bagian dari Bootstrap dan menambahkan kode kustom saya sendiri - itulah keindahan open source.
Jika Anda masih lebih suka Bootstrap dengan dukungan em dan rem, Anda dapat melihat ini - https://github.com/ivayloc/twbs-rem-em tidak perlu melakukan perhitungan apa pun untuk mengonversi piksel dalam unit rem atau em, ada build @mixinsuntuk ini - @include rem(property, values)- juga fallback ke px dan untuk konversi em yang dapat Anda gunakan em(value).
Sementara saya menggunakan Bootstrap secara ekstensif, ada beberapa area di mana aksesibilitas mengambil alih pembakar belakang. Saya kira ada trade-off yang tak terelakkan dengan platform yang digunakan secara luas.
Saya benar-benar mengerti mengapa mereka memilih untuk mempertahankan piksel untuk ukuran font. Masalah warisan dengan em untuk font kerangka kerja adalah mimpi buruk total.
rem adalah opsi alternatif, tetapi dukungan browser masih bermasalah.
Anda dapat membuat rems mixin Anda sendiri dan mengganti setiap baris less yang menggunakan variabel ukuran font dasar.
Itulah keindahan bootstrap - dan kerangka kerja seperti itu - ini adalah dasar yang kokoh untuk bekerja.
Ya, saya telah menyebutkan ada elemen untuk bootstrap twitter yang tidak dapat diakses - satu contoh kecil, penggunaan 'display: none' daripada menggunakan klip. Saya sangat yakin ada alasan yang valid untuk ini - dan sekali lagi, Anda dapat dengan mudah memodifikasi ini jika Anda mau.
Bootstrap bukanlah tanpa cela, tapi kemudian, saya ragu itu dimaksudkan sebagai jawaban akhir untuk semua kebutuhan Anda. Ini adalah basis - 'bootstrap' - pelajari dan manfaatkan dengan benar, tambahkan, campur semuanya - paling tidak, ini adalah kerangka kerja yang luar biasa untuk dijadikan prototipe, atau untuk membuat situs cepat. Lebih jauh lagi, ada beberapa dasar yang sangat kuat di dalamnya yang dapat diterapkan ke situs web apa pun .