جعل موقع الويب الخاص بك أكثر ملاءمة للجوال

نشرت: 2016-03-31

يعد الوصول إلى الويب في الوقت الحاضر أمرًا حيويًا للغاية في عالم اليوم حيث أن العديد من الأشخاص على استعداد للتواصل مع الشركات عبر الإنترنت من خلال الأجهزة بجميع أنواعها وأحجامها وأنواعها.

يعد إنشاء موقع ويب رائع وسهل الاستخدام على جهاز كمبيوتر عادي أمرًا واحدًا ؛ صنع جهاز يمكن عرضه على جميع أنواع الأجهزة هو شيء آخر. هذه فرصة رائعة فقط إذا كنت قد صممت موقع الويب الخاص بك بطريقة توفر للمستهلكين ما يحتاجون إليه سواء على الهواتف الذكية الصغيرة أو أجهزة الكمبيوتر والأجهزة اللوحية ذات الشاشات المسطحة الضخمة.

تبحث هذه المقالة في أكثر الطرق العملية حول كيفية إنشاء موقع ويب يعمل بسلاسة مع جمهورك وفحص إيجابيات وسلبيات وتأثير كل منها من شأنه تحسين رضا عملائك بالتأكيد.

إذن ، ما هي أفضل طريقة؟

1. حدد التكنولوجيا المناسبة للتطبيق

هناك العديد من الطرق التي يمكن استخدامها لإنشاء موقع ويب سهل الاستخدام للجوال يلائم احتياجات عملائك وأعمالك بما في ذلك أهداف العمل وتوقعات العملاء أيضًا. اعتمادًا على النهج الذي تستخدمه لتكوين موقع الويب الخاص بك لجميع الشاشات ، تأكد من أنه فريد من نوعه بالنسبة للعلامة التجارية لموقع الويب الخاص بك وأعمالك ، وقبل كل شيء ، يجب أن تكون الطريقة فعالة من حيث التكلفة وتخدم جميع المواقع من مجال واحد فقط ، مثل www.example.com .

مع وضع ذلك في الاعتبار ، دعنا نلقي نظرة على أفضل الطرق التي يمكن استخدامها لإنشاء موقع ويب سهل الاستخدام للجوال. توجد في الواقع ثلاثة أنواع وتوفر كل طريقة تجربة مختلفة لمستخدمي الأجهزة المحمولة: تصميم سريع الاستجابة وموقع محمول منفصل تمامًا وتصميم قابل للتكيف / RESS / ديناميكي.

تصميم الويب سريع الاستجابة (RWD)

هذا التصميم عبارة عن تقنية تستخدم رمز HTML واحدًا يتم إرساله من الخادم إلى جميع الأجهزة ويتم استخدام CSS لضبط تصوير الصفحة على الجهاز. هذا يجعل المشاهدة موحدة على أي جهاز لأن الكود ينشأ من نفس عنوان URL ولكن المحتوى ينثني بحيث يتناسب مع الشاشة التي يتم استخدامها في الوقت الحالي. يتطلب تصميم موقع الويب سريع الاستجابة تخطيطًا مسبقًا لأن التكلفة الأولية عادة ما تكون أعلى ولكن بمجرد اكتمالها ، تكون الصيانة سهلة للغاية.

الترميز

  • استخدم name="viewport"

هذا يوجه المتصفح لتغيير عرض المحتوى.

كيفية استخدام name="viewport" ؟

من أجل إعطاء إشارة للمتصفح بأن الصفحة سوف تتكيف مع جميع أحجام الشاشة ، تتم إضافة العلامة الوصفية إلى رأس المستند.

[الشفرة]
<meta name = محتوى "منفذ العرض"
[/الشفرة]

تقوم علامة meta viewport هذه بإرشاد المتصفح إلى كيفية تنظيم حجم وقياس عرض الشاشة قيد الاستخدام.

في حالة عدم وجود علامة meta viewport ، تحاول متصفحات الهاتف المحمول عادةً جعل محتوى موقع الويب يبدو أفضل عن طريق زيادة أحجام الخطوط وتوسيع نطاق محتوى موقع الويب ليشغل حجم الشاشة بالكامل أو من خلال إظهار جزء فقط من موقع ويب يناسب حجم الشاشة. يحدث هذا لأن متصفحات الجوال تحاول جعل محتوى موقع الويب افتراضيًا وفقًا لأبعاد شاشة سطح المكتب العادية. هذا يجعل الأمر صعبًا على مستخدمي الأجهزة المحمولة نظرًا لأن أحجام الخطوط لمحتوى موقع الويب تميل إلى أن تكون غير متسقة ، مما يضطرهم إما إلى الضغط للتكبير أو النقر المزدوج من أجل رؤية محتوى موقع الويب بوضوح.

