Данас, већина људи пролази кроз интернетмобилни уређаји - таблети, телефони, у вези са овим, оптимизација сајта долази и на нови ниво. Ако корисник дође и види да сајт није оптимизован за мобилне уређаје: Не можете видети слику, скинула дугме, малих и нечитљив фонтове, дизајн искривљену - 99 од 100% да ће изаћи и да ће почети да трага за другом згодније. Робот за претрагу ће означити да је ресурс непотребан, тј. Не подудара се са упитом за претрагу. Дакле, дизајн странице мора бити неопходно прилагођен различитим мобилним уређајима. Шта је мобилна верзија сајта, како то учинити, и који је најбољи начин за примјену? Прочитајте више у овом чланку.

Дакле, постоје четири кључна начина за прилагођавање сајта мобилној верзији.

мобилну верзију сајта како направити

Први пут - адаптивни дизајн

Адаптивни предлошци указују на променуслике сајта у зависности од величине екрана. По правилу су постављени на стандардне 1600, 1500, 1280, 1100, 1024 и 980 пиксела. За имплементацију користите ЦСС3 Медиа Куериес. Дизајн сајта се не мења истовремено.

Предности ове методе су:

  • погодан дизајн, с обзиром да се сама структура прилагођава параметрима екрана, а свака ажурирања не захтева развој дизајна од нуле, само исправити ЦСС и ХТМЛ;
  • један УРЛ - корисник не мора да запамтинеколико имена, нема потребе преусмеравање (преусмеравање од једне адресе на другу), који може да искомпликује операције вебмастер, и претраживач је лакше за сортирање и рангирају ресурс са једне локације.

Наравно, адаптивни шаблони имају својенедостатке, које су, иначе, више од заслуга. Ипак, многи програмери се придржавају овог концепта, на пример, корпорације Гоогле, чија мобилна верзија сајта има адаптивни дизајн. Дакле, мане су:

  • Адаптивни дизајн не подржава исте задаткемобилни уређај, као на рачунару. Ако је то, на пример, мобилна верзија веб сајта банке, где је вероватније да ће корисник имати информације о девизном курсу или најближем банкомату, онда је овај дизајн сасвим довољан. Али ако је то сложени структурирани ресурс са многим одељцима и подсекцијама, онда је мало вероватно да ће прилагођени изглед изгледати посјетитељима.
  • Споро преузимање претвара вашу омиљену страницу умрзела. Ово је посебно важно за ресурсе, где су богате анимације, видео снимци, искачу и други активни елементи. Због тешке тежине, страница ће једноставно "успорити", корисник ће се љутити и нестати, а потражња мјеста на сајту ће пасти.
  • Немогућност онемогућавања мобилне верзије - вишеједан значајан недостатак. Ако је неки елемент сакривен таквим изгледом, не можете учинити ништа да га отворите, за разлику од сајтова на којима се може онемогућити и идите у регуларни домен.

Ипак, таква мобилна верзија сајта је брза,без посебних вјештина и трошкова дозвољава вам да прилагодите ресурсе било којем гаџету. Али, с обзиром на наведене недостатке, погодна је за мале, једноставне ресурсе са минималним информацијама и мултимедијом, без компликоване навигације и анимације. За комплексно место, погодне су још две друге методе.

веб дизајн

Други метод је засебна верзија сајта

Овај метод је врло чест и често са успехомчини сајт на мобилном уређају погоднији за перцепцију. Његова суштина је креирање одвојене верзије странице, нацртане за апликацију и лоциране на одвојеној УРЛ-у или поддомену, на примјер, м.вк.цом. У исто време, главна функционалност је очувана, дизајн сајта једноставно изгледа другачије. Предности ове методе су очигледне:

  • кориснички интерфејс;
  • лако се мења и уноси, јер верзија постоји одвојено од главног ресурса;
  • због мале тежине одвојене верзије сајта је много брже од адаптивног предложака;
  • најчешће постоји могућност да пређете на главну верзију странице са мобилним уређајем.

Али и овде, било је недостатака:

  • Вишеструке адресе - десктоп и мобилна верзијасите. Како да учиним кориснику да запамти две опције? Веб мајстори често преписују редирекцију (преусмеравање) из дектуп верзије на мобилни, али у исто време, ако ова страница не постоји у мобилној верзији, корисник ће добити грешку. Овде постоје потешкоће са претраживачима, којима је тешко рангирати 2 идентична извора, што директно утиче на напредак.
  • Мобилна верзија сајта са рачунара, ако корисник погрешно оде на то, изгледат ће смешно, што може утицати на присуство.
  • Ова верзија је често ограничена, радна површина, тако да ће корисник имати врло ограничену функционалност. Али истовремено, ако нешто недостаје, посјетилац може ићи на пуну верзију странице.

