تصميم موقع على شبكة الانترنت

مؤلف: Judy Howell
تاريخ الخلق: 25 تموز 2021
تاريخ التحديث: 1 تموز 2024
Anonim
طريقة إنشاء موقع إلكتروني من الألف الى الياء - تصميم موقع ووردبريس احترافي
فيديو: طريقة إنشاء موقع إلكتروني من الألف الى الياء - تصميم موقع ووردبريس احترافي

المحتوى

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

لتخطو

طريقة 1 من 2: القواعد الأساسية الثلاثة

  1. قاعدة 1:استمع إلى عميلك. قد تكون تصمم "أعظم موقع ويب في العالم على الإطلاق في تاريخ الكون وما بعده" بألوان سوداء غنية وخطوط مصقولة وألوان زاهية وفنية لموقع يصرخ "اكتشفني الآن!" لسوء الحظ ، أراد عميلك شريط قوائم برتقالي بأحرف وردية وبرتقالية زاهية. لقد تم طردك ، وأفضل موقع ويب لديك على الإطلاق - والذي يملك العميل حق استخدامه - موجود في مكان ما على قرص النسخ الاحتياطي الخاص به ، دون أن يراه أي شخص مرة أخرى.
    • ادرس هوية شركة العميل. اطلب من العميل أن يظهر لك بعض مواقع الويب التي يحبها. لن يمنحك هذا فكرة عما يحلو لهم فحسب ، بل سيعطيك أيضًا بعض أفكار التصميم التي ربما لم تفكر فيها.
    • إذا كنت تعتقد أننا نمزح بشأن موقع الويب البرتقالي والوردي ، ففكر في هذا الموقع الرائع والمتطور:
  2. القاعدة # 2:تعرف على جمهورك وما الذي يبحثون عنه وقم بتكييف تصميمك وفقًا لذلك. السبب وراء امتلاك الأشخاص لمواقع الويب هو أنهم يريدون أن يراها الآخرون. يمكن أن يكون إعلاميًا أو تجاريًا أو للترفيه عن جمهور مستهدف محدد. وظيفتك كمصمم هي أن تعرف من تصمم من أجله ، وأن تبقيهم على الصفحة عندما يهبطون هناك.
    • قد تعتقد ، "إذا كان يبدو جيدًا ، فسيبقون." لكن هذا ليس بالضرورة أن يكون الأمر كذلك. خذ العقارات ، على سبيل المثال. هذا موقع بتصميم نظيف وممتع. يحتوي على الكثير من المساحات البيضاء التي تعطي مظهرًا مفتوحًا وألوانًا زاهية وشاشة عريضة حديثة مع روابط في مكان بارز:
    • ألقِ نظرة الآن على هذا النهج لبيع العقارات في نفس المنطقة: الألوان المزدحمة والمشغولة للغاية والباهتة والمغطاة بالإعلانات.
    • خمن أيهما أفضل لمن يبحثون عن منزل؟ الحق ، حيث منازل! عندما يبحث الأشخاص عن "منازل للبيع في سانتا مونيكا" ، فإنهم لا يهتمون بالشكل الذي يبدو عليه الموقع. لا يريدون القراءة عن الوكيل العقاري أو مشاهدة صور جميلة للمدينة. يريدون أن يروا منازل.
  3. القاعدة # 3:استمع الى نفسك. أنت تفهم ما يريده العميل وتعرف ما يبحث عنه سوقك. الآن حان الوقت أخيرًا للاهتمام بك ، المصمم!
    • أنشئ نموذجًا في برنامج الرسومات الذي تختاره. اجعل عناصر صفحتك على طبقات مختلفة (حتى تتمكن من تعديل الأشياء لاحقًا دون إتلاف القالب بأكمله). يمكن أن تكون هذه العناصر:
      • رأس. هذا عنصر هو نفسه في كل صفحة من صفحات موقعك. يتكون الرأس من عنوان وشعار الموقع ، بالإضافة إلى روابط لأجزاء أخرى من الموقع (على سبيل المثال ، حول ، جهة اتصال ، وما إلى ذلك). بصريًا وعمليًا ، سيؤدي هذا إلى ربطها معًا. يعد ربط الزر الأول الموجود في شريط القوائم بالصفحة الرئيسية ممارسة جيدة.
      • على سبيل المثال ، دعنا نلقي نظرة على شركة Apple:
      • كما هو الحال مع معظم منتجات Apple ، تتمتع صفحتهم الرئيسية بتصميم نظيف ومباشر للغاية. لاحظ شريط القائمة في الأعلى ، الذي يحتوي على موضوعات منطقية لكل زر ، بالإضافة إلى حقل البحث - وهي فكرة جيدة دائمًا إذا كان موقعك يدعمها. الآن دعونا نلقي نظرة على الصفحة المقصودة لأحد الأزرار ، iPad ، لنرى بعض العناصر:
      • يتغير شريط القائمة فقط عن طريق تعتيم زر iPad.
      • يتم عرض موضوع الصفحة المقصودة بأحرف سوداء كبيرة.
      • ستظهر قائمة فرعية جديدة حتى تتمكن من معرفة المزيد عن المنتج. إذا قمت بالنقر فوق أحد هذه الأزرار ، فسترى أن كل صفحة تقدم محتوى جديدًا بناءً على الموضوع ، ولكنها ستكون متطابقة في التخطيط والتصميم.
      • في كثير من الأحيان ، سيكون لكل موضوع رئيسي في شريط القائمة عناوين فرعية مختلفة لتقوم بملئها. بدلاً من إنشاء شريط قوائم ثانٍ ، يمكنك استخدام القوائم المنبثقة مثل هذا المثال من Musicians Friend:
      • الشريط الجانبي. سيظهر هذا في العديد من صفحات موقعك ، ولكن ليس بالضرورة جميعًا - يحدد السياق. ومع ذلك ، فهو عنصر مهم للغاية ويجب تصميمه بعناية ليكون بديهيًا وغير مزدحم. على عكس شريط القوائم ، يمكن أن يكون محتوى الشريط الجانبي ديناميكيًا للغاية. تحقق من هذين الشريطين الجانبيين من Real Estate Marketer Trulia الأول للمشترين:

طريقة 2 من 2: إرشادات

  1. تصميم واجهة مستخدم جيدة. ضع العناصر المختلفة لموقع الويب مثل العنوان والأشرطة الجانبية والشعارات والصور والنص في نفس المكان في كل صفحة لجعل موقعك سهل التنقل وسهل الاستخدام.
    • احتفظ بنفس العنوان أعلى كل صفحة. سواء كان محتوى موقعك يسمح بالعديد من العناصر المتكررة أم لا ، تأكد من أن الجزء العلوي من كل صفحة هو نفسه.
    • استخدم المنطق في تصميمك. يجب ترتيب العناصر الموجودة في صفحة واحدة منطقيًا حسب الأهمية أو الموضوع ؛ يجب أن تكون الصفحات المختلفة على الموقع أيضًا.
  2. ابتكر أسلوبًا متسقًا. حيث يجب أن يعطي التصميم تناسقًا هيكليًا لموقعك ، يجب أن يوفر النمط تناغمًا موضوعيًا.
    • التزم بلونين أو ثلاثة ألوان رئيسية وتأكد من توافقها معًا.
    • تجنب استخدام الكثير من أنماط الخطوط أو الأحجام ؛ إذا كنت تريد تبديل بعضها ، فاستخدمها بنفس الطريقة في كل صفحة.
    • استخدم Cascading Style Sheets (CSS) للحفاظ على نمط موحد ولتسهيل تغيير العناصر عبر موقع ويب بأكمله دون الحاجة إلى الانتقال إلى كل صفحة على حدة.
  3. تعظيم إمكانية القراءة. لتسهيل قراءة النص ، يمكنك تقسيمه إلى أجزاء أصغر.
    • استخدم الترجمات والتباعد المناسب لفصل كل جزء.
    • استخدم أحرفًا غامقة أو أحجامًا مختلفة لإظهار التسلسل الهرمي للموضوعات وأهميتها.
    • انتبه إلى كيفية تعاملك مع النص. لا تجعل الخط صغيرًا جدًا ، وقم بزيادة تباعد الأسطر لتسهيل قراءة الأجزاء الكبيرة من النص. تصعب قراءة البقع الكبيرة من النص ؛ قسمها إلى فقرات أصغر.
  4. اجعل موقع الويب الخاص بك قابلاً للقراءة عالميًا. استخدم HTML القياسي وتجنب العلامات والميزات والمكونات الإضافية التي لا تتوفر إلا لعلامة تجارية واحدة أو إصدار واحد من المستعرض.
    • في حين أن معظم المتصفحات وأجهزة الكمبيوتر الحديثة يمكنها التعامل مع الصور المعقدة ، فإن كل شيء سيبدو أكثر سلاسة إذا قمت بتقليص صورك وتحسينها للويب. الموازنة بين أهمية الجودة وأهمية السرعة.
  5. اختبر موقع الويب الخاص بك. تأكد من أن كل ارتباط يعمل كما تتوقع ، وتظهر الصور بشكل صحيح.
    • قد ترغب في تنظيم بعض اختبارات المستخدم من خلال جعل أعضاء جمهورك المستهدف يختبرون وضوح تصميمك وسهولة استخدامه وتقديم ملاحظات حول موقع الويب الخاص بك.
  6. انشر موقعك على الويب. قم بشراء اسم المجال إذا لم تكن قد قمت بذلك بالفعل. تحقق دوريًا مما إذا كانت الروابط لا تزال تعمل واستمع إلى الاقتراحات التي يرسلها الزوار إليك عبر البريد الإلكتروني.

نصائح

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

تحذيرات

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