साइट के लिए छवि अनुकूलन: बैच प्रसंस्करण jpegtran का उपयोग कर | Optipng | pngout

1. आवश्यक शर्तें
2. हम छवियों के लिए सिफारिशों का उपयोग करते हैं
3. पुरालेख संरचना
4. काम के लिए संक्षिप्त निर्देश
5. की आपूर्ति करता है
6. x64 (उर्फ एंडी)

छवियों के बिना साइट - एक कलावाद। इतने सारे लोग सोचते हैं, और यह सामान्य ज्ञान से रहित नहीं है। याद रखें, आप पिछली बार साइट पर कितने समय तक रहे हैं और आप उस पर कितने समय तक रहे हैं?

टेक्स्ट डेटा छवि की तुलना में बहुत छोटा है। लेकिन लोग अपनी आंखों से प्यार करने के लिए जाने जाते हैं। इसलिए, चित्र कहानी का एक निस्संदेह लाभ होगा।

सामान्य तौर पर, पाठ के बारे में बोलते हुए, हमारा मतलब है कि इसकी सामग्री और पैराग्राफ, सूची, उद्धरण, तालिकाओं सहित एक सुविधाजनक दृश्य प्रस्तुति दोनों। हालांकि, यह पर्याप्त नहीं है, और यहां तक ​​कि समाचार साइटें पत्रकारों की छवियां प्रदान करने की कोशिश कर रही हैं।

आइए इस धारणा से शुरू करें कि छवियों की आवश्यकता है। ये तस्वीरें, चित्र, बस चित्रों को समझा सकते हैं।

बहुत पहले, जब पुतिन शाश्वत नहीं थे, मैंने अपना पहला मेडिकल वेब पोर्टल बनाया। चित्रों को एटलस में रखना आवश्यक था। यह स्पष्ट है कि चित्रों के बिना शरीर की शारीरिक संरचना की कल्पना करना मुश्किल है, और शब्दों के साथ वर्णन करने के लिए और भी बहुत कुछ। और आगे की हलचल के बिना, मैंने bmp (असम्पीडित प्रारूप) में चित्र अपलोड किए। क्या मुझे यह कहना होगा कि वे आटा वजन करते हैं? इसके अलावा, कुछ ब्राउज़रों को यह नहीं पता था कि इस तरह की तस्वीरें कैसे दिखाई जाती हैं

तो क्यों छवियों का अनुकूलन? एक साधारण उदाहरण एक फोटो है। आधुनिक फोन में 8, 12 और इससे भी अधिक मेगापिक्सल के कैमरे हैं। 12 एमपी 4000 × 3000 पिक्सल की छवि से मेल खाती है। दृश्य की जटिलता के आधार पर, यह 2-5 मेगाबाइट के आकार से मेल खाता है, और इससे भी अधिक। एक दर्जन तस्वीरें - और पृष्ठ का आकार बहुत अधिक हो गया। छवि सामग्री क्षेत्र में फिट होती है, जिसका अर्थ है कि ब्राउज़र को पहले सब कुछ डाउनलोड करना होगा, इसे स्केल करना होगा और उसके बाद ही इसे प्रदर्शित करना होगा। कमजोरों के लिए प्रोसेसर या रैम की एक छोटी राशि के साथ - एक आपदा।

अब कल्पना करें कि उपयोगकर्ता फोन से साइट देख रहा है। इस स्थिति में, पृष्ठ लोडिंग केवल प्रतीक्षा नहीं कर सकती है। इसलिए, चित्रों को पहले से कम करने की आवश्यकता है।

कोई यह तर्क देगा कि इसका कोई मतलब नहीं है; आधुनिक सीएमएस छवियों को डाउनलोड करते समय स्वचालित रूप से थंबनेल बनाता है। लेकिन क्या सभी को वीपीएस या वीआईपी दरों पर अपनी साइटें हैं? एक 12 एमपी डाउनलोड करें छवि बाहर आ सकती है, लेकिन इसे संसाधित करने के लिए, PHP को भंडारण के लिए 35+ मेगाबाइट (सिद्धांत रूप में, वास्तव में अधिक) आवंटित करने की आवश्यकता होगी, और फिर अभी भी पता है कि एक छोटी प्रतिलिपि कैसे बनाई जाए। सस्ते टैरिफ तुरंत संसाधनों की अधिकता में डूब जाते हैं। एक अच्छा होस्टर उपयोगकर्ता से ऐसा नहीं करने के लिए कहेगा, एक बुरा व्यक्ति इसे अनदेखा करेगा, क्योंकि केवल पैसा उसके लिए महत्वपूर्ण है, न कि सेवाओं का प्रदर्शन।