Генерално, одвојена мобилна локација оправдава сеи најчешћи је начин прилагођавања ресурса мобилним уређајима. Популаран је код великих онлине продавница, на пример, Амазон.

адаптивни шаблони

Трећи начин је РЕСС-дизајн

Гоогле претраживач активно подржава овоправац мобилног дизајна. Ово је најкомплекснији, скупији, али ефикасан начин прилагођавања сајта телефону или таблету. Зове се РЕСС. Ово је таргетирање ресурса у мобилној апликацији која се може преузети за сваки уређај посебно. За Андроид - са ГооглеПлаи-ом и Аппле-ом са иТунес-ом.

Такве апликације су брзе, бесплатне, практичне,имају могућност прилагођавања различитим врстама информација, док се меморија телефона и Интернет саобраћај не једу на начин на који посјећују локацију преко претраживача. Они се лако уносе, јер ће веза увек бити на екрану и нема потребе за уносом сложеног имена у адресар у прегледачу.

Ту су, наравно, и њихови недостаци, као што сусложеност у развоју, висок трошак рада великог броја програмера, потреба да се направи неколико варијанти распореда. Понекад мобилни уређај не препознаје апликација. Потребна је редовна техничка подршка, исправљање недостатака. Ипак, ова опција се сматра најбољем од три понуђена због његовог продуктивног и неометаног рада.

гоогле верзија мобилног сајта

Најјефтинији начин за стварање мобилног сајта

Све горе наведене методе претпостављајуа не увек дуг и комплексан, али ипак плаћени рад вебмастера. Ако не видите хитну потребу за таквим развојем, можете користити једноставну и бесплатну мобилну верзију сајта. Како то олакшати?

Преузмите специјалне шаблоне (плугинс) заадаптивни дизајн. На пример, ВП Мобиле Детецтор, ВордПресс Мобиле Пацк, ВПСмарт Мобиле и други. Они ће вам помоћи да правилно приказали сајт у вашем телефону, а ти неколико савета које треба исправити да се боље прилагоди мобилну верзију странице.

Наравно, овај метод је тешко погоданозбиљни извори. Уместо тога, то је бесплатна опција је намењен малим и веома једноставне сајтове, блогове, вести. Не заборавите да Гоогле је претраживач, као и "Иандек", данас чини велике захтеве на мобилној верзији, тако да постоји велика шанса да смање своје позиције, помоћу ове методе.

Овим методом, највероватније ће бити прекинути рекламни и поп-уп банери, али ће се страница брзо и без "лагс" учитати.

мобилна верзија веб локације Андроида

Принципи креирања мобилних верзија

Без обзира на то, мобилна верзија сајта је креирана бесплатноили уз помоћ особља вебмастера, то се ради на систему РЕСС или користећи прилагођени образац. Најважнија ствар је да због свог ефективног рада мора се придржавати неколико врло важних принципа. Дакле, која би требало да буде мобилна верзија сајта? Како то учинити продуктивним, ефикасним и продуктивним?

мобилну верзију сајта са рачунара

Ми уклонимо све непотребне

Минимализам је нешто у чему би се требали потрудитипрограмер мобилне верзије сајта. Замислите колико је тешко приметити информације које су пуне боје, дугмади, банера и које морате бесконачно кретати у потрази за правим материјалом. Мобилни дизајн треба да буде једноставан и чист. Изаберите 2-3 боје да бисте раздвојили простор (на пример, брендирани). Боље је да ли је један од њих бели. Поделите простор малих екрана у чисту и читљиву зону. Виртуелни тастери би требало да буде видљив за корисника јасно знају где да кликнете, и видео - образац Овај производ је за попуњавање података, тако да информација испоруке и плаћања.

Било какве додатне опције које би биле кориснеу десктоп верзији и олакшати живот кориснику, они ће донијети само компликације. Оставите само најважније елементе. Анимација, рекламни банери, мултимедија, највероватније, само ће успорити локацију или апликацију и одвраћати од главне ствари.

Поравнање

Питање изједначавања није ништа мање акутно,јер ако то учините погрешно, корисник ће добити само завршавање важних речи. Усаглашавање лево и вертикално сматра се уобичајеним. Замислите како ћете прелистати линију вести на вашем телефону. То радите одозго надоле, али не са леве или десне стране.

Унификација

Када не постоји могућност дугог ланца транзиција,Покушајте да комбинујете неколико корака у једну. На пример, на сајту се захтева унос података у неколико фаза - име, затим адреса у којој свака кућа садржи одвојену кућу, улицу, стан, итд. Да не би присилили корисника да покуша да уђе на пуно малих ћелија, замолите га да попуни само 2 - име и адресу.

