तुम्हाला प्रतिमा आवडत नाहीत?

तुम्ही वाचत असताना ते मजकूराच्या एका भागाचे रूपांतर आकर्षक अनुभवात करू शकतात. इमेज ब्लॉग पोस्ट वाढवतात, ते अधिक शेअर करण्यायोग्य बनवतात आणि तुमच्या संपूर्ण साइटचा टोन आणि ब्रँड सेट करतात.

आणि तुम्हाला काय माहित आहे? आम्ही प्रतिमांना प्रतिसाद देण्यासाठी कठोर आहोत. म्हणूनच तुमच्या ब्लॉगची मार्केटिंग करताना तुमच्या सामग्रीमध्ये इमेजरी समाविष्ट करणे हे एक शक्तिशाली साधन आहे.

परंतु, तुम्ही सावध न राहिल्यास, इमेज तुमच्या वेब पेजच्या एकूण आकाराच्या अर्ध्या (किंवा अधिक) असू शकतात. काही वर्षांपूर्वी, वेब पृष्ठाचा सरासरी आकार 600–700K होता. आता, सरासरी 2MB आहे आणि ती दरवर्षी वाढत आहे.

ते खूप मोठे आहे!

हे घडण्याचे मुख्य कारण म्हणजे वेब पृष्ठांवर एकाधिक प्रतिमा अधिक वारंवार वापरल्या जात आहेत आणि या प्रतिमा नाहीत. योग्यरित्या आकार आणि ऑप्टिमाइझ केलेले नाही. याचा अर्थ ते वेब-अनुकूल पद्धतीने जतन किंवा संकलित केलेले नाहीत आणि त्याऐवजी, तुमची पृष्ठे फुगवत आहेत.

आमच्यापैकी बहुतेकांनी, नंतरचा विचार म्हणून इमेज ऑप्टिमाइझ करणे सोडले आहे आणि त्याऐवजी मजेदार गोष्टी करण्यात आनंद होईल. जसे की एखादी महाकाव्य पोस्ट तयार करणे किंवा तुमच्या कोनाडामधील इतर ब्लॉगर्ससह नेटवर्किंग करणे.

परंतु, पेज ब्लोट असणे म्हणजे तुमच्या पेज लोड होण्याच्या गतीवर परिणाम होतो. जर तुम्ही हाय-स्पीड कनेक्शनवर असाल तर तुम्हाला कदाचित ही मोठी गोष्ट वाटणार नाही, परंतु तुमचे बरेच अभ्यागत नाहीत. तसेच, Google ला धीमे लोडिंग पृष्ठे आवडत नाहीत आणि ते तुमच्या SEO वर नकारात्मक परिणाम करू शकतात.

तुम्हाला इमेज ऑप्टिमाइझ करण्याची आवश्यकता का आहे

तुम्ही येथे कठोर परिश्रम करतातारकीय सामग्री तयार करणे आणि तुम्ही तुमच्या ब्लॉगचा प्रचार करण्यासाठी आणि इतर ब्लॉगर्ससह नेटवर्किंगसाठी अगणित तास घालवता, त्यामुळे संभाव्य अभ्यागतांनी तुमची वेबसाइट लोड होण्यापूर्वीच सोडून द्यावी ही शेवटची गोष्ट आहे!

अभ्यास दाखवतात की 40% पर्यंत साइट लोड होण्यास तीन सेकंदांपेक्षा जास्त वेळ लागल्यास अभ्यागत बॅक बटणावर क्लिक करतात.

मला माहीत आहे, तीन सेकंद खरोखर इतके मोठे नसतात, परंतु जेव्हा तुम्ही मोबाइल कनेक्शनवर असता आणि तुम्ही एखाद्याची वाट पाहत असता तेव्हा साइट लोड करण्यासाठी, एक सेकंद कायमचा वाटू शकतो.

