Вероятно сте виждали как iPhone може да обръща и разширява уеб страниците. Тя може да ви покаже цялата уеб страница с един поглед или да увеличи, за да направи текста, който ви интересува, четлив. В един смисъл, тъй като iPhone използва Safari, уеб дизайнерите не трябва да правят нищо специално, за да създадат уеб страница, която да работи на iPhone.
Но наистина ли искате страницата ви просто да работи? Повечето дизайнери искат техните страници да блестят!
Когато създавате уеб страница , трябва да помислите кой ще я разгледа и как ще го видите. Някои от най-добрите сайтове отчитат какъв тип устройство се разглежда на страницата, включително разделителната способност, цветовите опции и наличните функции. Те не разчитат само на устройството, за да го разберат.
Общи указания за изграждане на сайт за мобилни устройства
- Тествайте колкото се може повече устройства. Първото нещо, което трябва да направите, е да прегледате сайта си на iPhone и толкова различни мобилни устройства или емулатори, колкото можете. Въпреки че можете да използвате емулатори за всичките си тестове, те наистина не ви дават същото чувство като опитвайки се да се движите в уебсайт на малкия малък екран, така че тествайте на възможно най-много устройства.
- Направете страниците си да се разпаднат грациозно. Можете да напишете страниците си за широкоекранен браузър с възможност за работа с Flash, но се уверете, че критичната информация е видима дори и при малък монитор, който не може да обработва специални функции (като "бисквитки", Ajax, Flash, JavaScript и др.). Всичко отвъд XHTML Basic ще бъде отвъд някои мобилни телефони. Докато повечето смартфони могат да се справят с всички тези неща (освен Flash на iPhone, разбира се), други мобилни устройства не могат.
- Изградете безжична конкретна страница и я улеснете лесно. Ако възнамерявате да създадете конкретна страница за мобилния си телефон и безжичните клиенти, го направете достъпна. Чудесен начин е да поставите връзката към безжичната страница най-отгоре на документа и след това да скриете тази връзка от не-ръчни устройства, като използвате ръчния тип носител. В края на краищата повечето хора идват на началната си страница, дори на мобилни телефони - и ако връзката към вашата безжична страница не е там, те ще напуснат, ако страницата е твърде трудна за използване.
Уебстраница за смартфони
Първото нещо, което трябва да помните, когато пишете страници за пазара на смартфони, е, че не е нужно да правите промени, ако не искате. Най-хубавото за повечето смартфони е, че използват уеб браузъри (Safari в iOS и Chrome на Android), за да показват уеб страници, така че ако страницата ви изглежда добре в Safari или Chrome, ще изглежда добре на повечето смартфони (много по-малки ). Но има неща, които можете да направите, за да направите преживяването на браузъра по-приятно:
- Не забравяйте, че екранът е малък. Смартфоните ще кондензират всички тези колони в малкия прозорец и това ще ги направи много трудни за четене без мащабиране. Повечето потребители са свикнали да мащабират, но могат да се натъпчат. Една дълга колона от текст е по-лесна за четене.
- Разделете страниците на по-малки парчета. Може да е трудно да се четат дълги сегменти от текста на мобилен телефон, така че поставянето им на няколко страници ги прави по-лесни за четене.
Връзки и навигация в iPhone
- Колкото по-къси са URL адресите, толкова по-добре. Ако някога сте се опитвали да въведете URL адрес на мобилен телефон, ще знаете, че това е болка (освен може би за тийнейджъри, които са свикнали да изпращат много текстови съобщения). Дори и на iPhone, е доста трудно да въведете дълги URL адреси. Дръжте ги кратки.
- Но текстът с дълга връзка е по-лесен за докосване. Когато на страница, където няколко отделни думи са свързани с различни статии, съвсем близо една до друга, може да бъде много трудно да се натисне правилната, без да се мащабира. Много хора просто ще се откажат и ще отидат някъде другаде. Връзките с 3-5 думи в тях са по-лесни за кликване върху телефона, отколкото 1-дума връзки.
- Не поставяйте навигацията си в самия връх на екрана. Няма нищо по-досадно, отколкото да се налага да преглеждате екрани и екрани от връзки, за да намерите желаната от вас информация. Ако сте разгледали уеб страници, предназначени за мобилни телефони, ще видите, че първите неща, които се показват, са съдържанието и заглавието. След това, под това е навигацията.
- Не се страхувайте да скриете навигацията си. Скриването на навигационните връзки с CSS или JavaScript и това, че се появяват само когато потребителят го поиска, е начин да направи страницата по-лесна за потребителите на смартфони.
Съвети за изображения на смартфони
- Изображенията трябва да са малки. Да, Android и iPhone могат да мащабират и разширяват изображенията , но колкото по-малки са те, толкова по-щастливи ще са вашите безжични клиенти, както при размерите, така и при изтеглянето. Оптимизирането на изображенията винаги е добра идея, но за страниците с мобилни телефони е критична.
- Изображенията трябва да се изтеглят бързо. Снимките заемат много място в уеб страниците, когато ги разглеждате от мобилно устройство. И докато те често са много приятни и правят страниците да изглеждат по-добре, когато се гледат на уеб браузър на цял екран, те често попадат на пътя на мобилно устройство. Освен това, когато потребител на смартфон е в клетъчната мрежа, последното нещо, за което искат да плати, е да изтегли куп огромни изображения или икони за навигация.
- Не поставяйте големи изображения в горната част на страницата. Точно както при навигацията, може да е много досадно да изчакате изображение, което заема 3-4 екрани, за да се зареди в най-горната част на страницата. Това е изключително често срещано в уеб страниците. Единственото изключение от това е, ако читателят знае, че ще получат изображение, когато кликнат, казват в фото галерия.
Какво да избягвате при проектирането за мобилни устройства
Има няколко неща, които трябва да избягвате, когато създавате страница, която е удобна за мобилни устройства. Както споменахме по-горе, ако наистина искате да имате тези на вашата страница, можете да, но се уверете, че сайтът работи без тях.
- Flash - повечето мобилни телефони не поддържат Flash, така че не е добра идея да я включите на безжичните си страници.
- "Бисквитки" - много мобилни телефони нямат поддръжка на "бисквитки". iPhones имат поддръжка на "бисквитките".
- Рамки - дори ако браузърът ги поддържа, помислете за размерите на екрана. Рамките просто не работят на мобилни устройства - те са много трудни или невъзможни за четене.
- Таблици - не използвайте таблици за оформление на мобилна страница. И се опитайте да избегнете масите като цяло. Те не се поддържат на всеки мобилен телефон (въпреки че iPhone и други смартфони ги поддържат) и може да се окажете със странни резултати.
- Вмъкнати таблици - ако трябва да използвате таблица, уверете се, че не я скриете в друга таблица. Те са трудни за поддържане на настолните браузъри и в най-добрия случай зареждат страницата по-бавно.
- Абсолютните мерки - с други думи, не определят размерите на обектите в абсолютни размери (като пиксели, милиметри или инчове). Ако определите нещо като ширина 100px, на едно мобилно устройство, което може да е половината от екрана, а на друго може да е два пъти по-широка. Относителните размери (като ems и проценти) работят най-добре.
- Шрифтове - не предполагайте, че някой от шрифтовете, до които сте свикнали да имате достъп, ще бъде налице на мобилните телефони.
Прочетете още
- Как да направите вашия уеб сайт Mobile приятелски чрез PHP