Jaká je optimální šířka webové stránky?

Návrh webové stránky a nastavení šířky webové stránky na optimální šířku je rozhovor, který stojí za to. Mnoho z vás si všimlo, že jsem nedávno změnil šířku designu mého blogu. Šířil jsem šířku stránky na 1048 pixelů. Někteří z vás s tímto krokem možná nesouhlasí - ale chtěl jsem se podělit o některé statistiky a důvody, proč jsem šířil šířku motivu tak širokou.

1048 pixelů však nebylo náhodné číslo.

Při rozšiřování mé šířky stránky byly dva klíčové vlivy:

  • Změňte šířku YoutubeYoutube nyní nabízí větší velikosti pro vložení. Pokud kliknete na malé ozubené kolo na postranním panelu stránky videa Youtube, nabídnou se vám možnosti pro větší velikosti a také motiv. Vzhledem k tomu, že videa s vyšším rozlišením se na Youtube stávají běžným místem, chtěl jsem tato videa začlenit do svého blogu a zobrazit je s co nejmenšími podrobnostmi (bez využití celé šířky stránky).
  • Typická reklama se dodává v šířkách 125, 250 a 300 pixelů. Zdá se, že 300 pixelů se na stránkách s výnosy z reklam objevuje stále více a já jsem je chtěl úhledně začlenit do mého postranního panelu.

A samozřejmě, vlevo a vpravo od stránky, obsahu a postranního panelu je nějaké polstrování ... takže magické číslo bylo pro mé téma 1048 pixelů:

Optimální šířka webových stránek

Zkontroloval jsem své statistiky čtenáře?

Ano, samozřejmě! Pokud většina mých návštěvníků provozovala obrazovky s nižším rozlišením, určitě bych měl o rozšíření své stránky další myšlenky. Šířka a procentoPo výstupu rozlišení obrazovky z mého balíčku Analytics (V Google jsou to Návštěvníci> Možnosti prohlížeče> Rozlišení obrazovky) jsem vytvořil tabulku výsledků Excel a analyzoval šířku z pole rozlišení.

Google poskytuje rozlišení 1600 1200 × 1 XNUMX, takže je třeba vzít vše zleva od znaku „x“, vynásobit ho číslem XNUMX a vytvořit z něj číselný výsledek, abyste jej mohli seřadit sestupně, provést SUMIF a zjistit, kolik návštěv jsou větší nebo menší než šířka návrhu, na kterou se díváte.

= VLEVO (A2; FIND ("x"; A2,1) -1) * 1

Opustil jsem 22% čtenářů, kteří používají menší rozlišení? Samozřejmě že ne! Pěkná věc na rozvržení s levým obsahem a pravým bočním panelem je, že můžete zajistit, aby byl váš obsah stále v šířce většiny prohlížečů. V tomto případě má 99% mých čtenářů šířku větší než 640 pixelů, takže jsem v pořádku! Nechci, aby úplně postrádali postranní panel, ale to je druhotné vůči obsahu.

9 Komentáře

  1. 1

    Navrhuji hybridní rozložení a šířku kontejneru CSS 100%. Pokud máte pro boční panel pevnou šířku, oblasti záhlaví, zápatí a hlavního obsahu se přizpůsobí zbývající šířce obrazovky. Vyplní 100% okna prohlížeče každého, bez ohledu na rozlišení monitoru uživatele. Pak už nemusíte počítat pixely ani sledovat uživatelské statistiky týkající se rozlišení monitorů.

    • 2

      Moc se mi líbí hybridní rozvržení, Bobe - ale bohužel se někdy nehrají dobře se skutečným obsahem. Možná jsem líný, ale je pro mě snazší vědět, že na mém webu jsou maximální a minimální hodnoty 640 pixelů. Když píšu příspěvky, je těžké si představit protahování.

      Myslím, že jen osobní preference!

  2. 3

    V zásadě souhlasím s vaším závěrem, ale pokud používám nastavení pevné šířky, omezím šířku na 960 pixelů.

    Jeden musí počítat se svislými posuvníky a dalšími pruhy zkratek prohlížeče, které zabírají další šířku. Tím, že zůstane v rozmezí 960 pixelů, je zajištěno, že při rozlišení obrazovky o šířce 1024 pixelů nedochází k posouvání zleva doprava.

    Andy Ebon

  3. 4
  4. 5
  5. 6

    Od té doby, co máš nastaveno na 1048 pixelů, váš web způsobí na obrazovce 1024 vodorovné posuvníky. Myslím, že by bylo lepší odříznout 100px ze šířky (a polstrování) postranního panelu a oblasti obsahu, aby se vešel na 728 × 1024. To je dnes nejlepší praxe.

    Jediným případem proti tomu by bylo, kdyby to analytická čísla podporovala ... ale protože jste ve svém článku tyto údaje neposkytli, řekl bych, že váš návrh stránky je chybný.

  6. 7
  7. 8

    Hloupý muž
    Ne každý používá každé okno na celou obrazovku - ve skutečnosti bych se vsadil, že jen málo z nich. 

    Mám váš blog v 80% větru ... a je to, vodorovný posuvník

    A co je mimo obrazovku ... uvidíme ... nic.

    Váš posuvník je tedy zbytečný.

    Jeden snadný způsob, jak přijít o čtenáře !!

    • 9

      Obsah je soustředěn na stránce @ heenan73: disqus a poskytuje čtenáři přesně to, co potřebuje. Pokud ztrácím čtenáře, protože oba mohou vidět obsah A vidět vodorovný posuvník ... nejsem si jistý, zda jsou čtenáři, které hledám. V našem obsahu je určitě něco jedinečného, ​​co ho posouvá na 1217px, takže to budu sledovat a opravit. Tento příspěvek byl vlastně napsán o předchozím tématu. Děkuji, že jste mě na to upozornili!

Co si myslíte?

Tyto stránky používají Akismet k omezení spamu. Zjistěte, jak jsou vaše údaje komentářů zpracovávány.