# عارض HTML

URL: https://discuvr.org/html-viewer/?hl=ar
Last updated: 2026-11-08
MCP tool: `inspect_html`

الصق HTML وعاينه مباشرة في بيئة معزولة، بعرض الهاتف أو الجهاز اللوحي أو سطح المكتب. نسّقه أو اضغطه، شغّل البرامج النصية بوحدة تحكم، واكتشف مشاكل حقيقية في الترميز.

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

## ما الذي تفعله الأداة

- معاينة مباشرة أثناء الكتابة؛ وعند تجاوز 200,000 حرف تتوقف مؤقتًا حتى تضغط تحديث.
- أحجام معاينة للهاتف والجهاز اللوحي وسطح المكتب والعرض الكامل، إضافة إلى ملء الشاشة.
- البرامج النصية متوقفة افتراضيًا؛ شغّلها لترى مخرجات وحدة التحكم والأخطاء.
- جمّل الترميز غير المرتب أو صغّره، دون المساس بمحتوى pre أو script أو style.
- تقرير فحص: أعداد العناصر، ومخطط العناوين، ومشكلات محددة.
- افتح ملف .html محليًا، أو انسخ النتيجة أو نزّلها.

## كيف يعمل

1. الصق HTML، أو افتح ملف .html، أو حمّل المثال.
2. اختر عرض المعاينة وقرّر ما إذا كان يُسمح بتشغيل البرامج النصية.
3. جمّل أو صغّر أو افحص، ثم انسخ النتيجة أو نزّلها.

## لماذا تعمل المعاينة في بيئة معزولة

قد يحتوي HTML الملصق على برامج نصية ونماذج وروابط لم تكتبها أنت. تعمل المعاينة داخل iframe بخاصية sandbox وبأصل معتم خاص بها، فلا يستطيع شيء بداخلها قراءة ملفات تعريف الارتباط لهذا الموقع أو جلستك، ولا إرسال بيانات نيابة عنك، ولا نقل هذه الصفحة إلى عنوان آخر. وتبقى البرامج النصية متوقفة حتى تشغّلها.

## ما الذي يتحقق منه الفحص

يقرأ الترميز بمحلل HTML قياسي ولا يبلّغ إلا عمّا رآه: وسوم فُتحت ولم تُغلق، ووسوم إغلاق بلا وسم فتح، وصور بلا نص بديل، ومعرّفات id مكررة، وروابط تفتح علامة تبويب جديدة دون rel="noopener"، ومستويات عناوين متخطاة، وموارد تُحمَّل عبر http://، وفي الصفحة الكاملة غياب doctype أو title أو lang أو وسم viewport.

## ما يتجاهله الفحص عن قصد

يبلغ عن الأخطاء لا عن الأسلوب. وسوم الإغلاق التي يسمح معيار HTML بحذفها، مثل </p> و</li> و</td> و</tr> و</option>، لا تظهر أبدًا على أنها غير مغلقة، والعناصر الفارغة مثل <br> و<img> و<input> لا تحتاج إلى وسم إغلاق. السمة الفارغة alt="" تُحسب نصًا بديلًا، وهذا صحيح للصورة الزخرفية. الرابط الذي يحمل target="_blank" يمر مع rel="noopener" أو rel="noreferrer". الرابط العادي http:// داخل <a href> لا يُعد غير آمن؛ فقط الموارد التي تُحمَّل مثل الصور والبرامج النصية وأوراق الأنماط وإطارات iframe. الرجوع إلى مستوى عنوان أعلى (من h4 إلى h2) لا بأس به؛ يُبلَّغ فقط عن القفز إلى الأسفل متخطيًا مستوى (من h2 إلى h4). فحوص doctype وtitle وlang وviewport لا تعمل إلا إذا كان النص الملصق صفحة كاملة، أي فيه doctype أو وسم html أو head أو body، لذلك لا يُحاسَب جزء من رسالة بريد أو مقتطف من نظام إدارة محتوى عليها.

## فحص رسالة بريد HTML قبل إرسالها

اعرضها أولًا بعرض الهاتف (375 px) لأن كثيرين يفتحون بريدهم على الهاتف، ثم بعرض الجهاز اللوحي (768 px) وسطح المكتب (1280 px). اترك البرامج النصية متوقفة: تطبيقات البريد لا تشغّل JavaScript، لذلك المعاينة دونها أقرب إلى ما يراه القارئ. استخدم روابط صور مطلقة تبدأ بـ https:// لأن المعاينة وتطبيق بريد المستلم لا يريان الملفات على حاسوبك. التصغير يحذف التعليقات العادية لكنه يُبقي التعليقات الشرطية التي تبدأ بـ <!--[if مثل <!--[if mso]> ... <![endif]-->. ولا يُبقي وسم الإغلاق <!--<![endif]--> في نمط <!--[if !mso]><!-->، فلا تصغّر قالبًا يستخدمه وإلا فقد يخفي Outlook كل ما بعده. المعاينة عرض متصفح؛ أما Outlook الكلاسيكي على Windows فيرسم البريد بمحرك Word، لذا أرسل لنفسك رسالة تجريبية هناك قبل أي إرسال كبير.