لإنشاء صورة سريعة الاستجابة ، قم بتضمين عنصر <picture> .

هذه هي القاعدة العامة إذا كان موقع الويب الخاص بك يعمل بشكل جيد مع معظم المتصفحات الحالية.

أهمية تقنية تصميم مواقع الويب سريعة الاستجابة

يوصى بتصميم الويب سريع الاستجابة للأسباب التالية:

  • يمكّن زوار موقع الويب الخاص بك من الارتباط بالمحتوى الخاص بك باستخدام عنوان URL واحد. هذا يجعل إدارة مُحسّنات محرّكات البحث أمرًا سهلاً للغاية وبالتالي ينتج عنه نتائج رائعة نظرًا لأن لديك رؤية موحدة لنتائجك.
  • فعاله من حيث التكلفه. عادةً ما تستغرق مواقع الويب المستجيبة وقتًا أطول في التصميم ولكنها تدوم لفترة أطول بأقل قدر من الصيانة أو لا تتطلب أي صيانة حيث يلزم تطبيق الترقيات مرة واحدة فقط. هذا في الواقع يوفر لك الوقت والمال.
  • ضمان تجربة مستخدم جيدة. إذا تم تصميم مواقع الويب الخاصة بك بحيث تكون مرنة وتتوافق مع أي أجهزة يختارها المستخدم ، فهذا يجعلهم سعداء وسيؤدي ذلك في الواقع إلى تحسين رضا عملائك مما يؤدي إلى المزيد من الربح لعملك.
  • يقلل من احتمالية مواجهة الأخطاء الشائعة التي تؤثر بالفعل على مواقع الجوال.
  • باستخدام تقنية تصميم الويب سريع الاستجابة ، ليست هناك حاجة لإعادة توجيه المستخدمين وهذا يقلل بشكل كبير من وقت التحميل.
  • معدل التحويل المحسن. تتسق المواقع المحسَّنة بغض النظر عن الجهاز الذي يتم عرضه عليه ، وبالتالي تزيد هذه من تجارب المستخدم حيث أن غالبية العملاء قادرون على التفاعل معك.

في الواقع ، لم تعد إستراتيجية تصميم مواقع الويب سريعة الاستجابة اتجاهًا ولكنها أمر لا بد منه. هذا لأنه يوفر للعملاء تجربة محسّنة جميلة بغض النظر عن اختيار الشاشة التي يشاهدون موقع الويب الخاص بك عليها. هذا يعني أنه سيكون لديك نطاق ممتد لخدماتك وسيجعلك تتقدم في عالم الأعمال.

تصميم متكيف / RESS / ديناميكي

تم تصميم هذه الطريقة بطريقة يلاحظ خادم موقع الويب نوع وحجم الجهاز الذي يستخدمه الزائر ثم يقدم صفحة مخصصة مصممة لهذا الجهاز المعين سواء كان هاتفًا محمولاً أو جهازًا لوحيًا أو شاشة كبيرة تلفزيون ذكي.

في طريقة تصميم موقع الويب هذه ، يظل عنوان URL هو نفسه أيضًا ولكن الخادم هو الذي يرسل كود HTML و CSS مختلفًا فيما يتعلق بنوع الجهاز الذي يستخدمه الزائر.

ما أهمية تصميم الويب التكيفي؟
  • هناك نطاق ترددي مخفض ، على سبيل المثال ، يكون إرسال مقطع فيديو إلى موقعك قصيرًا مثل هذا: <video src="…"></video> . بدلاً من إجراء البرمجة الأطول الذي يتم استخدامه بواسطة طريقة سابقة أخرى.
  • زيادة سرعة الخادم. يضمن تسليم المحتوى الجاهز للعرض إلى الجهاز عند الاستخدام بشكل أسرع ويضمن أيضًا تحميل أسرع للصفحات.
  • يستخدم استخدام عنوان URL واحد. هذا هو نفسه مع التصميم سريع الاستجابة حيث يتم الاحتفاظ بالمستخدمين بعنوان URL واحد فقط.
مساوئ تقنية تصميم الموقع التكيفي
  • البرمجة التكيفية لها بعض النواقص من حيث أن هناك محتوى متشعب. يحدث هذا بسبب المجموعات المتعددة من نفس المحتوى المخصصة لأجهزة مختلفة. في حالة عدم وجود نظام CMS متطور في مكان واحد ، فإن الحفاظ على المحتوى على جميع الأجهزة يمكن أن يسبب بعض التحديات.
  • ثانيًا ، في هذا النوع من تصميم مواقع الويب ، توجد بعض الأخطاء الشائعة مثل اكتشاف الجهاز الخاطئ. يحدث هذا بسبب البرامج النصية التي تديرها الخوادم التي انتهت صلاحيتها مما يتسبب في إرسال البرامج النصية لمنصة تعتمد على الأجهزة المحمولة إلى مستخدمي الأجهزة اللوحية. خطأ آخر ينشأ بسبب استخدام تقنية تصميم موقع الويب هذا هو أن الخادم يفترض دائمًا اتجاه الجهاز الذي يكون في الغالب عموديًا لهذه الحالة ، ولكن قد يكون المستخدم يحمل الجهاز في وضع أفقي.
  • بالإضافة إلى ذلك ، يميل تصميم الويب هذا إلى إرباك المستخدمين بسبب تعدد المواقع حيث تظهر بشكل مختلف على أجهزة مختلفة. لتجنب هذا الخطأ ، تأكد من التعرف على مظهر وملمس علامتك التجارية على أنهما متماثلان على جميع الأجهزة.

يعد تصميم موقع الويب التكيفي هو الأنسب للشركات الكبيرة التي تقوم بشكل متكرر بإجراء تغييرات على مواقع الويب الخاصة بها. ومع ذلك ، يلزم وجود محترف قادر ليكون مسؤولاً عن المجموعات المعقدة من أكواد مواقع الويب المطلوبة.

إنشاء موقع جوال مختلف

هذا هو الخيار الثالث حيث قد يختار مصمم الويب إنشاء موقع جوال مختلف يختلف في هيكله عن إصدار سطح المكتب لموقع الويب. يعمل هذا بطريقة تكتشف أنظمة مواقع الويب جميع مستخدمي الأجهزة المحمولة وتعيد توجيههم إلى موقع ويب مختلف محسّن للجوّال ، وعادةً ما يستخدم هذا اسم مجال آخر غالبًا مجالًا فرعيًا إلى المجال الرئيسي ، مثل m.example.com .

يسمح هذا لمستخدمي الهاتف المحمول فقط بمشاهدة موقع الجوال بينما يرى المستخدمون على الأجهزة الأخرى مثل الأجهزة اللوحية وأجهزة التلفزيون الذكية موقع سطح المكتب الخاص بك دائمًا.

تتمتع هذه الطريقة ببعض المزايا لأنها تتيح لك تخصيص تجربة المستخدم ووقتًا سهلًا أثناء إجراء تغييرات على موقع الويب حيث يمكنك أن تقرر إجراء تغييرات فقط على موقع سطح المكتب دون التأثير على إصدار الجوال من موقع الويب.

ومع ذلك ، فإن هذه الطريقة لها نكسات خاصة بها بسبب عناوين URL المتعددة التي يتم إنشاؤها وهذا يعني أن مشاركة موقع ويب تتطلب إعادة التوجيه والتكامل بين إصدار الهاتف المحمول من موقع الويب وإصدار سطح المكتب الخاص بك. يؤدي هذا أيضًا إلى زيادة الوقت المستغرق لتحميل صفحات الويب.

الأخطاء الشائعة التي تظهر بسبب استخدام هذا النوع من تصميم مواقع الويب هي: عمليات إعادة التوجيه الخاطئة والتعليقات التوضيحية المفقودة وتجربة المستخدم غير المتسقة.

2. تصميم موقع على شبكة الإنترنت يضمن تجربة رائعة للمستخدم.

إن التصميم الرائع لموقع الويب يتجاوز مجرد الإعداد والتكوين الأساسيين. عمليًا ، يحتوي موقع الويب المتوافق مع الجوّال على ثلاثة أجزاء ؛ السرعة والتخطيط والمحتوى.

تخطيط

للحصول على أفضل تجربة مستخدم للهاتف المحمول على تصميم موقع الويب الخاص بك ، يجب أن يكون مميزًا بالفعل. يجب تصميمه بطريقة تجعله سهل اللمس ويستخدم الخط الصحيح. يجب أن يكون الحد الأدنى للخط 12 بكسل وأي شيء أصغر ؛ سيواجه مستخدمو الهاتف المحمول صعوبة في محاولة قراءة محتوى موقع الويب الخاص بك.

يجب عليك أيضًا تعيين العرض المناسب لموقعك على الويب. عادةً ما يكون الأشخاص معتادون على التمرير من أعلى إلى أسفل ، وبالتالي تجنب المواقف التي يضطر فيها المستخدمون إلى التمرير جانبيًا وقبل كل شيء تقليل استخدام النوافذ المنبثقة بالماوس ، والقيعان التنبؤية تقوم فقط بتسمية كل شيء بوضوح.

محتوى

لتحسين تجربة مستخدم الهاتف المحمول على موقع الويب الخاص بك ، فقط تأكد من أنك لا تفرط في تحميل المستخدمين ، وحاول قدر الإمكان أن تذهب مباشرة إلى هذه النقطة.

بالإضافة إلى ذلك ، يجب عليك تبسيط إجراءات السداد الخاصة بك ولكن يمكنك ذلك لأنه أمر شاق للغاية في ملء النماذج الطويلة على منصات الهاتف المحمول ، لذا تأكد من أن إجراءات الدفع الخاصة بك أصبحت سهلة لزيادة معدلات التحويل الخاصة بك. يمكنك تحقيق ذلك عن طريق تمكين الشراء الفوري لمحفظة Google أو الخدمات الأخرى ذات الصلة التي تبسط عملية الدفع.

سرعة

يمكنك تحقيق ذلك عن طريق إنشاء صفحات يتم تحميلها بسرعة كبيرة. وفقًا للبحث الذي أجراه جوميز ، يتوقع كل متسوق عبر الإنترنت تحميل صفحة في أقل من ثانيتين وأكثر من 40٪ منهم يغادرون موقع الويب. يجب أيضًا أن يكون تصميم موقع الويب الخاص بك سهل التنقل حتى لا تحبط جمهورك لأن الغالبية منهم قد يغادرون موقع الويب دون أي احتمال للعودة. خذ وقتك لتحسين سهولة استخدام موقع الويب الخاص بك. يتم تحقيق ذلك من خلال:

  • تسمية كل صفحة بشكل مناسب. تأكد من أن كل تنقل فرعي يتوافق مع التنقل الرئيسي وتأكد من عدم وجود اكتظاظ.
  • ضع شعار موقع الويب الخاص بك في الزاوية العلوية اليسرى من موقع الويب الخاص بك. هذا مهم لأنه يجعل جمهورك على دراية بمالك الموقع ويرتبط بمحتوى الموقع. تأكد أيضًا من أن الشعار يوفر رابطًا مباشرًا إلى الصفحة الرئيسية للموقع.
  • يجب توفير وظيفة البحث. يعد هذا أمرًا حيويًا لأنه يتيح للزائرين العثور بسهولة على المعلومات التي يبحثون عنها بالفعل.
  • أضف معلومات الاتصال. تأكد من سهولة الوصول إلى الاتصال بك للاستفسارات عند الحاجة.
  • تقليل عناصر الصفحة التي تسهل الكثير من طلبات HTTP. وذلك لأن النطاق الترددي المتاح قد يكون غير موثوق به لتمكين مستخدم الهاتف المحمول من التصفح بشكل أسرع من نظرائهم على سطح المكتب.
  • تجنب الصور والملفات الزائدة. تأكد من تقديم الحجم الصحيح للصورة والملف إلى الجهاز الصحيح.

إذن ، لماذا يجب أن تجعل موقع الويب الخاص بك على الهاتف المحمول أكثر ملاءمة؟

حسنًا ، يعد تصميم موقع ويب تحديًا كبيرًا ، وعادة ما يرتكب حتى المحترفون في تصميم الويب أخطاء. يمكن أن يُعزى ذلك إلى التقدم التكنولوجي حيث إننا ندرك أن أدوات الإنترنت الجديدة تأتي سنويًا. فيما يلي بعض الأسباب التي ستجبرك على جعل موقع الويب الخاص بك متوافقًا مع الجوّال وإرضاء جميع المستخدمين.

فكر في المستخدم. ما هي توقعات العملاء من موقع الويب الخاص بك؟ إنهم يتوقعون موقع ويب يتم عرضه بشكل صحيح على أي جهاز يختارون استخدامه في أي وقت وفي أي مكان. إذا لم تقدم كل ذلك ، فتأكد من أنك تقدم تجربة مستخدم سيئة وهذا سيؤثر بشكل كبير على عوائدك. إن استخدام إستراتيجية متعددة الشاشات سيبقيك رئيسًا لمنافسيك نظرًا للعدد المتزايد من مستخدمي الويب عبر الأجهزة المحمولة والذي من المتوقع أن يصل إلى مستوى غير عادي في العام المقبل. ونتيجة لذلك ، فإن وجود موقع ويب أكثر ملاءمة للجوّال أمر لا بد منه لضمان نجاح أي عمل تجاري. في الواقع ، حان الوقت الذي يجب أن تنشأ فيه وتجمع فريقك معًا وتخطط لإستراتيجية تناسب عملك على أفضل وجه لأن ما يصلح للآخرين قد لا يعمل من أجلك ، وبالتالي بناء موقع ويب يجذب عملائك ويسعدهم.

مراجع

يمكنك زيارة المواقع التالية لمزيد من المعلومات.

  • google.com/think/multiscreen
  • developer.google.com/webmasters/mobile-sites/get-started