आणि तुमचे बरेच अभ्यागत धीमे मोबाइल कनेक्शनवर असू शकतात, हे स्पष्ट होते – तुम्हाला तुमच्या पृष्ठाचा आकार कमी करणे आवश्यक आहे. आणि पेज साइज ब्लोटचा सर्वात मोठा अपराधी कोणता आहे हे आम्हाला आधीच माहित आहे - ते तुमच्या इमेज आहेत.

अनावश्यकपणे मोठ्या इमेज देखील तुमच्या होस्टिंग खात्यावर जागा घेतात. तुमच्यापैकी काही जणांकडे "अमर्यादित" स्टोरेज स्पेससह होस्टिंग असू शकते, परंतु बरेच प्रीमियम होस्टिंग प्रदाते तुम्हाला निम्न-स्तरीय योजनांवर सुमारे 10GB स्टोरेजपर्यंत मर्यादित करतात. हे त्वरीत भरले जाऊ शकते, विशेषत: जर तुम्ही एकाच खात्यावर अनेक, इमेज-जड साइट होस्ट करत असाल तर.

तर, तुमच्या इमेजमुळे तुमची साइट कमी होत आहे हे तुम्ही कसे सांगू शकता? Google PageSpeed ​​Insights सह तुमच्या साइटच्या गतीची चाचणी घ्या.

Google ने समस्या म्हणून ऑप्टिमाइझ न केलेल्या इमेजचा अहवाल दिल्यास, त्याचे निराकरण करण्यासाठी तुम्हाला हे माहित असणे आवश्यक आहे.

इमेज ऑप्टिमायझेशन मूलभूत गोष्टी

जेव्हा तुमच्या ब्लॉगवर इमेज ऑप्टिमाइझ करण्याचा विचार येतो, तेव्हा तुम्हाला काही वेगळ्या गोष्टी असणे आवश्यक आहेयाविषयी माहिती आहे: फाइल प्रकार, प्रतिमा आकार आणि परिमाणे, तुम्ही तुमच्या प्रतिमा कशा देतात आणि इमेज कॉम्प्रेशन.

या प्रत्येक क्षेत्रावर बारकाईने नजर टाकूया.

फाइल प्रकार

वेबवरील प्रतिमा सामान्यतः PNG किंवा JPEG फाइल फॉरमॅटमध्ये - किंवा अॅनिमेशनसाठी GIF मध्ये सेव्ह केल्या जातात. वेबवर तरंगणारे ते आनंदी अॅनिमेटेड GIF कोणाला आवडत नाहीत!

आता ते तांत्रिकदृष्ट्या ठीक आहे जर तुम्ही तुमच्या प्रतिमा कोणत्याही स्वरूपात सेव्ह केल्या तर - तुमच्या अभ्यागतांच्या ब्राउझरला तुमचे वेबपृष्ठ प्रदर्शित करण्यात कोणतीही अडचण येणार नाही. – परंतु सर्वोत्तम गुणवत्ता आणि ऑप्टिमायझेशनसाठी, खालील नियमांचे पालन करा:

• JPEG – छायाचित्रे आणि डिझाइनसाठी वापरा जिथे लोक, ठिकाणे किंवा गोष्टी वैशिष्ट्यीकृत आहेत
• PNG – ग्राफिक्ससाठी सर्वोत्तम , लोगो, मजकूर-हेवी डिझाइन, स्क्रीनशॉट आणि जेव्हा तुम्हाला पारदर्शक पार्श्वभूमी असलेल्या प्रतिमांची आवश्यकता असते
• GIF – तुम्हाला अॅनिमेशन हवे असल्यास, अन्यथा PNG वापरा

तर, भिन्न स्वरूप का आहेत ?

ठीक आहे, PNG पारंपारिकपणे लोगो आणि ग्राफिक्स जतन करण्यासाठी वापरले जाते कारण ते मूळ प्रतिमेची गुणवत्ता जतन करते – कोणालाही अस्पष्ट मजकूर आणि पिक्सेलेटेड आकार नको आहेत. परंतु, जर तुम्ही फोटो PNG म्हणून सेव्ह करण्याचा प्रयत्न केला तर ते आश्चर्यकारक दिसेल, परंतु परिणामी फाइलचा आकार कमी-आश्चर्यकारक असेल.

