The Code Fix

🟧 شرح HTML

الرموز والكيانات والإيموجي والترميز

لماذا نحتاج الكيانات (Entities)؟

بعض المحارف محجوزة في HTML (مثل < و>)، لأن المتصفح يظنّها بداية وسم. لعرضها كنص نستخدم كيان HTML: يبدأ بـ & وينتهي بـ ;.

<p>5 &lt; 10 و 10 &gt; 5</p>   <!-- يعرض: 5 < 10 و 10 > 5 -->

أشهر الكيانات

المحرفالكيانالوصف
<&lt;أصغر من
>&gt;أكبر من
&&amp;علامة و
"&quot;اقتباس مزدوج
مسافة&nbsp;مسافة غير قابلة للكسر
©&copy;حقوق النشر
&euro;يورو
<p>الشركة &copy; 2026 — كل الحقوق &amp; الملكية محفوظة.</p>

🔑 الكيان &nbsp; يمنع المتصفح من كسر السطر بين كلمتين — مفيد لكن لا تُكثر منه.

الرموز (Symbols)

محارف رياضية وعلمية وعملات لها كيانات أو أكواد:

<p>&pi; &asymp; 3.14 — &deg;C — &times; &divide;</p>

الإيموجي (Emojis)

الإيموجي محارف Unicode عادية! يمكنك لصقها مباشرة طالما الترميز UTF-8:

<p>أحب البرمجة 💻🚀🔥</p>

ترميز المحارف (Charset)

UTF-8 هو الترميز العالمي الذي يدعم العربية وكل اللغات والإيموجي. ضعه دائمًا في الـ head:

<meta charset="UTF-8" />

بدونه قد تظهر الحروف العربية على شكل رموز غريبة (���).

ترميز الروابط (URL Encoding)

الروابط لا تقبل المسافات وبعض المحارف، فتُحوَّل: المسافة تصبح %20، والحروف العربية تُرمَّز أيضًا:

https://site.com/search?q=تعلم البرمجة
→ https://site.com/search?q=%D8%AA%D8%B9%D9%84%D9%85%20...

المتصفح يقوم بهذا غالبًا تلقائيًا، لكن من المفيد فهمه.

الأخطاء الشائعة

  • ❌ كتابة < و& مباشرة في النص → قد تكسر الصفحة. استخدم &lt; و&amp;.
  • ❌ نسيان UTF-8 → عربية مشوّهة.
  • ❌ الإفراط في &nbsp; للتباعد → استخدم CSS بدلًا منه.

خلاصة

استخدم الكيانات (&lt;, &amp;...) لعرض المحارف المحجوزة، وUTF-8 لدعم العربية والإيموجي، وافهم ترميز الروابط %20.