A keresési promóció költsége és annak eredménye attól függ, hogy az oldalt hogyan adaptáljuk mobileszközökhöz.

A könyvjelzőkhöz

Dmitry Mrachkovsky, az Ashmanov & Partners optimalizálója elmondta, hogyan válasszunk az adaptív és a mobil webhely között, és milyen nem nyilvánvaló problémákkal kell szembenéznie.

A reszponzív és mobil webhelyek előnyei

Nehéz egyértelműen válaszolni arra a kérdésre, hogy az okostelefonokhoz és táblagépekhez melyik adaptációs technológia a hatékonyabb SEO szempontjából. Még a nagy játékosok között sem vettem észre előnyt valamilyen döntés mellett. Az M.Video, a DNS, a Wildberries, az Aviasales adaptív elrendezést, a Lamoda, 220 Volt, Ulmart, Yandex.Market pedig mobilwebhelyeket használ. De nézzük meg, milyen előnyökkel jár az első és a második.

Az "M.Video" webhely adaptív elrendezése és a "220 Volt" webhely mobil verziója

A reszponzív elrendezésnek köszönhetően nem kell külön mobil verziót kifejleszteni. Ennek vannak előnyei:

  • Nincs szükségünk külön oldalszerkezetre a megjelenítéshez mobil eszközök. Elegendő az oldal asztali verzióját ezzel javítani CSS használatával.
  • Az asztali és mobil verziók esetében egyetlen URL-címet használnak. Ezért az oldal tartalma nem duplikálódik, az oldalak nem versenyeznek egymással, és a promóciós munka befolyásolja a helyezést az asztali és mobil keresésekben.

A mobil verzió költségesebb és rugalmasabb megoldás. A főoldal befolyásolása nélkül szerkeszthető. Ez a következő előnyöket nyújtja:

  • A mobilwebhelyek a lehető legegyszerűbben és leggyorsabban betölthetők, ha kódszinten eltávolítják a felesleges funkciókat.
  • A felület továbbfejleszthető a mobil felhasználók számára, ha olyan funkciókat adnak hozzá, amelyek nem voltak elérhetőek a webhely asztali verziójában.
  • A felhasználó bármikor átválthat a webhely fő verziójára mobileszközén, ha akar.

Még egy technológiát szeretnék megemlíteni - a RESS-t. Eszköztől függően asztali vagy mobil sablont jelenít meg a felhasználónak, de az oldal URL-je nem változik. A RESS egyesíti a fent leírt adaptív és mobil változat előnyeit. De van két hátránya is: bonyolult és költséges megvalósítás, valamint hibák a ritka és népszerűtlen telefonmodellek azonosításában.

Problémák a reszponzív elrendezéssel

Az Adaptive gazdaságos és kényelmes megoldás, de a tekintetben keresés promóciója több buktatója van.

Az adaptív félreértelmezése

Egyesek helytelenül alkalmazzák az adaptív elrendezést, és egyszerre két sablont jelenítenek meg egy oldalon a kódban – asztali számítógépen és mobilon. A felhasználó eszközétől függően a kód kívánt része látható marad, míg a többi el van rejtve a kijelző segítségével: nincs . Ez három problémát vet fel:

  1. Minden tartalmi elem kétszer töltődik be: szövegek, képek, H1 és H6 címsorok, navigációs útvonalak, kapcsolódó és kiemelt termékek stb. A keresőmotorok pedig nagyon nem szeretik a duplikációkat.
  2. A tartalom fel nem használt részeit a CSS elrejti. A keresőmotorok véleménye ebben a kérdésben kétértelmű. A Google kijelentette, hogy figyelmen kívül hagyja a rejtett blokkok tartalmát, a Yandex pedig azt, hogy figyelembe veszi az oldal teljes tartalmát. A legtöbb SEO-szakértő egyetért abban, hogy egy ilyen rendszer a büntetés kockázatával jár.
  3. A kód megkettőződik, és a webhely lassabban töltődik be.

Az ilyen megvalósítás a RESS technológia helytelen megközelítése.

A szükségtelen elemek elrejtése

Interfész elkészítéséhez adaptív változat kényelmesebb, egyesek megszabadulnak a funkciók egy részétől: zavaró blokkok, nagy szövegek katalóguskategóriákban stb. Minden felesleges el van rejtve a kijelző segítségével: nincs . De a probléma az, hogy az összes kódot felhasználják az oldal betöltésére, és az oldal lassú. Ezenkívül, amint fentebb említettük, a keresőmotorok ellentmondásosan viszonyulnak az ilyen tartalmakhoz – fennáll a veszélye annak, hogy szankciók alá esnek.

A JavaScript helytelen használata

Egyesek JS-t használnak, hogy elkerüljék a szükségtelen blokkok megjelenítését a mobileszközökön. De ez a módszer semmivel sem jobb, mint a megjelenítés: none . Fennáll annak a veszélye, hogy a keresőmotorok még az asztali verzióban sem indexelik a nekik szánt tartalmat. A keresőmotorok általában nem mindig érzékelik megfelelően az AJAX tartalmat, különösen akkor, ha a helyes indexelés számos feltétele nem teljesül.

Miért használnak még mindig reszponzív dizájnt az emberek?

Az adaptív választást általában két fő előny vezérli: a webhely csak egy verziójának fejlesztése és a több URL-lel kapcsolatos problémák hiánya.

