PHP min. 5.6.8MySQL min. 5.1Apache min. 2.0
GitHub
Přidejte kódy
PHP-Fusion 9 Jádro
v9.0
Český překlad
Pravidelně aktualizovaný

Technologie

Jaký design webu vlastně vyrobit?

Webdesigneři to dnes nemají lehké. A ani nebudou mít v budoucnu. Do popředí se tlačí tablety a mobily, a tak naše weby, které vytvoříme, si musí s ními tykat. Mobily se totiž pomalu a jistě stávají hlavním přístupovým zařízením pro všechny weby. A ty kódére se snaž! Musíme tedy vzat v potaz, že mobily mají malý displej, slabý procesor. range'>Proto bychom měli začít vyrábět nový web nejprve pro málo vybavené mobily. Počítá s tím naštěstí už modul Responsive i Mobile First. Pro ty nejjednodušší weby/bloky si vystačíme s návrhem Zeldmanova Mobile Only.


Webdesigneři to dnes nemají lehké. A ani nebudou mít v budoucnu. Do popředí se tlačí tablety a mobily, a tak naše weby, které vytvoříme, si musí s ními tykat. Mobily se totiž pomalu a jistě stávají hlavním přístupovým zařízením pro všechny weby. A ty kódére se snaž! Musíme tedy vzat v potaz, že mobily mají malý displej, slabý procesor. range'>Proto bychom měli začít vyrábět nový web nejprve pro málo vybavené mobily. Počítá s tím naštěstí už modul Responsive i Mobile First. Pro ty nejjednodušší weby/bloky si vystačíme s návrhem Zeldmanova Mobile Only.

O vývoji nových webů píše podrobněji Martin Michálek v článku: Zdrojak.cz/Zeldmanův mobile only. My se ale budeme držet vývoje pro složitější obsahy webů, které musíme vyvíjet pro desktopy a další podobná zařízení. Otázka proto zní, jak velký by měl takový web být. Lze najít kompromis?

Velikost zobrazení - rozlišení

Nová verze PHP-Fusion 9.0xx, jejíž redesign je před spuštěním také na našem serveru pc-politika.cz, se proto drží zásady - mít naprogramovaný obsah pro mobily, tablety a desktopy. Zásadním problémem je proto velikost zobrazení webové stránky. Rozhodující je zde šířka rozložení webu. Analýzy říkají, že nejčastějším rozložením obsahu webové stránky je v roce 2015 rozlišení 1366 × 768 pixelů. Proto v prvním kroku vývoje je nutné omezit vícesloupcový layout webu. Jak jsem už zmínil pomocí responsivního designu lze vyrobit web, aby se optimálně zobrazoval na všech aktuálně dostupných zobrazovacích zařízení.

Já jdu na problém podle kopyta, že při kvalitní čitelnosti textu o velikosti 13 px, při tvorbě webu nedovoluji, aby řádky byly delší než 80 znaků. Při přepočtu to představuje zhruba 600 pixelů. Připočtu-li k tomu pouze dva sloupce, rozhodně si vystačím s celkovými 1.300 px stránky webu.

Ukázka responsivního kódu pro centrální sloupec (AU_CENTER)

// row 1 - go for max width
	if (defined('AU_CENTER') && AU_CENTER) echo "
\n
/div<\n>/div>";

V ukázce je vidět rozvržení stránky (centrálního sloupce) s použitím responsivní mřížky. K tomu pak stačí v CSS stylech použít procenta pro maximální šířku webové stránky. Prakticky jde o úpravu jedné hodnoty CSS, např. takto:

.hlavni_ram {
  max-width: 1300px;
}

Resumé

Protože bitmapovou grafiku nelze jednoduše zvětšit nebo zmenšit bez ztráty kvality, je proto nutné dbát na správnou velikost již od začátku práce. První pravidlo pro rozlišení zní: Pracovat vždy v zobrazení 1:1 (100% velikosti). Jedině tak můžeme zjistit, jak bude web (jeho obsah, včetně obrázků) skutečně vypadat. Webovou stránku lze tvořit jako plovoucí (velikost stránky se přizpůsobuje velikosti obrazovky), nebo jako stránku s pevnou šířkou, tzn. šířkou zadanou přesnou hodnotou v pixelech. Využívám první způsob. Podle tohoto doporučení se webová stránka automaticky přizpůsobí velikosti displeje vašeho monitoru (dostupnému místu). Nejvýhodnější je proto používat rozlišení 1 366 × 768.
Kvido 28.09.2015 00:02 275 0 komentářů

0 komentářů

Zanechat komentář

Host
  • Žádné komentáře byly zveřejněny.
Nejnovější témata fóra
  Vlákno Zobrazení Odpovědi Poslední příspěvek
Chyba užívateľa
v PHP - Fusion 9.1
194 4 Balin50
20-04-2018 15:49
Seznam členů
v PHP - Fusion 9.0
86 1 RobiNN
20-04-2018 14:57
chyby po upgrade
v PHP - Fusion 9.1
405 10 Balin50
19-04-2018 07:09
nastavenie už. polí a zobra...
v PHP - Fusion 9.1
74 1 RobiNN
18-04-2018 22:00
Vzhľady
v PHP - Fusion 9.1
63 1 RobiNN
18-04-2018 21:57
Chyba v zobrazení
v PHP - Fusion 9.1
75 0 Balin50
18-04-2018 19:31