Ainasr المدونة بحث

تحويل الصورة إلى Base64

حوّل الصور الصغيرة إلى نص Base64 أو Data URI جاهز للاستخدام في HTML و CSS. المعالجة تتم بالكامل في متصفحك.

اسحب صورة هنا أو انقر للاختيار
PNG, JPG, WebP, GIF, SVG - حتى 5 ميجابايت

دليل استخدام Base64 للصور

متى يكون التضمين مفيداً ومتى يضر الأداء

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

أفضل حالات الاستخدام

أيقونات صغيرة

الأيقونات التي يقل حجمها عن بضعة كيلوبايت يمكن تضمينها لتقليل طلبات الشبكة في صفحات بسيطة.

قوالب البريد

بعض قوالب البريد تحتاج صوراً مضمّنة لا تعتمد على روابط خارجية قد تُحجب عند المستلم.

نماذج أولية

عند مشاركة مثال HTML واحد مع فريقك، يساعد Data URI في إبقاء المثال مستقلاً وسهل النقل.

لا تستخدمه للصور الكبيرة

ترميز Base64 يزيد حجم البيانات تقريباً، ويجعل الصورة جزءاً من ملف HTML أو CSS بدلاً من ملف قابل للتخزين المؤقت منفصلاً. للصور الكبيرة أو المتكررة في أكثر من صفحة، استخدم ملف صورة عادي بصيغة WebP أو JPG أو PNG.

خطوات الاستخدام

1
اختر صورة صغيرة
يفضل أن تكون أقل من 20 كيلوبايت للاستخدام داخل الكود.
2
اختر صيغة الناتج
Data URI مناسب للوسوم، و CSS مناسب للخلفيات.
3
انسخ النص
ضع الناتج في المكان المناسب ثم اختبر سرعة الصفحة.

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

إجابات سريعة حول Base64

هل يحافظ Base64 على جودة الصورة؟

نعم. Base64 لا يغيّر البكسلات ولا يضغط الصورة، بل يغيّر طريقة تمثيل الملف كنص.

لماذا يصبح النص أطول من الملف؟

لأن كل ثلاثة بايتات من البيانات الثنائية تتحول تقريباً إلى أربعة أحرف نصية، لذلك يزيد الحجم النظري بنحو الثلث قبل ضغط HTTP.

هل يمكن وضع الناتج في CSS؟

نعم، اختر صيغة CSS background-image لتحصل على كود جاهز يمكن استخدامه مباشرة داخل ملف CSS.

ملاحظات استخدام ومراجعة الأداة

يحوّل الصور الصغيرة إلى Base64 أو Data URI للاستخدام داخل HTML و CSS مع توضيح أثر الحجم.

مناسبة لـ

  • أيقونات صغيرة داخل ملف واحد
  • قوالب بريد أو نماذج HTML مستقلة
  • اختبارات المطورين التي لا تحتاج ملفات خارجية

إعدادات مقترحة

  • استخدمه للصور الأصغر من 20 كيلوبايت عند الإمكان
  • اختر CSS عند استخدام الصورة كخلفية
  • اختر Base64 فقط إذا كان النظام يضيف البادئة بنفسه

حدود يجب معرفتها

  • Base64 يزيد حجم النص غالباً
  • لا يناسب الصور الكبيرة أو المتكررة
  • الصور المضمنة لا تستفيد من التخزين المؤقت كملفات مستقلة

أدوات ذات صلة

دمج الصور

ادمج صورتين أو أكثر في صورة واحدة. ترتيب أفقي أو عمودي.

مولّد الفافيكون

أنشئ أيقونة موقعك بجميع الأحجام من صورة واحدة.

مولد Placeholder

أنشئ صور Placeholder بأي أبعاد ولون للتصميم والتطوير.

صانع GIF

أنشئ صور GIF متحركة من مجموعة صورك مع التحكم بالسرعة.

تحويل JPG إلى WebP

حوّل صور JPG إلى صيغة WebP الحديثة مع ضغط فائق يصل إلى 80%.

تحويل WebP إلى JPG

حوّل صور WebP إلى صيغة JPG للتوافق مع جميع الأجهزة والبرامج.