Kényelmes megoldás több régióban történő promócióhoz is. Minden erőfeszítésünket egyetlen domainre összpontosítjuk, és eredményeket érünk el az asztali és mobil keresésekben. Ehhez össze kell kapcsolnia az érdekes régiókat a Yandex.Directory webhelyével.

A Google számára pedig hozzon létre egy oldalt a fióktelepek címeivel, hogy a kereső megértse, mely régiókban dolgozik. Adaptív elrendezés egyetlen domain nagyon sikeresen használja az M.Video-t. Az áruház előkelő helyet foglal el a mobil és asztali számítógépes találatok között a termék-, kategória- és információs lekérdezésekben.

Megteheti a másik utat is – használja a földrajzi aldomaineket az oldalak szöveges relevanciájának növelésére. Ebben az esetben az olyan aldomainekhez, mint az spb.site.ru, samara.site.ru, kazan.site.ru a Yandex.Webmasteren keresztül régiókat rendelnek, majd a címeket és a metacímkéket a helynévvel. További előny, hogy könnyen beállítható külön elemzés a földrajzi aldomainekhez az eredmények régiónkénti nyomon követéséhez. Ezt a promóciós módszert a MediaMarkt gyakorolja.

Problémák a webhelyek mobil verzióival

Nem a viszonylag magas fejlesztési költség a mobiloldalak egyetlen hátránya. Az alábbiakban felsoroljuk azokat a kevésbé nyilvánvaló problémákat, amelyekkel találkozhat a technológia kiválasztásakor.

Dupla promóciós munka

A mobiloldalt a főoldaltól külön optimalizálják és reklámozzák, és ez több erőforrást igényel, mint az adaptív esetében. Az optimalizálást ezzel kell kezdeni mobil verzió megfelelően volt indexelve, és nem versenyzett az asztali változattal. Ehhez kapcsolja össze őket a Yandex.Webmasterben és a Search Console-ban, állítsa be a megfelelő rel="alternate" attribútumokat, állítsa be az indexelést és az XML-leképezés generálását.

Káosz a tartalom abszolút linkjei miatt

Asztali és mobil sablonok az esetek 99%-ában egy adatbázisból töltenek le tartalmat. Ha használ abszolút linkek az asztali oldal belső oldalára, megjelölve a protokollt és a domaint, ezek a mobil oldalon is megjelennek. Ha rákattint egy linkre, a következő két forgatókönyv valamelyike ​​fog bekövetkezni:

  • Ha az asztali verzióban van felhasználói ügynök, a felhasználó az oldal mobil verzióját fogja látni.
  • Más esetekben a felhasználó egy asztali oldalt lát, és a mobil verzió létrehozásának munkája hiábavaló lesz.

Ebben az esetben az oldal belső linksúlya sérülhet. A probléma elkerülése érdekében használja a tartalomban relatív linkek. Vagyis a href attribútumnál a https://site.ru/page/ helyett a /page/ értéket adja meg.

Az asztali és mobilwebhelyek tartalma és szerkezete eltérő lehet. Ezért logikus, hogy mindkettő tartalmát indexeljük a keresésben a hibák elkerülése érdekében. A Google azt javasolja a mobil verzióban, hogy jelezze, hogy az asztali webhely tartalma kanonikus. Másrészt a kereső azt mondja, hogy a nem kanonikus oldalak tartalmát nem veszi figyelembe.

A Yandex esetében ebben a tekintetben minden világos - külön indexeli a mobil és az asztali oldalak tartalmát. Ehhez csak állítsa be a rel="alternate" attribútumot a fő verzióról a mobilra, és az asztali verzióról a mobilra 301-es átirányítást is beállíthat, figyelembe véve az eszköz felhasználói ügynökét.

A mobil-first index nem egyértelmű követelményei

A mobil-első indexre való átállás előkészítése érdekében logikus, hogy a webhely mobil verzióját válassza ki kanonikus oldal. Igaz, van néhány kétértelműség a mobil-elsőként vonatkozó ajánlásokban. A Google irányelvei például kimondják, hogy a mobil és az asztali verziók tartalmának hasonlónak kell lennie, de nem árulják el a „hasonlóság” mértékét.

De mi van akkor, ha az asztali keresésben a rangsoroláshoz szükség van egy bizonyos tartalomblokkra, ami a mobil verzióban felesleges lesz, de a mobil verzióé lesz az elsőbbség?

Részlet a Google mobilwebhelyek indexelésére vonatkozó útmutatójából

Részlet a Google jelentéséből a mobil-first index megvalósításáról

A turbó oldalak esztelen használata

Egyes keresőmotorokat válogatás nélkül újítanak meg, azzal az elvárással, hogy befolyásolják a helyezéseket. Például a Yandex turbó oldalai, amelyek nem helyettesítik a teljes értékű mobiloldalakat a keresésben, a felhasználói funkciók egy kis részét tartalmazzák, és kevésbé konvertálnak. Ha van egy kereskedelmi webhelye, és magabiztos a mobil verzió minőségében, ne rohanjon a "turbó" bevezetésével - még a cikkeket és véleményeket tartalmazó oldalak esetében sem.

A külső hivatkozások hatásának csökkentése

A linkek továbbra is fontosak a rangsoroláshoz, különösen a Google keresőben. Ha van mobilaldomainünk, néhány felhasználó elkezdi hivatkozni rá a közösségi hálózatokon és fórumokon. A másik rész pedig a fő webhely címére mutató hivatkozásokat használ. Ennek eredményeként a linkek kevésbé teljesítenek a mobilos és asztali keresésekben, mintha egyetlen domainnel rendelkeznénk.

