आप उत्तरदायी छवियों के बारे में जानते हैं। यह HTML में छवि सिंटैक्स के बारे में है। यदि आप इसे सही वाक्यविन्यास में सही जानकारी देते हैं, तो आप ब्राउज़र को ठीक वही सही छवि डाउनलोड करने के लिए प्राप्त कर सकते हैं, जिसकी उसे बहुत अधिक या बहुत कम छवि डेटा दिए बिना। यह प्रदर्शन के लिए शानदार है।
आप जानते हैं कि उत्तरदायी छवियों का अधिकतम लाभ उठाने के लिए आपको इसे पिक्चरफिल के साथ पॉलीफ़िल करना चाहिए। आप इसे डाउनलोड करते हैं, आप इसे अपने पेज पर शामिल करते हैं।
आपके पास एक योजना है। आपको पता है कि आप अपने पृष्ठ को कुछ मीडिया क्वेरी ब्रेकपॉइंट पर पसंद करना चाहते हैं। आप यह सब स्केच या फ़ोटोशॉप में मज़ाक उड़ा रहे हैं।
आप जानते हैं कि उत्तरदायी छवियों के लिए वाक्य रचना क्या है। आपको अपनी स्थिति का वर्णन करने के लिए srcset / size सिंटैक्स जैसी कुछ की आवश्यकता होगी।
![Sunset]()
यह सब कुछ उस सामान के बारे में है। यह सभी को एक साथ बांधने के बारे में है। यह डिजाइन वर्कफ़्लो को एक साथ जोड़ने के बारे में है और सॉफ्टवेयर का उपयोग फ्रंट एंड वर्कफ़्लो और वहां उपयोग किए गए सिंटैक्स के साथ है। आपको यह जानने की जरूरत है कि प्रारूप और आकार में छवियों का उत्पादन कैसे करें। आपको यह जानना होगा कि आपको गुणवत्ता आउटपुट कब मिलेगा और कब नहीं। आपको यह जानने की आवश्यकता है कि उन छवियों को कैसे मापें और सही संख्याओं का उपयोग कहां करें। आपको यह जानना होगा कि अपने लेआउट विकल्पों और मीडिया क्वेरी को उन नंबरों से कैसे जोड़ा जाए। यह सब यहाँ है।
CodePen पर क्रिस कॉयर (@chisciscoyier) द्वारा उत्तरदायी छवियों के लिए संख्या प्राप्त करने पर स्क्रेन्कास्ट के लिए पेन डेमो देखें।