تخطَّ إلى المحتوى

تحويل HTML إلى PDF

حوّل ملف HTML — أو ترميزًا تلصقه — إلى ملف PDF مقسّم إلى صفحات يبدو تمامًا مثل الصفحة: flexbox وgrid والتدرجات والصور والطباعة كلها كما هي.

  • يُحذف فور انتهاء التحويل
  • نقل مشفّر، ويُحذف فورًا
  • دون تسجيل ودون علامة مائية

كيف تعمل الأداة

1

أضف HTML

أفلِت ملف .html، أو الصق الترميز في المربع.

2

اختر الصفحة

مقاس الصفحة واتجاهها والهوامش — تُطبَّق كقواعد CSS طباعة حقيقية.

3

حوّل ونزّل

يُعرض ويُقسَّم إلى صفحات تمامًا كما يفعل «طباعة ← حفظ بصيغة PDF»، مع نص حقيقي قابل للتحديد.

ما الذي يُسمح للصفحة بالوصول إليه، وما الذي يتحكم فيه CSS

لا يملك التحويل وصولًا إلى الشبكة ولا يشغّل أي سكربتات، وكلاهما قرار أمني لا ميزة ناقصة. فالمحوّل الذي يجلب كل ما تطلبه الصفحة المرسلة يمكن توجيهه بسهولة إلى عناوين لا يراها إلا خادمنا، والذي يشغّل السكربتات سيكون يشغّل كود شخص غريب. لذا فملف الأنماط المرتبط بشبكة CDN لا يصل، والصورة ذات عنوان الويب العادي لا تُحمَّل، وخط الويب يُستبدل بصمت، والصفحة التي ترسم نفسها بـ JavaScript تُحوَّل على هيئة ما يقوله الترميز قبل تشغيل أي شيء. والحل هو نفسه دائمًا: ضمّن CSS في كتلة style وضمّن الصور كـ data URI. والمتصفحات توفر ذلك مباشرة — «حفظ الصفحة باسم ← صفحة ويب، كاملة» في Firefox، أو «الحفظ بصيغة MHTML» — والصفحة المحفوظة في ملف واحد تُحوَّل بأمانة.

قواعد CSS الخاصة بالطباعة هي ما يحكم النتيجة فعلًا، وهذا ثاني ما يستحق المعرفة. فالصفحة تُخطَّط كأنها تُطبع، فتسري كتلة @media print وقد لا يسري ملف أنماط الشاشة العادي — ولهذا فالصفحة التي تتضمن قاعدة طباعة تخفي شريط التنقل تُحوَّل بشكل جميل، والتي تخلو منها تجلب معها واجهة الموقع كلها. @page يتحكم في الورق: يُقرأ منه المقاس والاتجاه والهوامش. وbreak-before وbreak-after وbreak-inside: avoid تحدد أين تنقسم الصفحات، فالجدول الذي يجب ألا ينقسم أو القسم الذي يجب أن يبدأ في صفحة جديدة تحت سيطرتك بالكامل.

الخلفيات هي الإغفال الكلاسيكي. لا تطبع المتصفحات ألوان الخلفية وصورها افتراضيًا، فقد تُحوَّل الترويسة الداكنة بيضاء ما لم يقل ملف الأنماط -webkit-print-color-adjust: exact — سطر واحد، وهو الفرق بين مستند يحمل هويتك البصرية ومستند عارٍ. يبقى النص نصًا حقيقيًا، وتبقى الروابط روابط تعمل، ويمكن أن تصبح العناوين إشارات مرجعية في PDF حيث يستخدم الترميز عناصر عناوين حقيقية.

إن تعذّر الوصول إلى خادمنا، تخبرك الصفحة بذلك وتعيد بناء المستند محليًا، فتحتفظ بالنص والصور والتخطيط البسيط مع تبسيط كل ما يحتاج إلى معالجة تخطيط حقيقية — ومن ذلك grid وflexbox وfloat والتموضع. المستند البسيط يُحوَّل بشكل شبه مطابق؛ أما المستند المصمَّم فلا.

عندما تحتاج إلى شيء آخر

لتحويل عنوان URL مباشر — وهو ما لا تستطيعه هذه الصفحة عن قصد — فإن محرك العرض نفسه الذي يعمل على خادمنا يعمل على جهازك: chrome --headless --disable-gpu --print-to-pdf=out.pdf https://example.com يحمّل الصفحة مع اتصالها بالشبكة، بسكربتاتها وكل شيء. هذا هو الفرق كله، وهو السبب للجوء إليه.

للتحكم الحقيقي في الترويسات والتذييلات وأرقام الصفحات والهوامش، تطبّق WeasyPrint وPrince مواصفة CSS Paged Media كما ينبغي: ترويسات متكررة من @top-center، وعدّادات صفحات، وحواشٍ سفلية، وإحالات مرجعية تُحلّ إلى أرقام صفحات. WeasyPrint مجانية، وهي ما تستخدمه معظم مسارات إنتاج التوثيق. أما Chrome فلا يدعم شيئًا تقريبًا من ذلك، فالتقرير المُولَّد الذي يحمل «الصفحة 3 من 12» في تذييله يحتاج إلى إحداهما لا إلى هذه الأداة.

الأسئلة الشائعة

هل سيبدو تمامًا مثل صفحتي؟

نعم — يخرج تمامًا كما ينتجه «طباعة ← حفظ بصيغة PDF». flexbox وgrid وfloat والتدرجات والظلال وSVG وخطوط الويب تخرج تمامًا كما تبدو على الشاشة.

هل يُخزَّن ترميز HTML في أي مكان؟

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

هل يُنفَّذ JavaScript؟

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

هل يمكنني استخدام صور أو ملفات أنماط خارجية؟

لا — التحويل معزول عن الشبكة لأسباب أمنية. ضمّن CSS داخل الملف وضمّن الصور كـ data URI؛ فكل ما هو مكتفٍ بذاته يُعرض بشكل مثالي.

هل النص قابل للتحديد؟

نعم. يحمل ملف PDF نصًا ورسومًا متجهة حقيقية — لا لقطة شاشة — فيبقى حادًا عند أي تكبير، ويمكن تحديده والبحث فيه ونسخه.

كيف تُحدَّد فواصل الصفحات؟

بقواعد CSS طباعة حقيقية: يتدفق المحتوى عبر الصفحات، وتُحترم قواعد page-break-before وpage-break-after وpage-break-inside في ترميزك تمامًا كما يحترمها المتصفح عند الطباعة.

معلومة مفيدة: لا تُنفَّذ السكربتات ولا يملك التحويل وصولًا إلى الشبكة — ضمّن أنماطك داخل الملف والصور كـ data URI. لا يمكن جلب عناوين URL مباشرة؛ احفظ الصفحة كملف أولًا. إن تعذّر الوصول إلى خادمنا، يحتفظ البديل العامل في المتصفح بالنص والتخطيط البسيط لكنه يبسّط CSS المتقدم.