Rozvržení s pevnou šířkou versus tekutá rozvržení

click fraud protection

Rozložení webové stránky následuje jeden ze dvou různých přístupů:

  • Rozvržení s pevnou šířkou: Jedná se o rozvržení, kde je šířka celé stránky nastavena konkrétní číselnou hodnotou.
  • Liquid Layouts: Jedná se o rozvržení, kde je šířka celé stránky flexibilní v závislosti na tom, jak široký je prohlížeč prohlížeče.

Existují dobré důvody pro použití obou metod rozložení, ale bez pochopení obou relativních výhody a nedostatky každé metody, nemůžete udělat dobré rozhodnutí o tom, které použít pro svůj web strana.

Rozvržení s pevnou šířkou

Pevné rozvržení jsou rozvržení, která začínají určitou velikostí, jak stanoví webový designér. Zůstávají touto šířkou bez ohledu na velikost okna prohlížeče, který stránku prohlíží. Rozvržení s pevnou šířkou umožňují návrháři přímější kontrolu nad tím, jak bude stránka vypadat ve většině situací. Často je upřednostňují designéři s pozadím tisku, protože umožňují designérovi provést drobné úpravy rozložení a nechat je konzistentní napříč prohlížeči a počítači.

instagram viewer

Liquid Layouts

Tekutá rozvržení jsou rozvržení, která jsou založena na procentech velikosti aktuálního okna prohlížeče. Flexují velikostí okna, i když aktuální prohlížeč při prohlížení webu změní velikost svého prohlížeče. Rozložení kapalné šířky umožňují efektivní využití prostoru poskytovaného libovolným daným oknem prohlížeče nebo Rozlišení obrazovky. Často je upřednostňují designéři, kteří mají spoustu informací k tomu, aby se dostali do tak malého prostoru jako možné, protože zůstávají konzistentní co do velikosti a relativní váhy stránek bez ohledu na to, kdo je prohlíží strana.

Co je v sázce?

Vaše design webových stránek ovlivňuje vaše Citlivost a přizpůsobivost webu. V závislosti na tom, který si vyberete, může vašim čtenářům pomoci nebo bránit schopnost skenovat váš text, najít to, co hledají, nebo někdy dokonce použít váš web. Rovněž může být ohrožena celková identita značky vašeho webu, zvláště pokud standardy vaší značky vycházejí z logického modelu prvního tisku.

Výhody rozvržení s pevnou šířkou

Rozložení s pevnou šířkou je za určitých okolností užitečné.

  • Rozložení s pevnou šířkou umožňuje návrháři vytvářet stránky, které budou vypadat stejně bez ohledu na to, kdo se na ně dívá.
  • Prvky s pevnou šířkou, například obrázky, nepřekonají text na menších monitorech, protože tyto prvky bude zahrnovat celá stránka.
  • Na délku skenování nebudou mít vliv velké segmenty textu bez ohledu na to, jak široký je prohlížeč.

Výhody tekutých rozvržení

Tekuté rozložení funguje nejlépe za jiných okolností.

  • Rozložení šířky kapaliny se rozšiřuje a smršťuje, aby vyplnilo dostupné místo.
  • Využívá se veškerá dostupná nemovitost, což návrháři umožňuje zobrazovat více obsahu na větších monitorech, ale stále zůstává životaschopný na menších displejích.
  • Tekutá rozvržení poskytují konzistenci v relativních šířkách, což umožňuje stránce dynamičtěji reagovat na zákaznická omezení, jako jsou větší velikosti písma.

Nevýhody rozvržení s pevnou šířkou

Pevný formát však není bez nákladů.

  • Rozvržení s pevnou šířkou vynutí horizontální posouvání v menších oknech prohlížeče. Většina lidí nerada posouvá vodorovně.
  • Ve větších monitorech nechávají velké mezery bílého prostoru, což má za následek spoustu nevyužitého prostoru a větší svislé posouvání, než by jinak bylo nutné.
  • Rozvržení s pevnou šířkou nezvládají velmi dobře zákaznické změny velikostí písma. Pro malé zvětšení velikosti písma mohou být v pořádku, ale pro větší zvětšení může dojít k narušení rozložení.

Nevýhody tekutých rozvržení

Tekuté rozložení také není bez nevýhod.

  • Tekuté rozložení umožňuje velmi malou přesnou kontrolu nad šířkou různých prvků stránky.
  • Mohou vyústit ve sloupce textu, které jsou buď příliš široké, aby je bylo možné pohodlně skenovat, nebo v menších prohlížečích příliš malé na to, aby se slova jasně zobrazovala.
  • Chyba rozvržení kapaliny, když je prvek pevné šířky, například obrázek, umístěn uvnitř sloupce kapaliny. Pokud je sloupec vykreslen bez dostatečného prostoru pro obrázek, některé prohlížeče zvětší šířku sloupce, nerespektování pokynů designéra, zatímco ostatní prohlížeče vynucují překrývání textu a obrázků, aby dosáhly správného výsledku procenta.

Preference rozvržení a smíšené přístupy

Někteří návrháři dávají přednost kombinaci těchto konceptů. Nelíbí se jim použití tekutých rozvržení pro velké bloky textu, protože tato struktura způsobí, že text bude nečitelný na malém monitoru nebo neskenovatelný na velkém. Mají tedy tendenci dělat hlavní sloupce stránek pevnou šířkou, ale vytvářejí záhlaví, zápatí a stranu sloupce flexibilnější, aby zabíraly zbývající nemovitosti a neztratily kapacitu větších prohlížeče.

Některé weby používají skripty k určení velikosti okna prohlížeče a poté odpovídajícím způsobem mění prvky zobrazení. Například pokud takový web otevřete ve velmi širokém okně, můžete na levé straně získat další sloupec odkazů, který by návštěvníci s menšími monitory nemuseli vidět. Zalamování textu kolem reklamy závisí také na tom, jak široké je okno prohlížeče. Pokud je dostatečně široký, web jej omotá textem, jinak zobrazí text článku pod reklamou. I když většina webů tuto úroveň složitosti nepotřebuje, ukazuje způsob, jak využít výhod větších obrazovek, aniž by to ovlivnilo zobrazení na menších obrazovkách.

instagram story viewer