ಇಂದು ಆನ್ಲೈನ್ನಲ್ಲಿ ಯಾವುದೇ ವೆಬ್ ಪುಟವನ್ನು ನೋಡಿ ಮತ್ತು ಕೆಲವು ವಿಷಯಗಳನ್ನು ಸಾಮಾನ್ಯದಲ್ಲಿ ಹಂಚಿಕೊಳ್ಳುವಿರಿ ಎಂದು ನೀವು ಗಮನಿಸಬಹುದು. ಆ ಹಂಚಿಕೆಯ ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಒಂದು ಚಿತ್ರಗಳು. ವೆಬ್ಸೈಟ್ನ ಪ್ರಸ್ತುತಿಗೆ ಸರಿಯಾದ ಚಿತ್ರಗಳನ್ನು ತುಂಬಾ ಸೇರಿಸಿ. ಕಂಪನಿಯ ಲಾಂಛನವನ್ನು ಹೊಂದಿರುವಂತಹ ಕೆಲವು ಚಿತ್ರಗಳು, ಸೈಟ್ ಅನ್ನು ಬ್ರ್ಯಾಂಡ್ ಮಾಡಲು ಸಹಾಯ ಮಾಡಿ ಮತ್ತು ನಿಮ್ಮ ಭೌತಿಕ ಕಂಪನಿಗೆ ಡಿಜಿಟಲ್ ಅಸ್ತಿತ್ವವನ್ನು ಸಂಪರ್ಕಿಸುತ್ತವೆ.
ಇಮೇಜ್, ಐಕಾನ್ ಅಥವಾ ಗ್ರಾಫಿಕ್ಸ್ ಅನ್ನು ನಿಮ್ಮ ವೆಬ್ ಪುಟಕ್ಕೆ ಸೇರಿಸಲು, ನೀವು ಪುಟದ HTML ಕೋಡ್ನಲ್ಲಿ ಟ್ಯಾಗ್ ಅನ್ನು ಬಳಸಬೇಕಾಗುತ್ತದೆ. ನೀವು ಗ್ರಾಫಿಕ್ ಅನ್ನು ಪ್ರದರ್ಶಿಸಲು ಬಯಸುವ ಸ್ಥಳದಲ್ಲಿ ನಿಮ್ಮ HTML ನಲ್ಲಿ IMG ಟ್ಯಾಗ್ ಅನ್ನು ಇರಿಸಿ. ಪುಟದ ಕೋಡ್ ಅನ್ನು ಸಲ್ಲಿಸುವ ವೆಬ್ ಬ್ರೌಸರ್ ಈ ಟ್ಯಾಗ್ ಅನ್ನು ಒಮ್ಮೆ ವೀಕ್ಷಿಸಿದ ನಂತರ ಸೂಕ್ತವಾದ ಗ್ರಾಫಿಕ್ನೊಂದಿಗೆ ಬದಲಾಯಿಸುತ್ತದೆ. ನಮ್ಮ ಕಂಪನಿ ಲಾಂಛನದ ಉದಾಹರಣೆಗೆ ಹೋಗುವಾಗ, ನಿಮ್ಮ ಸೈಟ್ಗೆ ಆ ಚಿತ್ರವನ್ನು ನೀವು ಹೇಗೆ ಸೇರಿಸಬಹುದೆಂದರೆ ಇಲ್ಲಿವೆ:
ಚಿತ್ರ ಗುಣಲಕ್ಷಣಗಳು
ಮೇಲಿನ HTML ಕೋಡ್ ನೋಡುತ್ತಿರುವುದು, ಅಂಶವು ಎರಡು ಗುಣಲಕ್ಷಣಗಳನ್ನು ಒಳಗೊಂಡಿದೆ ಎಂದು ನೀವು ನೋಡುತ್ತೀರಿ. ಪ್ರತಿಯೊಂದೂ ಚಿತ್ರಕ್ಕಾಗಿ ಅಗತ್ಯವಿದೆ.
ಮೊದಲ ಗುಣಲಕ್ಷಣವೆಂದರೆ "src". ಇದು ಪುಟದಲ್ಲಿ ನೀವು ಪ್ರದರ್ಶಿಸಲು ಬಯಸುವ ಇಮೇಜ್ ಫೈಲ್ ಅಕ್ಷರಶಃ ಆಗಿದೆ. ನಮ್ಮ ಉದಾಹರಣೆಯಲ್ಲಿ ನಾವು "logo.png" ಎಂಬ ಫೈಲ್ ಅನ್ನು ಬಳಸುತ್ತಿದ್ದೇವೆ. ಇದು ಸೈಟ್ ಅನ್ನು ಪ್ರದರ್ಶಿಸಿದಾಗ ವೆಬ್ ಬ್ರೌಸರ್ ಪ್ರದರ್ಶಿಸುತ್ತದೆ ಎಂದು ಗ್ರಾಫಿಕ್ ಆಗಿದೆ.
ಈ ಫೈಲ್ ಹೆಸರಿನ ಮೊದಲು, "/ images /" ಎಂಬ ಕೆಲವು ಹೆಚ್ಚುವರಿ ಮಾಹಿತಿಯನ್ನು ನಾವು ಸೇರಿಸಿದ್ದೇವೆ ಎಂದು ನೀವು ಗಮನಿಸಬಹುದು. ಇದು ಫೈಲ್ ಮಾರ್ಗವಾಗಿದೆ. ಕೋಶದ ಮೂಲವನ್ನು ನೋಡಲೆಂದು ಆರಂಭಿಕ ಫಾರ್ವರ್ಡ್ ಸ್ಲಾಶ್ ಸರ್ವರ್ಗೆ ಹೇಳುತ್ತದೆ. ಅದು "ಚಿತ್ರಗಳನ್ನು" ಎಂಬ ಫೋಲ್ಡರ್ಗಾಗಿ ಮತ್ತು ಅಂತಿಮವಾಗಿ "logo.png" ಎಂಬ ಫೈಲ್ಗಾಗಿ ನೋಡುತ್ತದೆ. ಎಲ್ಲ ಸೈಟ್ಗಳ ಗ್ರಾಫಿಕ್ಸ್ ಅನ್ನು ಶೇಖರಿಸಿಡಲು "ಇಮೇಜ್ಗಳು" ಎಂಬ ಫೋಲ್ಡರ್ ಅನ್ನು ಬಳಸುವುದು ಬಹಳ ಸಾಮಾನ್ಯವಾದ ಅಭ್ಯಾಸವಾಗಿದೆ, ಆದರೆ ನಿಮ್ಮ ಸೈಟ್ಗಾಗಿ ನಿಮ್ಮ ಫೈಲ್ ಮಾರ್ಗವು ಬದಲಾಗಬಹುದು.
ಎರಡನೆಯ ಅಗತ್ಯ ಗುಣಲಕ್ಷಣವು "ಆಲ್ಟ್" ಪಠ್ಯವಾಗಿದೆ. ಚಿತ್ರವು ಕೆಲವು ಕಾರಣಗಳಿಗಾಗಿ ಲೋಡ್ ಆಗಲು ವಿಫಲವಾದಲ್ಲಿ ತೋರಿಸಲ್ಪಡುವ "ಪರ್ಯಾಯ ಪಠ್ಯ" ಇದು. ಇಮೇಜ್ ಅನ್ನು ಲೋಡ್ ಮಾಡಲು ವಿಫಲವಾದರೆ ನಮ್ಮ ಉದಾಹರಣೆಯಲ್ಲಿ "ಕಂಪನಿ ಲೋಗೋ" ಅನ್ನು ಓದುವ ಈ ಪಠ್ಯವನ್ನು ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ. ಅದು ಏಕೆ ಸಂಭವಿಸುತ್ತದೆ? ವಿವಿಧ ಕಾರಣಗಳು:
- ತಪ್ಪಾದ ಫೈಲ್ ಹಾದಿ
- ತಪ್ಪಾದ ಫೈಲ್ ಹೆಸರು ಅಥವಾ ತಪ್ಪಾಗಿ ಬರೆಯುವುದು
- ಪ್ರಸರಣ ದೋಷ
- ಫೈಲ್ನಿಂದ ಸರ್ವರ್ ಅನ್ನು ಅಳಿಸಲಾಗಿದೆ
ನಮ್ಮ ನಿಗದಿತ ಚಿತ್ರಿಕೆ ಏಕೆ ಕಳೆದುಹೋಗಬಹುದು ಎಂಬುದಕ್ಕೆ ಇವುಗಳು ಕೆಲವು ಸಾಧ್ಯತೆಗಳು. ಈ ಸಂದರ್ಭಗಳಲ್ಲಿ, ಬದಲಾಗಿ ನಮ್ಮ ಆಲ್ಟ್ ಪಠ್ಯವನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ.
ದೃಷ್ಟಿ ದುರ್ಬಲಗೊಂಡ ಸಂದರ್ಶಕರಿಗೆ ಚಿತ್ರವನ್ನು "ಓದಲು" ಆಲ್ಟ್ ಪಠ್ಯವನ್ನು ಸ್ಕ್ರೀನ್ ರೀಡರ್ ಸಾಫ್ಟ್ವೇರ್ ಬಳಸುತ್ತದೆ. ನಾವು ಹಾಗೆ ಚಿತ್ರ ನೋಡಲು ಸಾಧ್ಯವಿಲ್ಲ ಏಕೆಂದರೆ, ಈ ಪಠ್ಯ ಅವುಗಳನ್ನು ಸ್ವತಃ ಚಿತ್ರ ಏನು ಗೊತ್ತಿಲ್ಲ ಅನುಮತಿಸುತ್ತದೆ. ಇದಕ್ಕಾಗಿಯೇ ಆಲ್ಟರ್ಟ್ ಪಠ್ಯ ಅಗತ್ಯವಿದೆ ಮತ್ತು ಇಮೇಜ್ ಏನೆಂದು ಸ್ಪಷ್ಟವಾಗಿ ತಿಳಿಸಬೇಕು!
ಆಲ್ಟ್ ಪಠ್ಯದ ಸಾಮಾನ್ಯ ಅಪಾರ್ಥವೆಂದರೆ ಅದು ಹುಡುಕಾಟ ಎಂಜಿನ್ ಉದ್ದೇಶಗಳಿಗಾಗಿ ಮೀಸಲಾಗಿದೆ. ಇದು ನಿಜವಲ್ಲ. ಗೂಗಲ್ ಮತ್ತು ಇತರ ಸರ್ಚ್ ಇಂಜಿನ್ಗಳು ಈ ಪಠ್ಯವನ್ನು ಏನೆಂದು ಚಿತ್ರಿಸುತ್ತವೆಯಾದರೂ (ನೆನಪಿಡಿ, ಅವರು ನಿಮ್ಮ ಚಿತ್ರವನ್ನು "ನೋಡುವುದಿಲ್ಲ"), ಹುಡುಕಾಟ ಎಂಜಿನ್ಗಳಿಗೆ ಮಾತ್ರ ಮೇಲ್ಮನವಿ ಸಲ್ಲಿಸಲು ನೀವು ಪರ್ಯಾಯ ಪಠ್ಯವನ್ನು ಬರೆಯಬಾರದು. ಲೇಖಕ ಮಾನವರು ಅರ್ಥ ನಿಗದಿಪಡಿಸಲಾಗಿದೆ ಆಲ್ಟ್ ಪಠ್ಯ ಸ್ಪಷ್ಟ. ಹುಡುಕಾಟ ಎಂಜಿನ್ಗಳಿಗೆ ಮನವಿ ಮಾಡುವ ಟ್ಯಾಗ್ನೊಳಗೆ ನೀವು ಕೆಲವು ಕೀವರ್ಡ್ಗಳನ್ನು ಸೇರಿಸಬಹುದು, ಅದು ಉತ್ತಮವಾಗಿದೆ, ಆದರೆ ಗ್ರಾಫಿಕ್ಸ್ ಫೈಲ್ ಅನ್ನು ನೋಡಲು ಸಾಧ್ಯವಾಗದ ಯಾರಿಗಾದರೂ ಚಿತ್ರವು ಏನು ಎಂದು ಹೇಳುವ ಮೂಲಕ ಆಲ್ಟ್ ಪಠ್ಯವು ಅದರ ಪ್ರಾಥಮಿಕ ಉದ್ದೇಶವನ್ನು ಪೂರೈಸುತ್ತಿದೆಯೆ ಎಂದು ಯಾವಾಗಲೂ ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಿ.
ಇತರ ಗುಣಲಕ್ಷಣಗಳು
IMG ಟ್ಯಾಗ್ ಸಹ ನಿಮ್ಮ ವೆಬ್ ಪುಟದಲ್ಲಿ ಗ್ರಾಫಿಕ್ ಅನ್ನು ನೀವು ಬಳಸಿದಾಗ ನೀವು ನೋಡಬಹುದಾದ ಎರಡು ಇತರ ಲಕ್ಷಣಗಳನ್ನು ಹೊಂದಿದೆ - ಅಗಲ ಮತ್ತು ಎತ್ತರ. ಉದಾಹರಣೆಗೆ, ನೀವು ಡ್ರೀಮ್ವೇವರ್ನಂತಹ ಡಬ್ಲ್ಯುವೈಎಸ್ಐಡಬ್ಲ್ಯುವೈಜಿ ಎಡಿಟರ್ ಅನ್ನು ಬಳಸಿದರೆ, ಅದು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಈ ಮಾಹಿತಿಯನ್ನು ಸೇರಿಸುತ್ತದೆ. ಇಲ್ಲಿ ಒಂದು ಉದಾಹರಣೆ ಇಲ್ಲಿದೆ:
ಅಗಲ ಮತ್ತು HEIGHT ಲಕ್ಷಣಗಳು ಬ್ರೌಸರ್ಗೆ ಚಿತ್ರದ ಗಾತ್ರವನ್ನು ತಿಳಿಸಿ. ವಿನ್ಯಾಸದಲ್ಲಿ ಎಷ್ಟು ಜಾಗವನ್ನು ನಿಯೋಜಿಸಲು ಬ್ರೌಸರ್ಗೆ ತಿಳಿದಿದೆ ಮತ್ತು ಇಮೇಜ್ ಡೌನ್ಲೋಡ್ಗಳು ಮಾಡುವಾಗ ಪುಟದ ಮುಂದಿನ ಅಂಶಕ್ಕೆ ಅದು ಚಲಿಸಬಹುದು. ನಿಮ್ಮ HTML ನಲ್ಲಿ ಈ ಮಾಹಿತಿಯನ್ನು ಬಳಸುವುದರ ಸಮಸ್ಯೆ ಆ ಚಿತ್ರದ ನಿಖರವಾದ ಗಾತ್ರದಲ್ಲಿ ಪ್ರದರ್ಶಿಸಲು ನೀವು ಯಾವಾಗಲೂ ಬಯಸಬಾರದು. ಉದಾಹರಣೆಗೆ, ನೀವು ಸಂದರ್ಶಕ ಪರದೆಯ ಮತ್ತು ಸಾಧನದ ಗಾತ್ರವನ್ನು ಆಧರಿಸಿ ಬದಲಾವಣೆಗಳನ್ನು ಮಾಡುವ ಒಂದು ಪ್ರತಿಕ್ರಿಯಾಶೀಲ ವೆಬ್ಸೈಟ್ ಅನ್ನು ಹೊಂದಿದ್ದರೆ, ನಿಮ್ಮ ಚಿತ್ರಗಳನ್ನು ಹೊಂದಿಕೊಳ್ಳುವಂತೆ ನೀವು ಬಯಸುತ್ತೀರಿ. ಸ್ಥಿರ ಎಚ್ಟಿಎಮ್ಎಲ್ ಏನು ಎಂದು ನೀವು ನಿಮ್ಮ ಎಚ್ಟಿಎಮ್ಎಲ್ನಲ್ಲಿ ಹೇಳುವುದಾದರೆ, ಪ್ರತಿಕ್ರಿಯಾಶೀಲರಾಗಿರುತ್ತಾರೆ CSS ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳೊಂದಿಗೆ ಅತಿಕ್ರಮಿಸಲು ನೀವು ತುಂಬಾ ಕಷ್ಟವಾಗುತ್ತದೆ. ಈ ಕಾರಣಕ್ಕಾಗಿ, ಮತ್ತು ಶೈಲಿ (ಸಿಎಸ್ಎಸ್) ಮತ್ತು ರಚನೆ (ಎಚ್ಟಿಎಮ್ಎಲ್) ಅನ್ನು ಬೇರ್ಪಡಿಸಲು, ನಿಮ್ಮ HTML ಕೋಡ್ಗೆ ಅಗಲ ಮತ್ತು ಎತ್ತರ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಸೇರಿಸಬೇಡಿ ಎಂದು ಸೂಚಿಸಲಾಗುತ್ತದೆ.
ಒಂದು ಗಮನಿಸಿ: ನೀವು ಈ ಗಾತ್ರದ ಸೂಚನೆಗಳನ್ನು ಆಫ್ ಮಾಡಿ ಮತ್ತು ಸಿಎಸ್ಎಸ್ನಲ್ಲಿ ಗಾತ್ರವನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸದಿದ್ದರೆ, ಬ್ರೌಸರ್ ತನ್ನ ಡೀಫಾಲ್ಟ್ನಲ್ಲಿ, ಸ್ಥಳೀಯ ಗಾತ್ರವನ್ನು ಹೇಗಾದರೂ ತೋರಿಸುತ್ತದೆ.
ಜೆರೆಮಿ ಗಿರಾರ್ಡ್ ಸಂಪಾದಿಸಿದ್ದಾರೆ