تصميم الويب

يشمل تصميم الويب العديد من المهارات والتخصصات المختلفة في إنتاج وصيانة مواقع الويب . تشمل مجالات تصميم الويب المختلفة تصميم الرسوم البيانية للويب؛ تصميم واجهة المستخدم (تصميم UI)؛ التأليف، بما في ذلك التعليمات البرمجية القياسية والبرامج الاحتكارية ؛ تصميم تجربة المستخدم (تصميم UX)؛ وتحسين محرك البحث . غالبًا ما يعمل العديد من الأفراد في فرق تغطي جوانب مختلفة من عملية التصميم، على الرغم من أن بعض المصممين سيغطونها جميعًا. ^[1] يستخدم مصطلح "تصميم الويب" عادةً لوصف عملية التصميم المتعلقة بتصميم الواجهة الأمامية (جانب العميل) لموقع الويب بما في ذلك كتابة العلامات . يتداخل تصميم الويب جزئيًا مع هندسة الويب في النطاق الأوسع لتطوير الويب . من المتوقع أن يكون لدى مصممي الويب وعي بإمكانية الاستخدام وأن يكونوا على اطلاع دائم بإرشادات إمكانية الوصول إلى الويب .

على الرغم من أن تصميم الويب له تاريخ حديث إلى حد ما، إلا أنه يمكن ربطه بمجالات أخرى مثل التصميم الجرافيكي وتجربة المستخدم وفنون الوسائط المتعددة، ولكن من الأفضل رؤيته من منظور تكنولوجي. لقد أصبح جزءًا كبيرًا من حياة الناس اليومية. من الصعب تخيل الإنترنت بدون رسومات متحركة وأنماط مختلفة من الطباعة والخلفيات ومقاطع الفيديو والموسيقى. تم الإعلان عن الويب في 6 أغسطس 1991؛ في نوفمبر 1992، كان سيرن أول موقع ويب يتم تشغيله على شبكة الويب العالمية. خلال هذه الفترة، تم هيكلة مواقع الويب باستخدام علامة <table> التي أنشأت أرقامًا على موقع الويب. في النهاية، تمكن مصممو الويب من إيجاد طريقهم حولها لإنشاء المزيد من الهياكل والتنسيقات. في التاريخ المبكر، كان هيكل مواقع الويب هشًا ويصعب احتواؤه، لذلك أصبح من الصعب جدًا استخدامها. في نوفمبر 1993، كان ALIWEB أول محرك بحث يتم إنشاؤه على الإطلاق (فهرسة Archie Like للويب). ^[2]

في عام 1989، أثناء عمله في سيرن ، اقترح تيم بيرنرز لي إنشاء مشروع نص تشعبي عالمي ، والذي عُرف فيما بعد باسم شبكة الويب العالمية . من عام 1991 إلى عام 1993، وُلدت شبكة الويب العالمية. يمكن عرض صفحات HTML النصية فقط باستخدام متصفح ويب بسيط في وضع الخط . ^[3] في عام 1993، أنشأ مارك أندريسن وإريك بينا متصفح Mosaic . في ذلك الوقت، كانت هناك متصفحات متعددة، ومع ذلك كانت غالبيتها تعتمد على يونكس وثقيلة النص بطبيعة الحال. لم يكن هناك نهج متكامل لعناصر التصميم الجرافيكي مثل الصور أو الأصوات . كسر متصفح Mosaic هذا القالب. ^[4] تم إنشاء W3C في أكتوبر 1994 "لقيادة شبكة الويب العالمية إلى إمكاناتها الكاملة من خلال تطوير بروتوكولات مشتركة تعزز تطورها وتضمن قابلية التشغيل البيني لها ". ^[5] هذا ثبط عزيمة أي شركة عن احتكار متصفح ولغة برمجة خاصة ، الأمر الذي كان من الممكن أن يغير من تأثير شبكة الويب العالمية ككل. تواصل W3C وضع المعايير، والتي يمكن رؤيتها اليوم مع JavaScript ولغات أخرى. في عام 1994، شكل أندريسن شركة Mosaic Communications Corp. التي عُرفت فيما بعد باسم Netscape Communications ، متصفح Netscape 0.9 . أنشأت Netscape علامات HTML الخاصة بها دون مراعاة عملية المعايير التقليدية. على سبيل المثال، تضمن Netscape 1.1 علامات لتغيير ألوان الخلفية وتنسيق النص بالجداول على صفحات الويب. من عام 1996 إلى عام 1999، بدأت حروب المتصفحات ، حيث تنافست Microsoft و Netscape على الهيمنة النهائية على المتصفحات. خلال هذا الوقت، كان هناك العديد من التقنيات الجديدة في هذا المجال، ولا سيما Cascading Style Sheets و JavaScript و Dynamic HTML . بشكل عام، أدت منافسة المتصفحات إلى العديد من الإبداعات الإيجابية وساعدت تصميم الويب على التطور بوتيرة سريعة. ^[6]