और इसलिए, हमने सही तरीके से काम करने का फैसला किया। हम छवियों को कम करते हैं, और फिर उन्हें साइट पर अपलोड करते हैं। तो इंजन आसान है, और लोग। सब कुछ है वास्तव में नहीं।

कई संपादकों ने अतिरिक्त जानकारी वाले मूल विखंडू (मेटा-जानकारी, फ़ाइल के गैर-छवि भाग) को बरकरार रखा है। उदाहरण के लिए, यदि आप फोन पर किसी चीज़ की तस्वीर लेते हैं, तो फ़ाइल को कंप्यूटर पर स्थानांतरित करें, दाईं ओर की कुंजी पर क्लिक करें और "गुण → विवरण" चुनें, आपको डिवाइस पर डेटा दिखाई देगा: आपने किस कैमरा पर फ़ोटो ली, शटर स्पीड, आईएसओ और इसी तरह। उपयोगकर्ता के लिए, यह जानकारी बेकार है, इसलिए आप इससे छुटकारा पा सकते हैं।

खैर, इसके बारे में सोचो, एक हिस्सा। वहाँ क्या है, जानकारी का एक समूह जो निहित है? कल्पना कीजिए। कभी-कभी आपको ऐसी छवियां मिलती हैं जिनमें सैकड़ों किलोबाइट ऐसे डेटा होते हैं। आज ही के दिन, उन्होंने समायोजित करने के लिए 584 KB का लोगो भेजा था। उसी समय, उपयोगी जानकारी केवल 14 KB थी! मेरे लिए, ऊपर से 570 KB डाउनलोड करने के लिए आगंतुक को मजबूर करना पूरी तरह से सही नहीं है।

आइए संक्षेपों को संक्षेप में प्रस्तुत करते हैं। साइट के उपयोगकर्ताओं को अच्छा करने के लिए, आपको निम्न करने की आवश्यकता है:

1. छवि का आकार कम करें। किसी भी ग्राफिक संपादक की मदद करने के लिए।
2. फ़ाइल भागों से बाहर फेंक अनावश्यक हैं। वास्तव में, उपयोगकर्ता को केवल एक चित्र की आवश्यकता होती है।
3. छवि के आकार को और कम करने का प्रयास करें।

पहले पैराग्राफ में प्रत्येक फ़ाइल पर अलग-अलग काम शामिल हैं। यह समय लेने वाला है, लेकिन यह सबसे अच्छा परिणाम लाता है। हम प्रत्येक फ़ाइल को खोलते हैं, काटते हैं, घटाते हैं, फिर स्वीकार्य गुणवत्ता के साथ सहेजते हैं।

लेकिन पैराग्राफ 2 और 3 को विशेष कार्यक्रमों की दया पर दिया जा सकता है। छवियों के साथ काम करने के लिए सॉफ्टवेयर सेट। Google निम्नलिखित कार्यक्रमों की सिफारिश करता है:

• jpg छवि प्रारूप के लिए jpegtran ।
• PNG छवियों के लिए ऑप्टिपिंज और पींगआउट ।

पी के बारे में थोड़ा सा। 3. ग्राफिक संपादक आमतौर पर इसके साथ परेशान नहीं करते हैं। वे बस एक ही सेटिंग्स, परिमाणीकरण गुणांक और अन्य चीजों के साथ रखी गई संपीड़न एल्गोरिदम से आगे की छवि को बचाते हैं। इसके अलावा, कई ईमानदारी से उपलब्ध मेटा-जानकारी को स्थानांतरित करते हैं और अपनी खुद की जोड़ते हैं, जिससे फ़ाइल का आकार बढ़ जाता है।

