ರಿಮೋಟ್ ಮೂಲಗಳಿಂದ ಚಿತ್ರಗಳನ್ನು ಸೇರಿಸುವ ಎಚ್ಟಿಎಮ್ಎಲ್ಗೆ ಸಂಬಂಧಿಸಿದ ಮುಖ್ಯ ಸಮಸ್ಯೆಯೆಂದರೆ ಅದು ನಿಧಾನ ಪುಟ ಲೋಡ್ ಸಮಯಕ್ಕೆ ಕಾರಣವಾಗಬಹುದು. ಏಕೆಂದರೆ ಬ್ರೌಸರ್ ಪ್ರತಿ ಚಿತ್ರಕ್ಕೂ ಪ್ರತ್ಯೇಕ ವಿನಂತಿಯನ್ನು ಮಾಡಬೇಕು, ಪುಟದಲ್ಲಿ ಬಹು ಚಿತ್ರಗಳಿದ್ದರೆ ಅದನ್ನು ತ್ವರಿತವಾಗಿ ಸೇರಿಸಬಹುದು. ಹೆಚ್ಚುವರಿಯಾಗಿ, ರಿಮೋಟ್ ಮೂಲವು ಡೌನ್ ಆಗಿದ್ದರೆ ಅಥವಾ ನಿಧಾನ ಸಂಪರ್ಕವನ್ನು ಹೊಂದಿದ್ದರೆ, ಇದು ಪುಟ ಲೋಡ್ ಮಾಡುವ ಸಮಯವನ್ನು ಇನ್ನಷ್ಟು ವಿಳಂಬಗೊಳಿಸುತ್ತದೆ. ಅಂತಿಮವಾಗಿ, ಚಿತ್ರಗಳನ್ನು ಬಾಹ್ಯ ಮೂಲದಿಂದ ಎಳೆಯಲಾಗಿರುವುದರಿಂದ ಭದ್ರತಾ ದೋಷಗಳ ಅಪಾಯವೂ ಹೆಚ್ಚಿದೆ.
<img src="https://example.com/image.jpg" alt="Example Image">
1. ಕೋಡ್ನ ಈ ಸಾಲು HTML ಇಮೇಜ್ ಟ್ಯಾಗ್ ಆಗಿದೆ, ಇದನ್ನು ವೆಬ್ಪುಟದಲ್ಲಿ ಚಿತ್ರವನ್ನು ಪ್ರದರ್ಶಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ.
2. "src" ಗುಣಲಕ್ಷಣವು ಪ್ರದರ್ಶಿಸಬೇಕಾದ ಚಿತ್ರದ URL ಅನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸುತ್ತದೆ, ಈ ಸಂದರ್ಭದಲ್ಲಿ ಅದು "https://example.com/image.jpg" ಆಗಿದೆ.
3. "alt" ಗುಣಲಕ್ಷಣವು ಚಿತ್ರಕ್ಕೆ ಪರ್ಯಾಯ ಪಠ್ಯವನ್ನು ಒದಗಿಸುತ್ತದೆ, ಈ ಸಂದರ್ಭದಲ್ಲಿ ಅದು "ಉದಾಹರಣೆ ಚಿತ್ರ".
img src ಗುಣಲಕ್ಷಣ
HTML ನಲ್ಲಿ img src ಗುಣಲಕ್ಷಣವನ್ನು ಚಿತ್ರದ ಮೂಲವನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ. ಇದನ್ನು ಒಳಗೆ ಬಳಸಲಾಗುತ್ತದೆ ಚಿತ್ರದ ಮೂಲವನ್ನು ವ್ಯಾಖ್ಯಾನಿಸಲು ಟ್ಯಾಗ್. ಈ ಗುಣಲಕ್ಷಣದ ಮೌಲ್ಯವು ಇಮೇಜ್ ಫೈಲ್ಗೆ ಸೂಚಿಸುವ ಮಾನ್ಯ URL ಆಗಿರಬೇಕು. ವೆಬ್ ಪುಟದಲ್ಲಿನ ಎಲ್ಲಾ ಚಿತ್ರಗಳಿಗೆ ಈ ಗುಣಲಕ್ಷಣದ ಅಗತ್ಯವಿದೆ, ಮತ್ತು ಇದು ಚಿತ್ರವನ್ನು ಪತ್ತೆಹಚ್ಚಲು ಮತ್ತು ಪ್ರದರ್ಶಿಸಲು ಬ್ರೌಸರ್ ಅನ್ನು ಅನುಮತಿಸುತ್ತದೆ.
HTML ನಲ್ಲಿ ಬಾಹ್ಯ ಚಿತ್ರವನ್ನು ಹೇಗೆ ಸೇರಿಸುವುದು
HTML ನಲ್ಲಿ ಬಾಹ್ಯ ಚಿತ್ರವನ್ನು ಸೇರಿಸುವುದು ತುಂಬಾ ಸರಳವಾಗಿದೆ. ನೀವು ಬಳಸಬೇಕಾಗಿರುವುದು src ಗುಣಲಕ್ಷಣವನ್ನು ಬಳಸಿಕೊಂಡು ಚಿತ್ರದ ಮೂಲವನ್ನು ಟ್ಯಾಗ್ ಮಾಡಿ ಮತ್ತು ನಿರ್ದಿಷ್ಟಪಡಿಸಿ. HTML ನಲ್ಲಿ ಬಾಹ್ಯ ಚಿತ್ರವನ್ನು ಸೇರಿಸುವ ಸಿಂಟ್ಯಾಕ್ಸ್ ಈ ರೀತಿ ಕಾಣುತ್ತದೆ:
ಅಲ್ಲಿ "image_url" ಚಿತ್ರ ಫೈಲ್ಗೆ ಲಿಂಕ್ ಆಗಿದ್ದರೆ ಮತ್ತು "ಪರ್ಯಾಯ ಪಠ್ಯ" ಚಿತ್ರದಲ್ಲಿ ಏನಿದೆ ಎಂಬುದರ ವಿವರಣೆಯಾಗಿದೆ (ಪ್ರವೇಶಿಸುವ ಉದ್ದೇಶಗಳಿಗಾಗಿ).
ಉದಾಹರಣೆಗೆ, ನೀವು my-image.jpg ಎಂಬ ನಿಮ್ಮ ವೆಬ್ಸೈಟ್ನಿಂದ ಬಾಹ್ಯ ಚಿತ್ರವನ್ನು ಸೇರಿಸಲು ಬಯಸಿದರೆ, ನಿಮ್ಮ ಕೋಡ್ ಈ ರೀತಿ ಕಾಣುತ್ತದೆ: