لا تقم بإنشاء موقعك الإلكتروني مباشرة على حاسوبك X

قبل ذلك جهز خطتك على الورق   

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

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

مقال اليوم يستعرض لكم أهم خطوات بناء تخطيط للموقع الالكتروني من خلال مثال عملي لموقع يبيع المنتجات الزراعية.   

أولاً: ضع قائمة بالمعلومات التي يجب أن يقدمها ويعرضها موقعك للزوار. 

فكي تقوم بإنشاء متجر لبيع المنتجات الزراعية قد تكون المعلومات التي ستعرضها هي:

  • موقع المتجر مع الاتجاهات والخريطة. 
  • ساعات وأيام فتح المتجر. 
  • فروع المتجر.
  • قائمة المنتجات. 
  • تفاصيل حول كل منتج. 
  • قائمة بآخر المنتجات المضافة.

ثانياً: قم بتحديد المعلومات التي ينبغي أن تكون على كل صفحة من الصفحات، والصفحات الموجودة على الموقع. 

  • المعلومات التي يجب أن تكون على جميع الصفحات هي (العنوان وساعات العمل وقائمة المنتجات المضافة مؤخرًا)7
    والصفحات الموجودة قد تكون كالتالي:
  • الصفحة الرئيسية ( تحتوي الموقع والخريطة والاتجاهات والساعات)
  • صفحة  تعريفية بالمتجر (حول المتجر) 
  • صفحة قائمة فروع المتجر. 
  • معلومات  تفصيلية حول كل فرع من الفروع على صفحة خاصة. 
  • صفحة لعرض كافة المنتجات. 
  • صفحة لعرض عرض تفاصيل كل منتج على صفحته الخاصة.
  • كما نحتاج قائمة قابلة للبحث عن منتجات مع وصلات لصفحات الوصفة التفصيلية 

ثالثاً: قم بتحديد المعلومات الأكثر أهمية في كل صفحة. 

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

رابعاً: حدد أي من هذه الصفحات يجب أن تظهر في القائمة الرئيسية لموقعك. 

على سبيل المثال سنضع في القائمة الرئيسية لموقعنا روابط الصفحات التالية: 

  • الصفحة الرئيسية 
  • الصفحة حول 
  • صفحة الفروع
  • صفحة المنتجات

خامساً: قم بعمل رسم تخطيطي تقريبي /سكتش أولي/ لكل صفحة

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

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

أخيراً : راجع المخطط باستمرار

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

لذا ننصح بأن تعدل خطتك وتصميم موقعك بما يتناسب مع محتوى موقعك الفعلي واحرص دوماً على أن تكون طريقة عرض المحتوى في موقعك بأفضل طريقة ممكنة.




ليست هناك تعليقات :

إرسال تعليق