Trying Out Images and Tables

In this lesson you'll learn the basics of using images and tables, so you can display visual information and table-shaped data. This is for people searching "HTML img alt" or "HTML how to make a table."

<img src="URL" alt="description"> displays an image. alt is fallback description text for when the image can't be loaded, and it's an important attribute for SEO and accessibility too. A table is built by lining up <tr> (rows) and <td> (cells) inside a <table>.

The sample code builds an image with an <img> tag, and a list of names and scores with a <table> tag. <th> is a tag representing a header cell — using it in the right place alongside <td> (an ordinary cell) makes the table's structure more semantically correct.

A common beginner stumbling block is forgetting the alt attribute. Without alt, no information at all is available when the image fails to display, and it also gets in the way of people with visual impairments who use screen-reader software to understand the content. It's worth remembering the distinction: for purely decorative images, an empty alt="" is the right choice.

A table is well suited for displaying data organized into rows and columns, like a report card or a timetable. That said, using a table purely for layout purposes is avoided in modern web development — it's basically meant for displaying table-shaped data.