--- title: 'Sağdan Sola Diller' source: 'https://academia.sh/tr/kurslar/erisilebilir-kaliplar/sagdan-sola-diller' course: 'Erişilebilir Bileşen Kalıpları' language: tr updated: '2026-08-17T18:09:34+00:00' license: 'CC BY-SA 4.0' --- # Sağdan Sola Diller Yön değişiminin biçem katmanındaki karşılığı, mantıksal özelliklerin fiziksel özelliklere üstünlüğü, simge aynalamasının ölçüte bağlanması, iki yönlü metinde yalıtım ve klavye sözleşmelerinin akış yönüyle yazılması. Önceki dersin bütün örnekleri soldan sağa yazılan dillerdeydi. Katalog sağdan sola yazılan bir dile açıldığında değişen şey metnin yönünden ibaret değildir: kayıt kartının kenarlığı karşı tarafa geçer, süzgeç paneli ekranın öbür yanına taşınır, ileri oku ters çevrilir ama saat simgesi olduğu gibi kalır. Bu ders yön değişimini bir çeviri sorunu olarak değil, bir **mimari karar** olarak ele alır. Kararın alındığı yer biçem katmanıdır ve kararın ölçüsü, kaç bildirimin yön değişiminden etkilendiğidir. ## Fiziksel Değil Mantıksal Eksen Sol ve sağ, ekranın sabit yönleridir. Başlangıç ve bitiş ise **akışa** bağlıdır: soldan sağa yazılan bir düzende başlangıç soldadır, sağdan sola yazılanda sağdadır. Bir bileşenin kenarlığı "solda" diye yazıldığında yön değiştiğinde de solda kalır ve düzen bozulur; aynı kenarlık "satır içi başlangıçta" diye yazıldığında akışı izler. Aşağıdaki hesap katalog bileşenlerinden toplanan bildirimleri fiziksel ve mantıksal karşılıklarıyla listeler ve kaçının yön duyarlı olduğunu sayar. ```js // yon.mjs — yon duyarli duzen: mantiksal ozellikler, aynalanan ve aynalanmayan ogeler // 1. Fiziksel ozelliklerin mantiksal karsiliklari. const ESLEME = { "margin-left": "margin-inline-start", "margin-right": "margin-inline-end", "padding-left": "padding-inline-start", "padding-right": "padding-inline-end", "border-left": "border-inline-start", "text-align: left": "text-align: start", "left": "inset-inline-start", "width": "inline-size", "margin-top": "margin-block-start", "border-bottom": "border-block-end", }; // Katalog bilesenlerinden toplanmis bildirimler. const BILDIRIMLER = [ { bilesen: "kayit-karti", bildirim: "padding-left" }, { bilesen: "kayit-karti", bildirim: "border-left" }, { bilesen: "kayit-karti", bildirim: "margin-top" }, { bilesen: "suzgec-paneli", bildirim: "width" }, { bilesen: "suzgec-paneli", bildirim: "text-align: left" }, { bilesen: "odunc-dugmesi", bildirim: "margin-right" }, { bilesen: "bildirim-seridi", bildirim: "left" }, { bilesen: "bildirim-seridi", bildirim: "border-bottom" }, ]; const yatay = (b) => /left|right|width|inline/.test(b); console.log("bilesen fiziksel bildirim mantiksal karsilik yon duyarli"); let duyarli = 0; for (const b of BILDIRIMLER) { if (yatay(b.bildirim)) duyarli++; console.log( `${b.bilesen.padEnd(17)} ${b.bildirim.padEnd(21)} ${ESLEME[b.bildirim].padEnd(25)} ${yatay(b.bildirim) ? "evet" : "hayir"}` ); } console.log(`yon duyarli bildirim: ${duyarli} / ${BILDIRIMLER.length}`); console.log("dikey eksendeki bildirimler yon degisiminden etkilenmez; yine de mantiksal"); console.log("yazilmalari dikey yazim kiplerinde ayni kazanci verir."); // 2. Aynalanan ve aynalanmayan ogeler. const OGELER = [ { ad: "geri oku", aynalanir: true, gerekce: "yonu akisa bagli" }, { ad: "ileri oku", aynalanir: true, gerekce: "yonu akisa bagli" }, { ad: "kirinti ayiraci", aynalanir: true, gerekce: "hiyerarsi yonunu gosterir" }, { ad: "ilerleme cubugu", aynalanir: true, gerekce: "artis yonu akisi izler" }, { ad: "saat simgesi", aynalanir: false, gerekce: "gercek dunyada yonu sabit" }, { ad: "onay isareti", aynalanir: false, gerekce: "yon anlam tasimaz" }, { ad: "arama buyuteci", aynalanir: false, gerekce: "nesnenin kendi bicimi" }, { ad: "ses seviyesi simgesi", aynalanir: true, gerekce: "artis yonu akisi izler" }, { ad: "kalem/duzenle", aynalanir: false, gerekce: "nesnenin kendi bicimi" }, ]; console.log("\noge aynalanir gerekce"); for (const o of OGELER) console.log(` ${o.ad.padEnd(20)} ${(o.aynalanir ? "evet" : "hayir").padEnd(10)} ${o.gerekce}`); console.log(`aynalanan: ${OGELER.filter((o) => o.aynalanir).length} / ${OGELER.length}`); // 3. Sayilar ve gomulu Latin terimler kendi yonunu korur. // Iki yonlu metin: paragrafin temel yonu sagdan sola, icindeki sayi soldan saga yazilir. const SEGMENTLER = [ { metin: "raf kodu", yon: "rtl" }, { metin: "QB-141", yon: "ltr" }, { metin: "yil", yon: "rtl" }, { metin: "1998", yon: "ltr" }, ]; console.log("\nparagraf temel yonu: rtl"); console.log("segment yon yalitim gerekir mi"); for (const s of SEGMENTLER) { console.log(` ${s.metin.padEnd(11)} ${s.yon.padEnd(5)} ${s.yon === "ltr" ? "evet" : "hayir"}`); } console.log("yalitimsiz birlestirmede soldan saga segmentlerin komsu noktalama isaretleri"); console.log("yanlis tarafa kayar; bu yuzden gomulu segment yalitilir."); // 4. Bir dizginin gorunen sirasi: yalitimli ve yalitimsiz. // Basit model: rtl paragrafta segmentler ters sirada dizilir, ltr segment kendi icinde duz kalir. function gorunenSira(segmentler, temel) { const dizi = temel === "rtl" ? [...segmentler].reverse() : segmentler; return dizi.map((s) => s.metin).join(" "); } console.log("\nmantiksal sira : " + SEGMENTLER.map((s) => s.metin).join(" ")); console.log("gorunen sira : " + gorunenSira(SEGMENTLER, "rtl")); // 5. Kaydirma ve klavye: ok tuslarinin anlami degismez. const TUSLAR = [ { tus: "Sag ok", ltr: "sonraki oge", rtl: "onceki oge" }, { tus: "Sol ok", ltr: "onceki oge", rtl: "sonraki oge" }, { tus: "Home", ltr: "ilk oge", rtl: "ilk oge" }, { tus: "End", ltr: "son oge", rtl: "son oge" }, ]; console.log("\ntus soldan saga sagdan sola"); for (const t of TUSLAR) console.log(` ${t.tus.padEnd(9)} ${t.ltr.padEnd(18)} ${t.rtl}`); console.log("ok tuslari fiziksel yonu izler: sag ok her zaman ekranda saga gider,"); console.log("dolayisiyla sagdan sola duzende bir onceki ogeye ulasir."); // 6. Denetim: fiziksel bildirim kalan bilesenler yayina cikamaz. const kalan = BILDIRIMLER.filter((b) => yatay(b.bildirim)); const bilesenler = [...new Set(kalan.map((b) => b.bilesen))]; console.log(`\nyon duyarli fiziksel bildirim tasiyan bilesen: ${bilesenler.length}`); for (const b of bilesenler) { const sayi = kalan.filter((x) => x.bilesen === b).length; console.log(` ${b.padEnd(17)} ${sayi} bildirim`); } ``` ``` bilesen fiziksel bildirim mantiksal karsilik yon duyarli kayit-karti padding-left padding-inline-start evet kayit-karti border-left border-inline-start evet kayit-karti margin-top margin-block-start hayir suzgec-paneli width inline-size evet suzgec-paneli text-align: left text-align: start evet odunc-dugmesi margin-right margin-inline-end evet bildirim-seridi left inset-inline-start evet bildirim-seridi border-bottom border-block-end hayir yon duyarli bildirim: 6 / 8 dikey eksendeki bildirimler yon degisiminden etkilenmez; yine de mantiksal yazilmalari dikey yazim kiplerinde ayni kazanci verir. oge aynalanir gerekce geri oku evet yonu akisa bagli ileri oku evet yonu akisa bagli kirinti ayiraci evet hiyerarsi yonunu gosterir ilerleme cubugu evet artis yonu akisi izler saat simgesi hayir gercek dunyada yonu sabit onay isareti hayir yon anlam tasimaz arama buyuteci hayir nesnenin kendi bicimi ses seviyesi simgesi evet artis yonu akisi izler kalem/duzenle hayir nesnenin kendi bicimi aynalanan: 5 / 9 paragraf temel yonu: rtl segment yon yalitim gerekir mi raf kodu rtl hayir QB-141 ltr evet yil rtl hayir 1998 ltr evet yalitimsiz birlestirmede soldan saga segmentlerin komsu noktalama isaretleri yanlis tarafa kayar; bu yuzden gomulu segment yalitilir. mantiksal sira : raf kodu QB-141 yil 1998 gorunen sira : 1998 yil QB-141 raf kodu tus soldan saga sagdan sola Sag ok sonraki oge onceki oge Sol ok onceki oge sonraki oge Home ilk oge ilk oge End son oge son oge ok tuslari fiziksel yonu izler: sag ok her zaman ekranda saga gider, dolayisiyla sagdan sola duzende bir onceki ogeye ulasir. yon duyarli fiziksel bildirim tasiyan bilesen: 4 kayit-karti 2 bildirim suzgec-paneli 2 bildirim odunc-dugmesi 1 bildirim bildirim-seridi 1 bildirim ``` Çıktının ilk bölümü sekiz bildirimin altısının yön duyarlı olduğunu gösteriyor. Dikey eksendeki iki bildirim yön değişiminden etkilenmez; yine de mantıksal yazılmaları, dikey yazım kiplerinde aynı kazancı verir. Kural basittir: yatay eksene dokunan her bildirim mantıksal yazılır ve bu, çeviri başlamadan önce alınması gereken bir karardır. Son bölüm aynı veriyi bir denetim çıktısına çeviriyor: dört bileşen hâlâ fiziksel bildirim taşıyor. Bu liste, bir dilin yayına alınmasından önce kapatılması gereken iş kalemidir ve Belirteçler konusundaki denetimlerle aynı biçimde otomatikleştirilir. ## Her Simge Aynalanmaz İkinci bölüm simgeleri ayırıyor. Aynalanma ölçütü tek bir sorudur: simgenin yönü **akışa** mı bağlı, yoksa nesnenin kendi biçimi mi? İleri oku akışa bağlıdır ve aynalanır; kırıntı ayıracı hiyerarşinin yönünü gösterir ve aynalanır; ilerleme çubuğu artış yönünü akıştan alır ve aynalanır. Saat simgesi aynalanmaz, çünkü saatin yönü gerçek dünyada sabittir. Onay işareti aynalanmaz, çünkü yönü anlam taşımaz. Büyüteç ve kalem aynalanmaz, çünkü bunlar nesnenin kendi biçimidir. Dokuz simgenin beşi aynalanıyor; ayrım simgenin ne gösterdiğine bakılarak yapılır, toplu bir dönüşümle değil. Bütün simgeleri aynalayan bir kural, saati ters çevirir. ## Sayılar ve Gömülü Terimler Kendi Yönünü Korur Üçüncü ve dördüncü bölüm iki yönlü metni ele alıyor. Sağdan sola bir paragrafın içindeki sayılar ve Latin harfli terimler — raf kodu, ISBN, ölçüm birimi — kendi yönlerinde yazılır. Paragrafın temel yönü ile segmentin yönü farklı olduğunda, aradaki noktalama işaretlerinin hangi tarafa düşeceği belirsizleşir. Çözüm gömülü segmenti yalıtmaktır: segment kendi yönünü bildirir ve komşularının yönünü etkilemez. Dördüncü bölümdeki karşılaştırma mantıksal sıra ile görünen sıranın aynı olmadığını gösteriyor — metnin bellekteki sırası ile ekrandaki sırası farklıdır ve bu fark kopyalama, arama ve sıralama işlemlerinde de kendini gösterir. ## Klavye Fiziksel Yönü İzler Beşinci bölüm sık atlanan bir ayrımı yazıyor. Ok tuşları fiziksel yönü izler: sağ ok her zaman ekranda sağa gider. Sağdan sola bir listede ekranda sağa gitmek, listenin **bir önceki** ögesine gitmek demektir. Bu, Sekmeler ve Menüler derslerindeki klavye sözleşmelerinin sağdan sola düzende yeniden yazılması gerektiği anlamına gelir: "sağ ok bir sonrakine geçer" cümlesi yön bağımlıdır. Doğru yazım akışa göredir — "akış yönünde bir sonrakine geçer". Başlangıç ve bitiş tuşları ise yön değişiminden etkilenmez, çünkü ilk ve son öge akışta tanımlıdır. ## Ölçülebilir Kısıtlar - Yatay eksene dokunan her bildirim mantıksal özelliklerle yazılır; denetim fiziksel bildirim kalan bileşenleri raporlar. - Simge aynalaması tek tek karara bağlanır; toplu aynalama saat, onay ve nesne biçimli simgeleri bozar. - Gömülü ters yönlü segmentler yalıtılır; yalıtımsız birleştirme noktalama konumunu belirsiz bırakır. - Ok tuşu sözleşmeleri fiziksel yön yerine akış yönüyle yazılır. - Metin uzaması kuralı sağdan sola dillerde de geçerlidir; iki kısıt birlikte denetlenir. ## Sık Yapılan Hata En sık hata, yön desteğini bir çeviri işi sanıp biçem katmanına hiç dokunmamaktır; bu durumda metin çevrilir ama düzen soldan sağa kalır ve arayüz okunamaz hâle gelir. İkincisi, bütün simgeleri toplu aynalamaktır. Üçüncüsü, yön değişimini yalnız bir kök özniteliğiyle bildirip bileşenlerdeki fiziksel bildirimleri bırakmaktır: bildirim düzeyinde düzeltme yapılmadan kök bildirimi tek başına yeterli değildir. ## Özet - Sol ve sağ ekranın sabit yönleridir; başlangıç ve bitiş akışa bağlıdır. Yatay eksendeki her bildirim mantıksal yazılır — modeldeki sekiz bildirimin altısı yön duyarlı. - Simge aynalaması ölçüte bağlanır: yönü akışa bağlı olan aynalanır, nesnenin kendi biçimi olan aynalanmaz; dokuz simgenin beşi aynalanıyor. - Sağdan sola paragrafta sayılar ve Latin harfli terimler kendi yönünü korur ve yalıtılır; metnin mantıksal sırası ile görünen sırası aynı değildir. - Ok tuşları fiziksel yönü izler; klavye sözleşmeleri bu yüzden akış yönüyle yazılır. - Denetim, fiziksel bildirim taşıyan bileşenleri listeler; bu liste bir dilin yayına alınmasından önce kapatılır. ## Sonraki Adım Yön ve biçim kararları arayüzün kabını dile uyarladı. Geriye kabın içine giren **veri** kalıyor. Kullanıcıdan ad, adres ve kimlik bilgisi isteyen her form bir varsayım taşır: adın iki parçadan oluştuğu, adresin bir posta koduyla tamamlandığı, kimliğin belli bir uzunlukta olduğu. Bu varsayımların hepsi bir yerde kırılır. Kursun son dersi bu alanları ele alır ve varsayımları kurala çevirir.