ألا تحب الصور؟

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

وهل تعرف ماذا؟ نحن مجبرون على الرد على الصور. هذا هو السبب في أن دمج الصور في المحتوى الخاص بك هو أداة قوية لاستخدامها عند تسويق مدونتك.

ولكن ، إذا لم تكن حريصًا ، يمكن أن تمثل الصور أكثر من نصف (أو أكثر) الحجم الإجمالي لصفحة الويب الخاصة بك. قبل بضع سنوات فقط ، كان متوسط ​​حجم صفحة الويب 600-700 ألف. الآن ، المتوسط ​​هو 2 ميغا بايت وهو يتزايد كل عام.

هذا ضخم!

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

على الرغم من ذلك ، يترك معظمنا تحسين الصور كفكرة لاحقة ويفضل الاستمتاع بالأشياء الممتعة مثل صياغة منشور ملحمي أو التواصل مع مدونين آخرين في مجال تخصصك.

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

لماذا تحتاج إلى تحسين الصور

أنت تعمل بجد فيإنشاء محتوى ممتاز وتقضي ساعات لا حصر لها في الترويج لمدونتك والتواصل مع المدونين الآخرين ، لذا فإن آخر شيء تريده هو أن يتخلى الزائرون المحتملون عن موقع الويب الخاص بك قبل أن يتم تحميله!

تظهر الدراسات أن ما يصل إلى 40٪ من ينقر الزائرون على زر الرجوع إذا استغرق تحميل الموقع أكثر من ثلاث ثوانٍ.

أعرف أن ثلاث ثوانٍ ليست طويلة حقًا ، ولكن عندما تكون على اتصال جوّال وتنتظر موقع للتحميل ، يمكن أن تبدو الثانية إلى الأبد.

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

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

لذا ، كيف يمكنك معرفة ما إذا كانت صورك تبطئ موقعك؟ اختبر سرعة موقعك باستخدام Google PageSpeed ​​Insights.

إذا أبلغ Google عن وجود مشكلة في الصور غير المحسّنة ، فإليك ما تحتاج إلى معرفته لإصلاحها.

أساسيات تحسين الصور

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

دعونا نلقي نظرة فاحصة على كل من هذه المناطق.

نوع الملف

عادةً ما يتم حفظ الصور الموجودة على الويب بتنسيق ملف PNG أو JPEG - أو GIF للرسوم المتحركة. من لا يحب صور GIF المتحركة المرحة التي تطفو على الويب!

الآن من الناحية الفنية حسنًا إذا قمت بحفظ صورك بأي من التنسيقين - لن يواجه متصفح الزائر مشكلة في عرض صفحة الويب الخاصة بك - ولكن للحصول على أفضل جودة وتحسين ، التزم بالقواعد التالية:

• JPEG - يُستخدم للصور الفوتوغرافية والتصميمات التي يظهر فيها الأشخاص أو الأماكن أو الأشياء
• PNG - الأفضل للرسومات والشعارات والتصميمات ذات النصوص الثقيلة ولقطات الشاشة وعندما تحتاج إلى صور ذات خلفيات شفافة
• GIF - إذا كنت بحاجة إلى رسوم متحركة ، فاستخدم PNG

إذن ، لماذا توجد تنسيقات مختلفة ؟

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

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

سوف ندخل في مزيد من التفاصيل حول الضغط لاحقًا ، ولكن في الوقت الحالي إذا كنت تتذكر شيئين فقط ، فتذكر: JPEG للصور و PNG للنص / الرسومات.

أبعاد الصورة

هل سبق لك أن حملت صفحة ويب ولاحظت أن صورة صغيرة (ربما لقطة رأس ، على سبيل المثال) تتطلب f-o-r-e-v-e-r للتنزيل؟ مثل ، بطيئة للغاية يمكنك رؤية كل سطر قادم؟ أنت تفكر في نفسك ، كيف يمكن أن تستغرق هذه الصورة الصغيرة وقتًا طويلاً للتنزيل؟

