Zdravím,
jak to vypadá? Opravené to stále není. Hrál jsem si s tím víc, konkrétně se jedná o cookie "webtype=desktop", kterou nastavíte při přechodu na plnou verzi, ale už ji nezměníte či nesmažete při přechodu na verzi mobilní.
Díky.
Zlatý tabuľkový layout:
- tabuľka center (aj to nie vždy)
- tabuľka max-width: 1180px
- lavé menu width: cca 180 až 200px
- a obsah sa bude automaticky prispôsobovať podľa veľkosti displeja napr. v tablete.
a dokonce takove weby meli vetsi informacni hodnotu nez dnes, take byly mnohonasobne mensi, to by byl pane cvrkot na dnesnim fofr mobilnim internetu i vydrz na batrii by se zvysila
Asi je třeba nejprve definovat co je to low-end a hlavně kde začíná mobilní cílovka, protože telefon, který se před rokem prodával jako novinka za 6kkč nemá dost výkonu na to, aby zobrazil stránku a při tom z něj nezačaly šlehat plameny
Poděkoval bych za pochvalu, ale je to tu na Lupě takové nějaké anonymní. Můj blog sleduj, to je jistota! :-)
V rámci komentáře asi dostatečně neodpovím.
K otázkám – rozeznat smartphone vs. desktop/tablet jde technicky docela dobře pomocí user-agent stringu. Výjimečně se může hodit.
Rozeznávání dotykáče/myši – to bych nedělal. Technicky to lze (např. Modernizr), ale chceš dělat dvojí rozhraní jedné aplikaci na tak elementární úrovni jako jsou konkrétní aktivní plochy? Hrrrrozně moc práce. Vymyslel bych jednotně.
Omlouvám se za chybu, v předchozím příspěvku jsem chtěl říct, že "toto chování by mělo být jenom na tabletu".
Díky za upozornění na problém, prověříme ho.
Nejlepší je dělat weby co nejjednodušší, tak jako se dělaly někdy v roce 1997. Pak je to automaticky optimalizované na jakékoli rozlišení, nerozsype se to nikde a nevadí, pokud si člověk v browseru nastaví zvětšení písma při současném nezvětšení ničeho jiného. Nevytěžuje to procesor javascriptem, je všechno dostupné ve všech verzích atd., žádné vopruzy s mobilní verzí. Pokud takhle celý web napsat nejde, protože tam je třeba prohlížeč šachové partie nebo video nebo prezentace výsledků mistrovství světa v javascriptu, css, flashi a HTML5, tak je dobré tím primitním stylem napsat celý zbytek toho webu. Navíc je pak ten web i hezčí. Myslím to vážně, nedělám si srandu.
Jo třeba nový redesign Srealit, na desktopu něco hrozného.
Seznam s desktopem uz asi nepocita :-(
Ani 5,5 palce vás nezachrání.
Komerční WEB jak si asi pamatujete pamatuje CRT a vytáčené analogové připojení. možná monitory byly 14" / 15" / 17" ale rozlišení bylo menší než smartphony a tablety dnes.
Kdo nema spatný oči nema problém, kdo má má problém i na obyčejných 15" NTB
Ze všechny bych netvrdil.
Mam ctyrpalec Lumii( pro mne maximum aby to byl jeste telefon) a vetsi rozměr mam 840 DPi.
A takových uživatelů nás bude spousta, ne všichni vyhazujeme oknem peníze za výmysl od Samsungu s naprosto zbytečným HD, fullHD a a podobnými vymysly
Proto hostuju svoje webowky na webnode.
Mobilní verzi stranek automaticky vygenerují automaticky i jejich šablony jsou optimalizované pro malé dotykové displeje.
Z hlediska navstevnika vypadají obe verze velmi podobne, prepinani mají udelane trivialne podle DPI zobrazovače.Pod 800 na sirku se automaticky nahraje mobilní web.Da se to v kódu stranky samozrejme prenastavit
Původně ale byla řeč o rozměrech zadaných relativně oproti rodičovskému prvku. Takže šířka DIVu by byla zadaná ne vůči „prohlížeči“, ale např. vůči stránce. Velikost stránky se může změnit spolu se zvětšením. DIV by tedy sice měl pořád 50 %, ale měnil by se základ, z čeho se těch 50 % počítá.
Pokud byste měl velikost DIVu zadanou opravdu relativně vůči záběru (viewport, vy jste napsal nepřesně prohlížeč), tedy jednotky vw nebo vh, pak by měl obrázek opravdu zůstat stejně velký bez ohledu na zvětšení stránky.
Pokud nemate jako telefon nějakou 5.5' a vice palcovou placacku na mouchy, tak na vetsine pro mobil neoptimalizovaných webu si bez neustálého zvetsovani a rolovani moc nepoctete.
Tak jo, našel jsem problém. Jakmile člověk jedinkrát klikne na "Přepnout na plnou verzi", pak už do konce života dostává plnou verzi webu. Přepnutí na mobilní verzi webu nepomůže, nezmění to výchozí režim stránky. Ozkoušeno na Firefoxu (jednoduše se to dá vyzkoušet pomocí anonymního režimu) i na Chrome. Jednoduše tu cookie nastavujete jen jedním směrem, ale druhým směrem už ne.
Jelikož v mobilním Firefoxu se nedají vymazat cookies konkrétní stránky, ale jen všechny globálně, tak se mi to teď moc nechce "opravovat". Ale pokud ten bug neopravíte na vaší straně, tak asi budu muset :) A pak už nikdy neklikat na "přepnout na plnou verzi".
Majoritní mobilní prohlížeče mají v nastavení volbu, zda stránky defaultně zobrazovat klasicky,pro Android, pro iOS, obecně pro mobil....
Teda alespon na platformě WP a Android.
http://lab.xhtml-css.cz/zoom/zoom.jpg Stačí to? Připadá vám že ten obrázek má vždy 400px? Mluvím o tom co bylo kdysi, kdy změna velikosti v prohlížeči ovlivňovala jen text. Dnes to funguje tak že se mění velikost celé stránky. Takže ano měli by zůstat poměry (těch vašich 50%) ale jak můžete vidět ten obrázek se zvětšuje/zmenšuje a nemá vždy 400px.
Je možné nějak spolehlivě rozeznat mobilní zařízení, nebo to děláte pouze podle rozlišení displeje, případně User Agent? Moto G má rozlišení 720 x 1280, možná to proto považujete za přístup z desktopu?
Povedlo se mi na mobilu kliknout dole na "Přepnout na mobilní verzi", přeplo to správně, ale po příštím spuštění Firefoxu jsem opět na desktopové verzi, takže si to bohužel nepamatuje. Nemám žádný anonymní režim ani paranoidní promazávání cookies, takže u mě by to snad být nemělo. Jak říkám, váš příbuzný root.cz funguje správně (vaše mobilní vzhledy mi přijdou podobné, takže předpokládám, že je sdílíte). Někde tam musí být rozdíl.
Teď jsem zkusil ještě Chrome, a stejný problém, taky si nepamatuje přepnutí na mobilní verzi. Poprvé mi to teda najelo jako mobilní, ale jakmile jsem přepnul na plnou verzi, a pak jsem chtěl zpět na mobilní, tak teď už po každém startu dostanu plnou verzi.
V každém případě díky za každou snahu o vyřešení problému, na lupu chodím často.
Toto chování by mělo být jenom na desktopu, mobil rozpoznat a přepnout hned na mobilní verzi (plus si to zapamatovat v cookie).
Reklama spořitelny je v tomto opravdu komplikace, to máte pravdu.
Nevypadá to, že by byla defaultně dostupná/nastavená na desktopových prohlížečích
Proc se vyjadřujete k nečemu, o čem nemáte ani páru? Pokud mate ve strance prvek DIV, ktery je siroky dejme tomu 50% šířky prohlížeče a v nem mate obrazek s nastavenym width: 100%;, pak tento obrazek bude vždy široký 50 % a nějaký zoom v prohlížeži s ním absolutně nic neuděla. Nezvětší, nezmenší...
Hezky jsi to shrnul, v dnešní době je definitivně potřeba s mobilními zařízení při návrhu UX počítat.
Na druhou stranu, objevují se i weby které zase úplně zapomínají, že ještě existuje desktop, ani tento extrém není vhodný....
Možná by stálo za to do budoucna podrobněji rozebrat, jak vlastně takové mobilní zařízení a desktop rozeznat....
Někde to řeší podle šířky okna, což mi nepřijde dobré, když si chci jen zúžit okno na desktopu abych viděl třeba jen sloupec s textem.
Někde to řeší podle prohlížeče, což ale také není 100%.
Dá se třeba nějak rozumně na úrovni HTML/JS rozeznat, jestli uživatel používá dotykový display nebo myš? I když to by taky mohlo být zavádějící u dnešních 2 v 1 noťasů...
Každopádně dík za článek, tvůj blog asi začnu sledovat ;)
Jde taky o fyzický rozměr - rozlišení je třeba dobré, ale displej rozměrem malý, takže máte perfektně vykreslená písmenka, která musíte číst s lupou, protože zvětšit roztažením prstů to nejde.
A když to i přečtete, tak se trefujte na mrňavé tlačítko někde v menu nebo formuláři.
Ovšem i low-end telefony v mnoha případech mají wi-fi. A pak vám tahle cílovka najednou začně brouzdat po netu někde během cesty vlakem nebo autobusem.
Neřešme aplikace, ty tahle skupina nejspíš skutečně kupovat nebude, ale vstoupit do e-shopu a objednat na dobírku zboží v akční slevě nepochybně dokáže.
Předpokládám, že nevíte o volbě v prohlížeči, která umožní přednostně zobrazovat desktop verzi? :-D
"Teď ta otázka, chtějí uživatelé responsivní/mobilní podobu nebo si dokáží poradit pomocí prohlížeče?"
Prohlížeč jim moc nepomůže, musí autor webu. Viz aktuální čísla z Megapixelu: http://www.slideshare.net/peckadesign/jak-se-megapixelu-vyplatil-responzivn-design
"Udělat plně responsivní stránky které by se zavděčili všem je skoro nemožné + řešit věci jako obrázky (retina) je dobrej bolehlav."
Vše se dá řešit, dneska už docela elegantně. Jen se k výrobě webů musí přizpůsobovat dost jinak. Responzivní = revoluční.
"Taky se tu řeší datová náročnost, která může být s responsivním přístupem paradoxně vyšší"
Špatně udělaný web se bude načítat pomalu. Špatně udělaný responzivní web se bude načítat také pomalu. Dobře udělaný…
"Nejhorší je že budoucnost je nejistá, standardy se mění a nemáme představu jaká zařízení příjdou (prohlížeč v TV, autě, ledničce..)."
Ano, máte pravdu. To, že se mění prostředí a měnit ještě hodně bude, je prostě osud webařů. Člověk prostě musí akceptovat podmínky nebo jít jinam.
Pod 1200px zobrazovacího rozlišení mají prakticky všechny tablety nebo smartphony.
Dobré vědět, že HW pixely jsou v tomhle dost špatný údaj: http://www.vzhurudolu.cz/prirucka/css-pixel
Pisete ze je 12% uzivatelu z mobilnich zarizeni. Proc se vse podrizuje minorite nechapu. Az to bude naopak, budiz.
Právě, že na to až nechce nikdo čekat. Až bude podíl dva nebo třikrát tak vysoký, budou weby jež začaly dříve daleko lépe připravené. Těm ostatním naopak vlak ujíždí.
Viz třeba trendy z USA: http://gs.statcounter.com/#all-comparison-US-yearly-2008-2014
nemoznost tahem dvouma prstama od sebe zvetsit si ji
To je samozřejmě chyba webdesignérů, bohužel relativně častá.
Ona ta funkce změny velikosti písma byla hodně nedomyšlená, protože pak 1 px textu byl jinak velký, než 1 px obrázku. Díky bohu, že jsme se tohohle nesmyslu zbavili.
Souhlasím stím tahle cílovka lowend telefonů , že není zrovna ta která bude mít datový paušál natož kupovat aplikace.
To že nemají ani kreditní\depetní kartu s možností platby na internetu je víc než pravděpodobné.
Bavím se tu o funkci Zvětšení/Zmenšení stránky a tam se mění velikost všeho (záleží konkrétně na prohlížeči jak se s tím vypořádá, dobře to umí FF). Měl jsem na mysli vestavěnou funkci prohlížeče a né CSS pravidla.
Jde o to, kolik % z tech 12% ma jeste rozliseni mensi jak cca 1200. Deti s lowendama stejne nepristupuji nikam jinam nez na fejs a max idos. Kdyz dostanou nahodou neco za ukol tak resp. ci rozl. neresej. Duchodci listujou akorat ve slevach. Zpravy a napr tech. info v praci, na mobilu cist nebudu.
Bomba je koukat na ,,mobilni" video 100x30 px to uz jsem taky nekde videl.
"Dneska už to všechny prohlížeče řeší tak že mění velikost všeho a zvětšují/zmenšují celou stránku. "
Ne, rozhodne nemeni velikost vseho ;-) Napriklad obrazky, jejich velikost je zadana v procentech (treba width: 100%) a urcena rodicovskym kontejnerem...
Tahle "cílovka" ten Internet v mobilu ani mít nebude a když už tak na Internet nechodí a používá ho max pro aplikace typu Facebook. Jo taky si nikdy nekoupí žádnou aplikaci, protože nemá ani spárovanou kreditku s účtem.
Tohle je fakt palčivé téma. Ono v dnešní době ty mobilní prohlížeče velmi kvalitně pracují s plnohodnotným obsahem (pokud neberem nějaký flash nebo silně přejavascriptované RIA). Vzpomínám si jak se před pár lety muselo řešit přetejkání obsahu pokud si uživatel změnil v prohlížeči velikost písma (zoom). Dneska už to všechny prohlížeče řeší tak že mění velikost všeho a zvětšují/zmenšují celou stránku. Teď ta otázka, chtějí uživatelé responsivní/mobilní podobu nebo si dokáží poradit pomocí prohlížeče? Udělat plně responsivní stránky které by se zavděčili všem je skoro nemožné + řešit věci jako obrázky (retina) je dobrej bolehlav. A tyhle úpravy nejsou zadarmo, a je tu otázka od zadavatele jestli se mu to vyplatí. Taky se tu řeší datová náročnost, která může být s responsivním přístupem paradoxně vyšší. Jsem z toho všeho rozčarován a to v tom dělám. Nejhorší je že budoucnost je nejistá, standardy se mění a nemáme představu jaká zařízení příjdou (prohlížeč v TV, autě, ledničce..).
Nemůžete to posuzovat podle svého vybavení, stále se ještě prodávají levné mobily s minimálním rozlišením. Ano, vy byste si mobil s rozlišením 320x480 px nekoupil, já bych si ho taky nekoupil, ale když se podíváte do obchodů, tak tam podobných přístrojů za minimální ceny najdete dost. "Mámo, v hypermarketu mají v akci mobil za 1500, koupíme si každej jeden a budeme mít smartfouny." Výsledkem je, že se skupina uživatelů mobilů s mizerným rozlišením příliš nezmenšuje - sice z ní odcházejí ti, kdo upgradují na lepší modely, ale průběžně ji doplňují ti, co si koupí mobil sice mizerný, ale zato za pár korun.
A s touto cílovkou, která si web v desktopové verzi nezobrazí, bohužel taky musíte počítat, i když si o ní můžete myslet svoje.
Tohle se mělo řešit před 5tilety , dnes weby krom konkrétních scriptových a flashových "prasáren" jsou normálně kompatibilní s soudobým smartphonem nebo tabletem.
Odkaz "Přepnout na mobilní verzi" je bohužel skrytý za reklamou na českou spořitelnu (proužek přes celou šířku stránky, vždy na spodní hraně), které má naprosto titěrné tlačítko zavřít, na které se na 7" tabletu vážně nestrefím. Editovat adresu teda můžu, akorát vždycky přicházím z RSS čtečky, takže je dost nepříjemné dělat to pro každý článek.
Na mobilu by to ale mohlo detekovat a přepnout automaticky, aspoň to by bylo fajn.
Na tabletu dostanete deskotopový vzhled, ale vždy máte možnost si jej přepnout dole v patičce ("Přepnout na mobilní verzi"), případně zavolat rovnou přes URL m.lupa.cz.
Když už tu máme tento článek, tak by mě zajímalo, proč Lupa zrušila svůj mobilní vzhled. Ještě před nějakým měsícem dvěma to fungovalo. Pak najednou přestalo. Ani na Moto G ani na Nexus 7 nevidím mobilní vzhled, ale plný desktopový vzhled. Přitom na spřáteleném root.cz mi to funguje (pouze teda na Moto G, ale na tabletu se už ten plný vzhled dá, i když to není ideální).
pokud jsem to dobre pochopil, tak staci udalat web tak, jak se delal pred 5+ lety a nebude problem
Přesně tak. I na mobilu v drtivé většině případů vyžaduji desktopové zobrazení. Zaprvé jsem na rozložení stránky zvyklej z PC (a nejsem línej stránku zvětšit a zmenšit) a za druhé mnoho stránek do mobilní verze nezahrnuje všechny možnosti desktopového zobrazení (např. videa,rozšířené filtrování dle parametrů apod...) jenom proto, protože si někdo myslel, že je to pro mobil/tablet zbytečné...
Další věc, o které psal pán nademnou, je ta "zobrazit klasicky". To je tak složité udělat cookies nebo tak, aby si to stránka pamatovala i příště? Teď už to myslím funguje, ale ještě nedávno jsem si musel na mobilu seznam.cz ukládat s proměnnou seznam.cz/NoResponsive nebo tak nějak... A to kolikrát nepomáhá ani nastavení v prohlížečí, že se má vydávat za desktopovej prohlížeč.
Responzivita je pro me spanelska vesnice a jako uzivatel (ctenar) pristupujici z tabletu i desktopu si myslim ze to nepochopim nikdy. Chapu ze asi neni jednoduche najit vhodne reseni pro vsechny ale nechapu jednu tak trivialni vec, proc ty stranky kdyz uz jsou pro obe verze, tak me smeruji na mobilni verzi ackoliv o to nestojim a jak debil musim hledat tlacitko, ,,zobrazit klasicky" Dalsi vec ktera me dovede k nepricetnosti u nekterych mobilnich verzi je nemoznost tahem dvouma prstama od sebe zvetsit si ji. Pisete ze je 12% uzivatelu z mobilnich zarizeni. Proc se vse podrizuje minorite nechapu. Az to bude naopak, budiz. Na mobilnim zarizeni lze casto puvodni desktove prizpusobeni stranek, konzumovat daleko lepe nez casto na zprznene mobilni verzi.