Fórum - Téma


Responsivní web design


Fórum Klubové záležitosti Responsivní web design




udm  
2016-05-24 05:29:01

Předělal jsem web na responsivní web design. Co ten pojem znamená? Že web se umí automaticky přizpůsobovat šířce obrazovky. Na PC by mělo vše vypadat téměř beze změn, ale když se podíváte na web z mobilu či tabletu, uvidíte, že se struktura stránek přeskládá tak, aby nemusel člověk zoomovat (přibližovat) aby si mohl něco přečíst či na něco kliknout. Na mobilu i tabletu můžete vyzkoušet překlopit na šířku a pak zas na výšku - uvidíte, jak se web přeskládá, aby vhodně využil šířku displaye.

Jak ten responsivní design funguje si lze nejlépe vyzkoušet přímo na PC - zmenšujte pomalu okno prohlížeče na nejmenší co jde a pak pomalu opět zvětšujte na maximální šířku. Pecka, co?

Pracoval jsem na tom více než měsíc a samozřejmě jsem se to snažil důkladně otestovat, než jsem to dneska finálně hodil z testovacího do ostrého prostředí. Ač na PC web vypadá téměř stejně, uvnitř téměř nezůstal kámen na kameni. Takže je velice pravděpodobné, že objevíte různé chyby a nedokonalosti. Pokud ano, pošlete mi vzkaz interkou .. nebo napište sem do tématu.

Uvítám jakoukoliv zpětnou vazbu (pozitivní i negativní).

Jinak více informací o tom, co to je responsivní web design viz Wikipedia https://cs.wikipedia.org/...sponzivn%C3%AD_web_design

MilanT  
Milan
2016-05-24 07:31:35

Ahoj Pavle, to je sice prima, že se stránka přizpůsobí displeji...ale na mém pracovním netbooku to nadělalo paseku v zalamování textu. Text příspěvku se dostal i do avatarů a je to dost nepřehledný. Zkoušel jsem různé velikosti zobrazení, ale bez úspěchu. Snad si zvyknu.

2016-05-24 11:33:58

udm: Mně se zas dost často odhlašuje, což dřív nedělalo.

udm  
2016-05-24 15:58:07

milant: to dělaj ty odrážky. V jiném případě by se to nemělo stát. Princip responsivního designu je hlevně v obtékání textu. Takže text teďka obtéká kdekoliv to je možné - kolem obrázků, tlačítek, atd. Ještě min. několik týdnů to budu ladit a vylepšovat, počítám s tím

Hlavní výhoda toho nového designu webu je pro ty, kteří používají často mobil či tablet. Na PC či notebooku uživatelé zaznamenají spíše jen minimální změny.

milk239: kdy přesně Ti to začlo zlobit s tím odhlašováním (datum, čas)?

2016-05-24 16:18:01

udm: No dnes ráno. Kolem 6:00. Psal jsem příspěvek, byl jsem přihlášenej a při odesílání mi to najelo na stránku, že nejsem přihlášenej. A takhle asi 3x. Ale dopoledne už to bylo v pohodě a teď se mi to taky ještě nestalo.

udm  
2016-05-24 16:21:58

milk239: to by nemělo s tím novým designem vůbec souviset.

MilanT  
Milan
2016-05-24 16:36:04

milk239: Tohle se mi stává často pokud jsem připojen na mobilní síti. Tam je někdy takové kolísání signálu a dost časté výpadky, že mě to odhlásí. Co já přepisoval příspěvků

Teď jsem se naučil před odesláním příspěvku, zprávy...to nejdříve zkopírovat.

  • -------------------------------------

Pavle, pokud text obtéká avatar, nebylo by ke zvážení vložit nick, avatara a počet příspěvků do nějakého společného rámečku? Možná je to jen moje rozmazlenost a vadí to jenom mě, ale možná by se ty příspěvky zpřehlednily. Určitě víš, že na jiných fórech má avatar a ostatní info samostatný oddělený sloupek. To by ale znamenalo dost volného místa nazmar - chápu to.