जेपीईजी पारंपारिकपणे फोटो सेव्ह करण्यासाठी वापरला जातो. फाईलचा आकार खूपच लहान बनवण्यासाठी काही प्रतिमा डेटा फेकून दिला जातो, परंतु फोटोंमध्ये विविध प्रकारचे रंग आणि नैसर्गिक भिन्नता असल्याने, गुणवत्तेचे नुकसान होते.सामान्यतः मानवी डोळ्यांना लक्षात येत नाही.

आम्ही नंतर कॉम्प्रेशनबद्दल अधिक तपशीलात जाऊ, परंतु आत्ता तुम्हाला फक्त दोन गोष्टी आठवत असल्यास, लक्षात ठेवा: फोटोंसाठी JPEG आणि मजकूर/ग्राफिक्ससाठी PNG.

प्रतिमा आकारमान

तुम्ही कधी वेब पृष्ठ लोड केले आहे आणि लक्षात आले आहे की एक लहान चित्र (कदाचित हेडशॉट, उदाहरणार्थ) डाउनलोड करण्यासाठी f-o-r-e-v-e-r घेते? जसे की, इतक्या हळू तुम्ही प्रत्येक ओळ आत येताना पाहू शकता? तुम्ही स्वतः विचार करा, एवढी छोटी इमेज डाउनलोड व्हायला इतका वेळ कसा लागू शकतो?

आणि जेव्हा हे एका मोठ्या हेडर इमेजच्या बाबतीत घडते, तेव्हा ते आणखी वाईट असते कारण ते संपूर्ण पेज लोड थांबवू शकते.

असे घडण्याचे कारण म्हणजे ब्लॉगरने त्यांच्या प्रतिमेचा योग्य रिसाईज आणि ऑप्टिमाइझ केलेला नाही आणि आमच्या हेडशॉट उदाहरणाच्या बाबतीत, कदाचित त्याच्या DSLR कॅमेर्‍यावरून पूर्ण-रिझोल्यूशन JPEG अपलोड केले असावे.<1

आणि ती खूप मोठी फाइल आहे!

तुम्ही पहा, वेब ब्राउझर (सामान्यत:) प्रतिमा त्याच्या मूळ परिमाणांवरून स्केल करेल जेणेकरून ती वेब पृष्ठावर त्याच्या जागी व्यवस्थित बसेल. ऑनस्क्रीन जी छोटी प्रतिमा दिसते ती खरोखरच एक विशाल 10-मेगापिक्सेल फोटो असू शकते, जी ब्राउझरद्वारे रिअल टाइममध्ये कमी केली जाते.

आता काही वेब प्रकाशन प्लॅटफॉर्म आपोआप तुमच्या पूर्ण रिझोल्यूशनच्या प्रतिमेच्या विविध भिन्नता तयार करतील. आकार, परंतु नसल्यास, तुम्ही फोटोशॉप, लाइटरूम, पिक्सलर – किंवा अगदी एमएस पेंट सारख्या इमेज एडिटरमध्ये आधीपासून तुमच्या प्रतिमांचा आकार बदलला पाहिजे. याचा अर्थ फरक असू शकतो50K फाईल आणि 5MB च्या दरम्यान.

वर्डप्रेस, उदाहरणार्थ, तुमच्या अपलोड केलेल्या प्रतिमेच्या तीन (किंवा अधिक, तुमच्या थीमवर अवलंबून) आपोआप तयार करेल – सर्व भिन्न परिमाणांसह – ज्या तुम्ही वापरू शकता ब्लॉग पोस्टमध्ये, नेहमी पूर्ण आकाराची प्रतिमा वापरण्याऐवजी.

तुम्हाला प्रचंड स्टॉक फोटो इमेज अपलोड करण्याची सवय असल्यास आणि तुमच्या होस्टिंग खात्यामध्ये जागा वाचवायची असल्यास, WordPress प्लगइन Imsanity तुमच्या पाठीशी आहे.