आवश्यक शर्तें

एक साल पहले, वे सेवा के बारे में बातें करने लगे। पेजस्पीड इनसाइट्स गूगल से। वास्तव में, ये "कैसे अच्छा करें" पर खोज विशाल की सिफारिशें हैं। बस साइट के पते में टाइप करें और अनुकूलन के लिए सुझावों की एक सूची प्राप्त करें। वहां आप अपनी साइट के लिए छवियों सहित पहले से ही अनुकूलित संसाधन भी डाउनलोड कर सकते हैं। सच है, यह केवल चेक किए गए पृष्ठ के लिए प्रासंगिक है।

यदि आपके पास एक वेबसाइट है, तो अवश्य देखें यह लेख । वर्डप्रेस का उपयोग करने वालों के लिए विशेष रूप से उपयोगी है।

हम छवियों के लिए सिफारिशों का उपयोग करते हैं

यह सरल लगता है: Google द्वारा निर्दिष्ट कार्यक्रमों को डाउनलोड करें और उनके माध्यम से सर्वर पर सभी फ़ाइलों को चलाएं। समस्या यह है कि ये उपयोगिताओं कंसोल हैं। वे एक बार में केवल 1 फ़ाइल लेते हैं। लेकिन हम व्यर्थ नहीं हैं अंतिम लेख फ़ाइलों को बैचने के लिए सही समय है?

अपने स्वयं के फ़ाइल हैंडलर एन मस्से बनाने के लिए लेख की जानकारी काफी है, इसलिए मैं यह नहीं चित्रित करूंगा कि वह कहां है। मैं सिर्फ तैयार असेंबली को डाउनलोड करने का प्रस्ताव करता हूं, जिसका मैं खुद इस्तेमाल करता हूं।

डाउनलोड संग्रह (212 KB)

पुरालेख संरचना

संग्रह में एक फ़ोल्डर होता है [ OptimizeImg ]। आरंभ करने के लिए, इसे कहीं अनपैक करें। मेरे पास यह c: \ temp \ में स्थित है, लेकिन यह महत्वपूर्ण नहीं है। मुख्य बात यह है कि पथ में विस्मयादिबोधक चिह्न नहीं हैं।

अगला। इस फ़ोल्डर में [ अपलोड ] उपनिर्देशिका है। यहां आपको उन फ़ाइलों को डालने की आवश्यकता है जो प्रसंस्करण की आवश्यकता होती है। सबसे अच्छी बात यह है कि आप कम से कम फ़ोल्डर / फ़ाइल संरचना को धक्का दे सकते हैं।

3 और कार्यक्रम हैं: jpegtran.exe | Optipng.exe | pngout.exe Google द्वारा अनुशंसित बहुत ही उपयोगी है। संबंधित आधिकारिक साइटों / रिपॉजिटरी से डाउनलोड किया गया। यदि संदेह है, या बस अपग्रेड करना चाहते हैं, तो एक विश्वसनीय स्रोत से डाउनलोड करें और मौजूदा लोगों को बदलें।

और अंत में, तुल्ज़ा का दिल। Batnichki:

• 1.bat
• 3.bat
• 3-go.bat
• 3-opti करने वाली out.bat
• 3-बाहर करने वाली opti.bat

पहली फ़ाइल, 1.bat, [अपलोड] से संरचना को फिर से बनाता है। 3 अतिरिक्त फ़ोल्डर बनाए गए हैं: [jpg_jpegtran] [png_optipng] [png_pngout] अपने प्रकार की संसाधित न्यूनतम फ़ाइलों के साथ (jpg - केवल * .jpg-files, png के साथ समान)।

3.bat क्रमिक रूप से निष्पादन के लिए तीन बैच फ़ाइलें लॉन्च करता है:

• 3-गो.बैट लगभग 1.bat के समान है। न्यूनतम के माध्यम से jpg / png फ़ाइलों को छोड़ें। कार्य का परिणाम संबंधित चित्रों के साथ 3 फ़ोल्डर (ऊपर देखें) होगा।
• 3-Opti-to-out.bat [png_optipng-to-pngout] फ़ोल्डर बनाता है, जिसमें Optipng + pngout द्वारा संसाधित फ़ाइलों को लिखा जाता है (वास्तव में इसी क्रम में)।
• 3-आउट-टू-ऑप्टी.बैट एक [png_pngout-to-optipng] फ़ोल्डर बनाता है जिसमें pngout + Optipng द्वारा संसाधित की गई फाइलें लिखी जाती हैं। पिछले एक के समान, केवल एक अलग अनुक्रम में।

