كل الأدوات تعمل داخل متصفحك — ملفاتك لا تغادر جهازك أبدًا.
All tools154

صور

صورة إلى Base64

تحويل صورة إلى data URI.

ما الذي تفعله. تحوّل هذه الأداة صورة إلى data URI تلصقه مباشرة في HTML أو CSS. وتوفّر بذلك طلب شبكة واحدًا مقابل زيادة نحو الثلث في الحجم.
يعمل في متصفحكلا يتم رفع أي شيءبدون تسجيليعمل دون اتصال

كيفية الاستخدام صورة إلى Base64

  1. اختر صورتك.
  2. اطّلع على حجم الناتج.
  3. انسخه كـ data URI أو كوسم img أو كخلفية CSS.

متى يستحقّ الأمر

الموازنة بسيطة: طلب أقل، ونحو ثلث بايتات أكثر.

يستحقّ مع الصور الصغيرة التي تلزم دائمًا: أيقونة، شعار صغير، نقش خلفية. ودون خمسة كيلوبايت تقريبًا يكون مفيدًا في الغالب.

ولا يستحقّ مع الصور الكبيرة. فصورة بمئات الكيلوبايتات تضخّم ملف HTML أو CSS بالقدر نفسه، وهذان يُحمَّلان دائمًا — حتى لزوّار لن يروا الصورة أبدًا.

وعيب مهمّ: الصورة المضمّنة لا تُخزَّن مؤقتًا على حدة. فإن كانت في ملف CSS أُعيد إرسالها مع كل تعديل لذلك الملف. أما الملف المنفصل فيبقى في الذاكرة المؤقتة.

وفي البريد الوضع مختلف: كثير من البرامج يحجب الصور الخارجية، وكثير منها يحجب أيضًا data URI. فالتضمين ليس حلًا موثوقًا هناك.

من الناحية العملية

حسّن الصورة قبل التحويل. فترميز Base64 على ملف PNG غير مضغوط خسارة مضاعفة.

وللأيقونات البسيطة يكون ملف SVG أفضل غالبًا من PNG مرمّز: أخفّ، وحادّ بأي مقاس، ويُدرج مباشرة بلا ترميز.

والتزم البنية: يبدأ data URI بنوع الوسيط ثم كلمة base64، تليهما فاصلة ثم البيانات. انسخ الكل لا الجزء الأخير وحده.

وفي CSS يوضع بين علامتَي اقتباس داخل دالة url. وفي HTML يوضع مباشرة في خاصية src.

كل شيء يجري في متصفحك.

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

متى أستخدم data URI؟

مع الصور الصغيرة دون خمسة كيلوبايت تقريبًا التي تلزم دائمًا.

كم يزيد الحجم؟

نحو الثلث.

هل يُخزَّن مؤقتًا؟

ليس على حدة: يذهب مع الملف الذي تضعه فيه.

هل يعمل في البريد؟

غير موثوق: كثير من البرامج يحجب data URI.

أليس SVG أفضل؟

للأيقونات البسيطة غالبًا نعم: أخفّ وحادّ بأي مقاس.

هل تُرفع صورتي؟

لا.