Кампутары, Інфармацыйныя тэхналогіі
Адаптацыя сайта пад мабільныя прылады: пакрокавая інструкцыя. Мабільная версія сайта
Мабільная адаптацыя сайта становіцца ўсё больш запатрабаванай з-за павелічэння колькасці смартфонаў і планшэтаў. Што яна сабой уяўляе? Якія перавагі дае? Асабліва гэтае пытанне актуальнае для ўладальнікаў інтэрнэт-крам, сайтаў розных сэрвісных кампаній, блогаў і папулярных форумаў. Як можа быць праведзена адаптацыя сайта пад мабільныя прылады? Вось невялікі пералік пытанняў, якія мы разгледзім у рамках артыкула.
Агульная інфармацыя
Такім чынам, для пачатку давайце разгледзім, што сабой уяўляе адаптыўны дызайн. Так называецца канфігурацыя, пры якой на ўсе прылады адпраўляецца адзін і той жа HTML-код, але памеры элементаў карэктуюцца дзякуючы CSS. Розныя пошукавыя робаты ўмеюць распазнаваць такія сайты пры ўмове, што старонкі і рэсурсы адкрытыя для сканавання. Для таго каб паказваць браўзэрам на наяўнасць такой магчымасці, выкарыстоўваецца тэг meta name = "viewport". Што ж уяўляе сабой адаптацыя сайта пад мабільныя прылады?
разгледзім тэг
Такім чынам, неабходна паклапаціцца аб тым, каб быў тэг meta name = "viewport". Навошта ён? Менавіта ў ім знаходзяцца інструкцыі для браўзэра пра тое, як варта карэктаваць памеры і маштабаваць старонку з улікам шырыні экрана прылады, з якога праглядаецца сайт. Калі не дадаць гэты невялікі элемент, то па змаўчанні будзе паказаная старонка, разлічаная на кампутары. Але пры гэтым мабільныя браўзэры будуць старацца аптымізаваць змест, што выкажацца ў павелічэнні шрыфтоў, маштабаванасці зместу або адлюстраванні часткі змесціва, якое залазіць на экран. Прыемна гэта? Не, мабільная версія сайта ў такім выпадку выкліча толькі негатыўнае ўспрыманне. Бо шрыфты будуць непрапарцыйнымі, прыйдзецца пракручваць старонку і здзяйсняць яшчэ шэраг дзеянняў, якія, хоць і з'яўляюцца другараднымі, але ўсё ж стомныя. Праверыць адаптацыю сайта пад мабільныя прылады можна з дапамогай смартфона, планшэта або спецыяльных сэрвісаў і праграм. Вядома, два першыя варыянты больш пераважныя, але калі патрэбен пільны аналіз з пазіцыі розных прылад і эканоміі часу, тады падыдуць апошнія.
Якія ж перавагі дае адаптацыя сайта пад мабільныя прылады?
- Карыстальнікам дзяліцца кантэнтам ў тых выпадках, калі ў яго ёсць адзін адрас.
- Алгарытмах пошукавых сістэм атрымліваць дакладныя параметры старонкі, няма блытаніны з рознымі версіямі.
- Знізіць верагоднасць ўзнікнення памылак.
- Скараціць час загрузкі дзякуючы адсутнасці неабходнасці переиндексации.
- Эканоміць рэсурсы.
Акрамя таго, адаптыўную старонку стварыць лягчэй, чым некалькі варыянтаў чагосьці аднаго. Адаптацыя сайта пад мабільныя прылады (самому гэта зрабіць цалкам магчыма) не з'яўляецца чымсьці складаным, дастаткова ведаць JavaScript і ўмець працаваць з каскаднымі табліцамі стыляў (CSS) і малюнкамі. Існуе мноства падыходаў да выканання пастаўленай задачы. У рамках артыкула будзе разгледжана тры самых папулярных варыянту:
- Упор на JavaScript.
- Камбінаванне.
- Дынамічнае выкарыстанне JavaScript.
Давайце ж разгледзім іх больш падрабязна.