A promóció jellemzői a régiókban

Fentebb az adaptív regionális népszerűsítésének két módjáról beszéltünk - egyetlen domain és földrajzi aldomainek használatával. Fontolja meg ezeket a lehetőségeket a mobil verziókhoz.

Az első esetben a fő domaint és az m.site.ru mobilaldomaint hirdetjük. Mindegyiküknek be kell állítania a régiókat a Yandex.Directory segítségével. A probléma az, hogy néha lehetetlen önállóan összekapcsolni a webhely mobil verzióját a fiókkal. Fel kell vennie a kapcsolatot a technikai támogatással, de ez nem garantálja az eredményt. Nem hozhat létre külön szervezetet a webhely mobil verziójához. Ezért ha sok ág van, a kötés sokáig tarthat.

Általában kizárjuk az olyan aldomainek használatát, mint az m.spb.site.ru vagy az spb.m.site.ru. Bár például a Kholodilnik.ru használja. Ebben az esetben azonban be kell állítania a címzést a mobil és asztali verziók minden régiója között, naprakészen kell tartania azokat, nyomon kell követnie a változásokat, és figyelnie kell a webmesterek szolgáltatásait. Ez egy hatalmas munka, amely valószínűleg nem térül meg.

Mobil alkalmassági ellenőrzés benyújtása

Ha nem küldi el webhelyének optimalizált verzióját a Yandex.Webmasternek mobilbarát jellegének tesztelésére, előfordulhat, hogy az nem jelenik meg a mobil keresési eredmények között. A probléma az alkalmazkodásra is vonatkozik. Ez nem mindig történik meg, de azt javaslom, hogy kövesse a Webmester üzeneteit.

A Yandex technikai támogatásával folytatott kommunikáció töredéke a webhely mobil verziójához való régió hozzárendeléséről

Miért használnak mobil verziókat?

A mobil verziók fő előnyei természetesen a külön sablon létrehozásának lehetősége és a nagy letöltési sebesség. Ráadásul a régi oldalaknak könnyebb külön mobil verziót létrehozni, mint adaptívat megvalósítani.

Emellett számos SEO-szakértő észlelte a keresési forgalom növekedését az adaptív helyett egy mobilwebhely bevezetése után. Bár nem tartom kizártnak, hogy a növekedés oka az volt, hogy az adaptív elrendezésükben olyan hibák voltak, amelyek negatívan befolyásolták a helyezést.

Melyik opciót válasszuk

Ha a semmiből fejleszt egy weboldalt, vagy van egy kis projektje, akkor nézze meg közelebbről az adaptív elrendezést. Ez gazdaságosabb és gyorsabb megoldás. De jobb, ha azonnal megtervezi a funkcionalitást, hogy ne kelljen elrejteni a webhely egy részét a jövőben a mobileszközökön való megjelenéstől.

Ha előnyben részesíti a felhasználói élményt, válassza a mobil verziót. Az asztali számítógépre gyakorolt ​​következmények nélkül módosítható. Ez akkor fontos, ha a webhely vezető pozíciót foglal el a saját szegmensében az asztali kiadások terén.

Használhatja a RESS technológiát is, de ne feledje, hogy ebben az esetben a Google a mobil verziót részesíti előnyben.

Részlet a Google webhelyek RESS használatával történő indexeléséhez című útmutatójából

Bármelyik technológiát is választja, próbáljon meg meggyőződni arról, hogy a webhely és annak verziói megfelelően indexelve, a lehető leggyorsabban betöltődnek, és minden eszközön problémamentesen megjelennek.

Köszönet a SEO szakértőknek

A mostani cikkben az oldal mobil verziójának ellenőrzéséről, kényelméről, olvashatóságáról és helyes megjelenítéséről lesz szó.

Webhelyének ellenőrzése a mobileszközökön való megjelenítés kényelme érdekében különféle webszolgáltatások segítségével ellenőrizhető. Különösen, ezt a szolgáltatást a Google-tól lehetővé teszi, hogy megfelelően felmérje mobilelrendezése műveltségét.

Nemrég Google kijelentette, hogy azok az oldalak, amelyek nem felelnek meg a mobil elrendezés követelményeinek, pesszimizáltak lesznek a mobileszközökkel végzett keresésekben. Ez az algoritmus már működik, és vannak olyan webhelyek, amelyeken nem vették a fáradságot, hogy megjelenjenek mobil platformok ah, valóban, kimaradtak Keresési eredmények mobil eszközökhöz.

Ha webhelye háromszor kényelmes az asztali platformok számára, ellenőriznie kell a mobil elrendezés minőségét, különben a forgalom lenyűgöző részét elveszíti (a mobilplatformok aránya a keresésben évről évre gyorsan növekszik), ami azt jelenti, hogy elveszíti ügyfeleit. Ezért webhelyeit mobileszközökhöz kell igazítania, és ellenőriznie kell a webhelyek megfelelő megjelenítését a mobilböngészőkben.

A mobil elrendezés minőségének ellenőrzése a Google Chrome segítségével

A fejlesztők számára a Google remek mobil szimulációs eszközzel rendelkezik. Ez az eszköz be van építve Google böngésző Króm. A hozzáféréshez nyomja meg a gombot F12 a böngészőben (váltson fejlesztői módba), és kattintson az okostelefon ikonjára:

Az oldal átvált eszközváltási módba, ahol a népszerű mobil eszközök közül választhat egyet, a hálózat típusát (GPRS, 2G, 3G, 4G stb.), szigorú megjelenítési beállításokat adhat meg. Ez lehetővé teszi, hogy szimulálja a webhely működését konkrétan mobil eszközök. A rendelkezésre álló eszközök különbözőek iPad verziók, iPad mini, iPhone, BlackBerry, Google Nexus, HTC, LG, Nokia, Samsung Galaxyés néhány más népszerű eszköz.

Egy adott eszköz kiválasztásával mobileszközön is ellenőrizheti a webhelyet. Például a "Nubex" webhely főoldalának megjelenítése iPad 3-on:

És a Samsung Galaxy S4-en:

Itt nem csak az oldal megjelenítését láthatja egy adott eszközön, hanem teljes mértékben együttműködhet az oldallal, mintha a megfelelő kütyü állna Ön előtt. Kétségtelen, hogy ez az eszköz egyszerűen nélkülözhetetlen a webhely mobil verziójának fejlesztéséhez, de azt, hogy webhelye hogyan jelenik meg valódi eszközökön, valódi eszközökön kell ellenőrizni. Ez különösen fontos, ha ellenőrizni kell a webhely megjelenítését "natív" böngészőkben (Safari - iPad / iPhone, IE - Windows telefon stb.).

A webhely mobil verziójának fejlesztésének költsége - 15 000 rubeltől

A mobileszközök életünkben való megjelenésével sok minden megváltozott - különösen az internethez való sürgősségi hozzáférés lehetőségei jelentősen bővültek. Most már egyáltalán nem szükséges, hogy laptop vagy személyi számítógép legyen az összefoglaló áttekintéséhez. legfrissebb hírek vagy látogasson el az Önt érdeklő cég weboldalára. Ehhez elég, ha kéznél van egy okostelefon.

Így tendenciát mutat az internet mobil közönségének növekedése, ami azt jelenti, hogy módosítani kell az Ön weboldalát, vagyis cégének képviseletét a világhálón.

Mi az oldal mobil verziója

A legtöbb modern webhely hibásan jelenik meg a mobileszközök és táblagépek képernyőjén. A használt kütyü fizikai képernyője hagyományosan kis méretű, tehát a képernyőn lévő oldal személyi számítógép tökéletesen néz ki, teljesen alkalmatlan okostelefon képernyőjén való megtekintésre.

Tulajdonképpen, mobil verzió fejlesztése egy külön projekt, amely magában foglalja az alkotást speciális kialakítás, használhatóság fejlesztés, elrendezés és tartalomoptimalizálás. A tervező fő feladata, hogy a lehető legpontosabban közvetítse a cég főbb gondolatait, és egyben egy kis képernyőn belül illessze azokat.

Egyes esetekben az oldal tartalma lecsökken, így csak a legfontosabbak maradnak meg. Változik a szerkezet és a funkcionalitás is, csak a stilisztikai kialakítás, egyes elemek és a tartalom marad változatlan.

Az oldal mobil verziója lehetőség az üzleti problémák teljes körű megoldására. Ezen a verzión belül például olyan eszközspecifikus funkciókat lehet megvalósítani, amelyek a PC-felhasználók számára nem elérhetők. Mindez hozzájárul a forgalom növekedéséhez azáltal, hogy növeli webhelye vonzerejét a mobil felhasználók számára.

Hogyan részesítette előnyben az internetes közönség az okostelefonokat a személyi számítógépekkel szemben

A bulvárlapok irigylésre méltó rendszerességgel forgatják a címszavakat a következő kategóriákból: „Az internetezők tömegesen vándorolnak az okostelefonok felé”, „Az orosz felhasználók a mobilinternetre mennek”. Mondanom sem kell, bőven van alapja az ilyen kijelentéseknek.

A Mediascope kutatócég szerint 2017-re az oroszországi mobilinternet-felhasználók közönsége elérte a 66 millió főt, ami a lakosság 54%-a. Ráadásul 16%-uk kizárólag mobilinternetet használ.

Azt is meg kell jegyezni, hogy az okostelefonok internetes közönsége nagyon gyorsan növekszik, miközben a számítógépes internetes szörfözés továbbra is folyamatosan veszít teret. Per Tavaly 4%-kal csökkent azoknak az oroszoknak a száma, akik asztali számítógépet használnak a hálózathoz való hozzáféréshez.

Mint látható, a korszak mobilinternet, és ha webhelye továbbra sem felel meg kényelmes megtekintés mobil eszközökről, ez nagyon komoly mulasztás.

Miért fontos a mobil webhely a vállalkozás népszerűsítéséhez?

Webhelye még mindig nem mobilbarát? Egy hétköznapi internet-felhasználó, aki azonnal meg akarja kapni a szükséges információkat, valószínűleg elhagyja őt, és nem tudja elviselni az ilyen kellemetlenségeket. Mi fog ezután történni? Azonnal megnyílik a közvetlen versenytárs oldala, aki a mobilközönség érdekeiről gondoskodott.

