Blogger कैसे बने

" A picture is worth thousand words " ये कहावत normal homosapiens के लिए सही है, पर आप एक एक SEO है तो आपके लिए ये कहावत हो जाती  "a picture is worth 150 thousand words " है।

300kb की एक image को आप replace करते हैं तो 150000 word लिख सकते हैं। दोनों का size same रहेगा। Picture या images website के सबसे heavy elements में से एक होती है। उन्हें use करना भी जरूरी है।

Google ने page experience desktop भी झोंक दी है। मरियल, सुस्त website नहीं चलेंगी। इस post में हम ऐसे दस point देखेंगे जिनको follow करके आप images को हटाए बिना अपने website की performance को बढ़ा सकते हैं। images के size के असर को website पर कम कर सकते हैं।

Image SEO कैसे करें 

इस post में हम images के website की performance पर पड़ने वाले असर को कम करने के दस step के बारे में जानेंगे। काफी सारी business category ऐसे होते हैं जिनमें ज्यादा images को views करना जरूरी होता है। आप अपने website की images की issues को पता करने के लिए सबसे अच्छा free tool GT metrix है। GT metrix आपके website की images को बारीकी से analys करके न सिर्फ problem बताता है, बल्कि solution को भी बताता है।

1. Resize well - images को optimize करने का पहला step उनके size है। आप CSS के जरिए images को resize कर सकते हैं। पर आप सही सही images को पहले से resize कर ले तो  एक extra error से बच सकते हैं।

पर आपके लिए सही size क्या है,                            icon                                  16*16px                slider images     1800px width*400px height  featured images।    250*250 px                  blog and images     680px width की होनी चाहिए। आप अपने website की images को आप इस size chart के हिसाब से resize करें और use करें।

2. Lazy load images -  lazy load का मतलब होता है, images को तभी load करना जब उनकी actually में जरुरत हो। WordPress वैसे अब images को natively load करने लगा है। तो इसके लिए आपको कोई plugin use करने की जरूरत नहीं है। लेकिन फिर भी आपकी website में lazy load images का issue आ सकता है। 

किसी website में images को दिखाने के दो तरीके होते हैं।एक तो होता है images को normal तरिके से show करना। दुसरा होता है images को background में use करना। 

Native lazy load images ये background वाली images lazy load नहीं होती है। इसलिए आपकी website में lazy load images के issues होते हैं वो आते रहते हैं। आखिर ऐसा क्यों होता है।

जब आप normally किसी web page में दिखाते हैं तो आप image src <img src"your/image/here.jpg> को use करते हैं। browser जैसे ही img src देखता है, उस url से images को load करने लग जाता है। lazy load plugin या script इस src को data.src से change कर देते हैं। तो browser को पता ही नहीं होता कि रहा पर image है। पर जैसे ही user page को scrall करता है और ये data src element आता है viewport में तो data src again आपकी script इस data src में change कर देती है। और browser image को download करके दिखाने लगता है। 

जो background image होती है उसमें img src को use नहीं किया जाता है। इसलिए lazy load काम नहीं करता है। इसके solution के लिए different plugin को use किया जाता है।जो इस background.image को actively manipulate करता है। WordPress में अगर आप background image lazy load search करेंगे तो आपको काफी सारे plugin मिल जाएंगे। 

3. Encode effectively - images को effectively encode करना। यहां पर हम kb, mb की बात कर रहे हैं। एक image सिर्फ 500*500 pixel की होते हुए भी unnacessary heavy हो सकती है। इसके solution के लिए आप picture को one by one mannualy compress कर सकते हैं। काफी सारी free online  tool ये facilitiy देते हैं।

Infact Google ने अपना खुद का एक online tool launch किया हुआ है schush.app। आपको photoshop की जरूरत भी नहीं है। आप खुद photopea.com पर जाकर भी images को manipulate कर सकते हैं। अगर आप WordPress user है तो आपको कई सारे option है, और अगर आपकी website में सैकड़ों,हजारों images है resize करने को तो आप python के जरिए भी images को resize कर सकते हैं। 

4. Use image CDN - image को CDN के जरिए load करके आप अपने server से काफी सारा load हटा सकते हैं, और website की performance को बढ़ा सकते हैं। images को CDN से load करना थोड़ा सा लंबा process है।

