تحويل الصورة إلى URI للبيانات

تحويل الصورة إلى URI للبيانات

يعد محول Image to Data URI (معرف الموارد الموحد) أداة مجانية عبر الإنترنت تسمح لك بتشفير ملف صورة في مخطط URI للبيانات. معرف URI للبيانات هو نظام URI يسمح لك بتضمين البيانات مباشرة في صفحة ويب أو مستند آخر، عادةً في شكل نص. عند استخدامها مع الصور، تقوم معرفات URI للبيانات بتشفير بيانات الصورة الثنائية إلى تنسيق قائم على النص، مما يسمح لك بتضمين الصور داخل HTML أو CSS أو المستندات النصية الأخرى دون الحاجة إلى ملفات صور منفصلة.

يبدأ معرف URI للبيانات الخاص بالصورة عادةً بالبادئة data:image، متبوعة بتنسيق الصورة (على سبيل المثال، data:image/png لصورة PNG)، وفاصلة، وبيانات الصورة المشفرة باستخدام Base64.

فيما يلي مثال لمعرف URI للبيانات لصورة صغيرة:

HTML:

في عنوان URI للبيانات هذا:

• data:image/png تحدد أنها صورة PNG.
• iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8DwAB/wAB/wAB/4jZf3QAAAAASUVORK5CYII= يمثل بيانات الصورة المشفرة بواسطة Base64.

تتضمن مزايا استخدام معرفات URI للبيانات للصور تقليل عدد طلبات HTTP (نظرًا لأن الصورة مضمنة داخل المستند)، ومن المحتمل تحسين أوقات تحميل الصفحة، وتبسيط إدارة الموارد.

تأتي محولات URI من الصورة إلى بيانات بأشكال مختلفة، بما في ذلك الأدوات المتوفرة عبر الإنترنت والمكتبات وتطبيقات البرامج. يمكن للمستخدمين توفير ملف صورة (على سبيل المثال، بتنسيق JPEG، PNG، GIF)، وسيقوم المحول بإنشاء معرف URI للبيانات المقابلة التي يمكن استخدامها في HTML، CSS، أو الملفات الأخرى ذات الصلة بالويب.

إليك مثال مبسط لكيفية استخدام محول URI من صورة إلى بيانات:

• لديك ملف صورة باسم "image.png" تريد تضمينه في مستند HTML.
• يمكنك استخدام أداة تحويل Image to Data URI لترميز ملف الصورة إلى Data URI.
• يقوم المحول بإنشاء معرف URI للبيانات، والذي يمكنك بعد ذلك استخدامه كسمة src لعلامة <img> أو في CSS الخاص بك.

باستخدام عناوين URI للبيانات، يمكنك تقليل عدد طلبات الصور الخارجية، مما قد يساعد في تحسين أداء موقع الويب في بعض الحالات. ومع ذلك، من الضروري مراعاة المقايضات، مثل زيادة حجم مستند HTML عند تضمين الصور كمعرفات URI للبيانات والتأثير على التخزين المؤقت وأوقات تحميل الصفحة.