Как да направите уебсайта мобилен

През 2016 г. за първи път използването на мобилен интернет надмина използването на компютър. Не би трябвало да е изненада за всеки, който обръща внимание.

Използването на мобилни устройства нараства още от момента, когато Apple пусна първия смартфон, а мобилните устройства се превърнаха в такава редовна част от ежедневието, че всички очакваме да виждаме хората, които гледат телефоните си всеки път, когато излизаме от къщата.

За собствениците на уебсайтове тази промяна в начина, по който хората си взаимодействат с мрежата, не е изненадваща, но все пак увеличава спешността, която трябва да имате, за да направите мобилен уебсайт . Ако в момента вашите мобилни посетители нямат добро изживяване, когато кацнат на уебсайта ви, вие прогонвате огромна част от потенциалния си трафик (и наранявате класирането на вашата търсачка в процеса).

Чували сте го досега, но отново го казваме. Вие имате да направите вашия сайт за мобилни приятелски. Но да знаеш, че това е нещо, което трябва да направиш и всъщност да знаеш как да го направиш са две различни неща.

10 стъпки, за да направите уебсайта си удобен за мобилни устройства
Какво ще научите … [ скрий ]

10 стъпки, за да направите уебсайта си удобен за мобилни устройства

1. Направете своя уебсайт отзивчив.
2. Накарайте хората да търсят информация по-лесно да намерят.
3. Не използвайте Flash.
4. Включете мета маркера Viewport.
5. Завъртете Автокоррекция за формуляри.
6. Направете размерите на бутоните големи, достатъчно за работа на мобилни устройства.
7. Използвайте големи размери на шрифта.
8. Компресирайте вашите изображения и CSS.
9. Позволете на лесен начин да преминете към изглед на работния плот.
10. Редовно провеждайте мобилни тестове.
    Ето няколко стъпки, които можете да предприемете сега, за да се уверите, че уебсайтът Ви работи добре както за вашите мобилни посетители, така и за потребителите на вашия десктоп.
11. Направете своя уебсайт отзивчив.
    Чувствителният уебсайт включва цялото едно и също съдържание и информация на всяко устройство, до което имате достъп, но променя начина, по който се показва и подрежда според размера на екрана на устройството. Това е най-добрият вариант да направите уебсайта си мобилен приятелски, тъй като не ограничавате информацията, до която могат да имат достъп посетителите на вашите мобилни устройства – те все още получават същото съдържание, което остатъка от посетителите ви правят. И отзивчивият дизайн също е добър за SEO. Google заяви, че това е техният предпочитан формат за мобилни уебсайтове .

Може да мислите, че не можете сами да създадете отзивчив уебсайт. Но тъй като отзивчивият дизайн се превърна в норма, има много инструменти, които да го направят възможно. Вижте топ 20 инструменти за уеб дизайн за отговорен уеб дизайн.

А супер лесният начин? Всички шаблони за дизайн в нашия конструктор на уебсайтове за влачене и пускане вече са оптимизирани за мобилни устройства.

пример за отзивчив дизайн

1. Накарайте хората да търсят информация по-лесно да намерят.
   Някои хора, които сърфират в мрежата на мобилните си устройства, нямат нищо против да отделят време за разглеждане или четене на съдържание със същото темпо, което биха направили на компютър, но други искат да намерят необходимата информация възможно най-бързо и възможно най-лесно. Помислете за информацията, която хората на мобилните устройства най-вероятно търсят, когато се отправят към вашия уебсайт, и поставете това някъде очевидно и лесно за намиране на началната страница за мобилни устройства.

Обмислете също така често задаваните въпроси, които хората най-често търсят, когато посещават вашия уебсайт. Възможно е да няма смисъл да поставяте всички отговори отпред и в центъра на началната си страница за мобилни устройства, но трябва да ги улесните в намирането и навигирането на мобилно устройство.

1. Не използвайте Flash.
   Използването на Flash във вашия уебсайт е SEO грешка . Това може да забави времето за зареждане на страницата и има много браузъри и устройства, където тя изобщо не работи.

Нито Android, нито iOS устройства поддържат флаш, така че ако създадете уебсайт, който зависи по някакъв начин от опита на Flash анимация, вашите мобилни потребители ще останат без. В този момент е най-добре да бракувате напълно технологията на вашия уебсайт и да намерите силен уеб дизайн, който работи без нея.

