Бүгінде адамдардың көпшілігі мобильді гаджеттер – планшеттер, телефондар арқылы желіге кіреді, осыған байланысты веб-сайтты оңтайландыру да жаңа деңгейге көтерілуде. Егер пайдаланушы кіріп, сайттың мобильді құрылғылар үшін оңтайландырылмағанын көрсе: суретті қарау мүмкін емес, түймелер жылжытылған, қаріптер кішкентай және оқылмайды, дизайн қисайған - ол 100% -дан 99 шығады. және басқа ыңғайлырақ іздеуді бастаңыз. Ал іздеу роботы ресурс маңызды емес, яғни іздеу сұрауына сәйкес келмейтін құсбелгіні қояды. Сондықтан бет дизайны әртүрлі мобильді құрылғыларға бейімделуі керек. Сайттың мобильді нұсқасы дегеніміз не, оны қалай жасауға болады және оны қолданудың ең жақсы жолы қандай? Толығырақ осы мақалада оқыңыз.
Сонымен, сайтыңызды мобильділікке ыңғайлы етудің төрт негізгі жолы бар.
Бірінші әдіс - жауап беретін дизайн
Жауап беретін үлгілер экран өлшеміне байланысты сайт кескінін өзгертеді. Әдетте, олар стандартты 1600, 1500, 1280, 1100, 1024 және 980 пиксельдерге орнатылады. Іске асыру үшін CSS3 медиа сұраулары пайдаланылады. Сайт дизайнының өзі өзгермейді.
Бұл әдістің артықшылықтары мыналарды қамтиды:
- ыңғайлы әзірлеу,Құрылымның өзі экран параметрлеріне бейімделгендіктен және кез келген жаңарту дизайнды нөлден әзірлеуді қажет етпейтіндіктен, CSS және HTML-ді түзету жеткілікті;
- бір URL – пайдаланушыға бірнеше атауды есте сақтау қажет емес, веб-шебердің жұмысын қиындататын қайта бағыттаудың (бір мекенжайдан екіншісіне қайта бағыттау) қажеті жоқ және іздеу оңайырақ бір мекенжайы бар ресурсты сұрыптау және дәрежелеу үшін қозғалтқыш.
Әрине, бейімделгіш үлгілердің кемшіліктері бар, айтпақшы, олар артықшылықтардан да көп. Дегенмен, көптеген әзірлеушілер бұл тұжырымдаманы ұстанады, мысалы, сайттың мобильді нұсқасы бейімделген дизайны бар Google корпорациясы. Сонымен, кемшіліктер:
- Жауапты дизайн компьютердегідей мобильді құрылғылардағы тапсырмаларды қолдамайды. Егер бұл, мысалы, айырбас бағамы немесе жақын маңдағы банкоматтар туралы ақпарат пайдаланушы үшін маңыздырақ болатын банк веб-сайтының мобильді нұсқасы болса, онда бұл дизайн жеткілікті. Бірақ бұл көптеген бөлімдері мен бөлімшелері бар күрделі құрылымдық ресурс болса, келушілер бейімделген орналасуды ұнатпайды.
- Баяу жүктелу сүйікті сайтты жек көретін сайтқа айналдырады. Бұл әсіресе анимациялар, бейнелер, қалқымалы терезелер және басқа белсенді элементтер көп болатын ресурстарға қатысты. Салмағы жоғары болғандықтан, бет жай ғана «баяулайды», пайдаланушы ашуланып кетіп қалады және сайттың іздеу орындары төмендейді.
- Мобильдік нұсқаны өшіру мүмкін еместігі - тағы бір маңызды кемшілік. Кейбір элемент осындай орналасу арқылы жасырылған болса, сізОны өшіріп, кәдімгі доменге ауыстыруға болатын сайттардан айырмашылығы, оны ашу үшін ештеңе істей алмайсыз.
Алайда сайттың мұндай мобильді нұсқасы жылдам, арнайы дағдылар мен шығындарсыз ресурсты кез келген гаджеттерге бейімдеуге мүмкіндік береді. Бірақ аталған кемшіліктерді ескере отырып, ол күрделі навигациясыз және анимациясыз ең аз ақпарат пен мультимедиялық шағын, қарапайым ресурстарға сәйкес келеді. Күрделі сайт үшін басқа 2 әдіс қолайлы.
Екінші әдіс - сайттың бөлек нұсқасы
Бұл әдіс өте кең таралған және көбінесе сайтты мобильді құрылғыда оқуға ыңғайлы етуде сәтті болады. Оның мәні қосымша үшін сызылған және бөлек URL мекенжайында немесе ішкі доменде, мысалы, m.vk.com орналасқан беттің бөлек нұсқасын жасау болып табылады. Сонымен қатар, негізгі функционалдылық сақталады, сайттың дизайны жай ғана басқаша көрінеді. Бұл әдістің артықшылықтары айқын:
- пайдаланушыға ыңғайлы интерфейс;
- өзгерту және өңдеу оңай, себебі нұсқа негізгі ресурстан бөлек бар;
- салмағы төмен болғандықтан, сайттың бөлек нұсқасы бейімделген үлгіге қарағанда әлдеқайда жылдам жұмыс істейді;
- көбінесе беттің негізгі нұсқасына ұялы телефоннан өтуге болады.
Бірақ бұл жерде де кемшіліктер болды:
- Бірнеше мекенжай - сайттың жұмыс үстелі және мобильді нұсқасы. Пайдаланушыға екі опцияны қалай есте сақтауға болады? Веб шеберлері көбінесе жұмыс үстелі нұсқасынан мобильді нұсқаға қайта бағыттауды (қайта бағыттауды) тағайындайды, бірақ сонымен бірге, егер бұл бет ұялы телефонда болсанұсқасы жоқ, пайдаланушы қате алады. Бұл жерде іздеу жүйелерімен қиындықтар туындайды, олар 2 бірдей ресурсты бағалау қиынға соғады және бұл жарнамаға тікелей әсер етеді.
- Сайттың компьютерден мобильді нұсқасы, егер пайдаланушы қателесіп кірсе, күлкілі болып көрінеді, бұл трафикке де әсер етуі мүмкін.
- Бұл нұсқа жиі қысқартылған, жұмыс үстелі, сондықтан пайдаланушы өте шектеулі функционалдылыққа ие болады. Бірақ сонымен бірге бірдеңе жетіспесе, келуші беттің толық нұсқасына өте алады.
Жалпы, бөлек мобильді сайт өзін ақтайды және мобильді құрылғылар үшін ресурсты бейімдеудің ең кең тараған тәсілі болып табылады. Ол Amazon сияқты ірі интернет-дүкендер арасында танымал.
Үшінші жол - RESS дизайны
Google іздеу жүйесі мобильді дизайнның осы бағытын белсенді түрде қолдайды. Бұл сайтты телефонға немесе планшетке бейімдеудің ең күрделі, қымбат, бірақ тиімді әдісі. Ол RESS деп аталады. Бұл әр құрылғы үшін бөлек жүктеп алуға болатын мобильді қосымшаға ресурсты бағыттайды. Android үшін - GooglePlay арқылы, ал Apple үшін - iTunes арқылы.
Мұндай қолданбалар жылдам, ақысыз, ыңғайлы, әртүрлі ақпаратты орналастыру мүмкіндігіне ие, ал телефонның жады мен интернет-трафик браузер арқылы сайтқа кірген кездегідей жеп қалмайды. Оларға қол жеткізу оңай, өйткені сілтеме әрқашан қолыңызда болады және браузердің мекенжай жолағына күрделі атауды енгізудің қажеті жоқ.
Бұл жерде, әрине, бар жәнеоның кемшіліктері, мысалы, әзірлеудің күрделілігі, көптеген программисттердің еңбегінің жоғары құны, бірнеше орналасу нұсқаларын жасау қажеттілігі. Кейде мобильді құрылғы қолданба арқылы танылмайды. Тұрақты техникалық қолдау, кемшіліктерді түзету қажет. Дегенмен, бұл опция өнімді, үздіксіз жұмыс істеуіне байланысты ұсынылған үшеуінің ішіндегі ең жақсысы болып саналады.
Мобильді веб-сайт жасаудың ең арзан жолы
Жоғарыда аталған әдістердің барлығы әрқашан ұзақ және қиын болмаса да, веб-шебердің ақылы жұмысын қамтиды. Егер сіз мұндай дамудың шұғыл қажеттілігін көрмесеңіз, сайттың қарапайым және тегін мобильді нұсқасы сізге сәйкес келеді. Оны жасаудың ең оңай жолы қандай?
Жауапты дизайн үшін арнайы үлгілерді (плагиндер) жүктеп алыңыз. Мысалы, WP Mobile Detector, WordPress Mobile Pack, WPSmart Mobile және т.б. Олар сайтты телефонда дұрыс көрсетуге көмектеседі, сонымен бірге бетті мобильді нұсқаға жақсырақ бейімдеу үшін нені түзету керектігі туралы бірнеше кеңестер аласыз.
Әрине, бұл әдіс елеулі ресурстар үшін қолайлы емес. Керісінше, бұл тегін мүмкіндік шағын және қарапайым сайттарға, блогтарға, жаңалықтар арналарына арналған. Google іздеу жүйесі, сондай-ақ Яндекс бүгінде мобильді нұсқаларға елеулі талаптар қоятынын ұмытпаңыз, сондықтан осы әдісті пайдаланып позицияларыңызды төмендетуге үлкен мүмкіндік бар.
Бұл әдіс арқылы жарнамалар мен қалқымалы терезелер өшірілуі мүмкінбаннерлер, бірақ бет тез және «кешікпей» жүктеледі.
Мобильдік нұсқаларды жасау принциптері
Сайттың мобильді нұсқасы тегін немесе веб-шеберлер қызметкерлерінің көмегімен жасалғаны маңызды емес, ол RESS жүйесінде немесе адаптивті үлгіні пайдаланып жасалған. Ең бастысы, оның тиімді жұмыс істеуі үшін бірнеше өте маңызды принциптерді сақтау қажет. Сонымен, сайттың мобильді нұсқасы қандай болуы керек? Оны қалай өнімді, тиімді және өнімді етуге болады?
Қажет емес барлығын алып тастаңыз
Минимализм - бұл сайттың мобильді нұсқасын жасаушы ұмтылуы керек. Түстерге, түймелерге, баннерлерге толы ақпаратты қабылдау қаншалықты қиын екенін елестетіп көріңіз және сізге қажетті материалды іздеу үшін шексіз айналдыруға тура келеді. Мобильді дизайн қарапайым және таза болуы керек. Кеңістікті бөлу үшін 2-3 түсті таңдаңыз (мысалы, фирмалық). Олардың біреуі ақ болса жақсы. Кішкентай экранның кеңістігін түсінікті және оқылатын аймақтарға бөліңіз. Виртуалды кілттер көрінетін болуы керек, сонда пайдаланушы қайда басатынын және көретінін анық біледі - міне, өнім, міне, деректерді толтыру пішіні, мұнда жеткізу және төлеу туралы ақпарат бар.
Жұмыс үстелі нұсқасында пайдалы болатын және пайдаланушының өмірін жеңілдететін барлық қосымша опциялар мұнда тек қиындықтар әкеледі. Ең маңызды элементтерді ғана қалдырыңыз. Анимация, жарнамалық баннерлер, мультимедиа, ең алдымен, тек сайттың немесе қолданбаның жұмысын баяулатады және алаңдатады.негізгі.
Тегістеу
Тегістеу мәселесі де өткір емес, өйткені қате орындалса, пайдаланушы маңызды сөздердің соңын ғана алады. Солға туралау және тік туралау әдетте қабылданады. Өзіңізді телефоныңыздағы жаңалықтар таспасы арқылы айналдырып жатқаныңызды елестетіңіз. Оны солға немесе оңға емес, жоғарыдан төмен қарай жасайсыз.
Біріктіру
Ұзын ауысулар тізбегі болмаған кезде, бірнеше қадамды бір қадамға біріктіріп көріңіз. Мысалы, сайт деректерді бірнеше кезеңде енгізуді талап етеді - аты, содан кейін мекенжайы, онда әрбір жеке ұяшықта жеке үй, көше, пәтер және т.б. бар. Пайдаланушыны көптеген кішкентай ұяшықтарды соғуға мәжбүрлемеу үшін, одан тек 2 - аты мен мекенжайын толтыруын сұраңыз.
Және ажырату
Кейде, керісінше, тым көп ақпаратты бөлу талап етіледі. Мысалы, ашылмалы мәзірде сізде жеткізу жүзеге асырылатын 80-нен астам қалалардың тізімі бар. Пайдаланушы осы үлкен тізімді айналдырудың қажеті болмас үшін оларды аймақ бойынша топтаңыз. Меңзерді облыс орталығының немесе аймақтың үстіне апарғанда, басқа қалалар тізімі жойылады.
Тізімдер
Айтпақшы, тізімдер туралы. Олардың екеуі бар - алфавиттік немесе басқа ретпен және ауыстырумен бекітілген. Олардың таңдауы тізімде болатын нәрсеге байланысты.
Тіркелген, егер пайдаланушы не іздеп жатқанын нақты білетін болса пайдалы. Мысалы, қала, нөмір немесе күн. Екінші нұсқа ұзын күрделі атаулар үшін немесе бір және бірдей нұсқалардың көптеген нұсқалары бар жағдайлар үшін қолайлыбірдей атау және әрбір ашылмалы тізім пайдаланушыны мақсатқа бір қадам жақындатады. Автоматты ауыстыру опциясы келушіге көмек қажет болғанда жиі пайдаланылады. Мысалы, тоқу сайты тоқылған инелерді сатып алуды ұсынады. Пайдаланушы «Металл тоқылған инелер» іздеу сұрауын енгізеді және құралдар кеңесінде ол «Трикотаж инелері 5 мм», «Трикотаж инелері 4,5 мм» және т.б.көреді.
Автотолтыру
Бұл тармақ әсіресе интернетте бірдеңе сататын сайттарға қатысты және төлем, жеткізу және т.б. үшін стандартты пішіндерді толтыру керек. Егер адам телефон арқылы сатып алса, оның уақыты жоқ шығар. компьютерге жету үшін, яғни сатып алу процесі мүмкіндігінше жылдам және ыңғайлы болуы керек.
Ол үшін пішіндерде толтырылған деректер болуы мүмкін, ең танымал жауаптарға жүгінуге болады. Мысалы, бүгінгі күнді, қолма-қол ақшаны төлеу әдісін, бір аймақта жұмыс істейтін болсаңыз, қаланы енгізіңіз. Оларды өзгертуге болады, бірақ мақсатқа жетсеңіз, пайдаланушының уақыты сақталады.
Бәрі оқылды, бәрі қаралды
Сайттың мобильді нұсқасын жасағанда, әркімнің телефоны әртүрлі екенін есте сақтаңыз, сонымен қатар олардың көру қабілеті де әртүрлі. Мүмкін сіздің сайтыңыз шағын экраннан қаралатын шығар, сондықтан қаріптер қарапайым және оқылатын болуы керек, түймелер басқа бетке өтпей-ақ басылатындай үлкен болуы керек және суреттер бөлек, үлкен, әсіресе ашылғанда ашылуы керек. ол Интернетке келеді. дүкен.
Кейбір статистика
Сайттың мобильді құрылғыларға бейімделуі туралы айтатын болсақ, бұл процестің қаншалықты маңызды екенін түсіну үшін статистикаға жүгіну керек.онлайн жарнама.
Сандар төмендегідей. Бүгінгі таңда гаджеттерді ең кішкентай балалар мен кейбір қарт адамдарды қоспағанда, халықтың 87% пайдаланады. Экономистер мобильді коммерция алдағы 5 жылда 100 есе өседі деп болжайды. Бұл ретте сайттардың 21%-ы ғана мобильді құрылғылармен жұмыс істеуге бейімделген. Бұл интернет-трафик пен электронды коммерция нарығының тек 5-тен аз ғана бөлігін алып жатқанын білдіреді.
Осы сандар туралы ойланыңыз. Ресурсыңызды бейімдеу мағынасы бар ма? Әрине, иә. Оның үстіне, бұл нарықта көп орын болса да, сіз одан өз сегментіңізді қиып ала аласыз.
Мобильдік нұсқа қажет жерде
Мобильдік нұсқаны пайдалану жоғары рейтингті алуға бағытталған кез келген платформа үшін мағынасы бар. Өйткені, бұл пайдаланушыға тікелей әсер етіп, оның сайтта қалуына қолайлы жағдай жасайды.
Мобильдік нұсқасынсыз болуы мүмкін емес:
- жаңалық порталдары, себебі олардың көпшілігі жұмысқа немесе мектепке бара жатқанда телефоннан қаралады;
- әлеуметтік желілер - дәл сол себепті, сонымен қатар онлайн байланыс факторы бар, яғни бұл үшін ыңғайлы, түсінікті чат құру керек;
- анықтама, навигациялық сайттар, т.б., адамдар бірдеңе іздеп жүргенде қайда барады;
- интернет-дүкендері – сатып алуды босқа өткізбей, барлығын мобильді интернет арқылы сатып алатын тұтынушыларды тарту мүмкіндігі.
Қорытындының орнына
Бүгінгі таңда мобильді технологиялар әлемдебелсенді өсу мен даму, сондықтан нарықта көшбасшылыққа ұмтылу, кез келген компания өзінің интернет-ресурсының талаптарға сай болуын қамтамасыз етуі керек. Пайдаланушының өсіп келе жатқан сұранысына байланысты сайттар үнемі жаңартылып, әртүрлі құрылғыларға бейімделуі керек. Егер адам белгілі бір ресурста болу ыңғайсыз болса, онда ол өнім немесе баға туралы ақпарат ала алмаса, тапсырыс бере алмаса, жеткізілім туралы біле алмаса, ол мұның бәрі мүмкін болатын сайтты табатыны анық. Сондықтан бәсекеде жеңіске жету үшін икемді, ыңғайлы, функционалды және қызықты ресурс болуы маңызды.
Оған Android немесе Ios веб-сайтының мобильді нұсқасы көмектеседі. Ол үшін жоғарыда аталған қайта өңдеу әдістерінің бірін таңдау керек – бейімделгіш үлгі, қосалқы доменде жаңа сайт жасау және оған қайта бағыттау, тегін үлгілерді пайдалану немесе пайдаланушының кіруін жеңілдететін мобильді қосымша жасау. және бетте болыңыз.
Бұл тәсіл бар тұтынушылардың адалдығын сақтауға көмектесіп қана қоймайды, сонымен қатар жаңа келушілерді тартуға мүмкіндік береді.
