عرض الصور بتنسيق Webp في بلوجر .
اذا كنت تمتلك موقع الكتروني او مدونة علي الانترنت فهذا المقال مهم جدا لك . حيث سنتناول موضوع في غاية الاهمية عن طريقة عرض الصور بصيغة webp . حيث ضغط الصورة بتنسيق png او jpeg الي تنسيق ويب بجودة عالية و حجم اقل . وهذا يعمل علي زيادة سرعة المدونة بالتالي تحسين سيو ترتيب مدونتك في جوجل .لماذا نقوم بتغيير التنسيق الاصلي للصور .
اهم العوامل التي يجب توفرها في موقعك هو سرعة الموقع . فكلما كان موقعك سريع كلما كان متفوق علي مواقع اخري في ترتيب بحث google .
في هذا الدرس نتناول عامل من اهم عوامل سرعة الموقع وهو الصور المستخدمة في المدونة . عند الانتهاء من تصميم صورة لاستخدامها داخل مدونة بلوجر نجد الاتي :
- صيغة الصورة jpg او png .
- حجم الصورة كبير جدا .
هذه مشكلة كبيرة مع زيادة عدد المواضيع يكثر عدد هذه الصور . و بالتالي يؤدي الي انخفاض في سرعة الموقع . يعني انخفاض ترتيب اليكسا و ترتيب المدونة علي جوجل . و حل هذه النقطة من اجل تسريع المدونة و تحميل الصور بشكل أسرع بواسطة تحويل صورك الي صيغة webp . حيث ان هذه الصيغة الموصى بها من جوجل و تسمي بتقنيات الجيل القادم للصور . تعمل علي تخفيف وتحسين تحميل المواقع مع الحفاظ علي جودة الصور .
ميزة عرض الصور بتنسيق Webp في بلوجر .
- تقلل وقت تحميل صفحة الويب مما يجعل موقعك يعمل بشكل صاروخي .
- يقلل حجم الصفحة لزيادة سرعة تصفح الموقع الخاص بك .
- الحفاظ علي الجودة الاصلية للصور .
- رفع ترتيب موقعك علي محركات البحث .
- أيضًا خفض ترتيب مدونتك علي اليكسا رانك .
شرح كيفية تحويل صيغة الصور الي webp .
سنتعرف الان علي شرح تحويل صور المدونة لعرض بتنسيقات ويب الحديثة و سنقوم بـ استخدام موقع Squoosh لتحويل الصور ستجد الرابط بالاسفل .
أولا نقوم بـ الانتقال الي الموقع ستجده علي هذا الشكل :
- في البداية حاول ان تجعل مقاس موحد للصور فهذا افضل .
- تقوم بالضغط علي Drop Or Past لتحميل الصورة المراد تحويلها .
- في الجزء الايمن اسفل Compress تفتح المنسدلة ستجد العديد من الصيغ تختار منها صيغة webp .
- قم بتنشيط lossless للحفاظ علي جودة الصورة , ستجد ان حجم الصورة قد انخفض بشكل كبير بدون فقدان الجودة للصوره .
- قم بالضغط علي رمز التحميل بالاسفل ليبدأ حفظ الصورة و ستجدها علي شكل ملف html وليس img .
- قم بـ تحرير مشاركة علي blogger ثم اضغط علي تحميل صورة و إضافة الصورة المحملة من الموقع بالتنسيق الجديد كما في الصور التالية :
طريقة عرض الصور بتنسيق Webp في Blogger .
بعد ذلك اذهب و اعرض المقال في وضع HTML . ثم اذهب لكود اي صورة بامتداد webp ستجده علي الشكل التالي :
قف علي رابط الصورة ثم قم باضافة الرمز -rw بعد ترميز الصورة كما في المثال التالي :
قد تجد الرمز بعد حرف S متغيرا . لا تقلق فقط قم بكتابة -rw بعد الرمز مباشرة . و من الافضل ان تقوم بتحديث جميع الصور داخل المقالات الخاصة بك فهذا بكل تأكيد سيحدث فارق في سرعة موقعك . و يمكنك ان تستخدم موقع pagespeed من جوجل لمعرفة سرعة موقعك . ستجد الرابط اسفل فيديو الشرح . عرض الصور بتنسيق Webp في بلوجر .
إرسال تعليق
يرجي التعليق باسلوب مهذب و عدم نشر روابط الاحالات و التسويق الالكتروني