/* Erfa Atelier — arayüz fontları KENDİ SUNUCUMUZDA (self-hosted). * Neden: Google Fonts render-BLOKLUYOR ve iki ayrı kaynağa (googleapis + * gstatic) bağlanmayı, TLS el sıkışmasını ve ardından ikinci bir istek turunu * gerektiriyordu: CSS gelmeden font isteği bile başlamıyor. Kendi kaynağımızdan * servis edilince kritik yol bir tur kısalıyor, preconnect gerekmiyor ve * .htaccess'teki uzun ömürlü font önbelleği (1 yıl) devreye giriyor. * Ayrıca gizlilik: ziyaretçinin IP'si üçüncü tarafa gitmiyor (KVKK/GDPR). * * Kaynak: Google Fonts (fonts.gstatic.com), SIL Open Font License 1.1 — kendi * sunucunda barındırma lisansen serbest. */ /* ============================ TÜRKÇE BİRLEŞİK ALTKÜME ====================== * SORUN (ölçüldü, CDP ağ kaydı, 127.0.0.1:8091): * her sayfa 10-11 font dosyası, 216,8-239,2 KB * /cizim /gokyuzu 16 font dosyası, 463,1 KB * woff2 zaten brotli'lidir; .htaccess'teki sıkıştırma bu baytları DÜŞÜRMEZ. * Tek çare dosya sayısını ve içindeki glif sayısını azaltmak. * * KÖK SEBEP: Google'ın `latin-ext` altkümesi 570-796 glif taşıyor — Lehçe, * Çekçe, Romence, Galce, Vietnamca diakritikleri dahil. Türkçe metnin bu * altkümeden ihtiyacı olan TAM OLARAK ALTI karakter: Ğ ğ İ Ş ş ve ₺. * (ı = U+0131 Google'ın `latin` aralığında zaten var.) Yani her sayfada * 14-66 KB'lık dosyalar altı harf için iniyordu. * * ÇÖZÜM — iki katmanlı, KAYIPSIZ: * 1) `-tr.woff2`: latin altkümesi + o altı Türkçe glif TEK DOSYADA. * (fontTools.merge; statik ailelerde uygulanabildi.) * Değişken fontlarda (Cormorant, Caveat — fvar/gvar/HVAR taşıyorlar) * merge desteklenmiyor; onlarda `-ext-tr.woff2` adında 3 KB'lık ayrı * Türkçe parça var. Yine de eski 34 KB'lık latin-ext yerine geçiyor. * 2) Eski `-latin-ext.woff2` dosyaları SİLİNMEDİ ve hâlâ bildiriliyor — * ama unicode-range'lerinden Türkçe kod noktaları ÇIKARILDI. Böylece * yalnız gerçekten bir Lehçe/Çekçe/Vietnamca karakter ekrana gelirse * iniyorlar. Türkçe bir sayfada sıfır istek, sıfır bayt. Kapsam * DARALMADI, yalnız tembelleşti. * * ÖLÇÜLEN SONUÇ (tel üzerindeki bayt; woff2 sıkıştırılamaz, ham = tel): * Barlow 300/400/500/600/700 36,3-37,7 KB (2 dosya) -> 21,7-22,5 KB (1 dosya) * Great Vibes 109,3 KB (2 dosya) -> 42,6 KB (1 dosya) * Cormorant italic latin-ext 34,4 KB -> 3,0 KB * Caveat latin-ext 29,5 KB -> 3,3 KB * * `src` listesindeki İKİNCİ url eski `-latin` dosyasıdır: yeni birleşik dosya * bir dağıtım hatasıyla eksik kalırsa sayfa yazısız kalmasın, en kötü ihtimalle * Türkçe harfler sistem fontuna düşsün diye duruyor. */ /* ÖLÇÜM DESTEKLİ YEDEK FONT METRİKLERİ — CLS'in gerçek kaynağı buydu. * * Bütün @font-face'ler `font-display:swap`. Yani metin önce sistem yedeğiyle * (Arial / Times) çiziliyor, woff2 gelince gerçek fonta TAKAS ediliyor. İki font * aynı ölçülere sahip olmadığı için takas anında satır kutusu büyüyor ve metin * yeniden sarılıyor — layout-shift. CDP ölçümünde kayan düğümler tam olarak * bunlardı: `#text { y 787->766 }` ve `div { h 126->130 }`. Görseller DEĞİL. * * Oranlar tarayıcıda ölçüldü, tahmin edilmedi (100 px'te aynı dizgi): * Barlow 1179,91 px / Arial 1243,22 px -> size-adjust %94,91 * satır yüksekliği 120 / 115 -> Barlow %4,3 daha yüksek * Cormorant 1014,50 px / Times 1150,06 px -> size-adjust %88,21 * satır yüksekliği 121 / 115 -> Cormorant %5,2 daha yüksek * ascent/descent değerleri canvas fontBoundingBox ölçümünden alınıp * size-adjust'a göre normalize edildi. * * Bu iki aile GERÇEK dosya indirmez (`src:local(...)`); yalnızca sistem fontunu * hedef fontun ölçülerine büker. Sıfır bayt maliyet. * * NOT: birleşik `-tr.woff2` dosyaları hhea/OS-2/unitsPerEm değerlerini kaynak * `-latin` dosyasından AYNEN taşıyor (merge sonrası bire bir doğrulandı), o * yüzden yukarıdaki oranlar geçerliliğini koruyor. */ @font-face{font-family:'Barlow Yedek';src:local('Arial'),local('Helvetica'),local('Liberation Sans');size-adjust:94.91%;ascent-override:105.36%;descent-override:21.07%;line-gap-override:0%} @font-face{font-family:'Cormorant Yedek';src:local('Times New Roman'),local('Times'),local('Liberation Serif');size-adjust:88.21%;ascent-override:104.30%;descent-override:32.88%;line-gap-override:0%} /* --- Cormorant Garamond (DEĞİŞKEN: 300-500 tek dosya) ---------------------- Google 300/400/500 için aynı dosyayı veriyor (bayt bayt aynı olduğu ölçüldü), o yüzden tek blokta `font-weight: 300 500`. Değişken font olduğu için latin ile Türkçe parça BİRLEŞTİRİLEMEDİ; Türkçe parça 34,4 KB yerine 3,0 KB'lık ayrı dosyada. */ @font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-normal-ext-tr.woff2) format('woff2');unicode-range:U+011E-011F, U+0130, U+015E-015F, U+20BA} @font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-italic-ext-tr.woff2) format('woff2');unicode-range:U+011E-011F, U+0130, U+015E-015F, U+20BA} @font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 500;font-display:swap;src:url(../fonts/ui/cormorant-300-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} /* --- Barlow (statik ağırlıklar: latin + Türkçe TEK dosyada birleştirildi) --- */ @font-face{font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/ui/barlow-300-normal-tr.woff2) format('woff2'),url(../fonts/ui/barlow-300-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/ui/barlow-300-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ui/barlow-400-normal-tr.woff2) format('woff2'),url(../fonts/ui/barlow-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ui/barlow-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ui/barlow-500-normal-tr.woff2) format('woff2'),url(../fonts/ui/barlow-500-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ui/barlow-500-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ui/barlow-600-normal-tr.woff2) format('woff2'),url(../fonts/ui/barlow-600-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ui/barlow-600-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} /* Araç sayfaları (Caveat: el yazısı · Great Vibes: imza) ve admin (Barlow 700). DİKKAT: Caveat ve Great Vibes yalnız buton etiketi DEĞİL — cizim.js:154-155 ve kolye-motor.js:76-77 müşterinin YAZDIĞI kazıma metnini de bu iki fontla çiziyor. Bu yüzden dört harfe altkümelenemezler; latin + Türkçe kapsamı korunmak zorunda. */ @font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ui/barlow-700-normal-tr.woff2) format('woff2'),url(../fonts/ui/barlow-700-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ui/barlow-700-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Caveat';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/ui/caveat-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Caveat';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/ui/caveat-400-normal-ext-tr.woff2) format('woff2');unicode-range:U+011E-011F, U+0130, U+015E-015F, U+20BA} @font-face{font-family:'Caveat';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/ui/caveat-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'Great Vibes';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ui/greatvibes-400-normal-tr.woff2) format('woff2'),url(../fonts/ui/greatvibes-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+011E-011F, U+0130-0131, U+0152-0153, U+015E-015F, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BA, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Great Vibes';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ui/greatvibes-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-011D, U+0120-012F, U+0132-015D, U+0160-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20B9, U+20BB-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}