ती मूळ प्रतिमेचा आकार बदलते आणि बदलते काहीतरी अधिक व्यवस्थापित करते, त्यामुळे तुम्ही तुमच्या पोस्टमध्ये पूर्ण-आकाराची प्रतिमा घातली तरीही ती इतकी वाईट होणार नाही.

एकदा सक्रिय केल्यावर, Imsanity तुमच्या विद्यमान प्रतिमा देखील शोधू शकते आणि त्यानुसार आकार बदलू शकते.

तुमच्या प्रतिमांना सेवा देणे

तुमच्या अभ्यागतांना तुम्ही तुमच्या प्रतिमा कशाप्रकारे दाखवता हे काटेकोरपणे त्यांना अनुकूल करणे नाही. , परंतु त्याचा तुमच्या पृष्ठ लोड वेळेवर नाट्यमय प्रभाव पडू शकतो.

बहुतेक ब्लॉगर त्यांच्या होस्टिंग खात्यातून त्यांच्या प्रतिमा थेट देतात आणि ते सहसा चांगले आहे, परंतु जर तुम्ही खरोखरच प्रत्येक कार्यप्रदर्शन पिळून काढू इच्छित असाल तर तुमची साइट, नंतर सामग्री वितरण नेटवर्क (CDN) वर तुमच्या प्रतिमा होस्ट केल्याने मोठा फरक पडू शकतो.

सीडीएनमध्ये जगभरातील डेटा सेंटर्समध्ये स्ट्रॅटेजिकरीत्या ठेवलेल्या वेब सर्व्हरचा समावेश असतो. हे सर्व्हर तुमच्या प्रतिमांच्या डुप्लिकेट प्रती होस्ट करतात आणि जेव्हा अभ्यागताचा ब्राउझर तुमच्या वेबसाइटवरून प्रतिमेची विनंती करतो तेव्हा CDN ब्राउझरला आपोआपसर्व्हर जो भौगोलिकदृष्ट्या त्यांच्या सर्वात जवळ आहे.

याचा अर्थ युरोपमधील अभ्यागतांना, उदाहरणार्थ, राज्यांमधून किंवा इतर ठिकाणांऐवजी स्थानिक युरोपियन सर्व्हरवरून दिलेल्या प्रतिमा प्राप्त होतील. प्रतिसाद वेळ आणि नेटवर्क लेटन्सी कमी केल्यामुळे, प्रतिमा अधिक जलद डाउनलोड होतात, ज्यामुळे पृष्ठ लोड वेळ कमी होतो.

ब्लॉगिंग विझार्ड सुकुरी वापरतो (त्यात सुरक्षिततेसाठी फायरवॉल तसेच CDN समाविष्ट आहे), परंतु इतर दर्जेदार प्रदाते आहेत. Amazon चे Cloudfront किंवा KeyCDN सारखे. अगदी लोकप्रिय क्लाउडफ्लेअर, जे काटेकोरपणे एक CDN नाही, एक CDN विनामूल्य देते आणि बहुतेक सामायिक होस्टिंग पॅकेजेसमध्ये सेट करणे सोपे आहे.

इमेज कॉम्प्रेशन

जेव्हा ते ऑप्टिमाइझ करण्याच्या बाबतीत येते प्रतिमा, प्रगत हानीकारक इमेज कॉम्प्रेशनपेक्षा काहीही तुमचा फाईल आकार कमी करत नाही.

विस्मे किंवा फोटोशॉप सारखी बहुतेक प्रतिमा संपादन साधने हानीकारक JPEG कॉम्प्रेशन वापरून फायली जतन करतील कारण त्यात सर्वोत्तम फाइल आकार कपात आहे. त्यामुळे, प्रतिमेची गुणवत्ता थोडीशी कमी होत असताना, हानीकारक इमेज कॉम्प्रेशन वापरल्याने मोठ्या प्रतिमा वेब-फ्रेंडली आकारात कमी होतात.

