سأقدم مثالًا عمليًا لكيفية تأثير التحقق من الصحة بشكل سيء على موقع الويب الخاص بك من وجهة نظر تحسين محركات البحث والمستخدمين. ذات مرة، كنت أقوم بإجراء تحسينات على الموقع ونسيت عن طريق الخطأ إغلاق علامة واحدة
. وبعد التأكد من صحة التعديل في المتصفحات المشهورة قمت بإجراء تغييرات على الموقع.
بعد مرور بعض الوقت، عندما قمت بتحليل حركة المرور من خلال Yandex Metrica، لاحظت أن متوسط وقت الزيارة في متصفح Internet Explorer كان أقصر بكثير. وبعد أن فتحت الموقع من خلال هذا المتصفح، أدركت ما كان يحدث. كان الموقع بأكمله منحرفًا، وكان من المستحيل قراءة المحتوى. وهذا يخلق مشكلتين في وقت واحد. كانت المشكلة الأولى هي أنني كنت أفقد كل حركة المرور من IE، والمشكلة الثانية هي أنني كنت أفسد العوامل السلوكية.
كيفية التحقق من صحة موقع كود html
1. مدقق HTML عبر الإنترنت
توجد خدمة مجانية على الإنترنت http://validator.w3.org/. يتحقق من صحة كود html. دعونا نلقي نظرة فاحصة على كيفية عمل هذه الخدمة.
في هذه المقالة سوف أعرض هذا المفهوم "صلاحية"كود الموقع (html & css). أتمنى أن يتذكر الجميع أن html هو هيكل الموقع. Css - قواعد وأنماط العلامات الموضحة في HTML.
سوف نفهم ذلك من الأسفل: النظرية، ثم ننتقل إلى الممارسة. ستجد أيضًا إجابات للأسئلة التالية: ما هي صلاحية كود html وcss، ولماذا هو مطلوب، ولماذا تحب محركات البحث الكود النظيف/الصالح. والأهم من ذلك أنني سأوضح لك بالأمثلة كيفية التحقق من صحة كود الموقع.
لماذا تحتاج إلى التحقق من صحة كود html و css؟
الصلاحية - رمز نظيف بخلاف ذلك (بدون أخطاء)
ثابت رقم 1. صلاحية كود الموقع تسمح بعرض الموقع بشكل صحيح في المتصفحات المختلفة، أي. يتم عرض جميع المكونات المرئية والوظيفية للموقع وتعمل بشكل صحيح. في أغلب الأحيان، يتبين أن المتصفح يعالج ويعرض جميع عناصر الموقع بشكل صحيح، ولكن هذا لا يعني أن الكود نظيف وسلس مثل قاع الطفل.
ثابت رقم 2.يتم تشجيع الكود النظيف (html و css) بواسطة محركات البحث (Yandex، Google). التحدث باللغة الروسية، عندما يأتي روبوت محرك البحث إلى المورد الخاص بك ويرى أنه تم استيفاء الصلاحية، فسيعرف روبوت البحث أن هذا المورد خالي من الأخطاء، وبالتالي سيتعامل مع الموقع للأفضل.
من تجربة شخصية:في ممارستي، كان هناك موقف عندما لا ترغب المقالات الجديدة في المدونة في الظهور في نتائج البحث. يبدو أنك تفعل كل شيء بشكل صحيح، ولكن ياندكس لا يظهر وهذا كل شيء! ما يجب القيام به، حيث لحفر؟ قد يعتقد شخص ما أن المرشحات هي مرشحات، ولكن لا يوجد شيء من هذا القبيل.
لقد قمت بفحص الموقع للتأكد من صحة كود html، وكم تفاجأت وأدركت مكان دفن الكلب. اتضح أن الكود كان يفتقد علامة إغلاقوهذه علامة خاصة تغلق أقسام التعليمات البرمجية أو الروابط من محرك بحث Yandex. وماذا حصلت؟ المقال بأكمله مغلق من الفهرسة. إليكم إجابة السؤال: "لماذا لا يظهر في نتائج البحث؟" ثم قمت بالطبع بإصلاح هذا الخطأ.
دعنا ننتقل من النص المجرد من الناحية النظرية إلى الممارسة، ونتعلم كيفية إجراء عمليات التحقق من الصحة عبر الإنترنت
أهلاً بكم! اليوم سأخبرك ما هو صلاحية كود الموقعلماذا هناك حاجة إليه على الإطلاق وكيفية التحقق منه وإصلاحه باستخدام خدمات التحقق من صحة W3C المختلفة عبر الإنترنت (html وCSS). لذا، لنبدأ بالنظريات. ما هو بالضبط هذا المصطلح؟
صلاحية الكود هي الدرجة التي يتوافق بها كود موقع الويب الخاص بك مع المعايير الدولية المقبولة، والمختصرة بـ W3C. بمعنى آخر، منذ وقت طويل، تم اعتماد عدد من القواعد العامة لكتابة التعليمات البرمجية، والتي، إذا لم تكن متوافقة مع معايير W3C، قد تؤدي إلى عرض غير صحيح لموقعك في متصفحات الكمبيوتر والجوال المختلفة. أيضًا، في بعض الحالات النادرة بشكل خاص، قد يؤدي ذلك إلى فرض عقوبات من محركات البحث، بالإضافة إلى فرض مرشحات مختلفة يمكن أن تؤدي إلى إبطاء تطوير مشروعك. ولكن هذا يحدث نادرا جدا، لأنه حتى ياندكس وجوجل أنفسهم لديهم رمز غير صالح بنسبة 100٪، أي أنه يحتوي على أخطاء.
في الواقع، ربما لديك سؤال: لماذا أحتاج إلى قضاء وقتي في تعديل كود موقعي حتى يصبح صالحًا، إذا لم يؤثر على أي شيء على أي حال؟ كما كتبت أعلاه، يعد هذا ضروريًا لضمان عرض موقعك بشكل صحيح (بدون أخطاء وأخطاء) في المتصفحات المختلفة. اليوم، كما تعلمون، أصبحت أنواع مختلفة من نماذج الهاتف أكثر شعبية: iPhone، Android، الهاتف الذكي وغيرها، والتي يستخدمها بالفعل جميع سكان الأرض. اليوم، كل شخص ثالث لديه هاتف محمول خاص به، يمكنه من خلاله الاتصال بالإنترنت وزيارة موقع الويب الخاص بك. وهذا يزيد بحوالي 20-30 مرة عن أولئك الذين لديهم جهاز كمبيوتر أو كمبيوتر محمول أو جهاز لوحي خاص بهم.
وهذا يعني أنك حصلت على هذه النقطة. إن جمهور الأشخاص الذين يستخدمون الأجهزة المحمولة هو الأكبر، وهو ما نحتاج إلى استهدافه. وإذا كنت تتذكر عدد الأجهزة المحمولة التي تم إصدارها خلال السنوات العشر الماضية وعدد النماذج الجديدة التي يتم إصدارها كل ستة أشهر، يصبح من الواضح أنه سيكون من الغباء جدًا تفويت مثل هذه الحركة (الزوار). بالإضافة إلى ذلك، فإن التقنيات الجديدة لا تقف مكتوفة الأيدي، ومع ظهور لغة html5 المحدثة، قد يتحول موقع الويب القديم الذي تم إنشاؤه في عام 200 إلى أن يكون، إذا جاز التعبير، أحد المخلفات الكبيرة على خلفية الشبكة العالمية.
كيف تتأكد من صحة كود html و CSS الخاص بموقعك؟
هناك الكثير من هذه الخدمات على الإنترنت، ولكن جميعها تقريبًا ملتوية، وحتى باللغة الإنجليزية، حيث لن يكون من السهل جدًا فهم ما يقال. ولكن لا يزال هناك واحد منهم أكثر طبيعية، والذي لا يقدم تفسيرا فحسب، بل يظهر أيضا في أي سطر من التعليمات البرمجية يقع الخطأ. لذلك، تعرف على - Jigsaw.w3.org.
من خلال زيارتك لهذا الموقع، يمكنك التحقق من صلاحية كود موقعك بثلاث طرق. في علامة التبويب "فحص URI"، أدخل عنوان موقعك، وستمنحك الخدمة القائمة الكاملة للأخطاء الموجودة في الرموز الموجودة في الصفحة الرئيسية فقط! إذا لم تكن، مثلي، على دراية كبيرة بالأكواد ولم تتمكن عند عرض كود موقعك من العثور على السطر الذي يحتاج إلى تصحيح، فيمكنك ببساطة تحميل ملف أنماط CSS الخاص بك (تصميم الموقع) في "التحقق من الملف الذي تم تحميله" " فاتورة غير مدفوعة. .
في هذه الحالة، ستعرف بالفعل الملف الذي تحتاج إلى تحرير الكود فيه. بالمناسبة، يمكنك أن تفعل ذلك أسهل. إذا كان موقعك يعمل على بعض المحركات، على سبيل المثال، فستحتاج فقط إلى الانتقال إلى لوحة إدارة المدونة في "المظهر" "المحرر"، وتحديد ملف، على سبيل المثال، header (header.php)، ونسخ الكود والصقه في علامة التبويب "فحص النص" بالخدمة. هذه هي الطريقة التي قمت بها شخصيًا بمراجعة مدونتي.
لذلك، في موقعي شخصيًا كان هناك 44 خطأ، وهو عدد قليل جدًا مقارنة بالمواقع الأخرى. بالمناسبة، لدى العم ياندكس ما يصل إلى 155 خطأ، آه آه آه. حسنًا، حسنًا، دعونا لا نتحدث عن الأشياء الحزينة.
ولتسهيل عليك تصحيح هذه الأخطاء في الرموز، دعني أعرض لك شخصيًا بعض الأمثلة على مدونتي. أولاً، انتبه إلى السطر 26 من النقش. يشير هذا إلى سطر من التعليمات البرمجية. للعثور عليه بسرعة، ضع هذا الرمز الذي قمت بإدراجه في خدمة Jigsaw.w3.org في أي محرر HTML، وسيتم عرض تسميات الأسطر.
لاحظ أن بعض العلامات يتم تمييزها دائمًا باللون الأحمر في الكود. هذا هو المكان الذي تحتاج فيه إلى البحث عن الكود وتعديله. في أغلب الأحيان، يجب إزالته تمامًا، أو إضافة العلامات المفقودة إليه. يوجد أيضًا في العنوان وفي أسفل النقش نصائح باللغة الإنجليزية حول ما يجب القيام به لتصحيح الخطأ.
مثال 1. هنا تحتاج إلى إزالة علامات الاقتباس المميزة باللون الأحمر <>
. لا ينبغي أن تكون داخل الكود، حيث تكون موجودة بالفعل في البداية والنهاية.
مثال 2. توجد علامة إغلاق مفقودة في نهاية الكود />
. لاحظ أنه إذا كان هناك سطر آخر في الجزء العلوي من الكود، أيضًا بعلامة غير مغلقة، فيجب أيضًا إغلاقه، وإلا فلن يختفي الخطأ.
مثال 3. هنا تحتاج فقط إلى إزالة السطر المتكرر: " href = "">
.
بالمناسبة، يجب عليك أولا تصحيح الأخطاء، تلك التي تم وضع علامة عليها بصليب، وليس بعلامة تعجب، لأن هذه الأخطاء ليست مهمة للغاية. وأيضًا، قبل أن تصلح أي شيء، افعل هذا، فهناك احتمال كبير أن تكسره. بعد تنظيف الكود بالكامل، أوصي بالنظر في كيفية عرض موقعك في متصفحات مختلفة على منصات مختلفة لأجهزة الكمبيوتر والهواتف. يمكن أن تساعدك خدمة browsershots.org المجانية عبر الإنترنت في ذلك.
وإلا كيف يمكنك التحقق بسرعة من صحة كود html وCSS لموقعك؟
إذا لم يكن Jigsaw.w3.org كافيًا بالنسبة لك، فإليك بعض الخدمات الإضافية للتحقق من صحة كود html الخاص بالموقع: www.validome.org، watson.addy.com،
في الختام، أريد أن أقول أنه إذا وجدت بعض الأخطاء في نفسك، فلا داعي للقلق بشأن ذلك، لأنه ليس بهذه الأهمية اليوم. بشكل عام، تم إجراء تجارب حول هذا الموضوع لفترة طويلة، والتي أصبح من الواضح أن الكود غير الصالح لا يؤثر على نتائج البحث في الموقع. ولكن، للأسف، الإنترنت بيئة يتغير فيها كل شيء بسرعة. اليوم قد لا يهم، ولكن غدا ستضيف ياندكس هذه الخوارزمية الإضافية إلى نفسها وقد تتدلى مواقع البحث (تسقط). لذا، إذا كان لديك وقت إضافي لإصلاح كود موقعك، فمن الأفضل أن تفعل ذلك الآن.
يعد التحقق من الصحة أحد أهم جوانب تصميم الويب الجيد. دعونا نلقي نظرة على ما هو وكيفية التحقق من صحة كود HTML. كمثال، لنأخذ نظام إدارة المحتوى الأكثر شيوعًا (CMS) – WordPress. وبعد ذلك، سنشارك قائمة الأخطاء التي واجهناها في الممارسة العملية، والأهم من ذلك، سنقدم طرقنا المجربة للتخلص منها.
لماذا من الضروري التحقق من صحة الموقع؟
ببساطة، فحص صفحة الويب سيحدد ما إذا كانت تلبي المعايير التي وضعها اتحاد شبكة الويب العالمية (W3C). يتم ذلك عادةً عن طريق التحقق من صحة الصفحات الفردية باستخدام خدمة التحقق عبر الإنترنت الخاصة بـ W3C.
مثلما توجد قواعد نحوية في اللغات المختلفة، هناك أيضًا قواعد في البرمجة. يتيح لك الفحص معرفة ما إذا كانت الصفحة تتوافق مع هذه القواعد، وإذا كانت هناك أخطاء أو تحذيرات، فسيتم تقديم توصيات لحلها. سنناقش الحاجة إلى هذا التحقق بمزيد من التفاصيل أدناه.
ما الذي يؤثر على صلاحية الموقع؟
هل تساءلت يومًا كيف "تقرأ" المتصفحات صفحة الويب؟ لديهم "محركات" لتحليل التعليمات البرمجية وتحويلها إلى نموذج مرئي للأشخاص. لسوء الحظ، كل متصفح لديه آلية خاصة به لمعالجة التعليمات البرمجية، وهذا قد يتسبب في عرض صفحاتك بشكل مختلف.
قد تتم قراءة صفحة الويب غير الصحيحة بشكل مختلف بواسطة المتصفحات. سيؤدي هذا إلى احتمال عدم تمكن زوار موقعك من رؤية محتوى الصفحة بشكل صحيح في متصفحاتهم. سيؤدي التحقق من الصحة لاحقًا إلى تصحيح جميع الاختلافات الرئيسية تقريبًا وجعل صفحة الويب الخاصة بك قابلة للقراءة بواسطة جميع متصفحات الويب تقريبًا (الاستثناء الأكثر شيوعًا هو الإصدارات الأقدم من Internet Explorer). ومن هنا جاء مصطلح "التخطيط عبر المتصفحات" - أي. تخطيط جيد (متوافق) بنفس القدر لجميع المتصفحات الشائعة.
كيف سيؤثر هذا على تحسين محركات البحث؟ من المهم أن نفهم أن روبوتات محركات البحث تحب صفحات الويب الدلالية. التخطيط الدلالي، وفقًا لويكيبيديا، هو أسلوب لإنشاء صفحات ويب بتنسيق HTML، استنادًا إلى استخدام علامات HTML وفقًا لدلالاتها (الغرض). بالإضافة إلى ذلك، تسمح صفحة الويب الدلالية الهيكلية لروبوتات البحث بتحديد أهمية كل من العناصر الفردية لصفحة الويب والنص بأكمله بشكل أكثر دقة. وفقًا لجوجل، لا يؤثر الكود الصحيح على ترتيب الصفحة بأي شكل من الأشكال. ولكن في الوقت نفسه، يمكن أن يؤثر وجود أخطاء في الكود سلبًا على مسح العلامات الدقيقة والتكيف مع الأجهزة المحمولة.
أدوات التحقق من صحة موقع الويب الخاص بك
لفهم الحاجة إلى عدم وجود أخطاء التحقق من الصحة على صفحات الموقع، دعونا نلقي نظرة على كيفية البحث عن هذه الأخطاء.
هناك العديد من الخدمات المجانية للتحقق من موقع الويب، مثل خدمة التحقق من صحة العلامات W3C، ومحلل صفحات الويب، وBrowsershots وغيرها.