في عام 1996، أصدرت شركة مايكروسوفت أول متصفح تنافسي لها، والذي كان مكتملًا بميزاته وعلامات HTML. وكان أيضًا أول متصفح يدعم أوراق الأنماط، والتي كانت تُرى في ذلك الوقت على أنها تقنية تأليف غامضة وهي اليوم جانب مهم من تصميم الويب. ^{[6] كان المقصود في الأصل من} ترميز HTML للجداول عرض البيانات الجدولية. ومع ذلك، أدرك المصممون بسرعة إمكانية استخدام جداول HTML لإنشاء تخطيطات معقدة ومتعددة الأعمدة لم تكن ممكنة بخلاف ذلك. في هذا الوقت، حيث بدا أن التصميم والجماليات الجيدة لها الأسبقية على بنية الترميز الجيدة، لم يتم إيلاء سوى القليل من الاهتمام للدلالات وإمكانية الوصول إلى الويب . كانت مواقع HTML محدودة في خيارات التصميم الخاصة بها، وخاصة مع الإصدارات السابقة من HTML. لإنشاء تصميمات معقدة، كان على العديد من مصممي الويب استخدام هياكل جدول معقدة أو حتى استخدام صور .GIF فاصلة فارغة لمنع انهيار خلايا الجدول الفارغة. ^{[7] تم تقديم} CSS في ديسمبر 1996 بواسطة W3C لدعم العرض والتخطيط. سمح هذا لكود HTML بأن يكون دلاليًا بدلاً من أن يكون دلاليًا وتقديميًا، كما أدى إلى تحسين إمكانية الوصول إلى الويب، راجع تصميم الويب بدون جداول .

في عام 1996، تم تطوير Flash (المعروف في الأصل باسم FutureSplash). في ذلك الوقت، كانت أداة تطوير محتوى Flash بسيطة نسبيًا مقارنة بالآن، باستخدام أدوات التخطيط والرسم الأساسية، وسابقة محدودة لـ ActionScript ، وجدول زمني، لكنها مكنت مصممي الويب من تجاوز نقطة HTML وصور GIF المتحركة و JavaScript . ومع ذلك، نظرًا لأن Flash يتطلب مكونًا إضافيًا ، فقد تجنب العديد من مطوري الويب استخدامه خوفًا من الحد من حصتهم في السوق بسبب عدم التوافق. بدلاً من ذلك، عاد المصممون إلى رسوم GIF المتحركة (إذا لم يتخلوا عن استخدام الرسوم المتحركة تمامًا) وJavaScript للأدوات . لكن فوائد Flash جعلته شائعًا بدرجة كافية بين أسواق مستهدفة محددة ليشق طريقه في النهاية إلى الغالبية العظمى من المتصفحات، وقويًا بما يكفي لاستخدامه لتطوير مواقع كاملة. ^[7]

في عام 1998، أصدرت شركة Netscape كود Netscape Communicator بموجب ترخيص مفتوح المصدر ، مما مكّن الآلاف من المطورين من المشاركة في تحسين البرنامج. ومع ذلك، قرر هؤلاء المطورون بدء معيار للويب من الصفر، مما وجه تطوير المتصفح مفتوح المصدر وسرعان ما توسع إلى منصة تطبيق كاملة. ^[6] تم تشكيل مشروع معايير الويب وتعزيز امتثال المتصفح لمعايير HTML و CSS . تم إنشاء برامج مثل Acid1 و Acid2 و Acid3 من أجل اختبار المتصفحات للتوافق مع معايير الويب. في عام 2000، تم إصدار Internet Explorer لنظام التشغيل Mac، والذي كان أول متصفح يدعم HTML 4.01 وCSS 1 بالكامل. وكان أيضًا أول متصفح يدعم تنسيق صور PNG بالكامل . ^[6] بحلول عام 2001، بعد حملة قامت بها شركة Microsoft لترويج Internet Explorer، وصل Internet Explorer إلى 96٪ من حصة استخدام متصفح الويب ، مما يدل على نهاية حروب المتصفحات الأولى حيث لم يكن لدى Internet Explorer أي منافسة حقيقية. ^[8]

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