وعندما يحدث لصورة رأس كبيرة ، يكون الأمر أسوأ لأنه يمكن أن يؤدي إلى توقف تحميل الصفحة بالكامل.

وهذا ملف ضخم!

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

الآن ستنشئ بعض منصات نشر الويب تلقائيًا أشكالًا متعددة من صورتك كاملة الدقة في مختلف الأحجام ، ولكن إذا لم يكن الأمر كذلك ، فيجب عليك تغيير حجم صورك مسبقًا في محرر صور مثل Photoshop أو Lightroom أو Pixlr - أو حتى MS Paint. يمكن أن يعني الاختلافبين ملف 50 كيلوبايت و 5 ميجابايت واحد.

سيقوم WordPress ، على سبيل المثال ، تلقائيًا بإنشاء ثلاث نسخ (أو أكثر ، اعتمادًا على المظهر الخاص بك) من صورتك التي تم تحميلها - جميعها بأبعاد مختلفة - يمكنك استخدامها في منشورات المدونة ، بدلاً من استخدام الصورة بالحجم الكامل دائمًا.

إذا كنت معتادًا على تحميل صور ضخمة من الصور ، وتريد توفير مساحة في حساب الاستضافة الخاص بك ، فإن المكون الإضافي WordPress Imsanity يدعمك.

إنه يغير حجم الصورة الأصلية ويستبدلها بشيء يسهل التحكم فيه ، لذلك حتى إذا أدخلت الصورة بالحجم الكامل في مشاركتك ، فلن تكون سيئة للغاية.

بمجرد التفعيل ، يمكن لـ Imsanity أيضًا البحث في صورك الحالية وتغيير حجمها وفقًا لذلك. ، ولكن يمكن أن يكون لها تأثير كبير على وقت تحميل صفحتك.

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

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

وهذا يعني أن الزوار من أوروبا ، على سبيل المثال ، سيتلقون صورًا يتم تقديمها من خادم أوروبي محلي ، بدلاً من خادم من الولايات أو في أي مكان آخر. نظرًا لتقليل وقت الاستجابة وزمن وصول الشبكة ، يتم تنزيل الصور بشكل أسرع ، مما يقلل من وقت تحميل الصفحة.

يستخدم معالج التدوين Sucuri (يتضمن جدار حماية للأمان بالإضافة إلى CDN) ، ولكن هناك موفرو جودة آخرون مثل Amazon's Cloudfront أو KeyCDN. حتى CloudFlare الشهير ، والذي لا يعد CDN بشكل صارم ، يقدم CDN مجانًا ويسهل إعداده في معظم حزم الاستضافة المشتركة.

ضغط الصورة

عندما يتعلق الأمر بتحسين الصور ، لا شيء يقلل من حجم ملفك أكثر من ضغط الصور مع الفقد المتقدم.

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

أنا متأكد من أن العديد من مستخدمي Photoshop قد يشاهدون ميزة Save for Web كأفضل تحسين للصور. وحتى أدوات تحرير الصور عبر الإنترنت مثل PicMonkey أو Visme تعمل على تحسين صورك أيضًا.

ولكن هل تعلم أن هناك أدوات يمكنها التقاط صورتك "المحسّنة" من Photoshop أو أدوات التحرير الأخرى ، وضغطها وضغطها بنسبة 40٪ أخرى (أو أكثر) ،و لا تزال هل تبدو مطابقة تقريبًا للعين البشرية؟

إليك بعض الأدوات المجانية والمدفوعة لمساعدتك في تحويل صورك إلى حالة ملائمة للويب.

أدوات سطح المكتب

ImageAlpha / ImageOptim

