Вэб хуудсан дээр Mobile Devices-аас яаж илрүүлэх талаар

Хөдөлгөөнт контент, дизайныг хөдөлгөөнт төхөөрөмж рүү шилжүүлэх

Олон жилийн турш шинжээчид мобайл төхөөрөмж дээрх аялагчдын вэбсайт руу орох хөдөлгөөн эрс нэмэгдсээр байна гэж хэлж байна. Энэ шалтгааны улмаас олон компани утсаар онлайнаар утасдаж, гар утасны төхөөрөмж болон бусад хөдөлгөөнт төхөөрөмжүүдэд тохирсон туршлагыг бий болгох ухаалаг стратегийг хэрэгжүүлж эхэллээ.

Гар утасны вэб хуудсыг хэрхэн дизайн хийх талаар суралцаж, стратегиа хэрэгжүүлж эхэлснээс хойш та өөрийн вэбсайтын зочдод уг дизайныг харах боломжтой болно. Үүнийг хийх олон арга бий, зарим нь бусдаас илүү сайн ажилладаг. Таны вэбсайтууд дээр хөдөлгөөнт дэмжлэгийг хэрэгжүүлэхэд ашиглах аргыг доор харуулъя. Үүний тулд хамгийн сайн арга болох Өнөөгийн Вэб дээр төгсгөлийн зөвлөмжийг дагуулсан.

Өөр сайт дахь хувилбарыг холбох

Энэ нь гар утасны хэрэглэгчидтэй харьцах хамгийн хялбар арга юм. Хуудаснуудаа харах эсвэл харах боломжгүй байгаа эсэхийг мэдэхийн оронд хуудасны дээд хэсэгт байрлах холбоосыг өөрийн сайтын гар утасны хувилбар руу зааж өгнө үү. Дараа нь уншигчид мобайл хувилбараа харахыг хүсэж байгаа эсвэл "ердийн" хувилбарыг үргэлжлүүлэх эсэхийг өөрөө сонгож болно.

Энэ шийдэл нь ашиглалтыг хэрэгжүүлэхэд хялбар байх явдал юм. Энэ нь хөдөлгөөнт холбооны оновчтой хувилбар үүсгэхийг шаарддаг бөгөөд дараа нь хэвийн сайтын хуудасны дээд хэсэгт байрлах холбоос нэмэхийг шаарддаг.

Үүнд:

Эцэст нь хэлэхэд энэ арга нь орчин үеийн хөдөлгөөнт стратегийн нэг хэсэг байх магадлал багатай юм. Үүнийг заримдаа зогсоох завсар болгон ашиглаж байхад илүү сайн шийдэл боловсруулж байгаа боловч яг энэ үед богино хугацааны тусламжийн хэрэгсэл юм.

JavaScript ашиглах

Дээр дурдсан хандлагын өөр өөр хувилбар дээр зарим хөгжүүлэгч нь хэрэглэгчийн хөдөлгөөнт төхөөрөмж дээр байгаа эсэхийг илрүүлэхийн тулд хөтөч илрүүлэх скриптийн зарим төрлийг ашигладаг бөгөөд дараа нь тэр тусдаа гар утасны сайт руу шилжүүлэх болно. Хөтөч илрүүлэх болон хөдөлгөөнт төхөөрөмжтэй холбоотой асуудал нь олон мянган гар утасны төхөөрөмжүүд байдаг. Эдгээрийг бүгдийг нь нэг JavaScript ашиглан илрүүлэх гэж оролдохын тулд бүх хуудсыг татаж авах хар дарсан зүүд болгон хувиргаж болох бөгөөд энэ нь дээр дурдсан арга барилын адил олон сул талуудаас хамаарна.

CSS & # 64; медиа гарыг ашиглах

CSS тушаал @media handheld нь зүгээр л гар утсан дээрх гар утасны төхөөрөмжүүдийн CSS загварыг харуулах хамгийн тохиромжтой арга зам шиг санагдаж байна. Энэ нь гар утасны төхөөрөмжүүдийн хуудсыг үзүүлэх хамгийн тохиромжтой шийдэл шиг санагдаж байна. Та нэг веб хуудас бичээд дараа нь хоёр загварын хуудсыг үүсгэнэ. Эхнийх нь "дэлгэц" медиа хэлбэрт монитор болон компьютерийн дэлгэцийн хуудсыг хэвлэнэ. "Гар оврын" загвар нь таны гар утас гэх мэт жижиг төхөөрөмжүүдэд зориулсан хуудасныхаа хоёр дахь загвар юм. Хялбархан сонсогдох боловч энэ нь практик дээр үнэхээр ажилладаггүй.

Энэ аргын хамгийн том давуу тал бол та вэбсайтын хоёр хувилбарыг хадгалах шаардлагагүй юм. Та зүгээр л нэг хэвээр хадгалагддаг бөгөөд загварын хуудас нь хэрхэн харагдах ёстойг тодорхойлдог бөгөөд энэ нь бидний хүссэн төгсгөлийн шийдэлд ойртож байгаа юм.

Энэ аргын асуудал бол олон гар утас нь гар утасны медиа төрлийн төрлийг дэмждэггүй бөгөөд тэдгээр нь дэлгэцийн медиа төрлөөр тэдгээрийн хуудсыг харуулдаг явдал юм. Хуучин гар утас, гар утас нь CSS дэмждэггүй. Эцэст нь хэлэхэд, энэ арга нь найдваргүй бөгөөд вэбсайтын гар утасны хувилбаруудыг түгээхэд ховор байдаг.

