{"id":24754,"date":"2013-05-31T00:00:00","date_gmt":"2013-05-31T00:00:00","guid":{"rendered":"https:\/\/alienroad.com\/google-bilgi-bankasi\/6-quick-tips-for-international-websites\/"},"modified":"2013-05-31T00:00:00","modified_gmt":"2013-05-31T00:00:00","slug":"6-quick-tips-for-international-websites","status":"publish","type":"ar_kb","link":"https:\/\/alienroad.com\/google-bilgi-bankasi\/6-quick-tips-for-international-websites\/","title":{"rendered":"Uluslararas\u0131 Web Siteleri \u0130\u00e7in 6 H\u0131zl\u0131 \u0130pucu"},"content":{"rendered":"\n

31 May\u0131s 2013, Cuma<\/p>\n\n\n\n

\n Edit\u00f6r\u00fcn notu: Daha \u00f6nce Google web aramas\u0131 i\u00e7in uluslararas\u0131la\u015ft\u0131rma<\/a> konusunu ele alan \u00e7e\u015fitli y\u00f6ntemleri inceledikten sonra, i\u015fte Google Web Studio ekibi \u00fcyelerinden web geli\u015ftiricilerine y\u00f6nelik ipu\u00e7lar\u0131.<\/i>\n<\/p>\n\n\n\n

\n Bir\u00e7ok web sitesi birden fazla dilde mevcuttur ve giderek daha fazla web sitesi birden fazla dil i\u00e7in eri\u015filebilir hale getirilmektedir. Ancak, bir web sitesini birden fazla dil i\u00e7in olu\u015fturmak sadece \u00e7eviri veya yerelle\u015ftirme (L10N) yapmak anlam\u0131na gelmez. Bu s\u00fcre\u00e7, tamam\u0131 uluslararas\u0131la\u015ft\u0131rma (I18N) ile ilgili olan birka\u00e7 ek gereksinim daha i\u00e7erir. Bu yaz\u0131m\u0131zda, uluslararas\u0131 web siteleri i\u00e7in birka\u00e7 ipucu payla\u015f\u0131yoruz.\n<\/p>\n\n\n\n

Sayfalar\u0131 stil sayfalar\u0131nda de\u011fil, i\u015faretleme dilinde I18N’e haz\u0131r hale getirin<\/h2>\n\n\n\n

\n Dil ve y\u00f6nl\u00fcl\u00fck, belgenin i\u00e7eri\u011finin ayr\u0131lmaz bir par\u00e7as\u0131d\u0131r. M\u00fcmk\u00fcnse, uluslararas\u0131la\u015ft\u0131rma ama\u00e7lar\u0131 i\u00e7in stil sayfalar\u0131n\u0131 de\u011fil, her zaman i\u015faretleme dilini (markup) kullanmal\u0131s\u0131n\u0131z. En az\u0131ndan html<\/code> \u00f6\u011fesinde @lang<\/code> ve @dir<\/code> kullan\u0131n:\n<\/p>\n\n\n\n

<\/div>\n\n\n\n

\u00d6zel s\u0131n\u0131flar veya kimlikler (ID) gibi kendi \u00e7\u00f6z\u00fcmlerinizi \u00fcretmekten ka\u00e7\u0131n\u0131n.<\/p>\n\n\n\n

\n Stil sayfalar\u0131nda I18N konusuna gelince, her zaman CSS’e g\u00fcvenemezsiniz: CSS spesifikasyonu, uyumlu kullan\u0131c\u0131 arac\u0131lar\u0131n direction<\/code> veya unicode-bidi<\/code> gibi \u00f6zellikleri g\u00f6rmezden gelebilece\u011fini<\/a> tan\u0131mlar. (XML i\u00e7in durum farkl\u0131d\u0131r. XML \u00f6zel bir uluslararas\u0131la\u015ft\u0131rma i\u015faretlemesi sunmaz, bu nedenle burada CSS kullan\u0131lmas\u0131 tavsiye edilir.)\n<\/p>\n\n\n\n

T\u00fcm yerel ayarlar i\u00e7in tek bir stil sayfas\u0131 kullan\u0131n<\/h2>\n\n\n\n

\n LTR (soldan sa\u011fa) ve RTL (sa\u011fdan sola) y\u00f6nl\u00fcl\u00fc\u011f\u00fc veya her dil i\u00e7in ayr\u0131 stil sayfalar\u0131 olu\u015fturmak yerine, her \u015feyi tek bir stil sayfas\u0131nda toplay\u0131n. Bu, uluslararas\u0131la\u015ft\u0131rma kurallar\u0131n\u0131z\u0131n anla\u015f\u0131lmas\u0131n\u0131 ve s\u00fcrd\u00fcr\u00fclmesini \u00e7ok daha kolay hale getirir.\n<\/p>\n\n\n\n

Yani, alternatif bir stil sayfas\u0131n\u0131 \u015fu \u015fekilde g\u00f6mmek yerine:<\/p>\n\n\n\n

<\/div>\n\n\n\n

mevcut olan\u0131 kullan\u0131n:<\/p>\n\n\n\n

<\/div>\n\n\n\n

\n Bu yakla\u015f\u0131m\u0131 benimserken, mevcut CSS kurallar\u0131n\u0131z\u0131 uluslararas\u0131 kar\u015f\u0131l\u0131klar\u0131yla tamamlaman\u0131z gerekecektir:\n<\/p>\n\n\n\n

[dir='rtl']<\/code> \u00f6znitelik se\u00e7icisini kullan\u0131n<\/h2>\n\n\n\n

\n Mevcut stil sayfan\u0131za ba\u011fl\u0131 kalman\u0131z\u0131 \u00f6nerdi\u011fimiz i\u00e7in (2. ipucu), di\u011fer y\u00f6nl\u00fcl\u00fck i\u00e7in farkl\u0131 \u015fekilde bi\u00e7imlendirmeniz gereken \u00f6\u011feleri se\u00e7menin farkl\u0131 bir yoluna ihtiyac\u0131n\u0131z vard\u0131r. RTL i\u00e7erikleri \u00f6zel i\u015faretleme gerektirdi\u011finden (1. ipucu), bu kolay olmal\u0131d\u0131r: \u00c7o\u011fu modern taray\u0131c\u0131 i\u00e7in basit\u00e7e [dir='rtl']<\/code> kullanabiliriz.\n<\/p>\n\n\n\n

\u0130\u015fte bir \u00f6rnek:<\/p>\n\n\n\n

<\/div>\n\n\n\n

:lang()<\/code> s\u00f6zde s\u0131n\u0131f\u0131n\u0131 kullan\u0131n<\/h2>\n\n\n\n

\n Belirli bir dildeki belgeleri hedeflemek i\u00e7in :lang()<\/code> s\u00f6zde s\u0131n\u0131f\u0131n\u0131 kullan\u0131n. (Burada metin par\u00e7ac\u0131klar\u0131ndan de\u011fil, belgelerden bahsetti\u011fimizi unutmay\u0131n; \u00e7\u00fcnk\u00fc belirli bir dildeki par\u00e7ac\u0131klar\u0131 hedeflemek i\u015fleri biraz daha karma\u015f\u0131k hale getirir.)\n<\/p>\n\n\n\n

\n \u00d6rne\u011fin, kal\u0131n yaz\u0131 tipinin \u00c7ince belgelerde pek iyi \u00e7al\u0131\u015fmad\u0131\u011f\u0131n\u0131 fark ederseniz (ki ger\u00e7ekten de \u00e7al\u0131\u015fmaz), a\u015fa\u011f\u0131dakini kullan\u0131n:\n<\/p>\n\n\n\n

<\/div>\n\n\n\n

Sol ve sa\u011f ile ilgili de\u011ferleri yans\u0131t\u0131n<\/h2>\n\n\n\n

\n Hem LTR hem de RTL i\u00e7erikleriyle \u00e7al\u0131\u015f\u0131rken, y\u00f6nl\u00fcl\u00fc\u011f\u00fc de\u011fi\u015fen t\u00fcm de\u011ferleri yans\u0131tmak \u00f6nemlidir. Dikkat edilmesi gereken \u00f6zellikler aras\u0131nda kenarl\u0131klar, kenar bo\u015fluklar\u0131 ve dolgularla ilgili her \u015feyin yan\u0131 s\u0131ra konumla ilgili \u00f6zellikler, float<\/code> veya text-align<\/code> yer al\u0131r.\n<\/p>\n\n\n\n

\n \u00d6rne\u011fin, LTR’de text-align: left<\/code> olan \u015fey, RTL’de text-align: right<\/code> olmal\u0131d\u0131r.\n<\/p>\n\n\n\n

\n Y\u00f6nl\u00fcl\u00fc\u011f\u00fc “\u00e7evirmeyi” kolayla\u015ft\u0131ran ara\u00e7lar vard\u0131r. Bunlardan biri CSSJanus<\/a>‘tur, ancak bu ara\u00e7 “ayn\u0131 stil sayfas\u0131” i\u00e7in de\u011fil, “ayr\u0131 stil sayfas\u0131” d\u00fcnyas\u0131 i\u00e7in yaz\u0131lm\u0131\u015ft\u0131r.\n<\/p>\n\n\n\n

Detaylara dikkat edin<\/h2>\n\n\n\n

A\u015fa\u011f\u0131daki \u00f6\u011felere dikkat edin:<\/p>\n\n\n\n