Optimum Web Sayfası Genişliği nedir?

Bir web sitesi tasarlamak ve web sayfası genişliğini en uygun genişliğe ayarlamak, yapmaya değer bir sohbettir. Birçoğunuz, yakın zamanda blogumun tasarımının genişliğini değiştirdiğimi fark ettiniz. Sayfa genişliğini 1048 piksele çıkardım. Bazılarınız harekete katılmayabilir - ancak tema genişliğini neden bu kadar geniş tuttuğuma dair bazı istatistikleri ve nedenleri paylaşmak istedim.

1048 piksel rastgele bir sayı değildi.

Sayfa genişliğimi genişletmenin iki temel etkisi vardı:

  • Youtube Genişliğini DeğiştirYoutube artık daha büyük yerleştirme boyutları sunuyor. Youtube video sayfasının kenar çubuğundaki küçük dişliye tıklarsanız, daha büyük boyutlar ve tema seçenekleri sunulur. Youtube'da daha yüksek çözünürlüklü videolar yaygın hale geldiğinden, bu videoları bloguma dahil etmek ve elimden geldiğince çok ayrıntıyla (tüm sayfa genişliğini tüketmeden) görüntülemek istedim.
  • Tipik reklamcılık 125, 250 ve 300 piksel genişliğinde gelir. 300 piksel reklam geliri sitelerinde gittikçe daha fazla ortaya çıkıyor ve bunları kenar çubuğuma düzgün bir şekilde dahil etmek istedim.

Ve elbette, sayfanın solunda ve sağında, içeriğinde ve kenar çubuğunda bir miktar dolgu var ... yani sihirli sayı temam için 1048 pikseldi:

Optimal Web Sitesi Genişliği

Okuyucu istatistiklerimi kontrol ettim mi?

Evet tabii! Ziyaretçilerimin çoğunluğu daha düşük çözünürlüklü ekranlar kullanıyor olsaydı, sayfamı genişletme konusunda kesinlikle ikinci düşüncelerim olurdu. Genişlik ve YüzdeEkran çözünürlüklerini Analytics paketimden çıkardıktan sonra (Google'da Ziyaretçiler> Tarayıcı Özellikleri> Ekran Çözünürlükleri), sonuçların bir Excel elektronik tablosunu oluşturdum ve çözünürlük alanından genişliği ayrıştırdım.

Google 1600 × 1200 çözünürlük sağlar, bu nedenle "x" in solundan her şeyi almanız, onu sayısal bir sonuç yapmak için 1 ile çarpmanız gerekir, böylece ona göre azalan sıralama yapabilir, ardından SUMIF yapıp kaç ziyarete bakabilirsiniz. baktığınız tasarım genişliğinden büyük veya küçük.

= SOL (A2, BUL ("x"; A2,1) -1) * 1

Daha küçük bir çözünürlük kullanan okuyucuların% 22'sini terk mi ettim? Tabii ki değil! İçeriğinizin solunda ve kenar çubuğunuzun sağda olduğu bir düzenin güzel yanı, içeriğinizin hala tarayıcıların çoğunun genişliği içinde olmasını sağlayabilmenizdir. Bu durumda okuyucularımın% 99'u 640 pikselden daha geniş çalışıyor, bu yüzden iyiyim! Kenar çubuğunu tamamen kaçırmalarını istemiyorum, ancak bu içeriğe göre ikincildir.

9 Yorumlar

  1. 1

    Karma bir düzen ve% 100 CSS kapsayıcı genişliği öneririm. Kenar çubuğu için sabit bir genişliğe sahip olduğunuz sürece, üstbilgi, altbilgi ve ana içerik alanları, ekranın kalan genişliğine uyacak şekilde ayarlanacaktır. Kullanıcının monitör çözünürlüğünden bağımsız olarak herkesin tarayıcı penceresinin% 100'ünü doldurur. Böylece artık piksel saymanıza veya monitör çözünürlükleriyle ilgili kullanıcı istatistiklerini takip etmenize gerek kalmaz.

    • 2

      Karma düzenleri gerçekten seviyorum Bob - ama ne yazık ki bazen gerçek içerikle iyi oynamıyorlar. Belki tembelim, ancak sitemde max ve min değerlerinin 640px olduğunu bilmek benim için daha kolay. Yazıları yazarken esnemeyi anlamak zordur.

      Sanırım sadece kişisel bir tercih!

  2. 3

    Esasen, sonucunuza katılıyorum, ancak sabit genişlikli bir kurulum kullanıyorsam, genişliği 960 pikselle sınırlıyorum.

    Dikey kaydırma çubuklarını ve ek genişlik alan diğer tarayıcı kısayol çubuklarını hesaba katmak gerekir. 960 piksel içinde kalarak, 1024 piksel genişliğindeki bir ekran çözünürlüğünde soldan sağa kaydırma olmadığı garanti edilir.

    andy siyah

  3. 4
  4. 5

    çok tuhaf. Firefox'ta, sitenizin 1048'de bir yatay kaydırma çubuğu vardır ve 1090'a çıkana kadar temiz bir görünüme sahip değildir.

    Google kararlarından olsa da harika istatistikler için teşekkürler

  5. 6

    Sende olduğundan beri 1048px olarak ayarlandığında, siteniz 1024 ekranda yatay kaydırma çubuklarına neden olur. 100 × 728'e sığması için kenar çubuğunuzun ve içerik alanınızın genişliğinden (ve dolgusundan) bir 1024px kaydırmanın daha iyi olacağını düşünüyorum. Bugün en iyi uygulama budur.

    Buna karşı tek durum, analitik numaralarının desteklemesi olabilir… ancak bu verileri makalenizde sağlamadığınız için, sayfa tasarımınızın kusurlu olduğunu söyleyebilirim.

  6. 7
  7. 8

    Aptal adam
    Herkes her pencereyi tam ekranda kullanmaz - aslında çok azının kullanacağına bahse girerim. 

    Blogunuz% 80 rüzgarlı durumda… ve işte orada, yatay bir kaydırma çubuğu

    Ve ekranın dışındakiler… görelim… hiçbir şey.

    Yani kaydırma çubuğunuz anlamsız.

    Okuyucuları kaybetmenin kolay bir yolu !!

    • 9

      İçerik, okuyucuya tam olarak ihtiyaç duydukları şeyi sağlayan @ heenan73: disqus sayfası içinde ortalanır. Okuyucularımı hem içeriği görebildikleri hem de yatay bir kaydırma çubuğu görebildikleri için kaybediyorsam… bunların aradığım okuyucular olduğundan emin değilim. İçeriğimizde onu 1217px'e iten kesinlikle benzersiz bir şey var, bu yüzden onu izleyip düzelteceğim. Bu gönderi aslında önceki bir tema hakkında yazılmıştır. Dikkatimi çektiğiniz için teşekkürler!

Ne düşünüyorsunuz?

Bu site spam'i azaltmak için Akismet'i kullanıyor. Yorum verilerinizin nasıl işlendiğini öğrenin.