1. Включете мета маркера Viewport.
   Мета маркерът на viewport е лесен начин да контролирате как уебсайтът ви се показва на мобилни устройства. Ако страницата ви се отвори със същата ширина на малкия екран на телефона ви, както на вашия работен плот, ще трябва да направите някои неудобни превъртания отстрани, за да прочетете всеки ред текст и да видите различните страни на страницата. Мета маркерът на viewport казва на браузърите да прилягат на ширината на страницата ви към екрана на типа устройство, от което идва посетителят.

Добавянето на това към вашия html е доста просто. Просто го поставете върху HTML за всяка страница:Завъртете Автокоррекция за формуляри.
Нещо, за което не е лесно да се мисли е малкото начини, по които автокорекцията може да направи взаимодействието на потребителя с вашия уебсайт по-неудобно. Ако на вашия уебсайт имате формуляри, които изискват информация за име или адрес, един малък начин да улесните предоставянето на тази информация за посетителите на мобилните си устройства е да изключите автоматичната корекция за всяко поле на формуляр, в противен случай телефонът им ще се опита да промени името или името на улицата към по-често срещани думи и забавете процеса на попълване на формата си.

В полето за въвеждане не забравяйте да включите autocorrect = off в html.

1. Направете размерите на бутоните големи, достатъчно за работа на мобилни устройства.
   Достатъчно лесно е да щракнете върху бутон с почти всякакъв размер с мишката, но когато се опитвате да „щракнете“ с пръсти върху малък екран на смартфон, с малки бутони е трудно да се справите . И това е особено вярно, ако има множество малки бутони близо един до друг – натискането на едно, докато се опитвате да натиснете друго, ще предизвика истинско раздразнение за вашите посетители.

Най-добрият начин да спасите посетителите си от това неудовлетворение е да използвате по-големи бутони. Всеки път, когато добавите бутон към вашия сайт (и за всички, които вече са там), отделете време, за да ги изпробвате на колкото и да е много мобилни устройства, които можете да откриете сред служителите и семейството си. Уверете се, че избирането на всеки бутон е разумно лесно на всички устройства и, ако не е, го актуализирайте така, че да е така.

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

1. Използвайте големи размери на шрифта.
   Четенето на малък екран е толкова по-трудно, ако шрифтът е мъничък. Най-добре е да използвате размер на шрифта от поне 14 пиксела на уеб страниците си, но продължете напред и изпробвайте как изглежда това, за да видите дали увеличението може да бъде по-добре тук.

Най-добре е също да се придържате със стандартни шрифтове. Всеки шрифт, който браузърът на вашия посетител може да изтегли, ще забави колко време отнема зареждането на уебсайта ви, което е лоша новина за мобилни устройства.

1. Компресирайте вашите изображения и CSS.
   Говорейки за времето за зареждане на сайта, винаги искате скоростта на вашия сайт да бъде бърза. Но ако нещо друго, тази скорост е по-важна при мобилните. Това означава, че още една добра стъпка за превръщането на вашия уебсайт в мобилен е да компресирате всичко, което заема много място и забавя времето за зареждане, като вашите изображения с висока разделителна способност и CSS.

Ако компресирате размерите на вашите изображения, те ще се зареждат по-бързо, без да се отразяват негативно на качеството на това, което хората виждат в сайта.

1. Позволете на лесен начин да преминете към изглед на работния плот.
   Някои от вашите мобилни посетители всъщност могат да предпочетат вместо това да виждат настолната версия на вашия уебсайт (особено ако отидете с мобилна версия на вашия уебсайт, а не с отзивчив сайт).

Уверете се, че им дадете начин да направят това, ако това е тяхното предпочитание. Искате посетителите ви да могат да взаимодействат с вашия уебсайт по начин, който има най-голям смисъл за тях.

1. Редовно провеждайте мобилни тестове.
   Най-доброто нещо, което можете да направите, за да сте сигурни, че мобилният ви опит на уебсайта е добър, е редовно да го тествате сами на мобилното си устройство. Всяко толкова често дръпнете уебсайта си на телефона и таблета си и отделете известно време, за да видите дали нещо е трудно да се види или е трудно да се направи. Помолете служителите си да направят същото и помислете дали да наемете потребители също да правят тестове (тъй като те ще виждат всичко с нови очи).

Направете уебсайта си мобилен
Дори и да получите всичко както трябва днес, начинът, по който изглеждат и работят мобилните устройства, ще се променя непрекъснато и днешният уебсайт за мобилни устройства може все още да не свърши работата утре. Продължете да тествате, продължавайте да настройвате където е необходимо и продължете да мислите за своите мобилни потребители като приоритет и трябва да сте добре.