منذ نهاية حروب المتصفحات ^{[ متى؟ ]} تم إصدار متصفحات جديدة. العديد من هذه المتصفحات مفتوحة المصدر، مما يعني أنها تميل إلى التطوير بشكل أسرع وهي أكثر دعمًا للمعايير الجديدة. يعتبر العديد من ^{[ كلمات مراوغة ] أن الخيارات الجديدة أفضل من} متصفح Internet Explorer من Microsoft .

أصدرت W3C معايير جديدة لـ HTML ( HTML5 ) و CSS ( CSS3 )، بالإضافة إلى واجهات برمجة تطبيقات JavaScript جديدة ، كل منها كمعيار جديد ولكن فردي. ^{[ متى؟ ]} في حين أن مصطلح HTML5 يستخدم فقط للإشارة إلى الإصدار الجديد من HTML وبعض واجهات برمجة تطبيقات JavaScript، فقد أصبح من الشائع استخدامه للإشارة إلى المجموعة الكاملة من المعايير الجديدة (HTML5 و CSS3 و JavaScript).

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

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

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

قد يحدد تصميم التسويق والاتصال على موقع الويب ما يناسب سوقه المستهدف. يمكن أن تكون هذه فئة عمرية أو فرعًا ثقافيًا معينًا؛ وبالتالي قد يفهم المصمم اتجاهات جمهوره. قد يفهم المصممون أيضًا نوع موقع الويب الذي يصممونه، مما يعني، على سبيل المثال، أن اعتبارات تصميم موقع الويب (B2B) من شركة إلى شركة قد تختلف اختلافًا كبيرًا عن موقع ويب يستهدف المستهلك مثل موقع البيع بالتجزئة أو الترفيه. يمكن إجراء اعتبار دقيق للتأكد من أن الجماليات أو التصميم العام للموقع لا يتعارض مع وضوح ودقة المحتوى أو سهولة التنقل على الويب ، ^[12] خاصة على موقع الويب B2B. قد يأخذ المصممون أيضًا في الاعتبار سمعة المالك أو العمل الذي يمثله الموقع للتأكد من تصويرهم بشكل إيجابي. يشرف مصممو الويب عادةً على جميع مواقع الويب التي تم إنشاؤها على كيفية عملها أو تشغيلها على الأشياء. إنهم يقومون باستمرار بتحديث وتغيير كل شيء على مواقع الويب خلف الكواليس. كل العناصر التي يقومون بها هي النصوص والصور والرسومات وتخطيط الويب. قبل البدء في العمل على موقع ويب، يقوم مصممو الويب عادةً بتحديد موعد مع عملائهم لمناقشة التصميم واللون والرسومات والتصميم. يقضي مصممو الويب أغلب وقتهم في تصميم مواقع الويب والتأكد من أن السرعة مناسبة. عادةً ما يشارك مصممو الويب في الاختبار والعمل والتسويق والتواصل مع مصممين آخرين حول تصميم مواقع الويب والعثور على العناصر المناسبة لمواقع الويب. ^[13]

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

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

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

في الممارسة العملية، يعني هذا تقديم المحتوى من خلال HTML وتطبيق التصميم والرسوم المتحركة من خلال CSS إلى الحد الممكن تقنيًا، ثم تطبيق المزيد من التحسينات من خلال JavaScript . يتم تحميل نص الصفحات على الفور من خلال كود مصدر HTML بدلاً من الاضطرار إلى انتظار JavaScript لبدء تحميل المحتوى لاحقًا، مما يسمح بقراءة المحتوى بأقل وقت تحميل وعرض نطاق ترددي، ومن خلال متصفحات تعتمد على النص ، ويزيد من التوافق مع الإصدارات السابقة . ^[15]

على سبيل المثال، تستخدم المواقع التي تعتمد على MediaWiki بما في ذلك Wikipedia التحسين التدريجي، حيث تظل قابلة للاستخدام أثناء تعطيل JavaScript وحتى CSS، حيث يتم تضمين محتوى الصفحات في كود مصدر HTML للصفحة، في حين يعتمد موقع Everipedia المضاد على JavaScript لتحميل محتوى الصفحات لاحقًا؛ تظهر صفحة فارغة مع تعطيل JavaScript.

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

