Nepochybne ste už počuli o prichádzajúcej vlne mobilného webu. Najbežnejšia vec, ktorú ste pravdepodobne počuli, je to, že prístup k mobilnému webu rýchlo rastie a asi polovica všetkého webového prenosu sa dnes deje prostredníctvom telefónu alebo tabletu. A Správa o február 2018 z Pew Research Center Upozorňujeme, že 95% všetkých Američanov vlastní mobilný telefón, zatiaľ čo podiel Američanov so smartfónmi je 77%.

Nemusíte hľadať ďaleko, aby ste videli vplyv mobilných zariadení. Pozerajte sa na svoje vlastné správanie a správanie svojej rodiny. V decembri 2016 comScore uviedol, že priemerný Američan nad 17 rokov strávil telefónom dve hodiny a 51 minút denne (Englais).

Statcounter.com poznamenáva, že globálny webový prenos pochádza hlavne z mobilných zariadení najmenej rok (51,95% vo februári 2018).

Aj keď si možno myslíte, že si nemôžete dovoliť vyvinúť natívnu aplikáciu pre mobilných používateľov na ukladanie do svojich telefónov, pre všetky podniky existuje skvelá alternatíva: Progresívne webové aplikácie. Možno ste už počuli o progresívnych webových aplikáciách (PWA) a o tom, ako ich ľudia používajú na rozvoj svojich firiem. V tomto článku sa dozviete niečo viac o PWA a o tom, prečo by ste mali v roku 2018 viac premýšľať o ich použití.

Niektoré definície

Progresívne webové aplikácie (PWA) sú kolekciou webových štandardov, ktoré pôvodne vyvinula spoločnosť Google na zlepšenie výkonu webových stránok v mobilných zariadeniach. Výsledkom je, že webové stránky fungujú skôr ako špecializované mobilné aplikácie, ktoré nájdete v Apple App Store alebo Google Play.

ďalšie definícia vývojári pre indický hotelový reťazec Treebo: „PWA sú jednostránkové aplikácie, ktoré sú postupne vylepšené funkciami, ktoré poskytujú pohlcujúcejší natívny zážitok. »

Ak to trochu znížime, PWA na mobilných zariadeniach umožňujú vašim čitateľom a zákazníkom rýchlo načítať domovskú stránku vášho webu a používať veľa rovnakých funkcií na mobilnom zariadení, aké by používala natívna aplikácia. Vaša stránka môže existovať mimo prehľadávača, aj keď zariadenie nie je pripojené k internetu.

Iné definície

Niektoré z kľúčových technických častí PWA zahŕňajú:

Pracovníci služieb sú kľúčovou technológiou spojenou s PWA. Umožňujú PWA pôsobiť mimo siete.

Zjavenie súborov obsahujú ikonu a názov, ktorý spája aplikáciu v zariadení s webové stránky. Vývojár tu môže tiež pridať dizajnové prvky, aby zlepšil vašu zákaznícku skúsenosť.

Push upozornenia komunikovať s vašimi používateľmi (s ich povolením), aby sa vrátili.

Niektoré dôvody

Prečo by teda vaša stránka mala obsahovať PWA? Je to dosť priame.

Lepší výkon - dokonca aj na stolnom počítači!

Viete, že na výhru máte obmedzený čas návštevník prvýkrát – šesť sekúnd načítania predtým, ako potenciálny zákazník odíde a navštívi ďalšiu stránku vo výsledkoch vyhľadávania. Používatelia mobilných zariadení sú ešte netrpezlivejší – polovica vašich potenciálnych používateľov odíde, ak sa stránka načítava dlhšie ako 3 sekundy!

Dobrá správa: zmeny, ktoré urobíte na vytvorenie progresívnej webovej aplikácie, zrýchlia váš web!

Príklad: Indická hotelová spoločnosť Treebo znížila svoj čas nabíjania mobilných telefónov zo šiestich sekúnd na 1,5 sekundy vytvorením svojho PWA. Stránka sa teraz načíta na plochu za sekundu! Ich technický tím uviedol, že hodnotenie stránok sa zlepšilo a mesačný konverzný pomer sa viac ako zdvojnásobil!

Kapacita offline

Na to PWA nemusí byť na internete. Vaši používatelia majú prístup k celému obsahu aplikácie zo svojho zariadenia alebo počítača.

Jednou z najkrajších vecí na PWA je v skutočnosti to, že váš zákazník môže uložiť web na domovskú stránku svojho zariadenia a neskôr ho použiť na zakúpenie vášho produktu alebo na získanie ďalších informácií. .

Napríklad, CNET Tech Today ponúka denný súhrn technologických noviniek, ktoré sú každodenným chlebom stránky. Ak otvoríte web pomocou prehliadača Google Chrome na zariadení s Androidom a posuniete sa nadol do dolnej časti obrazovky, zobrazí sa toto:

Pridajte PWA na mobilnú domovskú obrazovku. Nie je potrebný žiadny obchod s aplikáciami!
Pridajte PWA na mobilnú domovskú obrazovku. Nevyžaduje sa žiadny obchod s aplikáciami!

lis Pridať na domovskú obrazovku na stiahnutie progresívnej webovej aplikácie Tech Today do vášho zariadenia. Klepnutím na ikonu načítate prvých 10 aktuálnych príbehov. Prejdením doľava si prečítate každý príbeh. Klepnutím na logo CNET otvoríte vo svojom prehliadači domovskú stránku CNET.