A legtöbb cég számára a webhely mobil verziójának elérhetősége - egyáltalán nem mai trend, hanem sürgető igény, amely a következőképpen fejeződik ki:

  • A webhely promóciójának hatékonysága. A Google képviselői szerint azok az oldalak, amelyek nem rendelkeznek mobilverzióval, eleve lejjebb kerülnek az okostelefonok képernyőjére adaptált webes forrásokhoz képest. Így az oldal mobil verziója ma már nemcsak lehetőség a nagyobb forgalom vonzására, hanem előfeltétele is az oldal sikeres internetes népszerűsítésének.
  • Kényelem a felhasználók számára. Az internetezők 40%-a őszintén bevallja, hogy másik oldalra vált, ha az őt érdeklő oldalnak nincs mobil verziója. Üzleti szempontból óriási összegről esik le. potenciális ügyfelek ha cége weboldala nem erre való mobiltelefonokés tabletták.
  • Ragyogó hírnév. Webhelyének helytelen megjelenítése egy modern kütyü képernyőjén jelentős hátrány, és garantáltan szemrehányó megjelenést jelent az internethasználó számára. Másrészt a mobil verzió jelenléte egyfajta "plusz a karmához" és a cégről alkotott helyes kép fenntartása.
  • Versenyelőny.Észrevette, hogy versenytársai webhelyének nincs mobil verziója? Ideje kihasználni ezt a gyújtáskimaradást, és erős versenyelőnyt szerezni, nevezetesen olyan ügyfeleket szerezni, akik elhagyják üzleti ellenfelei nem reagáló webhelyeit.

Hogyan lehet "barátkozni" egy webhelytel mobil eszközökkel

Kétféleképpen lehet megoldani a webhely okostelefonokon való helyes megjelenítésének problémáját:

  1. Hozzon létre egy külön verziót a webhelyről, amely az eredeti verzió alternatívájaként fog létezni.
  2. Teremt adaptív kialakítás, amely képes automatikusan igazodni bármilyen képernyőmérethez.

Ha céged weboldala már létezik, és nincs kedved újratervezni, ugyanakkor szeretnéd növelni az oldal lojalitását a mobil eszközök iránt, akkor megéri a megrendelést mobil verzió fejlesztése. Ebben az esetben csak az okostelefon-tulajdonosok számára hasznos tartalmat lehet menteni.

Ha az oldal még csak most készül, és azonnal foglalkozni szeretne az internetes közönség érdekeivel, akkor az adaptív kialakítást részesítse előnyben. Kész helyszín esetén az adaptív kialakítás létrehozása a folyamat magas munkaintenzitását és ennek megfelelően magasabb költséget von maga után.

Az oldal mobil verziója az "Aspect" webstúdiótól: a fejlesztés költsége

A mai napig csak az oldalak egy része van adaptálva mobileszközökkel való együttműködésre, ami azt jelenti, hogy még mindig van esélye visszanyerni a forgalomból való részesedését. Az oldal mobil verziójának fejlesztését az Aspect webstúdió kínálja Önnek.

Ennek a szolgáltatásnak a költsége 15 000 rubeltől. Mobil verziót készítünk a meglévő oldal alapján, és csak a legjobb szakembereket vonjuk be ebbe a feladatba.

A munka költsége tartalmazza:

  • Új oldalak prototípusa.
  • Mobil design fejlesztés.
  • Elrendezés.
  • Az oldal mobil verziójának programozása és összekapcsolása a fővel.

Mennyi ideig tart egy mobil verzió elkészítése?

Átlagosan a webhely mobil verziójának fejlesztése szükséges 10 munkanaptól. A konkrét kifejezések a munka mennyiségétől, azaz a webhely oldalainak számától és a rajtuk megjelenő információk típusától függenek.

Csökkentheti a határidőket, ha csökkenti azoknak az oldalaknak a számát, amelyeket „át kell vinni” az okostelefonok képernyőjére – ezek lehetnek olyan oldalak, amelyek másodlagos, a mobilinternetezők számára értéktelen információkat nyújtanak.

Hogyan zajlik a mobil verzió fejlesztése webstúdiónkban?

Munkánk algoritmusa a következőképpen ábrázolható:

  1. Jelentkezésed mobil verzió fejlesztésére (telefonon, e-mailben).
  2. Találkozó és a projekt megbeszélése a vezetővel.
  3. A munkakör értékelése és a szolgáltatás pontos költségének kiszámítása.
  4. A szerződés elkészítése és aláírása.
  5. Fizetés és munkakezdés.
  6. Az oldal mobil változatának kialakítása.
  7. A tervrajz átvételi okiratának egyeztetése, aláírása.
  8. Mobil verzió elrendezése.
  9. Tartalomátvitel.
  10. A projekt átadása.

Meggyőződése, hogy szükség van egy mobil verzióra, és szeretné megrendelni a fejlesztését? A Web Studio "Aspect" mindig a legújabb trendekre összpontosít, és készen áll arra, hogy professzionális segítséget nyújtson webhelye "mobilizálásában".

A mobileszköz-robbanás megjelenésével a fejlesztők választás előtt álltak: megtartsák webhelyeik mobil verzióit a „teljes értékűek” mellett, vagy az oldalak váljanak reszponzívvá és alkalmazkodjanak a különböző képernyőméretekhez?

Jelenleg a webhelyek mobilverzióinak készítése során három fő módja van ezek létrehozásának:

  • Adaptív kialakítás;
  • Az oldal külön mobil verziója;
  • RESS (Responsive Design + Server Side).
Mindegyik módszernek megvannak a maga előnyei és hátrányai, amelyeket megpróbálok részletesen leírni.

Adaptív kialakítás

A CSS3 médialekérdezéseket általában az adaptív tervezés megvalósítására használják. A képernyő méretétől függően a felhasználó más képet fog látni:

@média képernyő és (max. szélesség: 1600px) ( div.például (szélesség: 1500px;) ) @média képernyő és (max. szélesség: 1280px) ( div.például (szélesség: 1100px;) ) @media képernyő és (max. szélesség: 1024 képpont) ( div.például (szélesség: 980 képpont;) )

A reszponzív tervezés előnyei
  • Könnyű fejlesztés - Az adaptív elrendezéssel a webhely teljes szerkezete automatikusan alkalmazkodik a különböző képernyőszélességekhez. Ahhoz, hogy működő terméket kapjunk, nem kell mindent a semmiből megírni – elég csak a CSS-t és a HTML-t megcsípni... Tekintettel a Bootstrap-hoz hasonló keretrendszerek elérhetőségére, az ilyen fejlesztés nem túl nehéz egy szabványos implementációval. Ráadásul egy ilyen termék támogatása viszonylag egyszerű feladat lenne.
  • Egy URL - megkímél minket a felesleges átirányításoktól, és attól, hogy a felhasználónak meg kell jegyeznie a mobil verzió címét (még akkor is, ha az csak az m. előtag). Ezenkívül egyetlen cím jelenléte pozitívan befolyásolja a webhely népszerűsítését, mivel „kényelmesebb” lesz a keresőmotorok számára.
A reszponzív tervezés hátrányai
  • Vegyes feladatok - a nagy oldalak "mobil" felhasználóinak tipikus feladatai általában eltérnek a PC-felhasználókétól. Ha Ön banki ügyfél, akkor valószínűleg a webhely mobil verziójában nagyon korlátozott mennyiségű információ érdekli - a legközelebbi fiókok, ATM-ek stb.
    Általánosságban elmondható, hogy az adaptív elrendezésnél a legelterjedtebb megközelítés egy normál webhely másolatának elkészítése, az összes csoport igényeinek megvalósítása a telefonok elrendezésében. célközönség. De akkor elfelejtheti a használhatóságot. A látogatók öt százaléka számára szükséges másodlagos részek az ügyfelek nagy részének kellemetlenséget okoznak.
  • Az oldalak „súlya” továbbra is komoly akadályt jelent a mobiltelefon-használók számára. Ez azt jelenti, hogy az asztali webhelyekre jellemző néhány aktív elemet, beleértve a beágyazott térképeket, videókat, hitelkalkulátorokat és a mobiloldalak animált menüit, le kell cserélni könnyebb alternatívákkal. A reszponzív tervezés megadhatja nekünk ezt a képességet? Egy népszerű megvalósításban a kis képernyővel rendelkező felhasználónak az egész oldalt be kell töltenie, hogy csak egy részét lássa. Például, ha a fő elrendezés asztali verziója 200 Kb, a mobil verzió pedig további 50 Kb, akkor a megtekintéséhez 250 Kb-ot kell letöltenie. Természetesen használhatja az oldalkód tömörítését, de extra kérések továbbra is a szerverre megy.
  • Reménytelenség - Az egyik tagadhatatlan előnyei mobil verzió: ha nem tetszik, akkor kikapcsolhatod, normál domainre válthatsz. A reszponzív tervezésű webhelyek nem kínálják ezt az egyszerű, de fontos választást. Ha az egyéni elrendezés kényelmetlen, hibás, vagy ha egy fontos navigációs elemet rejt, hagyja békén: semmit sem tehet, hogy újra láthassa. Futnia kell egy asztali számítógép vagy a versenytárs webhelyének kereséséhez. Kitalálhat „mankókat” ennek a korlátozásnak a megkerülésére (használjon sütiket és vegyen fel különböző stíluslapokat). De ez a megközelítés bonyolítja a fejlesztést.
Általánosságban elmondható, hogy a fenti hátrányok ellenére meglehetősen népszerű a mobil verzió adaptív kialakítású fejlesztésének ötlete. Ezt a koncepciót különösen az olyan óriáscégek teljes mértékben támogatják, mint például a Google.

Az oldal külön mobil verziója

Annak érdekében, hogy a webhely kényelmes legyen a mobilfelhasználók számára, gyakran külön webhely-verziókat is létrehoznak - kifejezetten az okostelefonnal / táblagéppel rendelkező felhasználó számára. A leggyakoribb gyakorlat a mobilfelhasználók átirányítása egy speciális aldomainre (m.example.com, mobile.example.com stb.). Valószínűleg az esetek 99%-ában a mobil verzió egy lecsupaszított főverzió - csak azzal a funkcióval, amely a fejlesztők szerint szükséges és hasznos lesz a mobileszközök és táblagépek felhasználói számára.
A mobil verzió előnyei
  • Könnyű váltás mivel az oldal de facto a főverziótól elkülönülten létezik, sokkal egyszerűbb csak a mobil verzióhoz kapcsolódó változtatásokat végrehajtani rajta, hiszen a mobil verzió legtöbbször nem biztosít redundáns, felesleges funkcionalitást.
  • Felhasználóbarátság - a mobil verzió általában jelentősen leegyszerűsödik az asztali verzióhoz képest, így a felhasználónak nem kell messzire mennie a szükséges információkért.
  • Sebesség - az oldal ugyanolyan egyszerűsítése miatt a mobil verzió gyorsabban töltődik be. Ez elengedhetetlen azoknak a felhasználóknak, akik még mindig GPRS-t vagy gyenge 3G-t használnak.
  • Választás- leggyakrabban a mobil verzióban lehet váltani a webhely fő verziójára.
