Ekran Çözünürlüğüm Kaç?

Ekran çözünürlüğünüzü, tarayıcı pencere boyutunu, piksel yoğunluğunu, renk derinliğini ve dokunmatik desteğini anında görün.

1.062 görüntülenme

Ekran Çözünürlüğü
Tarayıcı Görünüm Alanı
Piksel Oranı (DPR)
Fiziksel Piksel
Renk Derinliği
Yön
Dokunmatik

Pencereyi yeniden boyutlandırın — görünüm alanı canlı güncellenir.

"Cihaz Piksel Oranı" Gerçekte Neyi Ölçer

Her ekranın sabit bir fiziksel piksel ızgarası — yani doğal çözünürlüğü — vardır, ancak web sayfaları çözünürlükten bağımsız bir birim olan CSS pikseli üzerinden düzenlenir. Cihaz piksel oranı (DPR, device pixel ratio), ikisi arasındaki dönüşüm katsayısıdır: tek bir CSS pikselinin kaç fiziksel pikselle çizildiğidir. Standart yoğunluklu bir ekranda DPR değeri 1 olur ve ikisi birebir eşleşir. "Retina" veya yüksek-DPI bir ekranda DPR genelde 2 veya 3 olur; yani bir CSS pikseli aslında 2×2 (4 fiziksel piksel) veya 3×3 (9 fiziksel piksel) bir blok üzerinde çizilir. Bu yüzden metin ve simgeler bu ekranlarda gözle görülür şekilde daha net durur: işletim sistemi ve tarayıcı, aynı mantıksal pikseli çizmek için dört veya dokuz kat daha fazla fiziksel noktaya sahiptir, böylece eğriler ve kenarlar daha az kabaca yaklaştırılır.

Bu sayfa, yukarıdaki karttaki tüm bilgilerle birlikte bu sayıyı doğrudan gerçek tarayıcı API dizisinden okur: window.screen ekranın doğal genişliğini, yüksekliğini ve renk derinliğini bildirir; window.devicePixelRatio ise CSS-fiziksel piksel oranını verir. Tarayıcı görünüm alanı ölçümleri ise window.innerWidth ve innerHeight değerlerinden gelir — bu sayının ekran çözünürlüğünden küçük olmasının sebebi de budur: sekmelerin, adres çubuğunun ve pencere kenarlarının kapladığı alanı hariç tutar. Pencereyi yeniden boyutlandırın, bu değerler canlı güncellenir; çünkü önbellekten değil doğrudan tarayıcıdan okunurlar.

Bu Bilgi Nerede İşe Yarar

Tipik kullanım alanları arasında; teknik desteğe kurulumunuzu sayı tahmin etmeden tam olarak anlatmak, duyarlı (responsive) bir tasarımın cihazınızda gerçekte hangi piksel boyutlarıyla çalışacağını kontrol etmek, yeni bağlanan bir monitörün daha düşük bir yedek mod yerine gerçekten doğal çözünürlüğünü kullandığını doğrulamak veya ikinci ekran olarak bağlanan bir televizyonun doğru sinyali aldığını teyit etmek yer alır. Tek tıkla kopyala butonu, tüm değerlerin derli toplu bir metin özetini alır — doğrudan bir destek talebine veya hata raporuna yapıştırmaya hazır.

Kartta gösterilen renk derinliği de piksel oranına benzer bir kanal-başına prensiple çalışır: tipik 24 bitlik bir ekran kırmızı, yeşil ve mavi kanallarına sekizer bit ayırır ve piksel başına yaklaşık 16,7 milyon olası renk verir; bazı profesyonel ve HDR ekranlar ise daha ince geçişler için 30 veya 36 bit derinlik bildirir. Yön (dikey veya yatay) ve dokunmatik desteği de tabloyu tamamlar — ikisi de ekran boyutlarından tahmin edilmek veya user-agent bilgisinden çıkarılmak yerine canlı olarak aynı window.screen ve navigator arayüzlerinden okunur.

Sıkça Sorulan Sorular

Görünüm alanı ekran çözünürlüğümden neden küçük?

Görünüm alanı yalnızca tarayıcının iç çizim bölgesidir — sekmeler, adres çubuğu, yer imleri çubuğu ve pencere çerçevesi ekrandan kendi paylarını alır. Tam ekrana geçmek bu ek yükün çoğunu kaldırır ve iki sayıyı birbirine en çok yaklaştırır.

Cihaz piksel oranı pratikte tam olarak ne anlama gelir?

Bir CSS pikselinin kaç fiziksel pikselle temsil edildiğidir. Oran 2 ise, CSS ölçeğinde "1000 px" genişliğindeki bir sayfa aslında 2000 fiziksel piksel genişliğinde çizilir — Retina sınıfı ekranlarda metin ve simgelerin keskin görünmesini sağlayan bu aşırı örneklemedir.

Bildirilen çözünürlük neden monitörümün teknik özellikleriyle uyuşmuyor?

İşletim sistemi ekran ölçeklemesi yüzünden. Örneğin yüzde 150 ölçeklemede, fiziksel olarak 2880 piksel genişliğindeki bir panel, web sayfalarına 1920 mantıksal piksel bildirir. Panel yine de sahip olduğu her fiziksel pikseli kullanır — işletim sistemi yalnızca metnin okunabilir kalması için her şeyi daha büyük çizer.

window.screen ve window.devicePixelRatio tüm tarayıcılarda güvenilir mi?

Evet — bunlar standart ve uzun süredir desteklenen tarayıcı API dizileridir; ancak window.screen tüm fiziksel ekranı yansıtırken görünüm alanı değerleri yalnızca geçerli tarayıcı penceresini yansıtır, bu yüzden iki sayının farklı soruları yanıtlaması bir hata değil, beklenen bir durumdur.

Bu araç ekranımın dokunmatik girişi destekleyip desteklemediğini algılayabilir mi?

Evet — tarayıcının pointer ve touch olay desteği üzerinden dokunmatik girişe uygunluğu kontrol eder; kart bu sayede çözünürlük ve renk derinliğinin yanında geçerli ekranınızın dokunmatik olup olmadığını da bildirebilir.

Yorumlar

Henüz yorum yok — ilk yorumu siz yazın!

Benzer Araçlar