زادت شعبية التخطيطات السائلة حوالي عام 2000 للسماح للمتصفح بإجراء تعديلات تخطيطية خاصة بالمستخدم على التخطيطات السائلة بناءً على تفاصيل شاشة القارئ (حجم النافذة وحجم الخط بالنسبة للنافذة وما إلى ذلك). وقد نمت كبديل للتخطيطات القائمة على جدول HTML والتصميم القائم على الشبكة في كل من مبادئ تصميم تخطيط الصفحة وفي تقنية الترميز ولكن تم تبنيها ببطء شديد. ^{[ملاحظة 1]} كان هذا بسبب اعتبارات أجهزة قراءة الشاشة وأحجام النوافذ المتنوعة التي لا يملك المصممون التحكم فيها. وفقًا لذلك، يمكن تقسيم التصميم إلى وحدات (أشرطة جانبية وكتل محتوى ومناطق إعلانية مضمنة ومناطق تنقل) يتم إرسالها إلى المتصفح والتي سيتم تركيبها في نافذة العرض بواسطة المتصفح بأفضل ما يمكن. على الرغم من أن مثل هذا العرض قد يغير غالبًا الموضع النسبي لوحدات المحتوى الرئيسية، إلا أنه يمكن نقل الأشرطة الجانبية أسفل نص الهيئة بدلاً من جانبها. هذا عرض أكثر مرونة من التخطيط القائم على الشبكة المبرمج الثابت والذي لا يتناسب مع نافذة الجهاز. على وجه الخصوص، قد يتغير الموضع النسبي لكتل ​​المحتوى مع ترك المحتوى داخل الكتلة دون أن يتأثر. وهذا يقلل أيضًا من حاجة المستخدم إلى التمرير أفقيًا عبر الصفحة.

يُعد تصميم الويب المستجيب نهجًا جديدًا، ويستند إلى CSS3، ومستوى أعمق من المواصفات لكل جهاز داخل ورقة أنماط الصفحة من خلال الاستخدام المعزز لقاعدة CSS @media. في مارس 2018، أعلنت Google أنها ستطرح فهرسة الأجهزة المحمولة أولاً. ^[16] المواقع التي تستخدم التصميم المستجيب في وضع جيد لضمان تلبية هذا النهج الجديد.

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

تم تضمين تنزيل الخطوط لاحقًا في وحدة خطوط CSS3 وتم تنفيذه منذ ذلك الحين في Safari 3.1 و Opera 10 و Mozilla Firefox 3.5 . وقد أدى هذا لاحقًا إلى زيادة الاهتمام بطباعة الويب ، بالإضافة إلى استخدام تنزيل الخطوط.

تتضمن معظم تخطيطات المواقع الإلكترونية مساحات سلبية لتقسيم النص إلى فقرات وتجنب أيضًا محاذاة النص في المنتصف. ^[17]

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

قد تتسبب الرسوم المتحركة التي لا يبدأها زائر الموقع في حدوث مشكلات تتعلق بإمكانية الوصول. تتطلب معايير إمكانية الوصول الخاصة باتحاد شبكة الويب العالمية أن يتمكن زوار الموقع من تعطيل الرسوم المتحركة. ^[18]

قد يرى مصممو مواقع الويب أن الامتثال للمعايير ممارسة جيدة. يتم ذلك عادةً من خلال وصف يحدد ما يفعله العنصر. قد لا يؤدي عدم الامتثال للمعايير إلى جعل موقع الويب غير قابل للاستخدام أو عرضة للخطأ، ولكن يمكن أن تتعلق المعايير بالتخطيط الصحيح للصفحات لسهولة القراءة بالإضافة إلى التأكد من إغلاق العناصر المشفرة بشكل مناسب. يتضمن ذلك الأخطاء في الكود، وتخطيط أكثر تنظيمًا للكود، والتأكد من تحديد المعرفات والفئات بشكل صحيح. يُطلق على الصفحات المشفرة بشكل سيئ أحيانًا اسم حساء العلامات . لا يمكن التحقق من الصحة عبر W3C ^[9] إلا عند إجراء إعلان DOCTYPE صحيح، والذي يستخدم لتسليط الضوء على الأخطاء في الكود. يحدد النظام الأخطاء والمناطق التي لا تتوافق مع معايير تصميم الويب. يمكن للمستخدم بعد ذلك تصحيح هذه المعلومات. ^[19]

هناك طريقتان لإنشاء مواقع الويب: بشكل ثابت أو ديناميكي.

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

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

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

يتم إنشاء مواقع الويب الديناميكية أثناء التنقل وتستخدم تقنية جانب الخادم لإنشاء صفحات الويب. وعادةً ما تستخرج محتواها من قاعدة بيانات خلفية واحدة أو أكثر: بعضها عبارة عن استعلامات قاعدة بيانات عبر قاعدة بيانات علائقية للاستعلام عن كتالوج أو لتلخيص معلومات رقمية، وقد يستخدم البعض الآخر قاعدة بيانات مستندات مثل MongoDB أو NoSQL لتخزين وحدات أكبر من المحتوى، مثل منشورات المدونة أو مقالات wiki.

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

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

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

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

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

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

