الصور وسرعة الصفحة

الصور وسيلة رائعة لجعل موقعك الإلكتروني يبدو جميلاً واحترافياً. ولكن إذا لم تُستخدم بشكل صحيح، فقد يكون لها تأثير سلبي كبير على سرعة صفحاتك. فمقارنةً بالنص، غالباً ما تكون الصورة ملفاً كبيراً جداً. هذا يعني أن الصور غير المُحسّنة قد تُؤثر سلباً على أداء صفحتك، وبالتالي على تحسين محركات البحث (SEO).

الخبر السار هو أنه يمكنك استخدام الصور على صفحتك دون الإضرار بها pagespeedكل ما عليك فعله هو اتباع بعض الممارسات البسيطة الأفضل.

استخدم أبعاد الصورة الصحيحة

غالبًا ما تكون الصور الملتقطة بكاميرات أو هواتف حديثة عالية الدقة. على سبيل المثال، قد يبلغ عرض صورة من هاتف iPhone آلاف البكسلات. الدقة العالية تعني حجم ملف أكبر، مما يعني إطالة وقت تحميله. غالبًا ما يُهدر هذا سعة تحميل موقعك، خاصةً إذا عُرضت الصورة كصورة مصغرة فقط.

لحل هذه المشكلة، حاول دائمًا جعل الصورة الأصلية بحجم المساحة المتاحة على موقعك الإلكتروني. على سبيل المثال، إذا عُرضت صورة بدقة 300 × 200 بكسل على موقعك، فلا داعي لتحميل صورة ضخمة بدقة 3000 × 2000 بكسل. هذا يوفر لك ما يصل إلى 90% من عرض النطاق الترددي دون فقدان أي من جودة الصورة. منصتنا تساعدك في ذلك. الميزات التلقائية على كليك رانك يمكنه مسح موقع الويب الخاص بك بحثًا عن هذه المشكلات وإعطائك قائمة واضحة ومرتبة حسب الأولوية لما يجب إصلاحه.

صور مستجيبة

يبدو المثال أعلاه سهلاً، لكن نظراً لتنوع أحجام الشاشات اليوم، قد يكون الأمر أكثر تعقيداً. على جهاز كمبيوتر، قد ترغب في عرض صورة بدقة 600 × 400 بكسل، بينما على الهاتف المحمول، يكون عرض الصورة بدقة 300 × 200 بكسل أكثر منطقية.

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

تحسين ملفات الصور

حتى مع ضبط أبعاد الصورة بشكل صحيح، قد تبدو كبيرة بعض الشيء. وهنا يأتي دور تحسين الصور.

• استخدم نوع الملف الصحيح: تنسيقات الصور المختلفة تُناسب أنواعًا مُختلفة من الصور. تنسيق JPEG مثالي للصور، بينما يُعد تنسيق PNG أفضل للرسومات ولقطات الشاشة. أما تنسيق SVG فهو مثالي للشعارات والأيقونات.
• ضغط صورك: يمكنك تقليل جودة الصورة لتقليل حجم ملفها. عادةً، يكون تقليل جودة صورة JPEG إلى حوالي 75% من جودتها الأصلية أمرًا شبه ظاهر، ولكن يمكن تقليل حجم الملف بنسبة تصل إلى 85%. يمكنك استخدام أدوات عبر الإنترنت لضغط صورك.
• أضف نصًا بديلًا: هذه خطوة أساسية لتحسين محركات البحث وتجربة المستخدم. النص البديل هو وصف للصورة، تستخدمه محركات البحث لفهم محتواك. مولد نص بديل للصور بالذكاء الاصطناعي يمكن أن يساعدك في كتابة وصف جيد لصورك، وهي أيضًا طريقة رائعة لتحسين محرك البحث الخاص بك.

طرق أخرى لتحسين أداء الصورة

تحميل الصور خارج الشاشة بشكل بطيء

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

استخدم تنسيقات الصور الحديثة

هناك تنسيقات صور جديدة، مثل WEBP، تتميز بضغط ممتاز وإمكانية تحريكها. مع أن بعض المتصفحات لا تدعمها، يُنصح باستخدامها قدر الإمكان.

استخدم تنسيقات الفيديو للمحتوى المتحرك

تُستخدم صور GIF عادةً للرسوم المتحركة القصيرة، لكنها ليست فعّالة. يُفضّل تحميل صور GIF المتحركة الأطول كفيديو. هذا يُوفّر استهلاك البيانات ويُسرّع الصفحة.