अपने Logo को एक Favicon में बदलें
आपके logo में एक wordmark, एक symbol और बारीक detail होती है। 16 pixels चौड़ाई पर, इनमें से केवल एक बचता है। कुछ भी export करने से पहले इसे सोच-समझकर चुनें।
पूरा logo क्यों विफल होता है
एक favicon 16 pixels चौड़ाई जितना छोटा render होता है। एक wordmark और बारीक detail वाला पूरा logo उस size पर एक धूसर धब्बे में बदल जाता है: text पढ़ने लायक नहीं रहता और detail लुगदी में ढह जाती है।
समाधान यह है कि favicon को logo से निकाले गए अपने खुद के asset के रूप में देखें, न कि logo के रूप में। ज़्यादातर मज़बूत favicons एक symbol, एक monogram या एक अकेला अक्षर होते हैं, क्योंकि tab size पर बस इतना ही बचता है।
logo से favicon तक
- 1
एक element निकालें
अपने logo से symbol लें, या अगर आपका logo एक wordmark है तो एक अकेला initial। text और सजावटी चीज़ें हटा दें।
- 2
छोटे में पढ़ने लायक होने तक सरल करें
पतली रेखाएं, gradients और भीतरी detail हटाएं। अपने background के सामने ऊंचे contrast वाले एक बोल्ड आकार का लक्ष्य रखें।
- 3
पहले सबसे छोटे size पर design करें
16x16 पर zoom करें और इसे वहां पढ़ने लायक बनाएं। अगर यह 16 पर काम करता है तो हर जगह काम करता है। एक छोटे design को बड़ा करना आसान है; उल्टा नहीं।
- 4
ज़रूरत हो तो background दें
एक कसा हुआ मार्क अक्सर किनारे-से-किनारे तैरने के बजाय एक ठोस या हल्के padded background पर बेहतर पढ़ा जाता है। यह apple-touch-icon में भी मदद करता है, जिसे iOS काले पर भरता है।
- 5
पूरा सेट export करें
अंतिम मार्क से favicon.ico, PNGs और apple-touch-icon बनाएं ताकि हर size उसी साफ़ artwork से आए।
वे design नियम जो छोटा होने पर बचते हैं
पहले ऊंचा contrast। मार्क को अपने background से कड़ाई से अलग होना चाहिए, क्योंकि सूक्ष्म tonal बदलाव छोटे sizes पर गायब हो जाते हैं। बोल्ड foreground, सादा background।
एक आकार, तीन नहीं। एक favicon जो एक अकेली silhouette की तरह पढ़ा जाता है वह काम करता है। कई elements ढेर करें और वे शोर में मिल जाते हैं। अगर आप दो विचारों के बीच उलझे हैं, तो सरल वाला ship करें।
negative space पर ध्यान दें। आकारों के बीच पतले gaps 16 pixels पर बंद हो जाते हैं और मार्क एक धब्बे में भर जाता है। आकारों को जगह दें, या उन्हें मोटा करें ताकि gaps खुले रहें।
अक्सर पूछे जाने वाले सवाल
क्या मैं अपने logo को favicon के रूप में इस्तेमाल कर सकता हूं?
पूरा logo नहीं। symbol या एक अकेला initial निकालें और इसे 16 pixels पर पढ़ने लायक होने तक सरल करें, फिर उससे favicon सेट export करें। एक पूरा wordmark tab में लुगदी में बदल जाता है।
मैं एक logo से favicon कैसे बनाऊं?
logo से एक element लें, बारीक detail हटाएं, पढ़ने योग्यता के लिए इसे 16x16 पर ट्यून करें, अगर मार्क कसा हुआ है तो एक background जोड़ें, फिर अंतिम artwork से हर favicon size बनाएं।
मेरा logo favicon के रूप में धुंधला क्यों दिखता है?
इसमें 16 pixels के लिए बहुत ज़्यादा detail है। पतली रेखाएं, text और gradients उस size पर ढह जाते हैं। एक बोल्ड, ऊंचे contrast वाले आकार में सरल करें।
मुझे favicon किस size पर design करना चाहिए?
पहले सबसे छोटे size, 16x16 पर design करें। अगर मार्क वहां पढ़ा जाता है तो यह हर बड़े size पर पढ़ा जाता है। एक छोटे साफ़ design को बड़ा करना सुरक्षित है; एक detailed को छोटा करना नहीं।