متاسفانه
عرصه موبايل پيچيدگي خاص خود را دارد و رويارويي با آن مي‌تواند براي
توسعهدهندگان مشکل باشد. توسعه موبايل چيزي فراتر از سازگاري با
مرورگرهاي مختلف است و بايد با بسترهاي مختلف سازگار شود. تعداد وسيعي از
دستگاه‌هاي موبايل توسعهدهندگان را ياد روزهايي مي‌اندازد که مجبور
بودند فقط از مرورگرهاي خاصي پشتيباني کنند. افزون بر آن، براي پشتيباني
از بسترهاي مختلف، هر دستگاه ممکن است از تعداد زيادي مرورگر وب موبايل
استفاده کند. براي مثال يک کاربر آندرويد مي‌تواند با استفاده از مرورگر
خاص آندرويد يا با نصب اپراميني يا فايرفاکس موبايل به سايت‌ها دسترسي
يابد.
وب
موبايل موضوعات مختلفي را دوباره مطرح کرد که در سال‌هاي اخير فراموش شده
بودند. با آمدن شبکه‌هاي نسل چهارم، پهناي باند يک موضوع جدي براي مشتريان
موبايل شد، بعلاوه دستگاه‌هاي موبايل صفحه بسيار کوچکي دارند كه ترکيب اين
موضوعات به همراه مشکلات سازگاري با بسترهاي مختلف باعث مي‌شود به راحتي
درک کنيم که چرا توسعه موبايل بسيار شبيه «گامي به عقب در زمان» است.
پياده‌سازي شيوه‌نامه‌هاي موبايل
نخستين گام براي افزايش پشتيباني از موبايل براي يک وب‌سايت، شامل يک شيوه‌نامه خاص تنظيمCSS براي دستگاه‌هاي موبايل است.
روش‌هاي سوي سرور و رشته UA
يک
رويکرد براي قراردادن شيوه‌نامه‌هاي موبايل نيازمند شناسايي رشته عامل
کاربر با استفاده از يک زبان سوي سرور (server-side) مانند PHP است. با
استفاده از اين تکنيک، سايت مي‌تواند دستگاه‌هاي موبايلي را که از يک
شيوه‌نامه مناسب استفاده كرده يا کاربر را به يک زيردامنه موبايل
(m.jamejamonline.ir كه البته هنوز موجود نيست) راهنمايي مي‌کنند، شناسايي
کند. اين رويکرد سوي سرور چند مزيت دارد از جمله اين‌كه بالاترين سطح
سازگاري را تضمين مي‌کند و همچنين به وب‌سايت‌ها اجازه مي‌دهد از محتويات
و نشانه‌گذاري‌هاي خاصي براي کاربران موبايل استفاده کنند.
با
اين كه چنين تکنيکي براي وب‌سايت‌هاي سطح سرمايه‌گذاري عالي به‌نظر
مي‌رسد، ولي نگراني‌هاي عملي‌اي وجود دارند که پياده‌سازي آن را روي بيشتر
سايت‌ها مشکل مي‌کند. روزانه رشته‌هاي عامل زيادي براي کاربران جديد توليد
مي‌شود، بنابراين نگهداشتن فهرست UA user agent (يا عامل کاربر) تقريبا
غيرممکن است. بعلاوه اين رويکرد به دستگاه بستگي دارد تا به عامل کاربر
حقيقي خود کمک کند، هرچند در گذشته مرورگرها رشته UA خودشان را براي
دورزدن اين نوع شناسايي جعل مي‌کردند! مثلا هنوز هم بيشتر رشته‌هاي UA با
«موزيلا» شروع مي‌شود تا از بررسي‌هاي نت‌اسکيپ عبور کند (روشي که در دهه
90 استفاده مي‌شد)، يا براي سال‌هاي متمادي اوپرا وانمود مي‌کرد که IE است!
روش ابتکاري کاربر
به
خاطر سختي‌هايي که با شناسايي UA موبايل همراه است و همچنين مشکلات
پرس‌وجوهاي رسانه‌اي، برخي از شرکت‌ها مثل IKEA راه جديدي را در پيش
گرفتند تا به کاربر اجازه دهند خودش تصميم بگيرد که آيا مي‌خواهد نسخه
موبايل وب‌سايت را ببيند يا خير. در حالي‌که اين روش نقطه ضعف واضحي از
نياز به تعامل بيشتر با کاربر دارد ولي بي‌شك ساده‌ترين روش براي اجراست.
سايت،
لينکي با عنوان «از سايت موبايل ما ديدن فرماييد» دارد که کاربر را به
زيردامنه موبايل انتقال مي‌دهد. اين رويکرد اشکالاتي هم دارد از جمله
اين‌كه برخي از کاربران موبايل ممکن است لينک را نبينند يا اگر بدون در
نظر گرفتن اين‌که چه دستگاهي در حال استفاده است، لينک براي همه قابل رويت
باشد و بازديدکنندگان دستگاه‌هاي غيرموبايل هم ممکن است روي آن کليک کنند.
البته از اين فايده مهم كه به کاربر اجازه داده مي‌شود خودش انتخاب کند، نمي‌توان گذشت.
برخي
از کاربران طرح‌بندي متراکمي که براي دستگاه آنها بهينه‌سازي شده را
ترجيح مي‌دهند در حالي‌که کاربران ديگر ممکن است بخواهند وب‌سايت بدون
محدوديت‌هاي طرح‌بندي موبايل دسترسي داشته باشد.
چه چيزهايي بايد تغيير کنند؟
وقتي شيوه‌نامه‌هاي موبايل را پياده‌سازي کرديم، زمان آن مي‌رسد که ببينيم کدام‌يک از شيوه‌ها را مي‌خواهيم تغيير دهيم؟
تغيير وضعيت واقعي صفحه
هدف
اصلي شيوه‌نامه‌هاي موبايل تغيير طرح‌بندي براي يک نمايش کوچک‌تر است. در
درجه نخست اين مساله به معناي کاهش طرح‌بندي‌هاي چندستونه به تک‌ستونه
است. بيشتر صفحه‌هاي موبايل عمودي هستند، بنابراين فضاي افقي بيش از پيش
گران تمام مي‌شود و طرح‌بندي‌هاي موبايل به ندرت مي‌توانند بيشتر از يک
ستون اطلاعات را در بر بگيرند.
در
گام بعدي با تنظيماتdisplay:none روي عناصر با اهميت پايين‌تر، از شلوغي
کلي صفحه کاسته مي‌شود و در نهايت ذخيره پيکسل‌هاي افزوده به وسيله کاهش
حاشيه‌ها و لايه‌ها براي ساخت يک طرح‌بندي بسته‌تر صورت مي‌گيرد.
هدف
ديگر شيوه‌نامه‌ها کاهش پهناي باند براي شبکه‌هاي موبايل کندتر است. نخست
اطمينان حاصل کنيد که تصاوير زمينه بزرگ را حذف يا جايگزين کرده‌ايد،
بويژه اگر از يک تصوير زمينه براي کل سايت استفاده مي‌کنيد. بعلاوه براي
تصاوير غيرضروري تنظيمات display:none را انجام دهيد.
اگر
سايت شما براي دکمه‌ها يا نوارهاي کناري از عکس استفاده مي‌کند، توجه
داشته باشيد که آنها را با متن ساده CSS متناظرشان جايگزين کنيد.
در
کنار رويارويي با نگراني‌هاي اندازه صفحه و پهناي باند، چند تغيير ديگر
نيز وجود دارد که بايد در تمام شيوه‌نامه‌هاي موبايل اعمال شود. مي‌توانيد
خوانايي را با افزايش اندازه فونت هر متن ريز، متوسط يا زياد کنيد. عموما
کليک کردن در دستگاه‌هاي موبايل دقت کمتري دارد بنابراين توجه کنيد مناطق
قابل کليک براي دکمه‌ها يا لينک‌هاي مهم را با تنظيمات display:block
افزايش دهيد و براي عناصر قابل کليک لايه اضافه کنيد.
عناصر
شناور براي طرح‌بندي‌هاي موبايل مشکلاتي را ايجاد مي‌کنند بنابراين آنهايي
که شناورند و ضروري نيستند را حذف کنيد. به ياد داشته باشيد فضاي افقي
بويژه در موبايل هزينه‌بر است، بنابراين پيمايش عمودي را انتخاب کنيد.
محمدحسين کردوني
منبع: smashingmagazine