## الأسئلة

**هل يُرفع كود HTML أو يُخزَّن؟**

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

**لماذا لا تعمل برامجي النصية؟**

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

**لماذا لا تُحمَّل الصور أو أوراق الأنماط ذات المسارات النسبية؟**

تُبنى المعاينة من النص الملصق، لا من جهازك ولا من خادمك، لذا يُبحث عن مسار نسبي مثل images/logo.png في هذا الموقع ولا يُعثر عليه. استخدم عناوين URL مطلقة، أو أضف وسم <base href="..."> يشير إلى المكان الحقيقي للملفات.

**هل يغيّر التجميل شكل الصفحة؟**

يعيد فقط ضبط المسافات البادئة بين الوسوم ويترك محتوى pre وtextarea وscript وstyle كما هو. قد تتغير المسافات بين العناصر السطرية قليلًا أحيانًا، لذا راجع المعاينة بعد التنسيق.

**ما حجم المستند الذي يمكنه التعامل معه؟**

يقبل تقرير الفحص ما يصل إلى 1,000,000 حرف ويعرض 200 مشكلة كحد أقصى. وتتوقف المعاينة المباشرة مؤقتًا بعد 200,000 حرف لتبقى الكتابة سلسة؛ اضغط تحديث أو Ctrl+Enter لتحديثها.

**هل يمكنني معاينة قالب بريد إلكتروني بصيغة HTML؟**

نعم. الصق كود HTML للرسالة أو افتح ملف .html، وبدّل العرض إلى هاتف (375 px) وسطح المكتب (1280 px) لترى التخطيطين، ثم اضغط فحص لتجد الصور التي بلا نص بديل والموارد المحمّلة عبر http:// غير المشفّر. تستخدم المعاينة محرك متصفحك، بينما لكل برنامج بريد محركه الخاص وكثير منها يتجاهل جزءًا من CSS، لذا فهي تُظهر تقريبًا ما يعرضه بريد الويب في المتصفح، لا ما سيعرضه كل صندوق وارد بدقة. برامج البريد لا تشغّل JavaScript، فاترك تشغيل البرامج النصية متوقفًا. وقبل الإرسال الفعلي أرسل رسالة تجريبية إلى البرامج التي يستخدمها قرّاؤك.

**هل من الآمن فتح ملف HTML أرسله لي شخص ما؟**

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

**لماذا تتحول بعض الحروف إلى � بعد فتح ملف؟**

يقرأ زر فتح ملف الملف دائمًا بترميز UTF-8 ويتجاهل أي وسم <meta charset> بداخله. الصفحة المحفوظة بترميز Windows-1256 أو ISO-8859-6، وهو أمر شائع في محررات Windows القديمة وملفات التصدير، تخزن الحروف العربية ببايتات ليست UTF-8 صالحًا، فيظهر كل حرف منها كحرف الاستبدال �. افتح الملف في محررك، واحفظه مجددًا بترميز UTF-8 (المفكرة: حفظ باسم، الترميز UTF-8؛ VS Code: انقر على الترميز في شريط الحالة ثم Save with Encoding)، ثم افتحه هنا مرة أخرى. أو افتح الملف في متصفحك، واعرض مصدره والصقه هنا، لأن المتصفح فك ترميزه بالفعل باستخدام charset الصفحة نفسها.

**لماذا لا يفعل نموذج أو رابط يفتح علامة تبويب جديدة أي شيء في المعاينة؟**

لا تسمح البيئة المعزولة أبدًا بإرسال النماذج أو النوافذ المنبثقة، حتى مع تفعيل تشغيل البرامج النصية، لذلك لا يرسل زر الإرسال شيئًا، وتُحظر الروابط التي تحمل target="_blank" واستدعاءات window.open(). وهذا يمنع الصفحة الملصقة من إرسال بيانات أو فتح مواقع أخرى. تُفتح الروابط العادية داخل إطار المعاينة، والمواقع التي ترفض العرض داخل إطار تظهر فارغة أو مرفوضة. لفحص نموذج، اقرأ action وmethod والحقول في المصدر، كما يسرد زر فحص كل رابط target="_blank" بلا rel="noopener". واختبر الإرسال الحقيقي على خادم التطوير الخاص بك.

## المزيد في أدوات المطورين

- [حاسبة الشبكة الفرعية لـ IP](https://discuvr.org/ip-subnet-calculator/?hl=ar)
- [ترميز / فك الترميز](https://discuvr.org/encode-decode/?hl=ar)
- [محوّل طابع Unix الزمني](https://discuvr.org/timestamp-converter/?hl=ar)
- [صانع مخططات الأنظمة](https://discuvr.org/system-diagram/?hl=ar)

## يُستخدم غالبًا مع

- [مقارنة النصوص](https://discuvr.org/text-diff/?hl=ar)
- [فحص أمان الموقع الإلكتروني](https://discuvr.org/security-scan/?hl=ar)

---

Part of Discuvr (https://discuvr.org/): Discuvr is a collection of free, focused tools for day-to-day professional work - office and data utilities, legal and compliance helpers, privacy and security checks, and developer formatters. Every tool has its own page, and most can also be called from ChatGPT or Claude over MCP.