في مجال تطوير المواقع، -عكس عدة مجالات أخرى- لا يدرك الكثير من العملاء من الموقع/المشروع إلا ظاهره، الجزء المتعلق بالتصميم وإنجاز المهام المتوقعة منه، كإدخال المحتوى وتخزينه، وإظهاره حيث ييتوقع أن يراه.. في هذا الموضوع أحاول أن أتطرق إلى الجوانب الأخرى المرتبطة بتطوير المواقع، التي ينبغي أن يدركها العميل (صاحب الموقع) وكذلك بعض الزملاء من المطورين.
تطوير المواقع أشبه ما يكون بالجبل الجليدي العائم، يكون جزؤه العلوي فقط هو ما يهتم به الزبون/العميل العادي، لكن الجزء الأكبر من كل موقع هو الجزء الأسفل المخفي من الجبل الجليدي، وهو جزء فائق الاهمية في الموقع. وإن صحيح أن ما يشاهده الزائر او المستخدم في الواجهة والاستخدامات الأساسية هو الأهم، لكن هناك أمور بذات الأهمية أذكر البعض منها على سبيل المثال لا الحصر
أمور اخرى تندرج ضمن عملية تصميم وتطوير موقع مثالي
سرعة وكفاءة الموقع : وهذا يمشل المستخدمين الذين يتصفحونه بسرعات نت ضعيفة، سواء من من دول ليس لديها ADSL بعد، أو باستخدام الأجهزة الكفية بأنترنت 3g، أو في القطارات والمحطات والأماكن العمومية...
توافق الموقع مع أكبر عدد ممكن من الأجهزة والمتصفحات: وهنا لا أقصد التصاميم المتجاوبة فقط، بل تجربة المستخدم وإمكانيات المتصفحات والأجهزة ودعمها لخصائص محددة..
توفر الموقع على أكبر قدر من الأمن والحماية
توافقه مع القارئات الصوتية:خاصة إن كانت هناك شريحة كبيرة من زوار أو مستخدمي الموقع من فاقدي او ضعاف البصر، حيث يتم استخدام قارئات صوتية - كتطبيقات أو إضافات للمتصفحات - لتصفح الموقع.
هوية بصرية مستقلة وفريدة: ومعناه أن لا يستخدم المطور عملا متداولا في سوق الانترنت سواء عن طريق شرائه من متاجر القوالب والتصاميم أو بتحميله وقرصنته. أو حتى باستخدام أطر العمل المنتشرة بشكل خاطئ كما هي.
تنظيم الموقع وإعداده لأي إمكانية تطوير وتعديلات مستقبلية : سواء كانت التعديلات والتطوير من قبل نفس المطور أو من قبل مطور آخر جديد. لا يعرف كارثة تطوير وتجديد موقع بني بطريقة عشوائية إلا من جرب ذلك، التكلفة تكون ثقيلة على المطور وصاحب الموقع معا.
توافق الموقع مع معايير محركات البحث: أو ما يعرف ب SEO
توافق الموقع مع معايير المشاركة في الشبكات الإجتماعية: حيث يظهر أي قسم من الموقع عند مشاركة رابطه في فيسبوك أو تويتر بأفضل شكل، وبصور وعناوين وتوصيفات تعبر عن محتوى الروابط بالضبط، وتدفع الزائر للنقر عليها.
أكتفي بهذا القدر من الأمثلة، وإلا فهناك العديد من التفاصيل التي قد لا ينتبه لها صاحب الموقع، لكنه يحتاج إليها، وقد يجد نفسه في ورطة إن تم بناء موقعه دون أخذ أحد هذه العناصر في الحسبان.
المشكلة هنا تكمن في كون العديد من المطورين المبتدئين أو الهواة، أو حتى المطورين المتقدمين الذين لا يهمهم إلا إرضاء العميل في لحظة تسليم العمل، ولا يكترثون للجودة والمعايير القياسية، كل هؤلاء يغرون بعض العملاء بأثمنة منخفضة جدا ومدة تنفيد خيالية، فبعضهم يمكنه بناء فيسبوك أو تويتر حتى في ثلاثة أيام مقابل 100 دولار.
لذلك ينبغي على صاحب الموقع قبل التعاقد مع أي مطور أو مصمم، أن يستشير أهل المجال ممن يثق فيهم، ويدرك أن هناك أمورا وجوانب أخرى عند تطوير الموقع ينبغي أن يلتفت إليها، ويقدر أهلها، ويضرب حسابا لقيمتها عند كل تفاوض حول قيمة ومدة مشروع جديد.
يبدو أني سأستأنف حواري السابق معك ومع سارة سويدان هنا، أتذكر؟ :)
برأيك ما هي محددات الهوية البصرية؟ شخصياً أفضل حصر الهوية البصرية في الشعار والألوان، فلا أرى تشابه المواقع عيباً إن كانت الغاية من ذلك ضمان تآلف المستخدم مع الواجهة.
الهوية البصرية هي كامل الموقع، بدأ بالشعار إلى الألوان والأزرار حجم والخط وما إلى ذلك، بعض المواقع الكبرى تملك خطا حتى. بمعنى أن كل المواقع لا يجب أن تختلف في الألوان فحسب
موضة رائعة حاليا في المواقع الأجنبية والتي أفقدتها هويتها الفعلية هي استخدام نمط معين في صفحات الهبوط landing page وهي صورة كبيرة في البداية مظلمة قليلا، فوقها بعض الكتابة ثم زر أ, سهم للأسفل. رغم اختلاف الصورة والخط إلا أن شكل المواقع كلها واحد، ولا يتميز موقع عن الآخر. وهذا ما ينقص المواقع. فكل موقع يجب أن يكون فريدا
الأمر شبيه ببعض المدونات العربية الحالية الخاصة بالأخبار (مدونات تملأ الانترنت) كلها لها نفس الشكل، عرض 960 ثابت، هيدر بسيط، شعار لليمين، قائمة ثم مواضيع. كل المواقع متشابهة
تآلف المستخدم لديه حالات معينة، فالمستخدم قد تعود على أن الزر هو مستطيل عريض، واعتاد أن يكون الرابط بلون مغاير، واعتاد أن علامة X هي للخروج أو الغاء شيء ما
لكن شكل المواقع المشابه لن يجذب المستخدم، لن يأسره. سيكون نفس الأمر مرارا وتكرارا والألوان تختلف فحسب
لكن شكل المواقع المشابه لن يجذب المستخدم، لن يأسره. سيكون نفس الأمر مرارا وتكرارا والألوان تختلف فحسب
لا أرى في ذلك عيباً، فمن المفترض أﻻ يكون التصميم هو عامل الجذب، بل المحتوى! هل تزور موقعاً ما للتمتع بألوانه الخلابة، أم للوصول لمعلومة تبحث عنها؟ برأيي أن التصميم المتقن والمهني هو الذي يشكل لك بوابة عملية تسهل لك الوصول للمحتوى، لا تحفة فنية تلهيك عنه!
المحتوى الجيد وحده لا يكفي
هناك توازن بين التصميم والمحتوى
تصميم بلا محتوى هو مجرد ديكور، محتوى بلا تصميم لن يجذب أحدا
ربما أنت قد لا تكترث، ولكن قد يكون لديك أفضل محتوى في العالم، ولكن الزائر لن يقرأه إطلاقا لأن التصميم أفزعه. التصميم يستخدم ليأسر المستخدم حتى يقرأ المحتوى
ثم من قال تحفة فنية D: التصميم الجيد المريح للقراءة هو عامل في جلب الزوار
أنا مدرك لما تشير إليه منذ أول نقاشنا على تويتر، تلك الأرضية المشتركة التي ينبغي أن تكون لدى المواقع حتى يبقى المستخدم مراكما لتجربته في أي موقع ويستخدمها في موقع آخر. صحح لي إن أخطأت فهمك.
بالمقابل أقول، أنا معك تماما في هذا على ان يكون هذا هو القصد، تعزيز قابلية الاتسخدام وتجربة المستخدم، لكن تفحص معي ما يحدث الآن، كل موضة جيددة تظهر تجدها في جميع أو أغلب المواقع، حتى وإن لم يكن لها أي فائدة حقيقية، على سبيل المثال: Parallax Effect، الذي يعبر عن انتشاره لحد الحنق، هذه التغريدة الطريفة:
Got to love agencies that have a "why we are different" section on their Bootstrap driven parallax web site.
Christian Heilmann.
ما يحدث مع المكتبات أنها تعزز استخدام المكونات الموجودة في خصائص للموقع ليست مطلوبة ولا مفيدة، فقط لأنها في المكتبة، أو عندما يحتاج الأمر إلى شيء آخر مختلف غير متوفر في المكتبة، فيتم استخدام شيء آخر بدلا منه، غير عملي، لكن لانه متوفر في المكتبة يتم استخدامه كبديل. (أتمنى أن لا يكون ما كتبته متاهة :p )
نعم أنس، أذكر طبعا :)
شخصيا، أرى كل هذه العناصر تدخل ضمن الهوية البصرية: الألوان، المساحات، الخطوط، النسق البصري (visual style)، التأثيرات الحركية، الأشكال (shapes).
النشابه بين مجموعة من المواقع ليس عيبا، التشابه بين كل أو جل المواقع هو ما أراه عيبا، لا أدري أين قرات نصيحة لأحدهم عن اختيار قالب لشرائه من themeforest، يقول: "إذا اشتريت قالبا تجاوزت مبيعاته الألف، سيكون موقعك شبيها لألف موقع آخر على الأقل".
مشكلة المكتبات وإطارات العمل لا تنتهي عند الهوية البصرية، بل تمتد لأشمل من ذلك، حين يتم استخدامها بشكل كسول خاطئ وهو غالبا ما يحدث، حيث يتم تحميل bootstrap بحجمه الكامل من أجل الحصول على تنسيق الأزرار، او التنبيهات، او نظام الأعمدة.. بحث عن "bootsrap unused styles" سيظهر لك حجم الكارثة، وقس على ذلك بالنسبة للكثير من المكتبات، بالمقابل هناك من يستخدمها لكن يبذل جهدا في القيام بذلك بشكل صحيح، Pivotal Labs على سبيل المثال يستخدم bootstrap في مواقعه بإشراف من Nicole Sullivan صاحبة oocss، لكن باتباع منهجية وأدوات تتجاوز المشكلة التي اتحدث عنها:
بالتأكيد كل هذه العناصر تدخل ضمن مكونات الهوية البصرية، لكن سؤالي بعبارة أخرى: ما هي المكونات المسموحة للهوية البصرية لموقع إنترنت ما؟
قد يبدو كلامي هذا مبالغاً فيه نوعاً ما عندما نتكلم عن مواقع الإنترنت، لكن دعني أوضح الفكرة من خلال تطبيقات سطح المكتب:
إذ تبدو لي تطبيقات سطح المكتب التي تغص بأيقونات وألوان وخطوط لا تمت لروح سطح المكتب ومكوناته البصرية بصلة، محاوِلة بذلك فرض هويتها البصرية على سطح مكتبي، تبدو لي مستفزة جداً، ونوعاً من التمرد والتغريد خارج السرب، وتحول دون تكوين علاقة تآلف بينها وبين المستخدم.
برأيي الشخصي، أن مواقع الانترنت ستتنبه عاجلاً أم أجلاً لهذه النقطة، وستحاول وضع المزيد من الضوابط لمكونات الهوية البصرية على صفحاتها.
التعليقات