A mobil verzió hátrányai
  • Több cím -
  • Felhasználói kényelmetlenség - különböző címek az asztali és mobil verziókhoz. Egyesek számára ez plusznak bizonyulhat, mások számára rendkívül bosszantó tényező lehet, amikor az oldal kényelmes megtekintéséhez még egy címet kell megjegyeznie. A keresőmotorokkal is vannak gondok: az ismétlődő tartalmak elkerülése érdekében a keresőoptimalizálóknak a rel="alternative" és a rel="canonical" metacímkéket kell használniuk. Ezen kívül, ha egy mobil felhasználó Google kereső Ha rákattint a találatok között található linkre, a rendszer átirányítja az asztali verzióra, vagy átirányítja a mobil verzióra. De ha ennek az oldalnak a mobil verziója nem létezik, hibaüzenetet kap.
  • Korlátozás - külön mobilwebhely létrehozása azt jelenti, hogy megszabadulunk a tartalom és a funkciók egy részétől. Ezenkívül két különböző tartalomkészlettel rendelkezhet, amelyek negatívan befolyásolhatják az általános információs képet.

Általánosságban elmondható, hogy a webhelyek mobil verzióinak létrehozása meglehetősen jól indokolja magát, különösen nagy projektek esetén. Például az Amazon a webhely speciális, mobil verzióját használja.

RES

Maga a Google, bár támogatja a reszponzív tervezés webmesterek általi használatát, más rendszert használ termékeiben. Ha ellátogatsz pl. kezdőlap a különböző felhasználói ügynökök alatt különböző HTML-kódokat láthat különféle eszközök. RESS – Reszponzív tervezés + szerveroldal. Megvalósítási példa, "térdre" felvázolva:

$DS = DIRECTORY_SEPARATOR; request_once(dirname(__FILE__) . $DS . "könyvtárak" . $DS . "böngésző.php"); $device = BBrowser::detectDevice(); if($device == DEVICE_TYPE_MPHONE)( $tmpl = "sablon.m.php"; ) else if($device == DEVICE_TYPE_TABLET)( $tmpl = "sablon.t.php";) else( $tmpl = "sablon .php"; ) include(dirname(__FILE__) . $DS . "sablonok" . $DS . $tmpl);

A RES előnyei
Valójában a módszer magában foglalhatja a webhelyek különálló mobil- és reszponzív verziójának előnyeit is, a megvalósítástól függően. Az újdonságokból:
  • Forgalom minimalizálás - A szükségtelen JavaScript eltávolítható a HTML-ből, ami CPU-t, memóriát és gyorsítótárat szabadít fel a mobileszközön. Lehet speciálisan optimalizált html és css is.
  • Lehetőség van célzás használatára - például Android-eszközök esetén ajánlja fel az alkalmazás letöltését a GooglePlay-ről, az Apple-nél pedig az iTunes-ról. Mindegyik eszközhöz elkészítheti saját elrendezését.
Hátrányok
  • Fejlesztési nehézség egy ilyen módszer megfelelő szerverkonfigurációt és több programozó munkáját igényel. Ezenkívül több különböző elrendezési lehetőséget is meg kell adni.
  • Eszközészlelési mechanizmus - Sajnos még a mi korunkban sem sikerült tökéletesre hozni. Elég gyakran bukkannak fel történetek arról, hogy valaki ritka telefonját nem definiálják mobileszközként.

Általában a RESS a legjobb a három javasolt lehetőség közül, azonban sokkal több erőfeszítést igényel a fejlesztés során.

Összegzés

Személyes véleményem szerint nincs olyan ideális lehetőség, amelyet mindenkinek használnia kellene. A legjobb megoldás számomra a RESS. Ez azonban a ritka lehetőségek egyike, mert sok erőfeszítést igényel a megvalósítása. Általában mind a 3 lehetőségnek megvannak a maga előnyei és hátrányai, az oldal lényegétől és irányától függően.

Kiadtunk egy új könyvet, "Közösségi médiás tartalommarketing: Hogyan juthat el az előfizetők fejébe, és szeretheti meg velük a márkáját."

A webhely mobil verziója a fő webhely duplikált verziója, amelyhez speciális elrendezést használnak, amely lehetővé teszi az erőforrás oldalainak kényelmes megtekintését és navigálását mobiltelefonokról és táblagépekről.


Még több videó a csatornánkon – tanulja meg az internetes marketinget a SEMANTICA segítségével

A mobiltelefon lett a legjobb barát a legtöbb ember számára a bolygón. A modern mobil kütyük szinte teljesen átvették a szerepet asztali számítógépekés gyökeresen megváltoztatta a felhasználók viselkedését az interneten. Egyszerre információforrásként szolgálnak, és számos feladat végrehajtásának eszközei. Az élet dinamikája megköveteli az idő leghatékonyabb felhasználását, ezért már régóta tanulunk, vásárolunk és foglalunk útközben.

Minden internetes projektnek megvan a saját főoldala, de a mobileszközök képernyőfelbontása eltér a számítógépekétől és a laptopokétól. Ennek eredményeként az oldalt szinte lehetetlen telefonról használni, mivel a megjelenítése nagyon kényelmetlen. Ezért volt szükség az oldal optimalizált verziójára, amely a zsebkütyük számára is olvasható.

Miért van szüksége a webhely mobil verziójára?

