ಈ ಉಪಕರಣದ ಬಗ್ಗೆ
ಫೆವಿಕಾನ್ ಬ್ರೌಸರ್ ಟ್ಯಾಬ್ಗಳು, ಬುಕ್ಮಾರ್ಕ್ಗಳು ಮತ್ತು ಇತಿಹಾಸ ಪಟ್ಟಿಗಳಲ್ಲಿ ಕಾಣಿಸಿಕೊಳ್ಳುವ ಸಣ್ಣ ಐಕಾನ್ ಆಗಿದೆ. ಮೂಲ ಫೆವಿಕಾನ್ — /favicon.ico ನಲ್ಲಿನ 16×16 ICO ಫೈಲ್ - ವಿಭಿನ್ನ ಪ್ಲಾಟ್ಫಾರ್ಮ್ಗಳಿಗಾಗಿ ವಿಭಿನ್ನ ಗಾತ್ರದ ಐಕಾನ್ಗಳ ಸಂಕೀರ್ಣ ಸೆಟ್ಗೆ ವಿಸ್ತರಿಸಲಾಗಿದೆ: ಬ್ರೌಸರ್ ಟ್ಯಾಬ್ಗಳಿಗಾಗಿ 16×16 ಮತ್ತು 32×32, iOS ಹೋಮ್ ಸ್ಕ್ರೀನ್ಗಳಿಗೆ 180×180, Windows ಗಾಗಿ 192×192 ಮತ್ತು 512×512 ವಿವಿಧ ಗಾತ್ರಗಳು. ಇವೆಲ್ಲವನ್ನೂ ಒಂದೇ ಮೂಲ ಚಿತ್ರದಿಂದ ಉತ್ಪಾದಿಸುವುದು ಆಧುನಿಕ ಫೆವಿಕಾನ್ ಜನರೇಟರ್ ಮಾಡುತ್ತದೆ.
ಈ ಉಪಕರಣವು ಒಂದೇ ಹೆಚ್ಚಿನ ರೆಸಲ್ಯೂಶನ್ ಮೂಲ ಚಿತ್ರವನ್ನು ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ (ಸಾಮಾನ್ಯವಾಗಿ ಒಂದು ಚದರ ಲೋಗೋ) ಮತ್ತು ಫೆವಿಕಾನ್ ಸ್ವತ್ತುಗಳ ಸಂಪೂರ್ಣ ಸೆಟ್ ಮತ್ತು ಅವುಗಳನ್ನು ಉಲ್ಲೇಖಿಸಲು ಅಗತ್ಯವಿರುವ HTML ಲಿಂಕ್ ಟ್ಯಾಗ್ಗಳನ್ನು ಉತ್ಪಾದಿಸುತ್ತದೆ. ಔಟ್ಪುಟ್ ICO, ಬಹು PNG ಗಳು ಮತ್ತು ಪ್ರಗತಿಶೀಲ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ ಮೆಟಾಡೇಟಾಕ್ಕಾಗಿ ಮ್ಯಾನಿಫೆಸ್ಟ್.json ಅನ್ನು ಒಳಗೊಂಡಿದೆ. ಪರಿಣಾಮವಾಗಿ ಫೈಲ್ಗಳನ್ನು ನಿಮ್ಮ ಸೈಟ್ನ ಮೂಲದಲ್ಲಿ ಬಿಡಿ ಮತ್ತು ರಚಿಸಿದ HTML ಮೂಲಕ ಅವುಗಳನ್ನು ಉಲ್ಲೇಖಿಸಿ.
ಎಲ್ಲಾ ಪ್ರಕ್ರಿಯೆಯು ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲಿ ನಡೆಯುತ್ತದೆ. ಅಪ್ಲೋಡ್ ಇಲ್ಲ, API ಕರೆ ಇಲ್ಲ, ದರ ಮಿತಿ ಇಲ್ಲ. ಫೇವಿಕಾನ್ಗಳನ್ನು ಪ್ರದರ್ಶಿಸುವ ಪ್ರತಿಯೊಂದು ಆಧುನಿಕ ಬ್ರೌಸರ್ ಮತ್ತು ಆಪರೇಟಿಂಗ್ ಸಿಸ್ಟಮ್ನಲ್ಲಿ ಔಟ್ಪುಟ್ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ.
ಫೆವಿಕಾನ್ ಅನ್ನು ಏಕೆ ರಚಿಸಿ
ಫೆವಿಕಾನ್ಗಳಿಲ್ಲದ ಸೈಟ್ಗಳು ಅಪೂರ್ಣವಾಗಿ ಕಾಣುತ್ತವೆ. ಬ್ರೌಸರ್ ಟ್ಯಾಬ್ಗಳು ಸಾಮಾನ್ಯ ಐಕಾನ್ ಅನ್ನು ತೋರಿಸುತ್ತವೆ; ಬುಕ್ಮಾರ್ಕ್ಗಳು ಯಾವುದೇ ದೃಶ್ಯ ಗುರುತಿಸುವಿಕೆಯನ್ನು ಹೊಂದಿಲ್ಲ; ಸೈಟ್ ಕಡಿಮೆ ವೃತ್ತಿಪರವಾಗಿ ಕಾಣುತ್ತದೆ. ಸರಿಯಾದ ಫೆವಿಕಾನ್ ಸೆಟ್ ಅನ್ನು ಸೇರಿಸುವುದು ಕಡಿಮೆ-ಪ್ರಯತ್ನದ ಹೆಚ್ಚಿನ ಪ್ರಭಾವದ ಪೋಲಿಷ್ ಹಂತವಾಗಿದ್ದು ಅದು ವಿವರಗಳಿಗೆ ಗಮನವನ್ನು ಸೂಚಿಸುತ್ತದೆ.
ಆಧುನಿಕ ಫೆವಿಕಾನ್ ಅವಶ್ಯಕತೆಗಳು /favicon.ico ಮೀರಿ ಬೆಳೆದಿದೆ. iOS ಹೋಮ್ ಸ್ಕ್ರೀನ್ ಐಕಾನ್ಗಳು, Android Chrome ಐಕಾನ್ಗಳು, Windows ಟೈಲ್ ಐಕಾನ್ಗಳು ಮತ್ತು ಡಾರ್ಕ್ ಮೋಡ್ ರೂಪಾಂತರಗಳು ಎಲ್ಲಾ ವಿಭಿನ್ನ ಫೈಲ್ಗಳನ್ನು ಬಳಸುತ್ತವೆ. ಎಲ್ಲವನ್ನೂ ಒಂದೇ ಮೂಲದಿಂದ ರಚಿಸುವುದರಿಂದ ಪ್ರತಿ ಫೈಲ್ ಅನ್ನು ಕೈಯಿಂದ ನಿರ್ವಹಿಸದೆ ಸ್ಥಿರವಾದ ಬ್ರ್ಯಾಂಡಿಂಗ್ ಅನ್ನು ಖಾತ್ರಿಗೊಳಿಸುತ್ತದೆ.
ತಾಂತ್ರಿಕ ವಿವರಗಳು
ಪೂರ್ಣ ಆಧುನಿಕ ಫೆವಿಕಾನ್ ಸೆಟ್: favicon.ico (16+32+48 ಬಹು-ರೆಸಲ್ಯೂಶನ್), ಫೆವಿಕಾನ್-16x16.png, ಫೆವಿಕಾನ್-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png12chrome mstile-150x150.png. ಜೊತೆಗೆ PWA ಗಾಗಿ site.webmanifest, Windows ಗಾಗಿ browserconfig.xml.
ಪ್ರತಿ PNG ಮೂಲದಿಂದ ಕ್ಯಾನ್ವಾಸ್ ಆಧಾರಿತ ಡೌನ್ಸ್ಯಾಂಪ್ಲಿಂಗ್ನಿಂದ ಉತ್ಪತ್ತಿಯಾಗುತ್ತದೆ. DataView ಬರಹಗಳನ್ನು ಬಳಸಿಕೊಂಡು ಬಹು-ರೆಸಲ್ಯೂಶನ್ ICO ಸ್ವರೂಪಕ್ಕೆ 16/32/48 ಆವೃತ್ತಿಗಳನ್ನು ಸಂಯೋಜಿಸುವ ಮೂಲಕ ICO ಅನ್ನು JavaScript ನಲ್ಲಿ ನಿರ್ಮಿಸಲಾಗಿದೆ.
HTML ಲಿಂಕ್ ಟ್ಯಾಗ್ಗಳು ಪ್ರತಿ ಫೈಲ್ ಅನ್ನು ಸೂಕ್ತವಾದ rel ಮತ್ತು ಗಾತ್ರಗಳ ಗುಣಲಕ್ಷಣಗಳೊಂದಿಗೆ ಉಲ್ಲೇಖಿಸುತ್ತವೆ. ಜನರೇಟರ್ ಇವುಗಳನ್ನು ನಿಮ್ಮ ಸೈಟ್ನ <head> ಗಾಗಿ ನಕಲು-ಪೇಸ್ಟ್-ಸಿದ್ಧ ತುಣುಕಾಗಿ ಉತ್ಪಾದಿಸುತ್ತದೆ.
ಪದೇ ಪದೇ ಕೇಳಲಾಗುವ ಪ್ರಶ್ನೆಗಳು
- ನಾನು ಯಾವ ಇಮೇಜ್ ಫಾರ್ಮ್ಯಾಟ್ ಅನ್ನು ಅಪ್ಲೋಡ್ ಮಾಡಬೇಕು?
- ಪಾರದರ್ಶಕ ಹಿನ್ನೆಲೆಯೊಂದಿಗೆ PNG ಉತ್ತಮವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ. ಕನಿಷ್ಠ 512x512 ಪಿಕ್ಸೆಲ್ಗಳ ಚದರ ಚಿತ್ರವನ್ನು ಬಳಸಿ ಇದರಿಂದ ಉಪಕರಣವು ಗುಣಮಟ್ಟದ ನಷ್ಟವಿಲ್ಲದೆಯೇ ಅಳೆಯಬಹುದು. SVG ಸಹ ಉತ್ತಮವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಏಕೆಂದರೆ ಅದು ಯಾವುದೇ ಗಾತ್ರಕ್ಕೆ ಅಳೆಯುತ್ತದೆ.
- ಇದು ಯಾವ ಗಾತ್ರಗಳನ್ನು ಉತ್ಪಾದಿಸುತ್ತದೆ?
- 16x16 (ಬ್ರೌಸರ್ ಟ್ಯಾಬ್), 32x32 (ಬ್ರೌಸರ್ ಟ್ಯಾಬ್ @2x), 48x48 (ವಿಂಡೋಸ್ ಟಾಸ್ಕ್ ಬಾರ್), 180x180 (ಆಪಲ್ ಟಚ್ ಐಕಾನ್), 192x192 (ಆಂಡ್ರಾಯ್ಡ್ ಹೋಮ್ ಸ್ಕ್ರೀನ್), 512x512 (ಪಿಡಬ್ಲ್ಯೂಎ ಸ್ಪ್ಲಾಶ್ ಸ್ಕ್ರೀನ್). ICO ಫೈಲ್ 16, 32 ಮತ್ತು 48px ಗಾತ್ರಗಳನ್ನು ಒಳಗೊಂಡಿದೆ.
- ಫೆವಿಕಾನ್ ಫೈಲ್ಗಳನ್ನು ಎಲ್ಲಿ ಹಾಕಬೇಕು?
- ನಿಮ್ಮ ವೆಬ್ಸೈಟ್ ರೂಟ್ ಡೈರೆಕ್ಟರಿಯಲ್ಲಿ favicon.ico ಅನ್ನು ಇರಿಸಿ. ಇತರ PNG ಗಾತ್ರಗಳು ನಿಮ್ಮ ಸಾರ್ವಜನಿಕ ಫೋಲ್ಡರ್ ಅಥವಾ ಯಾವುದೇ ಪ್ರವೇಶಿಸಬಹುದಾದ ಮಾರ್ಗದಲ್ಲಿ ಹೋಗುತ್ತವೆ. ಪ್ರತಿ ಫೈಲ್ ಸ್ಥಳವನ್ನು ಸೂಚಿಸುವ ನಿಮ್ಮ <head> ವಿಭಾಗದಲ್ಲಿ HTML ಲಿಂಕ್ ಟ್ಯಾಗ್ಗಳನ್ನು ಸೇರಿಸಿ.
- ಬ್ರೌಸರ್ನಲ್ಲಿ ನನ್ನ ಫೆವಿಕಾನ್ ಏಕೆ ನವೀಕರಿಸುವುದಿಲ್ಲ?
- ಬ್ರೌಸರ್ಗಳು ಫೆವಿಕಾನ್ಗಳನ್ನು ಆಕ್ರಮಣಕಾರಿಯಾಗಿ ಸಂಗ್ರಹಿಸುತ್ತವೆ. ನಿಮ್ಮ ಬ್ರೌಸರ್ ಸಂಗ್ರಹವನ್ನು ತೆರವುಗೊಳಿಸಿ, ಅಜ್ಞಾತ ವಿಂಡೋದಲ್ಲಿ ತೆರೆಯಲು ಪ್ರಯತ್ನಿಸಿ ಅಥವಾ ರಿಫ್ರೆಶ್ ಮಾಡಲು ಒತ್ತಾಯಿಸಲು ಫೆವಿಕಾನ್ URL ಗೆ ಆವೃತ್ತಿಯ ಪ್ರಶ್ನೆ ಸ್ಟ್ರಿಂಗ್ (?v=2) ಸೇರಿಸಿ.
- ನನ್ನ ಫೆವಿಕಾನ್ ಏಕೆ ನವೀಕರಿಸುವುದಿಲ್ಲ?
- ಬ್ರೌಸರ್ಗಳು ಫೆವಿಕಾನ್ಗಳನ್ನು ಆಕ್ರಮಣಕಾರಿಯಾಗಿ ಸಂಗ್ರಹಿಸುತ್ತವೆ, ಕೆಲವೊಮ್ಮೆ ದಿನಗಳವರೆಗೆ. ಸಂಗ್ರಹವನ್ನು ತೆರವುಗೊಳಿಸುವ ಮೂಲಕ, ಐಕಾನ್ URL ಅನ್ನು ನೇರವಾಗಿ ತೆರೆಯುವ ಮೂಲಕ ಅಥವಾ ಲಿಂಕ್ ಟ್ಯಾಗ್ಗೆ ಆವೃತ್ತಿಯ ಪ್ರಶ್ನೆ ಪ್ಯಾರಾಮೀಟರ್ ಅನ್ನು ಸೇರಿಸುವ ಮೂಲಕ ರಿಫ್ರೆಶ್ ಮಾಡಲು ಒತ್ತಾಯಿಸಿ.
- ನನ್ನ ಚಿತ್ರವನ್ನು ಸರ್ವರ್ಗೆ ಅಪ್ಲೋಡ್ ಮಾಡಲಾಗಿದೆಯೇ?
- ಇಲ್ಲ. ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲಿ ಜನರೇಷನ್ ಸಂಭವಿಸುತ್ತದೆ.
- ನಾನು SVG ಅಥವಾ PNG ಬಳಸಬೇಕೇ?
- ಮೂಲಕ್ಕಾಗಿ SVG (ರೆಸಲ್ಯೂಶನ್-ಸ್ವತಂತ್ರ). ಜನರೇಟರ್ ನಿರ್ದಿಷ್ಟ ಗಾತ್ರಗಳಲ್ಲಿ PNG ಗಳನ್ನು ಉತ್ಪಾದಿಸುತ್ತದೆ; ಆಧುನಿಕ ಬ್ರೌಸರ್ಗಳು SVG ಫೆವಿಕಾನ್ಗಳನ್ನು ಲಿಂಕ್ ಮೂಲಕ ಬೆಂಬಲಿಸುತ್ತದೆ rel=icon type=image/svg+xml.
- site.webmanifest ಎಂದರೇನು?
- ಐಕಾನ್ಗಳು, ಬಣ್ಣಗಳು ಮತ್ತು ಇತರ ಮೆಟಾಡೇಟಾವನ್ನು ವಿವರಿಸುವ ಪ್ರಗತಿಶೀಲ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ಗಳಿಗಾಗಿ JSON ಮ್ಯಾನಿಫೆಸ್ಟ್. ಸ್ಥಾಪಿಸಬಹುದಾದ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ಗಳಿಗೆ ಅಗತ್ಯವಿದೆ; ಪ್ರಮಾಣಿತ ಸೈಟ್ಗಳಲ್ಲಿ ಸಹ ಸೇರಿಸಲು ನಿರುಪದ್ರವ.