Blog
Mert Özen'in yazılım geliştirme, backend, frontend ve DevOps üzerine blog yazıları.
Satır Kırma ve Taşma: white-space, overflow-wrap, word-break, hyphens, text-wrap: balance/pretty ve Çok Satırlı Kesme
Uzun URL ve ISBN için overflow-wrap: anywhere, kullanıcı metninde white-space: pre-line, başlıkta text-wrap: balance, çok satırlı kesmede ise hâlâ -webkit-line-clamp kalıbı kullanılır; Türkçe metinde hyphens: auto'ya güvenilmez. Bookstore'un kitap detayında break-word ile anywhere'in min-content farkını, Türkçe hecelemenin iki motorda da çalışmadığını, balance ve pretty sonuçlarını ve WebKit'in clamp'li kutuda ::first-letter çizmemesini ölçüyoruz.
Metin Stilleri: text-decoration Ailesi, text-underline-offset, text-shadow, letter-spacing, text-indent ve vertical-align
Okunur bir link alt çizgisi longhand'lerle yazılır (text-decoration-thickness, text-underline-offset em ile), letter-spacing em ya da yüzdeyle verilir, inline ikon ise vertical-align ile rakamlara hizalanır. Bookstore kataloğunda text-decoration shorthand'inin kalınlığı sıfırlamasını, em'in px olarak kalıtılmasını, lang="tr" ile text-transform'u, img altındaki boşluğu ve initial-letter desteğini Chromium ve WebKit'te ölçüyoruz.
Font'lar ve @font-face: font Shorthand'i, font-family Stack'i, Variable Font'lar ve font-variation-settings
Self-host bir variable font'u @font-face ile ağırlık aralığı (font-weight: 100 900), ayrı italik face ve unicode-range ile tanımlarsın; ağırlığı font-weight ile verir, font-variation-settings'i yalnız özel eksenler için kullanırsın. Bookstore başlıklarında Fraunces ile font shorthand'inin line-height'ı sıfırlamasını, tek değerli descriptor'ın 700'ü bozmasını, sahte italiği ve ğ, ş, İ harflerinin hangi dosyadan geldiğini Chromium ve WebKit'te ölçüyoruz.
Typography: Type Scale, Line Height, Satır Uzunluğu, Font Seçimi ve Türkçe Karakterler
İyi typography birkaç kurala dayanır: tek oranlı bir type scale, satır başına 45–75 karakter, gövdede 1.5–1.6 line-height ve tabloda tabular rakamlar. Bookstore'un kitap sayfasında 146 karakterlik satırları ve kayan ondalık noktaları ölçüp düzeltiyor, ch biriminin Inter'deki tuzağını, latin subset'inde eksik kalan ğ, ş, İ ve ₺'yi ve lang olmadan büyük harfe çevrilen i'yi Chromium'da gösteriyoruz.