मला खात्री आहे की फोटोशॉप वापरणारे बरेच जण कदाचित त्याचे वेबसाठी जतन करा वैशिष्ट्य पाहू शकतील. प्रतिमा ऑप्टिमायझेशनचे सर्व आणि शेवटचे सर्व म्हणून. आणि PicMonkey किंवा Visme सारखी ऑनलाइन इमेज एडिटिंग टूल्स देखील तुमच्या इमेज ऑप्टिमाइझ करतात.

परंतु तुम्हाला माहिती आहे का की अशी टूल्स आहेत जी फोटोशॉप किंवा इतर एडिटिंग टूल्समधून तुमची "ऑप्टिमाइझ्ड" इमेज घेऊ शकतात, क्रंच आणि कॉम्प्रेस करू शकतात. आणखी 40% (किंवा अधिक),आणि अजूनही ते मानवी डोळ्यांसारखेच दिसले आहे का?

तुमच्या प्रतिमा वेब-फ्रेंडली स्थितीत कमी करण्यात मदत करण्यासाठी येथे काही विनामूल्य आणि सशुल्क साधने आहेत.

डेस्कटॉप टूल्स

ImageAlpha / ImageOptim

Mac वापरकर्त्यासाठी, ImageOptim हे एक विनामूल्य डेस्कटॉप साधन आहे जे मी दररोज PNG प्रतिमा - मुख्यतः स्क्रीनशॉट - अपलोड करण्यापूर्वी ऑप्टिमाइझ करण्यासाठी वापरतो. ही साधने वापरण्यास सोपी आहेत, तुम्ही फक्त तुमच्या फाइल्स ड्रॅग आणि ड्रॉप करा, परंतु तुम्हाला एका वेळी एक इमेज करावी लागेल.

प्रो टीप : तंत्रज्ञानाच्या जाणकारांसाठी इमेजऑप्टिम- CLI, जिथे तुम्ही इमेजचे संपूर्ण फोल्डर एकाच वेळी ऑप्टिमाइझ करू शकता.

ImageAlpha हा एक तोटा PNG कंप्रेसर आहे आणि PNG फायली संकुचित करण्यावर चमत्कार करू शकतो, तर ImageOptim प्रगत लॉसलेस (हानीकारक पर्यायासह) कॉम्प्रेशन करते - आणि ते PNG, JPEG आणि GIF फायलींमधून अनावश्यक मेटाडेटा काढून टाकते.

माझ्या PNG प्रतिमांसाठी, मी प्रथम त्यांना ImageAlpha:

येथे, माझी स्क्रीनशॉट प्रतिमा 103K वरून 28K पर्यंत कमी केली आहे.

मग ते ImageOptim द्वारे चालवले आणि अतिरिक्त 10% वाचवले.

JPEGmini

माझ्या JPEG फाइल्ससाठी, मी डेस्कटॉप JPEGmini अॅपसह त्यांना ऑप्टिमाइझ करतो, उपलब्ध आहे मॅक आणि विंडोज दोन्हीसाठी.

लाइट आवृत्ती तुम्हाला दिवसातून 20 पर्यंत प्रतिमा विनामूल्य ऑप्टिमाइझ करण्याची परवानगी देते आणि मर्यादा काढून टाकण्यासाठी $19.99 खर्च येतो.

प्रो टीप : प्रगत वापरकर्ते जेपीईजीमिनी फोटोशॉप किंवा लाइटरूममध्ये प्लगइनद्वारे समाकलित करू इच्छित आहेत यासाठी प्रो आवृत्ती खरेदी करू शकतात$99.99.

ऑनलाइन / क्लाउड / SaaS टूल्स

TinyPNG

तुम्ही उच्च-गुणवत्तेचे ऑनलाइन इमेज कॉम्प्रेशन टूल शोधत असल्यास, TinyPNG (ते JPEG ऑप्टिमाइझ करते नाव असूनही फायली) हे एक वेब अॅप आहे जे तुम्हाला तुमच्या ब्राउझरमध्ये 20 5MB किंवा त्याहून लहान प्रतिमा ड्रॅग करण्याची परवानगी देते आणि त्यांना एकाच वेळी ऑप्टिमाइझ करण्याची परवानगी देते.