Az azonos web-források bősége, információs és értékesítési szempontból egyaránt, a látogatók hűséghiányát idézi elő. Az internetezőknek van választási lehetőségük, így ha egy látogató belebotlik például egy kényelmetlen erőforrás-navigációba, inkább nem vesztegeti az idejét, hanem elhagyja az oldalt, és egy versenytárshoz megy. Ez a helyzet arra kényszeríti az adminisztrátorokat, hogy a legkényelmesebb feltételeket teremtsék meg, hogy ne csak vonzzák a látogatókat, hanem motiválják őket a tartózkodásra.

A célközönség maximális lefedettsége és a számára kényelmes feltételek megteremtése – erre való az oldal mobil verziója.

Az oldal külön mobil verziója a mobil eszközökről történő kényelmes hozzáférés megvalósítása, amelyet régóta használnak. Az okostelefonokban az oldal egy oszlopban jelenik meg, így a fejlesztőnek az oldal mobil verziójának elkészítése előtt alaposan át kell gondolnia a dizájnt – mindent úgy kell elhelyezni, hogy a funkcionalitásban ne csökkentse a látogatót, és ugyanakkor tegye a lehető legkényelmesebbé az erőforrással való interakciót.

Hogyan működik

Az az elv, amely alapján meghozzák a döntést, hogy melyik verziót mutassák meg a látogatónak, hogy amikor a felhasználó belép az oldalra, automatikus észlelés eszköz képernyőjén. Ha a képernyő szélessége mobil modulként van azonosítva, akkor a rendszer átirányítást indít az erőforrás mobil verziójára, amely egy külön aldomainben található. Annak elkerülése érdekében, hogy a keresőmotorok ezt a verziót külön forrásként kezeljék a jövőben, jobb, ha egy aldomaint ugyanazon a domainen helyeznek el, mint a fő webhely, különben a webhely mobil verziójának népszerűsítése kontraproduktív lesz.

Hogyan fordítsuk le a webhelyet mobil verzióra

Vannak bizonyos alapelvek, amelyek megvalósításához programozási és elrendezési ismeretek szükségesek.

A mob. verziónál meg kell tartani az általános koncepciót az asztali verziónál, ugyanakkor külön tervezési megoldásokat kell kidolgozni, valamint a használhatóság szempontjából legkényelmesebb felületet. A látogató képernyőjén az erőforráselemeket megfelelő távolságban kell elhelyezni, és elég nagynak kell lenniük ahhoz, hogy könnyen megérintsék őket. Ezt követően a tesztelés és a végső indítás következik.

Mobil verzió vs adaptív elrendezés

Az oldal különálló mobil verziójával párhuzamosan van egy másik értelmezett változat is - az adaptív kialakítás.

Próbáljuk kitalálni, miben különbözik a webhely mobil verziója az adaptív verziótól.
A reszponzív webhely nem az erőforrás különálló változata, hanem a fő webhely, és automatikusan alkalmazkodik annak az eszköznek a felbontásához, amelyről bejelentkezik.

A reszponzív elrendezés előnyei közé tartozik, hogy ugyanaz a címe, mint a fő webhelynek, így nincs szükség átirányításra. Ez pedig jelentősen javítja az oldal pozícióját a rangsoroláskor. kereső motorok. A megnyitás során teljesen azonos oldaltartalom és annak funkcionalitása jelenik meg, de megjelenése igazodik az ablak méretéhez. Ezenkívül lehetőség van az erőforrás optimalizálására.

Az adaptív változat kidolgozása azonban időigényesebb folyamat, ennek megfelelően a rendezvény költséges része is nagyobb lesz.

A reszponzív dizájn olyan erőforrások esetében releváns, amelyek nem rendelkeznek nagy látogatói forgalommal - online áruházak, blogok, névjegykártyák, valamint weboldalak, fő feladatuk a tartalom szállítása.

A mobil verzió előnyei és hátrányai

A mobil verzióban több van Magassebesség letöltések és könnyű navigáció. Mivel a látogató minimális zavaró információt lát, nagyobb a valószínűsége, hogy pozitív cselekvést hajt végre. Ezenkívül egy külön mobil verzió teljesen független az asztali verziótól. Ez lehetővé teszi, hogy külön dolgozzanak velük.

Az ilyen koncepció hátrányai közé tartoznak bizonyos nehézségek a területen SEO promóció. Mivel ugyanazon tartalom elhelyezése ismétlődésnek minősül, ehhez külön intézkedésekre van szükség a webhely promóciós folyamatára gyakorolt ​​negatív hatások kiküszöbölésére. Tekintettel arra, hogy a mobil verzió nem univerzális, ezért a főoldal tartalmán kívül külön költségtételt igényel.

Az oldal ezen verziója olyan nagy projektekhez alkalmas, amelyek eleve nagy forgalmat bonyolítanak le a fő webhely felé, de újratervezés nélkül szeretnék növelni a mobileszközök iránti hűséget. A legtöbb esetben egy külön mobil verzió releváns azokhoz az erőforrásokhoz, amelyeknél fontos a letöltési sebesség - közösségi hálózatok, postai szolgáltatások, hírportálok.

Összefoglalva, csak azt mondhatjuk, hogy ma minden internetes projekt ésszerű igénye a webhely helyes megjelenítése a mobileszközökön. Ennek megvalósítása a webhely céljaitól és célkitűzéseitől, a költségvetéstől és a lehetőségektől függ.