Jinak díky za snahu nám to tady zpříjemnit. Určitě je za tím moře práce, které já vůbec nerozumím.

udm  
2016-05-24 16:42:51

milant: právě tak jsme to doteďka měli - avatar měl svůj vlastní sloupeček vlevo, stejně tak tlačítka vpravo. Uznávám, že to vypadalo učesaněji na PC. Ale teďka si na PC zkus okno prohlížeče postupně zmenšovat na nejmenší možnou velikost a pak zase zvětšovat. Princip toho, aby se web uměl přizpůsobovat šířce obrazovky je v obtékání textu. Na úplně malém displayi (mobily) kdyby měl být levý sloupec pro avatar a pravý pro tlačítka, tak už by se nikam nevešel text. Nebo vešel, ale měl bys ho přes 30 obrazovek, protože bys mělo 1 slovo / řádek.

daniel  
Daniel Matteoni
2016-05-24 16:47:38

udm: Používáš bootstrap? ( http://getbootstrap.com/ ) S bootstrapem se dá elegantně vyřešit, aby se to zobrazovalo jinak na velkých a jinak na malých obrazovkách.

2016-05-24 16:58:23

daniel:

...a akou rečou stě to těraz hovorili ?

udm  
2016-05-24 17:10:13

daniel: já nemám rád tyhle různý frameworky. Bootstrap jsem použil jen na rozcestník http://www.auto-moto-klub.cz/

daniel  
Daniel Matteoni
2016-05-24 18:37:08

plukovník: Latinsky prosím

udm: V pohodě, každý má svoje oblíbené technologie. Ale od doby, co znám bootstrap, tak bych do responsivního designu bez toho nešel - dle mého názoru to ušetří mnoho práce a výsledek vypadá (skoro) vždycky dobře.. Viz rozcestník - je radost zoomovat a koukat, jak se to dynamicky přeskládává

udm  
2016-05-24 18:56:26

daniel: můj odpor vůči Bootstrapu možná tkví taky trochu v tom, že ho moc neznám. A když jsem v něm chtěl cokoliv tvořit, tak že mi trvalo mraky času, než se mi podařilo zjistit, jak to je myšlený a jak to udělat. Ale taky je to omezující používat takový framework, zbavíš se tím svobody v tom, že některé věci bys mohl vyřešit lépe.

Nicméně zkoušel jsi tady na webu zoomovat a koukat, co to udělá? Funguje to úplně stejně.

Jinak co se Ti nezdá na responsivní verzi tohoto webu, že tolik chválíš Bootstrap?

2016-05-24 18:57:10

A vietě Daniel, že Armaty vyzerajú byť dosť dobré tanky a že ruské ponorky su celé zo skla naplněné vodkou…,

vietě prd...

daniel  
Daniel Matteoni
2016-05-24 19:13:34

udm: Já nejsem a nikdy jsem nebyl web designer, takže máš můj obdiv, že ses pustil do responsivního designu takto na vlastní pěst na docela velkém webu. Dovedu si představit, kolik to muselo být "sraní" A v podstatě jsem reagoval na to obtékání, které zmiňoval MilanT, protože myslím, že tento problém by se dal vyřešit pomocí bootstrapu elegantně..

plukovnik: Prepáčtě, Herr…, súdruh…, pan generál, som z toho volaký zmetěný

MilanT  
Milan
2016-05-24 20:08:13

udm: Pavle, já se vrátím ke svému původnímu návrhu. Taky nejsem webdesigner a nevím co je za tím práce nebo možností, ale mě by se líbily ty rámečky. Já to ale posuzuju z pohledu na monitor a netuším, jak by to vypadalo na displeji telefonu a jestli je to vůbec realizovatelné.

Pavle, je to jen návrh a nestojí na tom život. Jenom že mi to připadá přehlednější.


Odpovědět