5. Avoid redirects - http://example.com/, https://example.com/, http://www.example.com/, https://www.example.com/ ये सारे different url है। अगर आपकी website https version पर चल रही है। लेकिन images के urls में https:/www.example.com/image.jpg हो रहा तो images आपकी website में दिखाई देंगे। लेकिन images आएंगी लंबे रास्ते से। ऐसे में website के speed पर असर पड़ेगा।इसका solution है सिर्फ एक particular url formatको use करना। अगर आपकी https://www.example.com/ पर चल रही है तो images के url में भी https://www.example.com/images.jpg होना चाहिए।

अगर website https://example.com/ पर चल रही है तो https://example.com/images.jpg होना चाहिए। अगर website http पर चल रही है तो सबसे पहले SSL certificate insall करीए। वो ज्यादा जरूरी है। इस issue को solve करने के लिए अगर आपकी website coustom coded है तो आप find and replace command use कर सकते हैं, किसी भी adeater में होता है।

मान लीजिए आपकी website सिर्फ https पर चल रही है तो find section में आप डालेंगे https इसके : // www. जो भी आपके website का url है। और replace में डालिए https और उसके बाद आपका domain और replace all कर दिजिए। जहां जहां भी www होगा। वहां सिर्फ https आ जाएगा, www हट जाएंगा। 

6.use CSS image sprites - जब भी आपकी website पर बहुत सारी icon छोटे छोटे दिखाई देते हैं।तो चाहे इन icon का size आपने कितना भी कम कर लिया हो, वो फिर भी performance पर असर डालता है। उदाहरण के लिए आपने 10kb के 15 icon load किए हैं तो total weight 150kb होंगा। पर website को 15 request process पुरी करना होंगी।

CSS pride इन 15 icon को मिलाकर एक बना देती है। आपकी website को सिर्फ एक request को handel करना पड़ता है। WordPress में again आपको CSS pride को generate करने के बहुत सारे plugin मिलेंगे। और custom coded website में आप developer से help ले सकते हैं।

7. Avoid embedding - अपनी website में दुसरी site से images को ebmedd नहीं करना चाहिए। बात सिर्फ size की नहीं है, एक extra request की है। अगर आपको किसी third party site है image load करनी है तो आप उसे download करके सिधे अपने website पर upload कर सकते हैं। Size same रहेंगा। Request नहीं होंगी।Embedding ज्यादा costly option है।

8. Delete exif data - जब भी आप कोई photo लेते हैं तो उसमें location, camera, appretuer, local distance वो सारी information होती है जिसे आपकी website के visitor को कोई जरूरत नहीं है। तो आप इसे आराम से safely हटा सकते है। अधिकतर image optimization script ये data अपने आप हटा देते हैं। अगर आपकी images में अभी भी ये दिखाई दे रहा है तो make sure की आपने जो image optimization plugin है वो उसमे exif data से releted settings को turn on किया है।

9. Disable Hotlinking - अगर लोग आपकी website से images को embedd कर रहे हैं तो आपके website की bandwidth है वो भी खर्च हो रही है और आपके server पर load बड रहा है। जिसका नतीजा होगा कि आपकी website slow हो जाएंगी। 

अपनी website में से images की embedding यानी कि Hotlinking को आपको बंद करना है। इसको आप WordPress में किसी plugin से achieve कर सकते हैं। 

10. Add image dimensions - CSS में image का सही size होना जरूरी है। इससे browser का guess work बच जाता है। और इसका मतलब है कि आपका जो CLS score है वो नहीं बिगड़ता है। WordPress में अधिकतर builders अपने आप इस CLS velue को add कर देते हैं। पर custom develop website मैं भी आपको अपनी सारी images को देखना होगा, ध्यान देना होंगा कहीं किसी image में width और height को specification जो देना चाहिए। वो miss तो नहीं हो गया है। अगर ऐसा है तो उसे ठीक करिए।

निष्कर्ष

तो ये थे वो दस point जिसे cover करके आप sure हो सकते हैं कि जो आपके images है उनकी वजह से आपकी website slow नहीं होंगी और images की वजह से page score कम नहीं होंगा।