تحويل الصورة إلى Base64
يحوّل صورة إلى نص Base64 بصيغة Data URI، مع مقتطف HTML وCSS جاهز للنسخ، داخل متصفحك ودون رفع الصورة.
جرّب أداة أخرى
اخترناها لتكمل هذه الأداةأداة تحويل الصورة إلى Base64 من Tooleem تقرأ صورة حتى 10 ميغابايت وتكتب محتواها نصاً بترميز Base64 داخل رابط Data URI. تحصل على الرابط كاملاً، ومقتطف HTML بوسم img، ومقتطف CSS بخاصية background-image، مع طول النص بالأحرف. يستخدمها المطورون لتضمين أيقونة صغيرة مباشرة في الصفحة أو في رسالة بريد دون ملف منفصل. تُقرأ الصورة في متصفحك ولا تُرفع.
طريقة الاستخدام
- 01أضف صورةاسحب أي صورة يقرؤها متصفحك، مثل PNG أو JPG أو SVG أو WebP أو GIF، حتى 10 ميغابايت.
- 02انسخ الصيغة التي تحتاجهارابط Data URI كاملاً، أو مقتطف HTML جاهزاً، أو سطر CSS للخلفية، ولكل منها زر نسخ.
- 03راجع طول النصيظهر عدد الأحرف لتقدّر أثر تضمين الصورة على حجم الصفحة قبل استخدامها.
متى تفيدك هذه الأداة؟
- أيقونات صغيرة جداًللأيقونات التي تقل عن بضعة كيلوبايتات، قد يكون تضمينها أسرع من طلب ملف منفصل.
- ملف HTML مستقلتقرير أو عرض في ملف HTML واحد يحمل صوره معه دون مجلد صور.
- اختبار وتجريبلصق صورة في أداة تجريب أكواد أو في بيانات JSON حين لا يتوفر مكان لرفع الملفات.
أمثلة
- أيقونة صغيرة في CSSأيقونة PNG حجمها 1.5 كيلوبايت تصبح نصاً بنحو ألفي حرف، فتضعها في background-image وتوفر طلب ملف منفصل.
- شعار داخل قالب بريدتضمين شعار صغير كـ Data URI يجعله جزءاً من رسالة HTML، مع أن بعض برامج البريد قد تحجب الصور المضمنة.
- رمز SVG في صفحة واحدةصورة SVG صغيرة تتحول إلى Data URI تلصقه في وسم img داخل ملف HTML مستقل لا يعتمد على ملفات أخرى.
نصائح لنتيجة أفضل
- لا تضمّن الصور الكبيرةBase64 تزيد الحجم بنحو الثلث، والصورة المضمنة لا تُخزن مؤقتاً منفصلة. للصور الكبيرة يبقى الملف العادي أفضل.
- صغّر الصورة أولاًاضغط الصورة أو حوّلها إلى WebP قبل الترميز، فيقصر النص الناتج.
- انتبه لبرامج البريدبعض برامج البريد لا تعرض صور Data URI. جرّب الرسالة في البرنامج الذي يستخدمه جمهورك.
ما هو Base64؟
Base64 طريقة ترميز تمثل البيانات الثنائية بأحرف نصية مأمونة من 64 حرفاً، معرّفة في المعيار RFC 4648. كل 3 بايتات من الصورة تصبح 4 أحرف، ولهذا يكون النص الناتج أطول من الملف الأصلي بنحو 33%. الترميز ليس تشفيراً: أي أحد يستطيع فكّه واستعادة الصورة.
ما هو Data URI؟
Data URI رابط يحمل البيانات داخله بدلاً من الإشارة إلى ملف، وفق المعيار RFC 2397. يبدأ بـ data: ثم نوع الملف مثل image/png، ثم ;base64، ثم فاصلة والنص المرمّز. يقبله المتصفح في أي مكان يقبل فيه رابط صورة، مثل خاصية src في HTML أو url() في CSS.
متى يفيد التضمين ومتى يضر؟
يفيد التضمين للأيقونات الصغيرة والملفات المستقلة لأنه يلغي طلباً إضافياً للخادم. ويضر مع الصور الكبيرة لأنه يزيد الحجم بنحو الثلث، ويحمّل الصورة مع كل تحميل للصفحة أو لملف CSS بدلاً من حفظها في ذاكرة المتصفح مرة واحدة.
أسئلة شائعة
لماذا النص أطول من حجم الصورة؟
لأن Base64 تحوّل كل 3 بايتات إلى 4 أحرف، فيزيد الطول بنحو الثلث، إضافة إلى بادئة data: ونوع الملف.
هل Base64 تشفير يحمي الصورة؟
لا. Base64 ترميز فقط، ويمكن لأي شخص فكّه واستعادة الصورة كما هي.
ما أنواع الصور المدعومة؟
أي صورة يقرؤها متصفحك حتى 10 ميغابايت، مثل PNG وJPG وSVG وWebP وGIF. يحمل الرابط نوع الملف الأصلي.
هل تُرفع الصورة إلى خادم؟
لا. تُقرأ الصورة وتُرمَّز داخل متصفحك، ولا تغادر جهازك.
كيف أعيد النص إلى صورة؟
الصق رابط Data URI كاملاً في شريط عنوان المتصفح أو في خاصية src لوسم img، فتظهر الصورة ويمكنك حفظها.