اكواد الميتا meta tag في لغة html الدرس|4| - Programmer Tech

Programmer Tech

موقع تعليم مجاني يهتم بتعلم البرمجة و علوم الكمبيوتر, أمن المعلومات, القرصنة الأخلاقية, سكربتات

إعلان اعلى المقالة

الأحد، 24 نوفمبر 2019

اكواد الميتا meta tag في لغة html الدرس|4|



التعرف على اكواد وسم meta

الـ meta tag هي من أهم الأشياء بالنسبة لمحركات البحث فهي تسهل الأمر لمحركات البحث على الزائر.

تخيل معي انك الآن الزائر للموقع وليس المبرمج اول شيئ سوف تفعله الدخول علي اي محرك بحث وتبحث عن الموضوع الذي تريده.

هل سألت نفسك في يوم من الايام لماذا محرك البحث قام بجلب كل المواقع المتعلقه ببحثك فقط ؟ ولماذا لم يأتي بجميع المواقع الموجوده في العالم الافتراضي؟

اكواد الميتا تاغ تُعرّف محركات البحث أن موقعك يقوم بنشر شيئ معين كما طلبت انت من هذا المحرك, على سبيل المثال موقعك يتحدث عن البرمجة يجب ان يكون في اكواد الميتا تاغ بنفس اسلوب الموقع, لا ينفع ان يكون موقعي يتحدث عن البرمجة وانا اكتب داخل اكواد الميتا تاغ أمن المعلومات هذا ليس مقبول, محركات البحث تعرف انك تتحدث عن البرمجة وهذا ما تم كتابتة في اكواد الميتا تاغ.

كيف ستكتب مقال عن البرمجة و يظهر في محركات البحث ؟

الإجابة هنا اخي في برمجة الويب او بناء المواقع, طبعاً اكواد الميتا تاغ موجوده, ويكون موقعها داخل وسمين <head> </head> هنا يتم كتابة اكواد الميتا تاغ .

في بعض الأحيان اريد ان اكتب موقع باللغة العربية, في الدرس السابق تحدثت عن العنوان او title ونعرف كلنا مكانه وهو ايضاً يساعد محركات البحث من خلال هذا العنوان, لا ينفع ان يكون الموقع يتحدث عن البرمجة وأنا اكتب في عنوان الموقع سياسة أو دواجن او محروقات وغيره, هكذا غباء الموقع يتحدث عن البرمجة كيف اضع في العنوان سياسة او غيره وهو لا يتحدث عن السياسة وكذلك العكس صحيح مثال علي ذلك.



<html>
<head>
<title> Programmer Tech </title>
</head>
<body>
</body>
</html>

شرح المثال السابق

في المثال السابق تم وضع عنوان الصفحه يخص البرمجة Programmer Tech وهكذا سوف يعرف محرك البحث ان هذا الموقع خاص بالبرمجه.

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


لاحظ كلمة احمد قيصر لم تظهر باللغة العربية علي متصفح internet Explorer


لكنها ستظهر بشكل صحيح على google chrom كما في الصورة التالية

لم يختلف شيئ نفس الكود لكن متصفح internet Explorer لا يقبل اللغة العربية عكس google chrom يقبل اللغة العربية, وانت كمبرمج لا تعرف من اي محرك بحث سوف يدخل الزائر لموقعك, و لتفادي هذه المشكلة الحل هو عن طريق اكواد الميتا تاغ كما في المثال التالي :

<html>
<head>
<meta charset="utf-8">
<title> Programmer Tech </title>
</head>
<body>
</body>
</html>

بعد تعريف المتصفح اني اريد كتابة اللغة العربية في السورس كود من خلال الوسم meta charset و مهمته اننا نقول للمتصفح استخدم اللغة العربية من خلال خاصية utf-8 و يتم التعرف على اللغه العربيه في كل المتصفحات كما في الصورة التالية


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

ويكون هذا الوصف او النبذه مكتوبة ضمن وسم ال meta كما في الصورة التالية


يتضح من الصورة السابقة كيف يمكنني ان اكتب النبذه التعريفية عن الموقع من خلال content وهناك اكواد ايضاً تُكتب في رأس الصفحة head وهناك بعض الأوسمة مثل style الخاصة بتنسيق css و script الخاصة بـ javascript وسنتعرف عليهم في الدورات الخاصة بهم لاحقاً.

نأتي الآن الى الوسم link هو وسم استحضار ملفات أو روابط من الأنترنت على سبيل المثال لدينا ملف اسمه style.css وهذا الملف الخاص بالتنسيق ونريد استحضار هذا الملف والصورة التالية توضح ذلك.


لقد قمنا بإنشاء ملف style.css في نفس المجلد الموجود عليه kaissar.html وقمنا بإستعمال الوسم link لنقوم بإستحضار ملف او اي شيئ نريده فقط نضع المسار بين ""=href , نحن فقط اليوم نشرح لكم الأوسمة الموجوده داخل راس الموقع التي هي head بشكل بسيط للتعرف عليها.

ليست هناك تعليقات:

إرسال تعليق

facebook

تسميات

تواصل معنا

Translate

أخر الافكار

من انا

authorمبرمجين ويب و محبين للتقنية و الشبكات و امن المعلومات و سوف نقدم لكم الافضل إن شاء الله
أعرف المزيد ←

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

اقسام