HTML for WordPress Users, Part 2: Images and Tables

This is Part 2 of a three-part series. Start with Part 1: Basic HTML.

Images

An image is placed on a page with the img tag. Most of the time you’ll use WordPress’s Image block (or the Add Media button) — that does two things for you:

copies the image file from your computer to your site’s server, and
writes the HTML img tag that displays it.

Once a file is uploaded you can reference it with an img tag anywhere, so the same image can appear in several places:

<img src="/wp-content/uploads/2026/fireworks.jpg" alt="Fireworks over the river" />

The alt text describes the image. It’s read aloud by screen readers, shown if the image fails to load, and used by search engines — so write a genuine, relevant description.

Note the / before the closing >. An img tag is self-closing, and that slash is the signal.

Image paths can be absolute or relative:

https://yoursite.com/wp-content/uploads/2026/fireworks.jpg
/wp-content/uploads/2026/fireworks.jpg

Both point to the same file — the relative version just means “relative to the root of this website”.

Special characters

Some characters need a special code (an HTML entity) so they display correctly:

copyright © — ©
registered trademark ® — ®
less-than < and greater-than > — < and >
ampersand & — &
non-breaking space —  
em dash — — —

Tables

Tables are handy for laying out data in rows and columns. (For page layout, use the editor’s columns rather than a table — tables are for tabular data.)

The building blocks:

the whole table is wrapped in <table> … </table>
each row is a <tr> … </tr>
each cell is a <td> … </td>

A simple two-column table:

<table>
  <tr>
    <td>Day</td>
    <td>Task</td>
  </tr>
  <tr>
    <td>Saturday</td>
    <td>Walk the dog</td>
  </tr>
  <tr>
    <td>Sunday</td>
    <td>Feed the cat</td>
  </tr>
</table>

which produces:

Day	Task
Saturday	Walk the dog
Sunday	Feed the cat

For a proper data table, put your column labels in a header row using <th> cells instead of <td> — it’s clearer for readers and for screen readers.

Borders and spacing

Modern table styling is handled with CSS rather than old HTML attributes. Most themes already style tables sensibly. If you want to adjust borders or spacing, do it with a few CSS rules (see Part 3: Divs and CSS) rather than adding border attributes to the tags.

Next: Part 3 — Divs and CSS.