सिद्धांत रूप में, केवल 1.bat हमारी जरूरतों के लिए पर्याप्त है। बैच बैग के पिछले संस्करण में अनुसंधान और त्रुटियों के परिणामस्वरूप 3x बैग दिखाई दिए। ऐसा हुआ कि त्रुटि के दौरान पिंगआउट के लिए फाइलें ऑप्टिपिंज डायरेक्टरी से ली गई थीं। और जब पुराने संस्करण के लॉन्च ने अद्यतन बैच फ़ाइल की तुलना में 1.5 गुना छोटे आकार दिया तो मेरा आश्चर्य क्या था। नतीजतन, यह पता चला कि डबल प्रोसेसिंग चित्रों को अच्छी तरह से "पकड़" सकती है। लेकिन इसमें लगभग 2 गुना अधिक समय लगता है। इसलिए जरूरत पड़ने पर खुद फैसला करें।

काम के लिए संक्षिप्त निर्देश

1. संग्रह डाउनलोड करें ।
2. इसे अनपैक करें।
3. नए खुले [OptimizeImg] फ़ोल्डर में जाएँ।
4. सभी फ़ाइलों को स्टिंगिंग की आवश्यकता होती है, फ़ोल्डर को अपलोड करें [अपलोड]।
5. 1.bat चलाएं और प्रतीक्षा करें। यदि कई फाइलें हैं और वे पीएनजी हैं, तो लंबे समय तक प्रतीक्षा करें।
6. जब कोई संदेश जारी रखने के लिए एक कुंजी दबाने की आवश्यकता के बारे में काली खिड़की में दिखाई देता है, तो सब कुछ तैयार है। यह बनाए गए फ़ोल्डर्स की सामग्री को लेने और एफ़टीपी के माध्यम से होस्टिंग की प्रतिलिपि बनाने के लिए पुरानी फ़ाइलों को अधिलेखित करता है।

एक उदाहरण के लिए। आपको WordPress पर एक ब्लॉग है। सभी चित्र [ / wp-content / uploads / ] में संग्रहीत हैं। साइट फ़ोल्डर (ftp के माध्यम से) पर जाएँ, [ wp-content ] पर जाएँ और बस [ अपलोड ] उसी नाम के फ़ोल्डर OptimizeImg पर कॉपी करें। 1.bat चलाएं और प्रतीक्षा करें। काम समाप्त होने के बाद, सामग्री [jpg_jpegtran] (हम वहां जाते हैं!) सर्वर पर अपलोड की जाती है। मौजूदा फ़ाइलों के अनुरोधों का उत्तर ओवरराइटिंग द्वारा दिया जाता है। पीएनजी के लिए एक समान चाल, लेकिन पहले हम किस फ़ोल्डर को देखते हैं - [png_optipng] या [png_pngout] - कम जगह लेता है, इसे अपनी सामग्री से भरता है।

अन्य फ़ाइलों को नुकसान से डरो मत। बत्नीकी केवल jpg / png के साथ काम करती है, और केवल इन प्रकार के चित्र नव निर्मित फ़ोल्डरों को लिखे जाते हैं।

मुझे उम्मीद है कि कोई उपयोगी होगा। गुड लक!

की आपूर्ति करता है

1. [OptimizeImg] पथ में विस्मयादिबोधक चिह्न नहीं होना चाहिए ! और प्रतिशत %
2. स्क्रिप्ट चलाना व्यवस्थापक के रूप में आवश्यक नहीं है। इसके अलावा, इस मामले में, वे काम नहीं कर सकते हैं!
3. ...

लेखक

ऑनलाइन नहीं 13 घंटे

x64 (उर्फ एंडी)

टिप्पणियाँ: 2846 प्रकाशन: 395 पंजीकरण: 02-04-2009