بالنسبة لمستخدم Mac ، ImageOptim هي أداة سطح مكتب مجانية أستخدمها يوميًا لتحسين صور PNG - معظمها لقطات شاشة - قبل تحميلها. هذه الأدوات سهلة الاستخدام ، ما عليك سوى سحب الملفات وإفلاتها ، ولكن عليك عمل صورة واحدة في كل مرة.

نصيحة احترافية : للمتخصصين في التكنولوجيا هناك ImageOptim– CLI ، حيث يمكنك تحسين مجلد كامل من الصور مرة واحدة.

ImageAlpha هو ضاغط PNG يمكن أن يفعل المعجزات في تقليص ملفات PNG بينما ينفذ ImageOptim ضغطًا متقدمًا بدون فقدان (مع خيار فقدان البيانات) - وهو شرائط البيانات الوصفية غير الضرورية من ملفات PNG و JPEG و GIF.

بالنسبة لصوري PNG ، قمت بتشغيلها أولاً من خلال ImageAlpha:

هنا ، خفضت صورة لقطة الشاشة الخاصة بي من 103 كيلو إلى 28 كيلو.

ثم قمت بتشغيله من خلال ImageOptim وحفظت 10٪ إضافية.

JPEGmini

بالنسبة لملفات JPEG الخاصة بي ، أقوم بتحسينها باستخدام تطبيق سطح المكتب JPEGmini ، المتوفر لكل من Mac و Windows.

يسمح لك الإصدار Lite بتحسين ما يصل إلى 20 صورة يوميًا مجانًا ، ويكلف 19.99 دولارًا لإزالة الحد الأقصى.

نصيحة احترافية : يمكن للمستخدمين المتقدمين الراغبين في دمج JPEGmini في Photoshop أو Lightroom عن طريق مكون إضافي شراء إصدار Pro لـ99.99 دولارًا.

أدوات عبر الإنترنت / السحابة / SaaS

TinyPNG

إذا كنت تبحث عن أداة ضغط صور عالية الجودة عبر الإنترنت ، TinyPNG (تعمل على تحسين JPEG أيضًا على الرغم من الاسم) هو تطبيق ويب يسمح لك بسحب ما يصل إلى 20 5 ميغابايت أو صور أصغر إلى متصفحك ، وجعلها محسّنة جميعًا مرة واحدة.

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

يمنحك TinyPNG 500 تحسين مجاني للصور شهريًا ، وبعد ذلك يتقاضى من 0.002 إلى 0.009 دولارًا لكل صورة ، حسب الحجم.

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

EWWW Image Optimizer

إذا لم تكن مستعدًا لإنفاق الأموال ، ولا تريد أن تزعج نفسك بالتحسين صورك يدويًا ، يمكن لمكوِّن EWWW Image Optimizer المجاني لـ WordPress تحسين صورك التي تم تحميلها تلقائيًا.

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

ملاحظة: للحصول على ملخص كامل ، تحقق منمنشورنا حول أدوات ضغط الصور.

تغليفه

مع توقع بعض الأشخاص أن يقترب متوسط ​​حجم صفحة الويب من 3 ميجا بايت بحلول عام 2017 ، حان الوقت الآن لبدء تحسين صورك.

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

انتبه لأبعاد صورتك وقم بتغيير حجم أي صور أو صور كبيرة جدًا من الكاميرا الرقمية إلى الحجم المناسب الحجم.

بعد ذلك ، استفد من ضغط الصور الحديث باستخدام تطبيقات سطح المكتب مثل JPEGmini ، أو الأدوات السحابية مثل TinyPNG أو Kraken - قم بدمجها في WordPress مع مكون إضافي إن أمكن.

أخيرًا ، إذا كان لديك تقوم منصة النشر تلقائيًا بإنشاء أشكال تم تغيير حجمها من صورتك الأصلية ، اختر أحد هذه الأشكال لمدونة المدونة الخاصة بك ، بدلاً من النسخة الأصلية بالحجم الكامل.

القراءة ذات الصلة: 7 طرق لتقليل حجم ملفات PDF.