Images and Media on the Web

Images, audio, and video can make a web page more interesting and easier to understand.

Basic Image: JPEG

This is a JPEG image. JPEG is often used for photos because it can show many colors.

A landscape with trees and mountains
JPEG image: good for photographs and colorful images.

Image Link: PNG Example

This image is inside a link. Click the image to visit Unsplash.

A laptop computer on a desk

PNG image label: PNG is good for graphics, logos, and images with transparency.

Aligned Image in Text

A person using a laptop

Images can be aligned with text using CSS. This image floats to the left, and the text wraps around it. This is useful when a web page has articles, news, or blog posts with pictures.

Good image styling includes border, padding, margin, and clear spacing around the image.

GIF and Custom Bullet List

GIF files can be used for simple animation. Custom bullet images can also make a list more visual.

GIF label: GIF can support simple animation.

Audio Example

Audio can be added to a web page with the HTML audio element.

Video Example

Video can be added to a web page with the HTML video element.