मैं अपनी वेबसाइट के लिए एक अच्छी कवर तस्वीर कैसे चुन सकता हूं?


22

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

एक प्रभावी कवर / पृष्ठभूमि फोटो क्या बनाता है? अपनी साइट के लिए कुछ छवियों को लेने और संपादित करने की योजना बनाते समय मुझे क्या ध्यान में रखना चाहिए?


1
अब बड़ी पृष्ठभूमि के VIDEOS का चलन है।
user11153

1
अच्छी तरह से किया, साइट पर सबसे अच्छा स्व-उत्तरित प्रश्नों में से एक (मैं किसी अन्य को याद नहीं कर सकता, इसलिए संभवतः सबसे अच्छा)। :)
डोम

जवाबों:


30

क्या आपको वास्तव में प्रवृत्ति का पालन करने की आवश्यकता है?

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

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

  • सुनिश्चित करें कि छवि सामग्री से संबंधित है
  • सुनिश्चित करें कि छवि वही कहती है जो आप चाहते हैं
  • सुनिश्चित करें कि छवि अपेक्षाकृत अद्वितीय है
  • वास्तविक चीजों की एक छवि का उपयोग करें
  • सुनिश्चित करें कि छवि आपके लेआउट के साथ काम करती है
  • सुनिश्चित करें कि छवि अच्छी फोटोग्राफी और डिजाइन नियमों का पालन करती है
  • सुनिश्चित करें कि छवि आपकी रंग योजना का अनुसरण करती है
  • छवि के भीतर विचरण को सीमित करें
  • सुनिश्चित करें कि छवि का आकार काफी बड़ा है
  • सुनिश्चित करें कि आपके पास छवि का उपयोग करने के अधिकार हैं
  • सुनिश्चित करें कि फोटो की गुणवत्ता अधिक है

सुनिश्चित करें कि छवि सामग्री से संबंधित है

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

यहां छवि विवरण दर्ज करें


सुनिश्चित करें कि छवि वही कहती है जो आप चाहते हैं

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

यहां छवि विवरण दर्ज करें

यह बिना कहे चला जाता है कि छवि नेत्रहीन आकर्षक होनी चाहिए। छवि के आकर्षक होने के लक्षणों के बारे में अधिक जानकारी नीचे दी गई है।


सुनिश्चित करें कि छवि अपेक्षाकृत अद्वितीय है

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

यहां छवि विवरण दर्ज करें


वास्तविक चीजों की एक छवि का उपयोग करें

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

यहां छवि विवरण दर्ज करें

लोगों को दिखाने का और भी अधिक प्रभाव पड़ता है, जो अच्छा और बुरा दोनों हो सकता है। यदि सही ढंग से किया जाता है, तो यह उपयोगकर्ताओं को महसूस कर सकता है कि अनुभव अधिक वास्तविक और व्यक्तिगत है। अगर खराब किया है, यह ऐसा प्रतीत कर सकते हैं im व्यक्तिगत और सस्ती। उस पर और यहाँ

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

यहां छवि विवरण दर्ज करें


सुनिश्चित करें कि छवि आपके लेआउट के साथ काम करती है

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

सुनिश्चित करें कि आपके पास मौजूद सामग्री से छवि का कोई महत्वपूर्ण हिस्सा कवर नहीं किया गया है। उपयोगकर्ताओं को उन सामग्री तक ले जाने में मदद करने के लिए दृश्य दिशानिर्देशों का उपयोग करें जिन्हें आप उन्हें देखना चाहते हैं (अगले भाग में इस पर अधिक)।

यहां छवि विवरण दर्ज करें


सुनिश्चित करें कि छवि अच्छी फोटोग्राफी और डिजाइन नियमों का पालन करती है

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

ये सिद्धांत छवि के महत्वपूर्ण भागों और इसके आसपास के संदर्भ पर ध्यान आकर्षित करने में मदद करके छवि को अधिक उद्देश्य देंगे।

अच्छी छवि के नियम


सुनिश्चित करें कि छवि आपकी रंग योजना का अनुसरण करती है

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

descr


छवि के भीतर विचरण को सीमित करें

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

आंशिक रूप से पारदर्शी ओवरले जोड़ना, एक छवि को काला करना, या रंग फिल्टर जोड़ने से पहले इसे काले और सफेद रंग से धोना अनावश्यक शोर को कम करने में मदद कर सकता है। इसके अलावा, पृष्ठभूमि के रंगों को पाठ के पीछे या पठनीयता में मदद करने के लिए एक तत्व पर भी लागू किया जा सकता है।

यहां छवि विवरण दर्ज करें

उपरोक्त छवि मूल छवि को गहरा करती है और शोर को कम करने के लिए किनारों पर कुछ छाया का उपयोग करती है। नीचे दी गई छवि समान कार्य करने के लिए आंशिक रूप से पारदर्शी डार्क ओवरले का उपयोग करती है।

यहां छवि विवरण दर्ज करें


सुनिश्चित करें कि छवि का आकार काफी बड़ा है

यह बिना कहे चला जाता है कि उपयोग की गई छवि इतनी बड़ी होनी चाहिए कि वह प्रत्येक स्क्रीन को बिना खींचे कवर कर सके। इसका मतलब है कि पूर्ण आकार की स्क्रीन के लिए हमें 1024 x 768 पिक्सेल के न्यूनतम रिज़ॉल्यूशन वाली छवियां चाहिए, लेकिन इसका लक्ष्य कम से कम 1200 पिक्सेल चौड़ा होना सर्वोत्तम है। हम संकल्प के आधार पर छवियों के अंतर आकारों की सेवा करके छोटी स्क्रीन के लिए बड़ी छवियों को लोड करने से भी बचा सकते हैं । छवि गुणवत्ता को स्वीकार नहीं करते हुए हालांकि छवि लोड समय को अनुकूलित करने का प्रयास करें।


सुनिश्चित करें कि आपके पास छवि का उपयोग करने के अधिकार हैं

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


सुनिश्चित करें कि फोटो की गुणवत्ता अधिक है

दानेदार या धुंधली छवियों का उपयोग न करें। संदिग्ध या असंबंधित सामग्री वाली फ़ोटो का उपयोग न करें। इसे सरल रखें लेकिन (अधिकतर) वास्तविक। प्रत्येक छवि के अच्छे और बुरे हिस्सों के बारे में कठिन सोचें जो आप मानते हैं और जो कुछ औसत दर्जे का है उसे स्वीकार न करें।

अतिरिक्त संसाधन:


4
अच्छा उत्तर। मैं शायद बहुत रसीला हो गया था: "सुनिश्चित करें कि यह एक अच्छी तस्वीर है और आपकी साइट की जरूरतों और उद्देश्यों के लिए प्रासंगिक है" :)
DA01

@ DA01 जब मैं उस कथन से पूरी तरह सहमत हूं, कुछ लोगों को थोड़ी और मदद की आवश्यकता है :)
Zach Saucier
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.