Хэрэглэгч-Agent-г илрүүлэхийн тулд PHP, JSP, ASP-г ашиглана уу

Энэ нь хөдөлгөөнт төхөөрөмжийн хэрэглэгчид ашигладаггүй скрипт хэл буюу CSS дээр тулгуурлаагүй учраас гар утасны хэрэглэгчид чиглэлийн мобайл хувилбарыг дахин чиглүүлэх илүү сайн арга юм. Харин оронд нь сервер талын хэл (PHP, ASP, JSP, ColdFusion, г.м.) ашиглан хэрэглэгчийн төлөөлөгчийг хараад HTTP хүсэлтийг гар утасны төхөөрөмж дээр гар утасны хуудас руу зааж өөрчлөх.

Үүнийг хийхийн тулд энгийн PHP код иймэрхүү харагдах болно:

($ ua, "Windows CE") буюу
($ ua, "AvantGo") эсвэл
($ ua, "Mazingo") эсвэл
($ ua, "Мобайл") эсвэл
($ ua, "T68") эсвэл
($ ua, "Syncalot") эсвэл
($ ua, "Blazer")) {
$ DEVICE_TYPE = "MOBILE";
}
if (isset ($ DEVICE_TYPE) болон $ DEVICE_TYPE == "MOBILE") {
$ байрлал = 'mobile / index.php';
толгой ('Байршил:'. $ байршил);
гарах;
}
?>

Энд асуудал бол хөдөлгөөнт төхөөрөмжүүдэд хэрэглэгддэг өөр олон боломжит хэрэглэгчийн агентууд байдаг. Энэ скрипт нь бараг бүх зүйлийг дахин чиглүүлэх болно. Илүү их цаг хугацаа нэмж байна.

Дээрх бусад шийдлүүдийн нэгэн адил, эдгээр уншигчдад зориулсан тусдаа гар утасны сайтыг хадгалах хэрэгтэй болно! Хоёр буюу түүнээс дээш тооны вэбсайтуудыг удирдах шаардлагатай сул тал нь илүү сайн шийдлийг хайж олоход хангалттай үндэслэлтэй юм.

WURFL ашиглах

Хэрэв та гар утасны хэрэглэгчид тусдаа сайт руу дахин чиглүүлэхээр шийдсэн бол WURFL (Wireless Universal Resource File) нь сайн шийдэл юм. Энэ нь зөвхөн XML файл (болон одоо DB файл) болон DBI сангууд юм. Энэ нь зөвхөн сүүлийн үеийн утасгүй хэрэглэгчийн өгөгдөл агуулдаг боловч хэрэглэгчдийн дэмждэг боломжууд, боломжийг олгодог.

WURFL-г ашиглахын тулд XML тохируулгын файлыг татаж аваад өөрийн хэлийг сонгож, вэбсайт дээрх API-г хэрэгжүүлнэ. WURFL-г Java, PHP, Perl, Ruby, Python, Net, XSLT, болон C ++ ашиглан ашиглах боломжтой байдаг.

WURFL-ийг ашиглах нь ашиг тустай байдаг тул олон хүмүүс шинэчлэгдэж, тохиргооны файлд байнга нэмдэг. Тиймээс та татаж авсан файлаа татаж аваад дуусахаасаа хоцролттой байсан ч, хэрэв та үүнийг сард нэг удаа татаж авбал боломжит бүх гар утасны хөтчүүдийг уншигч таныг ямар ч асуудлууд. Мэдээжийн хэрэг, та үүнийг үргэлжлүүлэн татаж авах хэрэгтэй бөгөөд ингэснээр та хэрэглэгчдийг хоёр дахь вэбсайт болон үүсгэх сул талуудыг чиглүүлэх болно.

Шилдэг шийдэл нь хариуцлагатай дизайн

Өөр өөр сайтуудад өөр өөр сайтуудыг байлгах нь хариулт биш юм бол яах вэ? Хариуцлагатай вэб дизайн .

Хариуцлагатай загвар бол янз бүрийн өргөнтэй төхөөрөмжүүдэд зориулж стилийг тодорхойлоход CSS медиа асуулга ашигладаг. Загварчилсан дизайн нь хөдөлгөөнт болон хөдөлгөөнт бус хэрэглэгчдийн аль нэгэнд зориулан нэг веб хуудсыг үүсгэх боломжийг олгодог. Дараа нь та мобайл сайт дээр ямар контент үзүүлж болох талаар санаа зовох хэрэггүй юмуу эсвэл таны мобайл сайтад хамгийн сүүлийн үеийн өөрчлөлтийг шилжүүлэхийг санаарай. Дээр нь, CSS-г бичсэн бол та шинэ зүйлийг татаж авах шаардлагагүй болно.

Зохистой дизайн нь маш хуучин төхөөрөмжүүд болон хөтөч дээр төгс тохироогүй байж болно (ихэнх нь өнөөдөр маш бага хэрэглээтэй байгаа бөгөөд таны хувьд санаа зовох зүйл биш юм), гэхдээ энэ нь нэмэлт (content-ийг контент дээр нэмэх хол) эдгээр уншигчид нь таны вэбсайтыг унших боломжтой хэвээр байх болно, энэ нь зөвхөн хуучин төхөөрөмж эсвэл хөтөч дээр нь тохиромжтой харагдах болно.