Při tvorbě klientsky orientovaného webu je potřeba vzít v úvahu a promyslet spoustu věcí, od kreativních (design, obsah) až po technické (rozvržení, umístění na internetu). Pro klienty je důležitá každá maličkost, proto je důležité dívat se nejen na vnější stranu vašeho projektu – co uživatel uvidí – ale také na to, jak rychle to uživatel uvidí. Výzkum ukazuje, že zhruba polovina uživatelů očekává, že se web načte za méně než dvě sekundy, a 40 % uživatelů web opustí, pokud načítání trvá déle než tři sekundy. Proto je nesmírně důležité, aby se vaše stránky načítaly rychle, jinak riskujete ztrátu značné části zákazníků. Co tedy můžete udělat, abyste zkrátili dobu načítání vašeho webu?
1. Zkraťte kód
Čím větší je kód vašeho projektu, tím více váží, což znamená, že jeho načtení trvá déle. Nejprve se proto musíte ujistit, že je kód optimalizován. To platí zejména pro první vstupní stránka, na které uživatel padne - bude lepší opustit těžké JavaScript skripty a Ajax nebo je odstraňte na konec stránky. Dodržujte známou zásadu KISS – Keep it short and simple – udržujte kód krátký a jednoduchý.
Servis PageSpeed Insights od Google doporučuje odstranit externí JavaScript soubor z horní části stránky, protože cyklus operací, které je potřeba provést k jejímu načtení, výrazně zpomaluje načítání stránky. V tomto případě se doporučuje kód JavaScript buď vložit, nebo jej načíst až po načtení horní části stránky.
Pokud chcete vědět, zda je na stránce vašeho webu s JavaScriptem vše v pořádku, použijte tuto službu: https://varvy.com/tools/js/
Tento tip platí také pro kód HTML a CSS. Stejně jako u JavaScriptu věnujte zvláštní pozornost externí soubory- například externí šablony stylů, které se pokud možno nejlépe vkládají do HTML.
2. Použijte kompresi stránek
Existuje několik technologií, pomocí kterých můžete komprimovat data, což může snížit velikost textových zdrojů, a tím i dobu načítání stránek zdrojů. Použijte například gzip: tento nástroj minimalizuje požadavky na server z prohlížeče. Můžete jej použít v protokolu HTTP.
Můžete zkontrolovat, zda váš web používá gzip pro kompresi dat na tomto zdroji: http://www.gidnetwork.com/tools/gzip-test.php
A kliknutím na následující odkaz můžete zjistit, zda se na vašem webu obecně používá nějaká kompresní technologie: http://www.whatsmyip.org/http-compression-test/
3. Snižte počet přesměrování
Přesměrování 301 se často používá k přesměrování z jedné adresy na druhou. To však přichází s rizikem zavedení dalších síťových cyklů, které mohou prodloužit dobu načítání stránek, zejména na mobilních zařízeních. Proto je lepší počet přesměrování snížit nebo je úplně odmítnout.
Přesměrování na svém webu můžete zkontrolovat pomocí tohoto programu (k dispozici je bezplatná verze): https://www.screamingfrog.co.uk/seo-spider/
4. Snižte počet pluginů
Tento odstavec platí pro ty, kteří používají CMS: Wordpress, Joomla nebo jakýkoli jiný. Pravidelně kontrolujte seznam pluginů, které používáte, pro ty, které nepotřebujete nebo již nepoužíváte. Snížení počtu pluginů pozitivně ovlivní načítání vašeho webu a jeho práci obecně. Pokud používáte Wordpress jako svůj redakční systém, můžete také optimalizovat počet pluginů pomocí pluginu P3 (Plugin Performance Profiler): https://wordpress.org/plugins/p3-profiler/ Tento plugin vám ukáže související s výkonem data dalších pluginů a jak každý z nich ovlivňuje web. To vám pomůže určit, které pluginy jako první ukončit.
5. Optimalizujte své obrázky
Velikost obrázků na webu přímo ovlivňuje dobu načítání zdroje. Všechny obrázky musí být optimalizovány: nastavte správnou velikost, formát a kompresi. Hodit se bude i zbavení se takzvaného digitálního smetí: různých dat, která se do snímku dostanou při jeho zpracování.
6. Použijte mezipaměť prohlížeče
Pomocí ukládání do mezipaměti můžete výrazně zlepšit rychlost načítání vašich stránek: když uživatel poprvé navštíví váš web, některé soubory JavaScript a CSS se uloží do mezipaměti jeho prohlížeče, které se pak automaticky zobrazí při jeho příštích návštěvách. a prohlížeč nebude muset ztrácet čas jejich stahováním. Pro ukládání do mezipaměti musí být hlavička HTTP Expires správně nakonfigurována. Můžete to udělat tak, že do souboru .htaccess, který se nachází v kořenové složce, zapíšete následující řádky:
V tento případ všechny typy mají období 1 měsíce, ale čas si můžete změnit na cokoliv potřebujete: cache může být uložena po určitý počet let (roků), měsíců (měsíců), týdnů (týdnů) nebo dnů (dnů).
Pokud používáte konkrétní CMS, můžete si k tomu nainstalovat speciální plugin. V případě Wordpressu se hodí W3 Total Cache: cachování je povoleno v nastavení (v seznamu všech vyberte Nastavení pro tento plugin nainstalované pluginy a poté Obecné - zaškrtněte políčko „Zapnout nebo vypnout všechny typy ukládání do mezipaměti (najednou)“).
7. Sledujte výkon webových stránek
Je důležité neustále sledovat výkon vašeho webu – i když si myslíte, že jste optimalizovali vše, co můžete. K tomu existují speciální bezplatné zdroje, z nichž nejznámější budou uvedeny níže:
- již výše zmíněný Statistiky rychlosti stránky: https://developers.google.com/speed/pagespeed/insights/?hl=ru
Tento nástroj od Google měří rychlost načítání vašeho webového zdroje (od 0 do 100 bodů; čím vyšší skóre, tím lépe). Služba vám dá doporučení pro zlepšení výkonu a také vám ukáže, jaké položky optimalizace jste dokončili. Mějte na paměti, že protože Page Speed Insights podléhají změnám a úpravám, může se změnit i počet bodů, které váš web získá. - Test rychlosti webu Pingdom: http://tools.pingdom.com/fpt/
Dobrý Anglicky mluvící služba zkontrolovat rychlost načítání vašeho zdroje. Bude se hodit zejména těm, kteří spravují mezinárodní zdroje, protože umožňuje vybrat si místo, odkud se bude test provádět: USA, Austrálie nebo Švédsko (výsledek se bude lišit). Zobrazuje mnoho různých dat a dává doporučení. - dopad zatížení: https://loadimpact.com/
Tato služba vám umožňuje generovat několik požadavků na váš web, pomocí kterých můžete za prvé zjistit průměrnou rychlost načítání vašeho webu a za druhé pochopit, jak se váš web bude chovat při určitém počtu požadavků (zda obstojí náklad). - loadstorm: http://loadstorm.com/
S pomocí této služby můžete spustit poměrně vážné testování vašeho webu. Bezplatná verze Služba vám umožní otestovat váš zdroj s 10 uživateli, ale placená verze vám dává více možností, zejména můžete nezávisle napsat skript, který uživatelé spustí (například klikněte na určité tlačítko nebo přejděte do požadované sekce ). V tomto případě jste povinni ověřit, že jste vlastníkem webu.
Závěr
Pokud budete dodržovat každý z bodů navržených v tomto článku, můžete výrazně zkrátit dobu načítání svého webu. Zároveň však nezapomeňte, že optimalizace by neměla být na úkor uživatelů: obrázky by měly zůstat atraktivní, navigace pohodlná a informace srozumitelné a dostupné.
Podělte se o své nápady v komentářích, jak urychlit načítání webového zdroje.
Mnoho uživatelů chce, aby jejich počítač fungoval rychle, a proto používají programy k odstranění dočasných souborů, jako je například, a automatickému vyčištění systému (včetně vymazání mezipaměti prohlížeče). To je ale jeden z hlavních důvodů zpomalení načítání stránek v prohlížeči.
Proč prohlížeče vytvářejí mezipaměť?
V jednom z článků popsal Alexander Shikhov. Nebudu převyprávět celý článek, řeknu jen hlavní podstatu. Mezipaměť je potřeba jen k tomu, aby se stránky otevíraly velmi rychle. Pokud jej budete mazat každý den, pak při příštím spuštění prohlížeče a pokusu o otevření vašich oblíbených stránek bude muset prohlížeč během zlomku sekundy znovu stáhnout stejná data, která by mohl otevřít z místního disku (mezipaměti).
Proč jsme se učili vymazat mezipaměť?
Po mnoho let nás vývojáři programů na čištění systému učili, že mezipaměť je nadbytečná a je třeba ji vyčistit. Zdůvodnili to jednoduše – zabírá to spoustu místa, které lze využít racionálněji. Ale ve skutečnosti je to jen trik, důvod přidat dvě nebo tři sta megabajtů a několik tisíc souborů do statistiky "odpadu" nalezeného v systému. To umožňuje, aby takový produkt vypadal lépe v očích uživatelů díky tomu, že najde více (nebo ne méně) konkurentů.
Je to dáno tím, že většina hodnotí množství nalezeného odpadu, nikoli jeho kvalitu. Pokud některý program najde v systému 700 megabajtů smetí a dalších 900 megabajtů, pak druhý program vypadá rozhodně lépe. A nezáleží na tom, že 200 megabajtů nahoře bylo přidáno přidáním mezipaměti prohlížeče, která za den doplní stejných 200 megabajtů. To je skvělý důvod navrhnout znovu vyčistit systém, ne?
Smažte historii prohlížeče a dočasné soubory bez vymazání mezipaměti
Chcete-li zabránit smazání mezipaměti při používání programů na čištění disku, jednoduše v nastavení programu zakažte čištění mezipaměti a pokračujte v jeho používání. Okamžitě si všimnete, že začal nacházet méně odpadků, ale nezapomeňte, že je to kvůli nedostatku mezipaměti v „odpadu“, díky kterému se prohlížeče načítají rychleji a práce se stránkami je pohodlnější.
Použít soukromý režim (anonymní režim)
Pokud nechcete, aby nějaké stránky zanechávaly stopy na vašem PC, pak stačí aktivovat soukromý režim procházení stránek (v něm se aktivuje kombinací Ctrl + Shift + N), po jehož zavření se z prohlížeče smaže veškerá historie a data o prohlížených stránkách a nikdo se o nich nikdy nedozví.
Mezipaměť prohlížeče je velmi užitečná a nezbytná věc, kterou nemusíte mazat, pokud nechcete, aby bylo surfování na webu nepohodlné. Pokud pravidelně čistíte mezipaměť svých prohlížečů, pak vše, čeho touto akcí dosáhnete, je zpomalit rychlost načítání stránky, prodloužit čekací dobu a snížit vlastní výkon.
Poté, co shromáždíte nějaké statistiky o době načítání stránky a efektivní šířce kanálu pro skutečných uživatelů, můžete experimentovat se změnami, které mohou tato čísla zlepšit. V případě významných úspěchů ve zlepšení tohoto ukazatele se vyplatí provedené změny opravit.
Některé z níže uvedených tipů již byly uvedeny v jiných článcích: tipy od Yahoo, slučování souborů CSS, optimalizace doby načítání stránky a mnoho dalších. Opakování však učí a v následujících tipech je několik nových bodů.
Můžete vyzkoušet následující věci:
Pokud uživatelé pravidelně stahují tucet nebo více objektů bez mezipaměti nebo bez mezipaměti, vyplatí se rozložit jejich stahování na 4 hostitele. V tomto případě obvykle uživatel bude moci navázat 4krát více připojení. Bez kanálu HTTP to povede ke snížení ztrát při předávání požadavků asi čtyřnásobně.
Při generování stránky budete čelit úkolu distribuovat obrázky na 4 různé hostitele. To lze nejsnáze provést pomocí jakékoli hashovací funkce, jako je MD5. Místo stahování všeho z jednoho http://static.example.com/ vytvořte 4 hostitele (např. static0.example.com , static1.example.com , static2.example.com , static3.example.com) a použijte 2 bity z množství MD5 pro každý obrázek vybrat, na kterého hostitele vložit odkaz pro jeho stažení. Ujistěte se, že všechny stránky používají stejný algoritmus shody (ukažte na stejného hostitele pro každý obrázek), jinak budete bojovat proti ukládání do mezipaměti bez úspěchu.
Stojí však za zmínku, že přidání dalšího hostitele zvyšuje náklady na další vyhledávání DNS a připojení HTTP. Pokud mají uživatelé povoleno zřetězení požadavků nebo stránka načítá méně než deset objektů ( osobně bych doporučil cílit 5-6 na hostitele, tzn. s 10 objekty můžete vstoupit do druhého hostitele, s 16 - třetího a s 25 - čtvrtého), pak uživatelé nebudou těžit z nárůstu počtu paralelních požadavků a místo zrychlení načítání webu zaznamenají jeho zpomalení. Výhody tento přístup se zobrazí pouze pro stránky s velký počet vnější objekty. Před úplným zavedením této techniky se vyplatí nějakým způsobem změřit rozdíl v době načítání vašich uživatelů.
Možná nejlepší způsob, jak urychlit načítání vašich stránek pro vracející se návštěvníky, je bezpodmínečně uložit do mezipaměti statické obrázky, soubory stylů a skripty prohlížeče. To nijak nepomůže při načítání stránky novému návštěvníkovi, ale výrazně zkrátí dobu načítání stránky při opakovaných návštěvách.
Zvažte umístění malých objektů (nebo zrcadla nebo jejich mezipaměti) co nejblíže uživatelům z hlediska latence sítě. U velkých webů s mezinárodním publikem můžete použít obojí placené sítě doručování obsahu ( Síť pro doručování obsahu) a jednotlivé virtuální počítače do 50 ms pro 80 % vašich uživatelů, spolu s mnoha dostupnými metodami distribuce uživatelských požadavků tomu, který je jim nejblíže virtuální stroj (mimochodem, takto fungují stránky mnoha mezinárodních společností, včetně Acronis, které rozdělují uživatele podle místních verzí v závislosti na geografické oblasti).
Pravidelně kontrolujte své stránky přihlášením pomocí „obyčejných“ připojení. V mém případě se ukázalo, že použití „pomalého proxy“, které emuluje špatné DSL připojení z Nového Zélandu (768 Kb/s vstup, 128 Kb/s, latence 250 ms, ztráta paketů 1 %), namísto gigabajtového spojení s několika milisekundami ze serverů ve státech být docela nápomocný. Velmi rychle jsme našli a opravili řadu funkčních chyb a problémů s použitelností.
Pro simulaci takto pomalého připojení jsem použil moduly Linuxová jádra netem a HTB , které jsou dostupné od verze 2.6. Oba tyto moduly se instalují pomocí příkazu . To umožňuje nejpřesnější emulaci, jakou jsem byl schopen najít, ale nenazval bych ji dokonalou. Osobně jsem to nepoužíval, ale podle všeobecného mínění podle skrytá příležitost v jejich prohlížeči, což vám také umožňuje nějaké získat Dodatečné informace o stahování.
Pokud jste obeznámeni s protokolem HTTP a TCP/IP na úrovni paketů, můžete se pokusit zjistit, co se děje, pomocí tcpdump nebo . Tyto nástroje jsou prostě nutností pro ladění sítě jakéhokoli druhu.
Zkuste na svém webu otestovat výkon často načítaných stránek lokální síť, pomocí toho, který je dodáván s webovým serverem Apache. Pokud server při generování stránky odpovídá déle než 5–10 milisekund, pak stojí za to dobře porozumět tomu, na čem server tráví čas.
Pokud tyto testy vedou k velmi vysokým latencím a proces webového serveru (nebo CGI, pokud jej používáte) zabírá příliš mnoho CPU, důvodem může být často nutnost kompilovat skripty za běhu na každý požadavek. Takový software, jako eAccelerator pro PHP, mod_perl pro perl, mod_python pro python atd. mohou ukládat skripty na straně serveru do kompilovaného stavu, což výrazně urychluje načítání vašeho webu. Kromě toho stojí za to najít profilovací nástroj pro váš programovací jazyk, abyste zjistili, na jaké zdroje CPU jsou utráceny. Pokud můžete opravit příčinu vysokého využití procesoru, stránky se budou vykreslovat rychleji a budete moci obsluhovat větší provoz na méně počítačích.
Pokud váš web při vytváření stránky provádí mnoho databázových dotazů nebo jiné náročné výpočty, zvažte přidání mezipaměti na straně serveru pro pomalé operace. Většina lidí začíná zápisem mezipaměti do místní paměti nebo místního disku, tato logika však přestane fungovat, pokud se váš systém rozšíří na cluster webového serveru ( každý se svým lokální disk a místní paměti). Stojí za to se podívat na použití memcached , který vytváří velmi rychlou sdílenou mezipaměť, která sdružuje volné RAM všechna dostupná auta. Klienti k němu jsou portováni do většiny běžných jazyků.
(Volitelné) Požádejte dodavatele prohlížeče o povolení zřetězení požadavků HTTP ve výchozím nastavení v nových prohlížečích. Pokud se tak stane, nebudeme muset provádět tyto „tance s tamburínami“ ( tyto triky) a většina webu se běžnému uživateli načte rychleji. (Toto je ve Firefoxu zakázáno, pravděpodobně kvůli některým proxy serverům, některým nástrojům pro vyrovnávání zatížení a některým verzím IIS ( ahoj Microsoft!), které přicházejí do šoku při žádostech z potrubí. Zdá se však, že Opera udělala hodně práce, aby tuto funkci povolila ve výchozím nastavení. Proč to nemohou dělat všechny ostatní prohlížeče?)
Závěr
Tento seznam obsahuje mé myšlenky na to, jak zvýšit rychlost komunikace mezi prohlížečem a serverem a lze jej obecně použít na mnoho webů, bez ohledu na to, jak se webový server nebo vývojový jazyk používá k psaní webu. Bohužel se však všechny tyto věci dělají poměrně zřídka.
Přestože jsou všechny tipy zaměřeny na zkrácení doby načítání stránky, pozitivními vedlejšími účinky může být snížení provozu z webu a menší zatížení procesoru serveru při zobrazení jedné stránky. Snížení nákladů na váš web a zároveň zlepšení uživatelského dojmu by mělo být dobrým důvodem, proč strávit nějaký čas tímto druhem optimalizace.
V Google Chrome, podobně jako u jiných prohlížečů Windows je problém, že po načtení stránky se některé stažené soubory uloží do počítače.
Postupem času začnou na vašem pevném disku zabírat příliš mnoho místa.
Soubory cookie musíte pravidelně mazat, i když může být vše v pořádku. Samotný postup nezabere mnoho času, protože v prohlížeči Google Chrome je velmi jednoduchý.
co to je
Než vymažete mezipaměť v prohlížeči Google Chrome v systému Windows, měli byste obecně pochopit, co to je. Termín cash byl převzat z anglického slova cashe. Označuje úkryt nebo místo uložení. Často se také označuje jako „cookie“, protože se jedná o textová data stránky uložená v počítači uživatele. Pomineme-li technické detaily, můžeme říci, že takovéto úložiště informací je možné poskytovat rychlé otevření a zobrazení těch stránek, které uživatel dříve navštívil přes Chrome.
Celkově jsou taková úložiště vynikající možností, která vám umožní ušetřit váš internetový provoz. Takže například poté, co jste zhlédli video na určité stránce, při opětovném zhlédnutí již nebude nutné je znovu stahovat celé ze sítě. Faktem je, že algoritmy prohlížeče automaticky vytvoří kopii tohoto videa a umístí je do paměti počítače, čímž vytvoří soubory cookie a mezipaměť. Poskytuje také rychlejší načítání.
Tento případ má však i své stinné stránky. Například:
- Pokud byly na webu provedeny změny, poté, co byly navštíveny z prohlížeče a informace o nich byly uloženy do souborů cookie, ne všechny se zobrazí v nové podobě. Důvodem je, že v paměti již existuje obrázek stará verze webové stránky, které jsou načteny algoritmy prohlížeče a mohou být zobrazeny uživateli. Abyste tomu zabránili, musíte úložiště informací včas vyčistit;
- Další negativní stránkou je, že takové informace, pokud se dlouho nečistí, zaberou velmi dlouhou dobu. velký počet místo na pevném disku snížením jeho volného místa.
Jak čistit
Samotný postup je maximálně jednoduchý. Nejprve musíte spustit samotný prohlížeč systém Windows. Nyní musíte stisknout kombinaci kláves Shift + Ctrl + Delete. Tohle je nejvíc rychlý způsob otevřít soubory cookie prohlížeče. To lze provést i jiným způsobem. Chcete-li to provést, musíte najít tlačítko pro vstup do nabídky v chromu (je v nejnovější verze označeno třemi tečkami uspořádanými do sloupce), nazývá se „Nastavení a správa“ a klikněte. 
V se objevil kontextová nabídka musíte vybrat položku "Nastavení", po které se otevře karta se všemi parametry dostupnými pro změny. Jdeme dolů na úplný konec stránky, kde se nachází tlačítko „Zobrazit“. další nastavení“ a stiskněte jej. Najdeme zde sekci „osobní údaje“, kde budete muset kliknout na tlačítko „Vymazat historii“. 
Dále se objeví okno, kde bude možné kromě nezbytných úložišť souborů vyčistit uložená data historie stahování, jaké stránky byly navštíveny a také informace o heslech. Chcete-li vybrat, co přesně bude smazáno, musíte zaškrtnout políčko vedle konkrétní položky. Poté můžete jednoduše kliknout na tlačítko „Vymazat historii“ a počkat, až bude postup dokončen.
Tím je postup čištění informací o úložišti souborů prohlížeče Google Chrome prostřednictvím systému Windows dokončen. Za zmínku však také stojí, že v části nastavení „Osobní údaje“ můžete určit frekvenci mazání určitého typu uložených dat v prohlížeči Google Chrome. Tím zajistíte, že nebudou odstraněny všechny soubory, ale pouze zastaralé a již nejsou relevantní. Také stojí za to říci, že soubory cookie a mezipaměť mají významné rozdíly:
- První jsou zvláštní stopy, které zůstanou po návštěvě webu ve formě informací vyměňovaných mezi webovými stránkami a samotným chromem;
- Druhým je úložiště videí, hudby a fotografií stažených z různých webových stránek.
Můžete také smazat všechny uložené soubory, aniž byste museli jít do Chromu. Chcete-li to provést, budete muset otevřít samotnou složku ve Windows, kde jsou uloženy. 
To lze obvykle provést tak, že přejdete do složky C:\Documents and Settings\Admin\Local Settings\Application Data\Google\Chrome\User Data\Default\Cache\ kde „Admin“ je vaše uživatelské jméno Windows.
Vydali jsme novou knihu „Content Marketing in v sociálních sítích: Jak se dostat do hlavy předplatitelů a zamilovat si svou značku.
Neil Patel vydal článek o tom, jak zrychlit svůj mobilní web.
Co to dělá: V roce 2014 se webová stránka Walmartu načetla do mobilních zařízení za 7 sekund a zobrazuje uživatelům Bílá obrazovka. V průběhu roku Walmart zkrátil dobu načítání stránky na 2,9 sekundy. 4 sekundy byly zkráceny snížením překážek načítání: zjednodušení JavaScript kód, odstranit pomalá písma, optimalizovat obrázky. Zvyšování rychlosti za každou sekundu zvýšilo konverzi webu o 2 %.
Plus 2 % jen díky tomu, že uživatel začal čekat na otevření stránky o 1 sekundu méně. To je dobrý důvod pro kontrolu vašeho webu. I když se vám zdá, že to funguje rychle, může se dobře ukázat, že stále existují sekundy navíc a kradou vám zisk. Neil Patel hovořil o tom, jak zjistit, jak rychlý je váš web a jak jej v případě potřeby zrychlit.
Irina Vinničenko
Content Marketer SEMANTICA
Rychlost načítání webu je důležitým parametrem pro propagaci v vyhledávače Ach. Nízká rychlost snižuje počet zákazníků na servisních stránkách, prodej v internetových obchodech, publikum blogů.
Existuje několik služeb, které vám pomohou zjistit rychlost načítání stránek. Nebudu popisovat jejich schopnosti, rychleji je otestuji a naučím se, jak služby fungují, vyhodnotím klady / zápory na konkrétním příkladu.
- pr-cy.ru
- mainspy.ru
- airi.rf
Více o tom, jak se určuje rychlost načítání stránek, si můžete přečíst v článku Sémantika.
Ve svých článcích hodně mluvím o důležitosti optimalizace pro mobily. Proč tomu přikládám takovou důležitost?
protože mobilní provoz To je realita digitálního světa. Nyní je to důležitější než návštěvnost z desktopů. 51,3 % všech uživatelů internetu jsou uživatelé mobilních zařízení. Počet v budoucnu poroste.
Aktuální způsob přizpůsobení webu pod mobilní zařízení je responzivní web design s nenápadnými vyskakovacími okny.
Responzivní webový design zajišťuje správné zobrazení zdrojových stránek na jakékoli obrazovce: tablet, telefon, notebook. Dělá to výběrem šablon stylů a skrytím určitých prvků.
Všechny doporučené postupy optimalizace vyvinuté pro stolní počítače se navíc vztahují i na mobilní zařízení. Budu mluvit o jednom z nich - o rychlosti.
Proč je důležité myslet na rychlost
Uživatelé od webu očekávají rychlé načítání. Pokud zpomalí, ztratíte tuny provozu.
Dovolte mi uvést příklad výzkumu. Na otázku, zda jste narazili na stránky, jejichž načítání na mobilu trvá příliš dlouho, odpovědělo 73 % uživatelů kladně. 40 % z nich opustilo web, pokud se stránka načítala déle než 3 sekundy.
Existují studie, které ukazují, že lidé očekávají ještě rychlejší načítání stránek – doslova během mrknutí oka, tedy do 400 milisekund.
Nezapomínejme, že Google se zaměřuje i na rychlost načítání stránek. Jako hodnotící faktor používá rychlost.
Zjistěte rychlost načítání vašeho webu
Možná si myslíte, že se vaše stránky načítají dostatečně rychle. Ale může to být pomalejší, než si myslíte.
Jeden z nejlepší testy rychlost mobilního webu – Think With Google :
Testovat budeme na Amazon.com, protože se často používá z mobilních zařízení.
Proces analýzy trvá minutu nebo dvě.
Na konci analýzy uvidíte tři skóre:
V tomto článku jsou pro nás důležitá první dvě hodnocení: mobilní přívětivost a mobilní rychlost, tedy přizpůsobivost webu pro mobilní uživatele a rychlost stahování.
První skóre ukazuje, jak snadné je použití vašeho webu na mobilu. Toto je obecná metrika. Amazon si podle tohoto ukazatele vede skvěle. Ale je to špatné z hlediska rychlosti stahování.
Think With Google nabízí bezplatnou diagnostiku webových stránek. Doporučuji souhlasit s vypracováním podrobné zprávy a podívat se, co služba nabízí jako výsledek analýzy.
Vylepšete design svého mobilního webu
Vzpomeňte si na dobu, kdy jste navrhovali svůj web. Uvažovali jste o mobilních zařízeních? Stěží.
S největší pravděpodobností byl v té době na prvním místě desktop. Nyní však musíme přehodnotit přístup k designu s ohledem na nové skutečnosti.
Mobilní weby se za posledních pár let hodně změnily. V minulosti bylo běžné mít dvě verze webu – běžnou, desktopovou a mobilní. Ty byly snadno identifikovatelné podle subdomény „m.“:
V této situaci se weby pro mobily a počítače spravují odlišně. Lze je srovnat s McDonald's a McAuto. Desktop je restaurace McDonald's. Mobilní web je MakAuto.
To znamená, že mobilní verze je aplikace pro desktop, plní své úkoly, ale nemůže poskytovat služby a komfort, které poskytuje hlavní, desktopový web.
Ale teď to nestačí. Uživatelé zařízení chtějí ten nejlepší zážitek. Potřebují skvělé rychlý servis. Responzivní webdesign pomůže uspokojit jejich přání.
Responzivní webový design znamená schopnost webu měnit se v závislosti na tom, ze kterého zařízení se na něj přistupuje. Uživatelé mobilních prohlížečů a stolních počítačů tedy otevřou stejnou stránku, ale jak ji uvidí, bude záviset na zařízení použitém při načítání.
Google se tento přístup líbí, což potvrzuje i prohlášení společnosti: „ Adaptivní design je designový vzor, který Google doporučuje.“
Možná si říkáte: „Dobře, dobře. Ale jak mi může responzivní webdesign pomoci vyřešit problémy s rychlostí.
Responzivní web design obvykle umožňuje načítání webu rychleji než v případě mobilní verze. Jeho používáním získáte velkou výhodu v SEO.
Pokud tedy ještě nemáte responzivní webdesign, je na čase o něm začít přemýšlet.
Usnadněte si svůj web
Když má web hodně vizualizací, vypadá to, že vypadá skvěle. To usnadňuje zapojení uživatele.
Ale někdy je vizualizace příliš. V důsledku toho se web načítá pomaleji. Čím větší obrázek přidáte, tím déle bude načítání trvat.
Vývojáři tento stav nazývají bloat, neboli nafouklý software. Přeloženo do jazyka neprogramátorského uživatele, web je těžší kvůli redundantnímu kódu.
Ve většině případů je důvodem výskytu nadbytečného kódu přílišné zaměření designéra na vizuální prezentaci. Je to přehnané, protože je samozřejmě nutné myslet na krásný design. Zároveň by však účinnost webu neměla ustupovat do pozadí.
Naštěstí účinnost a krásná dekorace dokonale sladit. Pár tipů:
Zjednodušit
Leonardo da Vinci řekl, že: "Jednoduchost je konečný limit zážitku." Téměř o pět set let později jsou jeho slova stále pravdivá. Když se rozhlédnete kolem sebe, uvidíte, že vše složité kolem vás nahrazuje minimalistický design. To platí i pro webové stránky. Zejména mobilní, protože na obrazovkách přenosná zařízení příliš málo místa. Otočný prostor snadno přeteče. Přemýšlejte o tom, jak se vyhnout nepořádku.
Mobilní web obvykle potřebuje pouze jednu výzvu k akci na stránku. Takové omezení vám pomůže zkrátit kód a bude mít pozitivní dopad na uživatelskou zkušenost.
Zde je příklad jednoduchý design od Rug Doctor:
Okouzlující. Žádný extra lesk. Přitahuje pozornost.
K upoutání pozornosti uživatelů nepotřebujete jasné barvy a fotografie. Pokud jde o mobilní design, méně často znamená více.
Zkraťte si kroky
Čím méně toho musí návštěvník webu udělat, tím lépe.
Proč dělat 7 kroků mezi kupujícím a nákupem, když by stačily tři. Zkrácení prodejní cesty vám pomůže prodat produkt rychleji a zjednoduší proces pro samotného uživatele.
Tuto strategii využívá mnoho internetových obchodů. Jejich zkušenosti ukazují, že omezení stupňů trychtýře zvyšuje prodej.
Dovolte mi uvést Bodenův mobilní web jako příklad. Je velmi snadné si tam produkt koupit. Stačí vložit do košíku, vyplnit platební údaje, zaplatit.
Přímé a jednoduché. Nic extra.
Opět zkrácením kroků zkrátíme kód. Je těžké udělat to obrovské s minimem stránek na webu.
Použijte méně obrázků
Dobré obrázky jsou užitečné pro jakýkoli web. Uživatelé je mají rádi, pomáhají v SEO. Ale pokud se toho dobra stane příliš mnoho, přestane to být dobré.
Pro informaci: obrázky zabírají přibližně 63 % hmotnosti stránky.
Od roku 2011 do roku 2015 průměrná hmotnost mobilní stránka vzrostl třikrát.
Obrázky jsou nejnáročnějšími prvky stránky. Zabírají hodně místa. Příliš mnoho obrázků škodí.
Existují dva způsoby, jak zmenšit velikost obrázku:
- Ořízněte obrázek.
- Komprimujte obrázek.
Ta druhá možnost se mi líbí víc. Komprese zmenšuje velikost obrázku, neovlivňuje kvalitu, zkracuje dobu načítání stránky. Mimochodem, pro roboty vyhledávačů je také jednodušší procházet a indexovat stránku s komprimovanými obrázky.
Nepoužívejte vlastní písma
Mám rád krásné fonty. Většina z nich je ale velmi náročná.
Někteří jedí tunu CSS, jiní ztěžují JavaScript. V každém případě se budete muset vypořádat s obrovským kódem.
Minifikujte kód
Minimalizace je odstranění veškerých prvků, které nejsou potřeba pro správnou existenci kódu – nadbytečné mezery, tabulátory, prázdné řádky. Minimalizace pomáhá zvýšit rychlost načítání stránky.
