Web Dev Roadmap for Beginners (Free!): [ Ссылка ]

Learn how to insert images in HTML. In this HTML5 image tutorial, you will learn about the img element and the attributes this HTML tag requires to display images on your web pages. You will also discover some good image resources along the way.

🚩 Subscribe ➜ [ Ссылка ]

🚀 This lesson is part of an HTML for Beginners tutorial series playlist:
[ Ссылка ]

🔗 Starter Source Code: [ Ссылка ]

📬 Course Updates ➜ [ Ссылка ]

How to Insert Images in HTML | An HTML5 Image Tutorial

(00:00) Intro
(00:05) Welcome
(00:25) Setup
(01:05) Image Files
(02:29) img element
(06:15) width and height attributes
(08:40) Insert a 2nd image
(11:34) Loading attribute and "below the fold"
(17:59) figure and figcaption elements
(19:58) Adding a 3rd image
(23:23) figure is not just for images
(25:50) Validate your HTML code
(26:52) Image resources

🔗 All Resources for this HTML Tutorial Series: [ Ссылка ]

⚙ Web Dev Tools:
Chrome Browser: [ Ссылка ]
Dark New Tab Chrome Extension: [ Ссылка ]
Visual Studio Code (VS Code): [ Ссылка ]
Prettier VS Code Extension: [ Ссылка ]
vscode-icons VS Code Extension: [ Ссылка ]
Github Themes VS Code Extension: [ Ссылка ]
W3C HTML Validator: [ Ссылка ]

📚 References:
MDN HTML: [ Ссылка ]
MDN HTML Elements Reference: [ Ссылка ]
HTML Entities Character Chart: [ Ссылка ]

🖼️ Image Resources:
Placeholder Image Generators:
[ Ссылка ]
Sites with Freely-Usable Images:
[ Ссылка ]
[ Ссылка ]
[ Ссылка ]
[ Ссылка ]
Image Editing / Resizing Software:
For Windows: [ Ссылка ]
As a Service: [ Ссылка ]
Suggestions for Mac:
[ Ссылка ]
Full Featured Editor for Windows/Mac/Linux:
[ Ссылка ]
Image Compression (shrink file size):
[ Ссылка ]

✅ Follow Me:
Github: [ Ссылка ]
Twitter: [ Ссылка ]
LinkedIn: [ Ссылка ]
Blog: [ Ссылка ]
Reddit: [ Ссылка ]

Was this tutorial about how to insert images in HTML helpful? If so, please share. Let me know your thoughts in the comments.

#html #html5 #images

свернуть