ما هو تصميم المواقع ؟

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

ما هو تصميم المواقع ؟

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


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


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

طرق تصميم المواقع

قد تصادف الكثير من المقالات على مواقع الانترنت المختلفة تتحدث عن عدد كبير من طرق تصميم المواقع الالكترونية مثل (fixed, static, fluid, etc.. ) ولكن هذه كانت تصنيفات قديمة، ففي عالم الجوالات اليوم أصبح هناك طريقتين فقط لتصميم مواقع الويب وهي تصميم المواقع المتجاوبة وتصميم المواقع القابلة للتكيف. 

قبل التعرف على هاتين الطريقتين بشكل تفصيلي علينا التعرف أولاً على الغرض منهما

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

بشكل عام يمكننا القول أن ..

  • في تصميم المواقع سريعة الاستجابة يتم تحرك الموقع بشكل ديناميكي تبعا لحجم الشاشة التي يتم عرضه عليها

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


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

تصميم المواقع المتجاوبة (responsive)

في المواقع القابلة للتجاوب يتم استخدام مجموعة من الأبعاد الشبكية "grids" (بناءًا على النسب المئوية) مع نقاط التوقف (باستخدام استعلامات الوسائط) لإنشاء مظهرًا متخصصا على كل حجم من أحجام الشاشات، ولهذا فإن المواقع المتجاوبة تتغير باستمرار تبعا لحجم الشاشة المعروض عليها، على عكس المواقع القابلة للتكيف والتي تتغير فقط عند الوصول إلى نقطة التوقف (breakpoint

ملاحظة: يمكن أن تحتوي مواقع الويب المتكيفة على عناصر متجاوبة. على سبيل المثال، يمكن إنشاء معارض الصور لتكون متجاوبة تمامًا بينما تكون بقية الموقع متكيفة.

مميزات المواقع المتجاوبة

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

عيوب المواقع المتجاوبة

عند القيام بتصميم الموقع من البداية (from scratch)، فإن هذا يتطلب تصميمًا شاملًا و إجراء اختبار لضمان جودة الموقع دون امتلاك الصلاحية للتحكم في الكود.

تصميم المواقع القابلة للتكيف (adaptive)

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

التكيف تبعا لنوع الجهاز

عندما يتصل المتصفح بموقع الويب الخاص بك، فإن طلب بروتوكول HTTP يتضمن حقلا يعرف باسم " وكيل المستخدم "، والذي بدوره سيقوم بإعلام الخادم بنوع الجهاز الذي سيتم عرض الموقع عليه.


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

التكيف تبعا لعرض المتصفح (أبعاد المتصفح)

في هذا النوع بدلا من أستخدام حقل " وكيل المستخدم"، فإن الموقع يقوم باستخدام استعلامات الوسائط ونقاط التوقف في التعرف على النسخة المطلوبة والتبديل بينهم بما يتوافق، فبدلا من امتلاك اصدار سطح الموقع أو الهاتف الجوال، سيكون لديك إصدارات بعرض 1080 بكسل و 768 بكسل و 480 بكسل، بالاضافة الى توفير المزيد من المرونة عند التصميم مما يعطي مظهرا أكثر استجابة عند تغيير حجم المتصفح.

مميزات المواقع القابلة للتكيف

  • تحرير WYSIWYG (ما تراه هو ما تحصل عليه)

  • تصاميم مخصصة هي أسرع وأسهل لبناء دون رمز

  • التوافق عبر المستعرضات والأجهزة المشتركة

  • صفحات التحميل السريع

عيوب المواقع القابلة للتكيف

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

  • القيود على بعض الآثار التي يمكن أن تحققها المواقع المستجيبة فقط

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

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


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

مواقع إخبارية

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

مواقع تجارية

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

المواقع الترفيهية

تحتوي هذه المواقع على مواضيع الفن والأخبار الترفيهية الحصرية، وكذلك بعض الصوتيات والصور المرفقة فيها، وينتهي عنوان الانترنت الخاص بها ب com. 

المواقع التعليمية

تحتوي هذه المواقع على المراكز التعليمية سواء كان التعليم عن بعد أو مواقع خاصة بمراكز تعليمية أخرى كالجامعات أو المعاهد، وينتهي عنوان الانترنت الخاص بها ب edu. 

المواقع الحكومية

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

المواقع الشخصية

تعتبر هذه المواقع خاصة بأفراد معينين، بمعنى أنها لا تمثل أي منظمات أو منشئات أو شركات، فهي للتعبير عن الرأي أو لعرض مؤلفات خاصة بصاحب الموقع أو حتى تجارب خاصة به، وينتهي عنوان الانترنت الخاص بها ب com.

مميزات تصميم المواقع في شركة أوامر الشبكة للحلول الرقمية

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

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

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

اتصل بنا

أنت قصة نجاحنا القادمة دعنا نعرف ما يمكننا القيام به لأعمالك، بالتأكيد لدينا أفكار رائعة لك.