لا يقدم المؤلفون إشارة واضحة للتطبيق المحدد، إلا أنهم يقدمون إطارًا واضحًا وموجزًا ​​للتواصل التقني الفعال.

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

غالبًا ما أكد خبراء قابلية الاستخدام، بما في ذلك جاكوب نيلسن وكايل سوسي، على تصميم الصفحة الرئيسية لنجاح موقع الويب وأكدوا أن الصفحة الرئيسية هي الصفحة الأكثر أهمية على موقع الويب. ^[21] نيلسن، جاكوب؛ طاهر، ماري (أكتوبر 2001)، قابلية استخدام الصفحة الرئيسية: تفكيك 50 موقع ويب، دار نشر نيو رايدرز، رقم ISBN 978-0-7357-1102-0^{[22] [23]} ومع ذلك، بدأ الممارسون في العقد الأول من القرن الحادي والعشرين في اكتشاف أن عددًا متزايدًا من حركة المرور على موقع الويب يتجاوز الصفحة الرئيسية، ويذهب مباشرة إلى صفحات المحتوى الداخلية من خلال محركات البحث والنشرات الإخبارية الإلكترونية وموجزات RSS. ^[24] دفع هذا العديد من الممارسين إلى القول بأن الصفحات الرئيسية أقل أهمية مما يعتقد معظم الناس. ^{[25] [26] [27] [28]} زعم جاريد سبول في عام 2007 أن الصفحة الرئيسية للموقع هي في الواقع الصفحة الأقل أهمية على موقع الويب. ^[29]

في عامي 2012 و2013، أصبحت الدوارات (والتي تسمى أيضًا "الشرائح" و"اللافتات الدوارة") عنصر تصميم شائع للغاية على الصفحات الرئيسية، وغالبًا ما تستخدم لعرض المحتوى المميز أو الأخير في مساحة محدودة. ^[30] يزعم العديد من الممارسين أن الدوارات هي عنصر تصميم غير فعال وتضر بتحسين محرك البحث وسهولة الاستخدام لموقع الويب. ^{[30] [31] [32]}

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

تشمل الوظائف الإضافية التي قد تصبح مرتبطة بإنشاء موقع ويب ما يلي:

• مصممو الجرافيك لإنشاء صور مرئية للموقع مثل الشعارات والتخطيطات والأزرار
• متخصصون في التسويق عبر الإنترنت للمساعدة في الحفاظ على التواجد على الويب من خلال حلول استراتيجية لاستهداف المشاهدين للموقع، باستخدام تقنيات التسويق والترويج على الإنترنت
• يقوم كتاب تحسين محركات البحث بالبحث والتوصية بالكلمات الصحيحة التي يجب دمجها في موقع ويب معين وجعل الموقع أكثر سهولة في الوصول إليه والعثور عليه في العديد من محركات البحث
• كاتب محتوى على الإنترنت لإنشاء المحتوى المكتوب للصفحة لجذب المشاهدين المستهدفين للموقع ^[1]
• يدمج مصمم تجربة المستخدم (UX) جوانب اعتبارات التصميم التي تركز على المستخدم والتي تتضمن بنية المعلومات، والتصميم الذي يركز على المستخدم، واختبار المستخدم، وتصميم التفاعل، والتصميم المرئي في بعض الأحيان.

الجماليات نظرية الألوان التكوين (الفنون البصرية) متعدد المتصفحات تعليم التصميم مبادئ وعناصر التصميم رسم النمط الداكن جوائز التصميم الأوروبية بيان "الأشياء الأولى أولاً" لعام 2000

برامج الفنون الرسومية مهن التصميم الجرافيكي الرسومات رسومات المعلومات قائمة مؤسسات التصميم الجرافيكي قائمة مصممي الجرافيك البارزين الشعار مخطط تصميم الويب وتطوير الويب التحسين التدريجي

دليل الأسلوب ويب 2.0 ألوان الويب خطوط آمنة للويب قابلية استخدام الويب إطار عمل تطبيقات الويب منشئ مواقع الويب إطار سلكي للموقع

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

تصميم المعلومات مخطط الألوان الفاتحة والداكنة اتصالات التسويق تصميم الرسوم المتحركة وسائل الاعلام الجديدة تحسين محركات البحث (SEO)

كاتب تقني الطباعة تجربة المستخدم تصميم واجهة المستخدم تطوير الويب رسوم متحركة على الويب

• اتحاد W3C لمعايير الويب
• تصميم وتطوير الويب في Curlie