المرحلة التمهيدية

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

تسديد الديون التقنية

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

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

أخطاء وقت التشغيل
تحقَّق من الأخطاء التي تم الإبلاغ عنها في وحدة تحكُّم المتصفِّح. ويجب ألا يكون هناك أي :).

النسخ النصي
هل هناك أخطاء في رمز HTML أو CSS أو JavaScript؟ يمكن أن يساعد بناء الدمج في سير العمل في الحفاظ على جودة التعليمات البرمجية وتجنب التراجع. ونقترح استخدام HTMLHint وStyleLint وESLint، والتي يمكن استخدامها كمكونات إضافية لتعديل الرموز، أو تشغيلها من سطر الأوامر في عمليات سير العمل وأدوات الدمج المستمر مثل Travis.

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

المكوّنات الإضافية
يمكن أن تشكّل المكوّنات الإضافية، مثل Flash وSilverlight، خطرًا أمنيًا، وبالتالي تم إيقاف إتاحة استخدامها، ولا تعمل على الأجهزة الجوّالة. استخدام Lighthouse للبحث عن مكونات إضافية

إجراء الاختبارات باستخدام مجموعة متنوعة من الأجهزة والسياقات

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

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

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

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

الاتصال
جرِّب عدة أنواع من الشبكات المستهدفة، وهي الشبكات المتصلة وشبكة Wi-Fi وشبكة الجوّال. يمكنك استخدام أدوات المتصفح لمحاكاة مجموعة متنوعة من شروط الشبكة.

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

تعمل صفحة مشاركات المدونة بمواصفات عالية وهاتف منخفض المواصفات

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

قد تكون النتائج البسيطة مثل هذه أكثر أهمية بكثير من تشويش بيانات الأداء!

تجربة واجهة المستخدم وتجربة المستخدم

تسهيل الاستخدام وتسهيل الاستخدام وتسهيل القراءة
لضمان وصول الجميع إلى محتوى موقعك الإلكتروني ووظائفه، عليك فهم تنوّع المستخدمين. تُجري أداة Lighthouse وغيرها من الأدوات إجراء اختبارات للتحقّق من مشاكل معيّنة في إمكانية الوصول، ولكن لا شيء يتفوق على الاختبار الواقعي. حاول القراءة والتنقل وإدخال البيانات في مجموعة متنوعة من السيناريوهات: على سبيل المثال، في الهواء الطلق في ضوء الشمس أو في القطار. اطلب من مجموعة من الأصدقاء والعائلة والزملاء تجربة موقعك جرِّب استخدام المحتوى عبر قارئ شاشة، مثل VoiceOver على نظام التشغيل Mac أو NVDA على نظام التشغيل Windows.

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

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

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

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

اختبارات ذاتية لواجهة المستخدم
قد لا تكون هذه الاختبارات جميعها ذات صلة، ولكن يمكن أن تؤدي التغييرات البسيطة إلى تسهيل عملية إعادة الهيكلة:

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