И раздвајање

Понекад, напротив, морате да прекинете везупуно информација. На пример, у падајућем менију имате листу од више од 80 градова у којима се испоручује. Групирајте их по региону, тако да корисник не мора да се креће кроз ову огромну листу. Када указује на регионални центар или подручје, изаћи ће још једна листа градова.

Цхецклистс

Иначе, о листама. Два су фиксирана по абецедном или другом реду и са замјеном. Избор њих зависи од тога шта ће бити на листи.

Фиксна је погодна у случају да јекорисник тачно зна шта тражи. На пример, град, број или датум. Друга опција је погодна за дуго компликованих имена или у случајевима где постоји низ варијација у једном и исто име, и свака листа корисника падајући доноси корак ближе циљу. Варијанта са аутоматском заменом се чешће користи када је посетиоцу потребна помоћ. На пример, сајт за плетење нуди куповину за игле за плетење. Корисник унесе упит за претраживање "Металик жбице", ау врха тачкама "кракова 5 мм" "Спокес 4,5 мм" и т. Д

Аутофилл

Овај став је посебно релевантан за сајтове у којима нештопродајете онлине и морате попунити стандардне облике плаћања, испоруке и сл. Ако неко купи телефон, онда највероватније нема времена да дође до рачунара, што значи да процес куповине треба учинити што бржим и практичним.

За ово, обрасци могу садржати већ попуњенеподатке, можете се обратити најпопуларнијим одговорима. На пример, убаците данашњи датум, начин плаћања у готовини, град, ако радите у једном региону. Могу се мењати, али ако погодите циљ, време корисника ће бити сачувано.

Све је прочитано, све је видљиво

Када креирате мобилну верзију веб странице, запамтитеда су сви телефони различити, а такође и вид. Можда ће ваша страница бити приказана са малих екрана, тако да фонтови требају бити једноставни и читљиви, дугмад довољно велика да се могу кликнути и не доћи до друге странице, а слике се требају отварати одвојено, велике, посебно када је у питању Интернет до продавнице.

Неке статистике

Говорећи о адаптацији сајта на мобилне уређаје, не можете се прибјећи статистичким подацима како бисте схватили колико је важан овај процес промовисање мреже.

Цифре су следеће. Данас гаџети користе 87% становништва, очигледно, осим најмлађе деце и неких старијих људи. Економисти предвиђају раст мобилне трговине 100 пута у наредних 5 година. Истовремено, само 21% сајтова је прилагођено раду са мобилним уређајима. Стога, интернет саобраћај и тржиште е-трговине заузима само мали 5-ти део.

Размислите о овим бројкама. Да ли је смисла прилагодити свој ресурс? Наравно, да. Штавише, све док постоји пуно слободног простора на овом тржишту, можете узети свој сегмент на њему.

мобилну верзију сајта бесплатно

Где је потребна мобилна верзија?

Користите мобилну верзију која одговарабило која платформа која тежи да добије висок рејтинг. На крају крајева, то је директан утицај на корисника, стварајући за њега угодне услове за боравак на вашој веб локацији.

Без мобилне верзије, не може постојати:

  • портале вијести, пошто је већина њих која гледа преко телефона на путу за рад или проучавање;
  • друштвене мреже - из истог разлога, плус постоји фактор комуникације он-лине, што значи да за то треба створити погодан, разумљив ћаск;
  • референтне локације, локације са навигацијом итд., где се људи окрећу када су у потрази за нечим;
  • онлине продавнице - прилика да привуче купце који не проводе вријеме на шопинг путовања, али купују све преко мобилног интернета.

Уместо закључивања

Данас су у питању мобилне технологијеактивни раст и развој, стога, тежња за лидерском позицијом на тржишту, свака компанија треба да осигура да његов Интернет ресурс испуњава услове. Због растућих захтева корисника, странице морају бити стално надограђене и прилагођене различитим уређајима. Јасно је да ако је некоме непријатно да буде на одређеном ресурсу, он не може добити информације о производу или цени, поставити наређење, сазнати о испоруци, наћи ће локацију на којој ће све то постати могуће. Због тога, како би побиједили на такмичењу, важно је имати флексибилан, практичан, функционалан и занимљив ресурс.

Направите ову мобилну верзију сајтаАндроид или ИОС. Да бисте то урадили, изаберите једну од наведених начина да Редизајн - адаптивно шаблону, стварајући нови сајт на поддомен и прелазак на њега преусмеравање употребу слободних предложака или направите мобилну апликацију путем које корисник једноставно да уђу и остану на страници.

Такав приступ ће помоћи не само да одржи лојалност постојећих купаца, већ ће и пружити прилику да привуче нове посетиоце.

</ п>