Poznámka : Vo Firefoxe majú weby s PWA ikonu „Pridať na domovskú stránku“ (znamienko plus v malom poli) priamo na paneli s adresou. Ak je PWA už nainštalovaný, logo Androidu v paneli s adresou vás zavedie na PWA.

Jedna vec, ktorú váš web nepotrebuje: miniaplikácie „Stiahnite si našu aplikáciu“ zaberajú miesto na vašej stránke (zvyčajne s logami iTunes a Android, ktoré rušia používateľov). Ak prehliadač Chrome zistí, že používateľ otvoril vaše stránky PWA niekoľkokrát týždenne, zobrazí sa výzva na ich pridanie. Aktualizácie sú tiež automatické.

Nie je potrebné zložité programovacie jazyky

Možno ste uvažovali o vytvorení natívnej mobilnej aplikácie pre vašu firmu, no zistili ste, že zostavenie mobilnej aplikácie je iné zviera ako zostavenie a webové stránky. Ak na údržbe svojich stránok spolupracujete s agentúrou zaoberajúcou sa webovým dizajnom/vývojom, nemusí mať nevyhnutne zručnosti na vytvorenie aplikácie pre bežných mobilných predajcov.

Aby sa váš softvér mohol zobraziť v Apple App Store, musia sa vaši vývojári zaregistrovať v sieti Apple Developer Network, používať nástroj Apple Developer Tool (ktorý funguje iba v počítačoch Mac) a ovládať jazyk Programovanie schválené spoločnosťou Apple: Swift alebo Cieľ C.

Programovanie pre Android je o niečo jednoduchšie (nie je potrebné schválenie vývojárom), ale drvivá väčšina aplikácií pre Android je napísaná v jazyku Java, ktorý sa dá naučiť ťažko.

Aby sa aplikácia mohla zobraziť v online obchodoch Apple alebo Android, musí mať dokončená aplikácia súhlas od správcov príslušného obchodu.

Naproti tomu progresívne webové aplikácie sú postavené na populárnych webových jazykoch: HTML, CSS (kaskádové štýly) a JavaScript. Stručne povedané, aj nováčikoví weboví vývojári môžu vytvárať vysoko kvalitné PWA.

Konkrétne nepotrebujete veľké počítačové vzdelanie, aby ste mohli robiť PWA pre svoj web WordPress. Ak ste už zmenili formátovanie svojich stránok pomocou podradenej témy, môžete tiež vytvoriť súbor PWA. Problematike kódovania sa budeme venovať v inom článku.

Zvýšiť podporu technologických gigantov

Normy sa dlho stávajú normami. Spoločnosť Google prvýkrát propagovala PWA v roku 2015.

Chrome bol dlho jediným prehliadačom, ktorý podporoval PWA, ale to sa čoskoro zmení. V posledných mesiacoch:

  • Mozilla pridala podporu PWA do prehliadača Firefox 58
  • Spoločnosť Apple nedávno oznámila podporu webových aplikácií v systéme iOS
  • Spoločnosť Microsoft bude podporovať PWA v budúcej verzii systému Windows 10, ktorá bude k dispozícii koncom tohto roka (2018).

Spoločnosť Microsoft ide nad rámec iných dodávateľov operačných systémov a uviedla, že „vysoko kvalitné“ PWA budú čoskoro integrované do obchodu s aplikáciami pre Windows 10 na mobilných telefónoch a desktopoch.

WordPress a PWA

WordPress zatiaľ úplne nepodporuje vytváranie progresívnych webových aplikácií v základnej aplikácii. Tím Jetpack sa zaviazal pridať v budúcom roku funkčnosť PWA. Pomáha tomu Javascriptová aplikácia WordPress.

Jetpack „Postupne zavádza funkcie PWA hneď, ako sú pripravené,“ hovorí vývojár Dan Walmsley v článku na blogu WordPress VIP . Vývojári môžu súbory manifestov pridávať pomocou modulu manifestu Jetpack od verzie 5.6.0 a zaviedli progresívne načítanie obrázkov, vďaka čomu sa načítanie stránok zrýchľuje aj v prípade, že je na nich veľa obrázkov. strana. Ďalšie funkcie prídu tento rok.

Niekoľko doplnkov sa snaží pridať funkčnosť PWA, ale ešte sa veľmi neprijalo.

  • Nástroj na optimalizáciu WordPress poskytuje funkčný a manifestný nástroj.
  • Superprogresívne webové aplikácie okrem iných funkcií generujú manifest a tlačidlo Pridať na domovskú obrazovku.
  • Balík WordPress Mobile Pack tiež obsahuje funkcie PWA

Ako použijete PWA?

V tomto návode ste sa dozvedeli niečo málo o progresívnych webových aplikáciách a prečo by ste ich mali pridať do aplikácie webové stránky vašej spoločnosti:

  • Rastúca vlna premávky mobilných zariadení
  • Lepší výkon pre vaše webové stránky - mobilné aj stolné
  • Dostupnosť, aj keď je zariadenie offline
  • Používa štandardné webové funkcie: HTML, CSS a Javascript. Lacnejšie stavať
  • Zvýšená podpora pre prehliadače a operačné systémy

Možno teraz chcete vedieť, ako urobiť PWA vo WordPress? Alebo ukážte vývojárom, ako na to? Toto bude predmetom ďalšieho tutoriálu.