İçerik
- Apple'ın web tarayıcısında geliştirici araçlarına erişin
- Safari'de Duyarlı Tasarım Modunu Etkinleştirme
- Safari Geliştirici Araçları
Apple'ın web tarayıcısında geliştirici araçlarına erişin
Web sitelerinin ve web uygulamalarının çok sayıda cihazı ve platformu desteklediğinden emin olmak, web geliştiricileri için önemli bir görevdir. Apple'ın Safari web tarayıcısı, sitenizin çeşitli ekran çözünürlüklerinde ve farklı iPad, iPhone ve iPod touch yapılarında nasıl görüneceğini önizlemenizi sağlayan Duyarlı Tasarım modu içerir.
Bu makaledeki talimatlar macOS için Safari 13 için geçerlidir. Duyarlı Tasarım modu Windows sürümünde mevcut değildir.
Safari'de Duyarlı Tasarım Modunu Etkinleştirme
Safari'nin geliştirici araçlarını ve Duyarlı Tasarım modunu etkinleştirmek için:
-
seçmek Safari > Tercihler Safari araç çubuğunda.
Klavye kısayolunu da kullanabilirsiniz komuta+Virgül (,) Tercihler menüsüne erişmek için.
-
Tercihler menüsünde, ileri sekmesini tıklayın ve yanındaki kutuyu işaretleyin Menü çubuğunda Geliştir menüsünü göster. Şimdi ekranın üst kısmındaki Safari araç çubuğunda yeni bir seçenek bulunmalıdır.
-
seçmek Geliştirmek > Duyarlı Tasarım Moduna Girin Safari araç çubuğunda.
Klavye kısayolunu da kullanabilirsiniz seçenek+komuta+R, Duyarlı Tasarım Moduna girmek için.
-
Aktif web sayfası Duyarlı Tasarım modunda gösterilmelidir. Sayfanın üst kısmında, sayfanın nasıl görüntüleneceğini görmek için bir iOS cihazı veya ekran çözünürlüğü seçin.
Safari'den ayrıca, çözünürlük simgelerinin hemen üzerindeki açılır menüyü kullanarak farklı kullanıcı aracılarını simüle etmesini de isteyebilirsiniz.
Safari Geliştirici Araçları
Duyarlı Tasarım moduna ek olarak, Safari'nin Geliştirme menüsü aşağıdakiler de dahil olmak üzere birçok yararlı seçenek sunar:
- Sayfayı Birlikte Aç: Etkin web sayfasını Mac'inizde yüklü olan diğer tarayıcılarda açın.
- Kullanıcı Aracısı: Kullanıcı aracısının değiştirilmesi web sunucularının tarayıcınızı Safari dışında bir şey olarak tanımlamasına neden olur.
- Web Inspector'ı bağlayın: Bir web sayfasının CSS bilgileri ve DOM metrikleri dahil tüm kaynaklarını görüntüler.
- Hata Konsolunu Göster: JavaScript, HTML ve XML hatalarını ve uyarılarını görüntüleyin.
- Sayfa Kaynağını Göster: Etkin web sayfasının kaynak kodunu görüntüleyin ve arayın.
- Sayfa Kaynaklarını Göster: Geçerli sayfadaki belgeleri, komut dosyalarını, CSS'yi ve diğer kaynakları görüntüleyin.
- Snippet Düzenleyicisini Göster: Kod parçalarını düzenleyin ve yürütün. Bu özellik test açısından çok kullanışlıdır.
- Uzantı Oluşturucuyu Göster: Kodunuzu buna göre paketleyerek ve meta veriler ekleyerek kendi Safari uzantılarınızı oluşturun.
- Zaman Çizelgesi Kaydını Başlat: WebKit Inspector içindeki ağ isteklerini, JavaScript yürütmeyi, sayfa görüntülemeyi ve diğer etkinlikleri kaydedin.
- Boş Önbellekler: Yalnızca standart web sitesi önbellek dosyalarını değil, Safari içindeki tüm saklanan önbellekleri silin.
- Önbellekleri Devre Dışı Bırak: Önbellek devre dışı bırakıldığında, yerel önbelleği kullanmak yerine erişim isteği her yapıldığında kaynaklar bir web sitesinden indirilir.
- Akıllı Arama Alanından JavaScript'e izin ver: Güvenlik nedeniyle varsayılan olarak devre dışı bırakılmış olan bu özellik, Safari'nin adres çubuğuna JavaScript içeren URL'ler girmenize olanak tanır.
- SHA-1 Sertifikalarına Güvensiz gibi davranın: Güvenli Karma Algoritma kısaltması olan SHA-1 karma işlevinin başlangıçta düşünülenden daha az güvenli olduğu kanıtlanmıştır, bu nedenle Safari'de bu seçeneğin eklenmesi.