त्यांच्याकडे डेव्हलपर API देखील आहे आणि ते WordPress बनवतात अपलोड केल्यावर तुमच्या इमेज आपोआप ऑप्टिमाइझ करू शकणारे प्लगइन उपलब्ध आहे.

TinyPNG तुम्हाला दरमहा ५०० मोफत इमेज ऑप्टिमायझेशन देते आणि त्यानंतर व्हॉल्यूमवर अवलंबून प्रति इमेज $०.००२–०.००९ पर्यंत शुल्क आकारले जाते.

आता ५०० दरमहा प्रतिमा खूप वाटू शकतात, परंतु जेव्हा तुम्ही या वस्तुस्थितीचा विचार करता वर्डप्रेस प्रत्येक प्रतिमेचे तीन ते पाच भिन्न आकार वेगवेगळ्या आकारात बनवते, तेव्हा 500 प्रतिमा विपुल ब्लॉगरसाठी इतक्या सारख्या वाटत नाहीत. सुदैवाने, प्रति-प्रतिमेची किंमत बजेटसाठी अनुकूल आहे.

EWWW इमेज ऑप्टिमायझर

तुम्ही पैसे खर्च करण्यास तयार नसाल, आणि तुम्हाला ऑप्टिमाइझ करताना त्रास होऊ इच्छित नसेल तुमच्या इमेज मॅन्युअली, वर्डप्रेससाठी मोफत EWWW इमेज ऑप्टिमायझर प्लगइन तुमच्या अपलोड केलेल्या इमेज आपोआप ऑप्टिमाइझ करू शकते.

तुम्ही प्रीमियम सबस्क्रिप्शनची निवड करू शकता जी हानीकारक कॉम्प्रेशन करते, परंतु विनामूल्य आवृत्ती केवळ लॉसलेस कॉम्प्रेशन करते त्यामुळे बचत' t जवळजवळ लक्षणीय म्हणून. हे तुमचा वेळ वाचवेल आणि काहीही करण्यापेक्षा चांगले आहे.

टीप: संपूर्ण रनडाउनसाठी, तपासाइमेज कॉम्प्रेशन टूल्सवरील आमची पोस्ट.

ते गुंडाळत आहे

काही लोक 2017 पर्यंत सरासरी वेब पृष्ठ आकार 3MB पर्यंत पोहोचण्याचा अंदाज लावत आहेत, आता तुमच्या प्रतिमा ऑप्टिमाइझ करणे सुरू करण्याची वेळ आली आहे.

लक्षात ठेवा, तुमचे सर्व अभ्यागत हाय-स्पीड कनेक्शनवर असतील असे नाही आणि पेज ब्लोट आणि मंद पेज लोडिंग वेळा तुमच्या Google सह रँकिंगवर संभाव्य परिणाम करू शकतात. तुम्हाला भार हलका करण्यात मदत करण्यासाठी, आजच तुमच्या इमेज ऑप्टिमाइझ करण्याची सवय लावा.

तुमच्या इमेजच्या परिमाणांवर लक्ष द्या आणि डिजिटल कॅमेऱ्यातील कोणत्याही मोठ्या स्टॉक फोटो किंवा इमेजचा आकार योग्य असा आकार द्या. आकार.

पुढे, JPEGmini सारख्या डेस्कटॉप अॅप्ससह किंवा TinyPNG किंवा Kraken सारख्या क्लाउड टूल्ससह आधुनिक इमेज कॉम्प्रेशनचा लाभ घ्या – शक्य असल्यास प्लगइनसह वर्डप्रेसमध्ये एकत्रित करणे.

शेवटी, जर तुमचे प्रकाशन प्लॅटफॉर्म आपोआप तुमच्या मूळ प्रतिमेचे आकार बदलते, मूळ, पूर्ण-आकाराच्या ऐवजी तुमच्या ब्लॉग पोस्टसाठी यापैकी एक निवडा.

संबंधित वाचन: 7 मार्ग कमी करण्यासाठी पीडीएफ फाइल्सचा आकार.