छवि का आकार, सर्वोत्तम अभ्यास


12

यदि आप html डॉक्यूमेंट को कड़ाई से मौजूदा सर्वोत्तम अभ्यास के उपयोग से विकसित कर रहे हैं, तो आप मार्कअप से सबसे अच्छा संवाद कैसे कर सकते हैं?

पास्ट बेस्ट प्रैक्टिस इमेज के साथ इमेज की ऊंचाई और चौड़ाई चाहता है कि यह उस ब्राउजर की तुलना में तेजी से रेंडर हो जाए जो इमेज को डाउनलोड करने के लिए इसके आयामों को पाने के लिए इंतजार कर रहा है। लेकिन ऐसा करने से दस्तावेज़ से बाहर की शैली अलग हो जाती है।

प्रत्येक छवि में एक आईडी विशेषता जोड़ें और सीएसएस में ऊंचाई / चौड़ाई डालें? क्या यह इनलाइन छवि ऊंचाई और चौड़ाई के प्रतिपादन बोनस को नकारता है?

जवाबों:


12

IMG एलिमेंट में चौड़ाई और ऊँचाई को घटाया नहीं गया है और निश्चित रूप से ब्राउज़र को किसी इमेज की चौड़ाई और ऊंचाई बताने का सबसे अच्छा तरीका है। इसे करने के अपने तरीके से बाहर जाना एक और तरीका है बेमानी और अनावश्यक (और संभवतः मूर्खतापूर्ण)। अपने या ब्राउज़र के लिए कोई अनावश्यक काम न करें। मूल बातें जो काम करते हैं।


1
... और एक ALTटैग भी मत भूलना , भले ही उसके खाली, या अनुपालन चेकर्स शिकायत करेंगे।
ताल्लवी वटिया

@Tchalvak क्षमा करें लेकिन आप गलत हैं। आप सर्वर साइड प्रोग्रामिंग और / या जावास्क्रिप्ट के माध्यम से चौड़ाई और ऊंचाई को गतिशील रूप से ओवरराइड कर सकते हैं। और अपने तर्क से आप इनलाइन शैलियों को भी ओवरराइड नहीं कर सकते।
जॉन कोंडे

वूप्स, ऐसा लगता है कि मैं वैसे भी एक सीएसएस ओवरराइट की कमी के बारे में गलत था, !importantसीएसएस में आपको चौड़ाई और ऊंचाई विशेषताओं को ओवरराइड करने की अनुमति देता है, इसलिए शुरू में चौड़ाई / ऊंचाई का उपयोग करना अच्छी तरह से काम करता है। हालांकि मैं वोट डाउन की स्थिति में फंस गया हूं। अगर आपको ऐसा लगा कि उत्तर को संपादित करना है, तो मैं इसे बदल दूंगा। श्रग नहीं कि यह बहुत ज्यादा मायने रखता है।
Kzqai

8

जॉन कोनडे का जवाब हाजिर है। छवियों की एक चौड़ाई और ऊंचाई है - यह उनकी सामग्री का हिस्सा है , न कि उनकी शैली । इसलिए यहां "अलगाव" करने की आवश्यकता नहीं है।

हालांकि, एक अपवाद: छवि आयाम के लिए सीएसएस है उपयोगी अगर आप कई छवियों है सभी एक ही आकार (उदाहरण के लिए थंबनेल)। यहाँ HTML को काटने और विकास को बढ़ाने के लिए CSS क्लास का उपयोग करना बेहतर है।

बटन और आइकन सहित वेबसाइट के डिजाइन के लिए, आपका सबसे अच्छा समाधान सीएसएस स्प्राइट्स है।


+1, सीएसएस स्प्राइट साइट की गति में एक हास्यास्पद अंतर बनाते हैं।
Kzqai
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.