Web sitemi farklı
tarayıcılar için nasıl uygun hale getirebilirim. Ziyaretçilerim hangi
tarayıcı ile girerse girsin sorun yaşamasın istiyorum. Bu konuda bilgi
verebilir misiniz?
Cevap:
Tarayıcılara göre web sitenizin farklılıklar göstermesi genel olarak
tasarım kodlarınızla alakalıdır. Temel olarak bir web sitesi HTML ve
CSS olarak tasarlanır. JAVA, AJAX, ASP ve PHP ile siteye dinamiklik ve
interaktiflik katılır. Tasarımlarımızla alakalı olan kodları bütün
tarayıcılar için çalışanlardan seçersek sitemizi bütün tarayıcılar için
uygun hale getirmiş oluruz. Şu an HTML olarak tarayıcılarda bir
uyumluluk söz konusu iken CSS için aynısını söylemek şu an için pek
mümkün değil. Aşağıdaki tablolarda CSS kodlarının tarayıcılarda çalışıp
çalışmadığını görebilirsiniz. Sitenizi oluştururken kullanmış olduğunuz
kodları buna göre seçmenizde fayda var.
Seçtiğimiz kodların farklı tarayıcılara göre çalıp çalışmadığını
belirlemekle iş bitmiyor. Bu sefer de kod çalışsa bile her tarayıcıda
farklı görünümler oluşabiliyor. Bunun için de CSS Hack yöntemlerini kullanmak gerekiyor. Eğer her tarayıcı da farklı çalışan bir CSS şablonu oluşturmak isterseniz Rafael Lima ‘nın yazdığı bir Javascripti kullanabiliriz. 1 KB dan daha küçük olan bu javascripti TR.GG siteniz var ise fileden.com adresine yükleyerek aşağıdaki şekilde TASARIM ÜZERİNDEKİ YAZI kısmına yapıştırmanız yeterli olacaktır.
Eğer bir hostinge sahipseniz bu dosyanın uzantısını .js yaparak yükleyin ve tagleri arasına bırakın.
Her tarayıcı için görünecek CSS özelliklerini ayarlayın. Örneğin
Firefox‘da h1‘in boyutunun 16px ve IE‘da ise 18px olmasını istiyorum.
Bunun için yapmam gereken;
.gecko h1 {font-size: 16px;}
.ie h1 {font-size:18px;}
Ya da Mac üzerinde Safari kullanan biri baktığında h1 boyutunun 10px olarak görsün istiyorum;
.mac.webkit h1 {font-size:10px;}
olarak yazmamız gerekir.
Özellikle burada dikkat edilmesi gereken nokta işletim sistemi adı ile
tarayıcı adının arasında boşluk bırakılmamasıdır.
İşletim sistemleri için kullanılabilecek kodlar;
* win - Microsoft Windows
* linux - Linux (x11 and linux)
* mac - Mac OS
Tarayıcılar için kullanılabilecek kodlar
* ie - Internet Explorer (All versions)
* ie6 - Internet Explorer 6.x
* ie5 - Internet Explorer 5.x
* gecko - Mozilla, Firefox, Camino
* opera - Opera (All versions)
* opera8 - Opera 8.x
* opera9 - Opera 9.x
* konqueror - Konqueror
* webkit or safari - Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
HackeR FrienD bu yazının bir kısmını buradan aldı.
Not:Alıntı
tarayıcılar için nasıl uygun hale getirebilirim. Ziyaretçilerim hangi
tarayıcı ile girerse girsin sorun yaşamasın istiyorum. Bu konuda bilgi
verebilir misiniz?
Cevap:
Tarayıcılara göre web sitenizin farklılıklar göstermesi genel olarak
tasarım kodlarınızla alakalıdır. Temel olarak bir web sitesi HTML ve
CSS olarak tasarlanır. JAVA, AJAX, ASP ve PHP ile siteye dinamiklik ve
interaktiflik katılır. Tasarımlarımızla alakalı olan kodları bütün
tarayıcılar için çalışanlardan seçersek sitemizi bütün tarayıcılar için
uygun hale getirmiş oluruz. Şu an HTML olarak tarayıcılarda bir
uyumluluk söz konusu iken CSS için aynısını söylemek şu an için pek
mümkün değil. Aşağıdaki tablolarda CSS kodlarının tarayıcılarda çalışıp
çalışmadığını görebilirsiniz. Sitenizi oluştururken kullanmış olduğunuz
kodları buna göre seçmenizde fayda var.
Seçtiğimiz kodların farklı tarayıcılara göre çalıp çalışmadığını
belirlemekle iş bitmiyor. Bu sefer de kod çalışsa bile her tarayıcıda
farklı görünümler oluşabiliyor. Bunun için de CSS Hack yöntemlerini kullanmak gerekiyor. Eğer her tarayıcı da farklı çalışan bir CSS şablonu oluşturmak isterseniz Rafael Lima ‘nın yazdığı bir Javascripti kullanabiliriz. 1 KB dan daha küçük olan bu javascripti TR.GG siteniz var ise fileden.com adresine yükleyerek aşağıdaki şekilde TASARIM ÜZERİNDEKİ YAZI kısmına yapıştırmanız yeterli olacaktır.
Eğer bir hostinge sahipseniz bu dosyanın uzantısını .js yaparak yükleyin ve tagleri arasına bırakın.
Her tarayıcı için görünecek CSS özelliklerini ayarlayın. Örneğin
Firefox‘da h1‘in boyutunun 16px ve IE‘da ise 18px olmasını istiyorum.
Bunun için yapmam gereken;
.gecko h1 {font-size: 16px;}
.ie h1 {font-size:18px;}
Ya da Mac üzerinde Safari kullanan biri baktığında h1 boyutunun 10px olarak görsün istiyorum;
.mac.webkit h1 {font-size:10px;}
olarak yazmamız gerekir.
Özellikle burada dikkat edilmesi gereken nokta işletim sistemi adı ile
tarayıcı adının arasında boşluk bırakılmamasıdır.
İşletim sistemleri için kullanılabilecek kodlar;
* win - Microsoft Windows
* linux - Linux (x11 and linux)
* mac - Mac OS
Tarayıcılar için kullanılabilecek kodlar
* ie - Internet Explorer (All versions)
* ie6 - Internet Explorer 6.x
* ie5 - Internet Explorer 5.x
* gecko - Mozilla, Firefox, Camino
* opera - Opera (All versions)
* opera8 - Opera 8.x
* opera9 - Opera 9.x
* konqueror - Konqueror
* webkit or safari - Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
HackeR FrienD bu yazının bir kısmını buradan aldı.
Not:Alıntı