Van itt rengeteg nagyszerű eszközök, amiket az AMP HTML támogatja, ezekkel lehet együtt dolgozni, fejleszteni a weblapokat és a webáruházakat.
Ezért gondoltam írok tudnivalókat, és adok jó tippeket is, mert azokat is használtam már, felsorolom is, hogy miket. Egyelőre kizárólag csak ami weboldalhoz(websites) tartozik, azaz kihagyom ezeket: stories, ads, email.
Folyamatosan bővülnek vagy módosulnak, ezért érdemes visszalátogatni. Időpont szerint diktálva: 2020. augusztus 28.
Alkotás és dizájn
Instapage
Kizárólag csak landing Page-ra (érkezési oldalra) való, mely ez a készítő online szoftver segítségével a kattintás utáni élmények létrehozni, automatizáltan optimalizálni és szabni a személyre szerint szükségeseket, ami növelne a konverziók száma.
Csak annyi gond, hogy nagyrész feladatok nem igényel a fejlesztő szakemberre, hanem bárki létrehozhatja és elkészíthetje ezt. Inkább annak szólna, aki olcsóbb megoldást keres, azaz mint például kisvállalkozók.
Unbounce
Az is kizárólag csak landing Page-ra (érkezési oldalra) való, mely ez a készítő online szoftver a startupok, a kisebb vállalkozások és a marketing ügynökségek számára hasznosak.
Ilettve tud létrehozni az előugró ablakokat és ragacsos sávokat is.
Ezek közül melyiket használok / használtam?
- Egyiksem, még a közeljövőben sem fogok használni.
CMS és Platformok
WordPress (AMP-vel)
CMS-ek közül ez a WordPress a legnépszerűbb, ennek köszönhetően van lehetőség első tartalom létrehozása a WordPress erejével és rugalmasságával. Mellette rengeteg bővítmények is találhatóak, amiben támogatja ez az AMP-t, mint például: Woocommerce, Contact form 7, Yoast SEO, stb.
Magento (AMP-vel)
Ez egy nyílt forráskódú e-kereskedelmi platform és ezt legjobban támogatja az AMP.dev weboldalon szerint. Akár vérprofi webshop-okat (webáruházakat) elkészítheti, ami segítségével villámgyorsan meg fog jelenik az oldal. Sok termékek és egyéb cuccok miatt fontos és igen előnyök.
Bold by Quintype
Ez a maga is CMS, a digitális kiadói megoldások teljes készletét kínálja, amely nagy teljesítményű, könnyen használható és megbízható. Beépített támogatást is nyújtanak az AMP-hez.
Hátránya: ez a CMS egyelőre még nem népszerű, kevesen használják.
Google Search Console
Segít mérni a webhely keresési forgalmát és teljesítményét, kijavítani a problémákat, és javulni fog a webhelyen a Google Keresési eredmények között.
Google AMP Test
Nemcsak a szokásos HTML, hanem AMP HTML alatt is van lehetőség tesztelni, hogy ez az oldal jól megjelenik-e és hogyan szerepelne a Google keresőben.
Amikor minden rendben találja, akkor ezt ki fogja írni: “Az oldalnál megjelenhetnek az AMP-specifikus keresési funkciók a Google keresési eredményei között.” és igen zöld gombot kap az által készített weboldal.
Létezik a “Találatok előnézete”, amivel kiderítheti, hogy hogy fog kinézni a Google kereső listában megjelenése.
RebelMouse
Platformja páratlan oldalsebességet és méretezhető teljesítményt kínál.
PageSpeed Insights pontszámai eléggé magasak, az optimalizálással kapcsolatban annyi, hogy nincs sok munka vele, ezért a RebelMouse legkorszerűbb.
AMP-vel beépítve, még gyorsabban, mint villáman tölti be az oldalsebessége.
Gyors. Rugalmas. Biztonságos. Modern.
Ezek közül melyiket használok / használtam?
- WordPress
- Google Search Console
- Google AMP Test (Bár ez a demo oldalamhoz megadtam noindex-et, de ha módosítok erről az index-re és akkor zöld lesz az eredmény)
Fejlesztői eszközök
AMP Validator
AMP Validator
Az AMP fejlesztéséhez érdemes mindig vizsgálni, hogy a validátor szerint rendben van-e, ne legyen 1 apró hiba sem.
Experiment Configurator
Egyelőre még Beta verzió ez az új funkció, úgyhogy később tudok majd foglalkozni vele és átnézni őket.
AMP Tag Test
Ez egy olyan Audit eszköz, ami segítségével elemezi, hogy megfelelően be van-e állítva a Google Analytics és az AdWords követő dolgok.
AMP Toolbox
Az AMP eszközök gyűjteménye, amely megkönnyíti az AMP oldalak közzétételét és tárolását.
AMP Bench
Az is hibakeresési és érvényesítési eszköz, csak annyi különbség, hogy többen, mélyülésebben ellenőrzi.
AMP Insights
Ez egy Google Analytics irányítópult-sablon, aminek kizárólag csak AMP-nak szólna, amely elősegíti az elemzési betekintés gyorsabb elérését.
AMP Readiness
Ez egy Chrome-kiterjesztő program, ami segítségével ki lehet deríteni, hogy megfelelően be vannak-e állítva, amely a webhely AMP-re történő konvertálásának megvalósíthatóságát. (Pl.: Google Analytics, Google Tag Manager, Facebook, stb.)
AMP Boilerplate Generator
Generálja az egyedi sablonokat: weboldalra, történeteire, e-mailjeire vagy hirdetéseire.
Erről írtam cikket, itt megtekinthető.
AMP Playground
Ez egy élő, interaktív online szerkesztő program, mely segítségével akár sablonok vagy akár példák forráskódok szerkesztés mellette élőben meglehet nézni, hogyan jelenik meg. Végül forráskódot lel lehet másolni a weboldalba.
AMP Prototyper
Ez egy olyan Node.js alapú script egy prototípust készíte eszköz, amely automatikusan HTML-ról AMP-ra konvertálja. Ez az eszköz követi az általános irányelveit és megmutatja a teljesítménynövekedést.
VS Code Extension
Visual Studio Code szoftverhez kiegészítő program, mely segíti a hibákat keresi és figyelmezteti őket, ha talál.
Ampify.io
Aki nem szereti az AMP-ot, vagy nem érti, azoknak szól, mert ez olyan fejlesztési platform segítségével képes bármely HTML-ról AMP HTML-ra konvertálni. Legmodernebb megoldás a gyors és pontos HTML-AMP konvertáláshoz és telepítéshez.
Ezek közül melyiket használok / használtam?
- AMP Validator
- AMP Tag Test
- AMP Insights
- AMP Boilerplate Generator
- VS Code Extension
Összefoglalás
Ezeket 2-3 nap alatt témakörönként folyamatosan kb félóránként olvastam / átnéztem / megismerkedtem, végül megírtam őket. Illetve felsoroltam azokat is, amiket 3 év alatt (2017 nyár óta) használtam már.
Felhasznált források:
Korábbi minden cikkek, amelyek ez a technológiáról írtam
Az elmúlt években különböző, több témakörökben már írtam erről a programnyelvről, akkor a címkék közül kattintson az “amp” címkére és között megnézheti.
0 Megjegyzések