The HTML and CSS Blog:

Posts in category Level 4: Images

Mastering HTML Images

Learn HTML with Song Level 4: Images

You may have noticed that we’ve divided our tutorials into sections. This can help you track your mastery as you work your way through our course. If you’ve been following along with our new posts, this month you mastered adding all kinds of images to your HTML posts. If that’s you, congrats! Have a fancy […]

The New Figure Tag Lets You Relate Im...

The HTML figure tag

You will learn how to use the new HTML5 figure and figcaption tag to contain pictures and their captions.

But wait, we already have an img tag, what do we need

for? The
tag is meant to contain pictures and their related captions. It’s a way to organize your page content by grouping together captions and their related images.

The Favicon: Create an Icon for Your ... is a favicon generator that lets you crete your own favicon by drawing or using photos

What You Learn in This HTML Lesson In this HTML post you’ll learn how to make a favicon—that little icon next to the url. You’ll learn how to install the new favicon on your site. I’ll also point you in the direction of some useful favicon galleries in case you don’t want to take the […]

SVG graphics

SVG graphics are scaleable vector graphics

I’m really excited about using images in the SVG format because they solve a lot of problems with making your images look great on devices of any size and resolution. This post is all about SVG: Why, how and when to use scaleable vector graphics.

Preparing Images for the Web

This flat graphic image of a cat has been saved in the GIF format, which is ideal for simple, flat graphics

This lesson will help you prepare an image for use on your web page. You may want to use an image editing software program to adjust size, crop, and compress your picture before placing it into your web page with the HTML image tag ().

Creating Accessible Websites

judmental parental cat looks down debutant kitty

In this HTML lesson you’ll learn about how we use alt and title attributes to make images more accessible. We’ll talk about why giving your images title attributes and alt attributes improves both web content accessibility and search engine optimization. We’ll also cover some other basic accessibility standards and offer some resources that let you test just how accessible your site is.

The Image Tag: Insert a Picture in Yo...

The HTML image tag

What You Learn in This HTML Lesson In today’s HTML lesson, you’ll learn how to use the mighty image tag ( <img> ), which allows us to put all those lovely pictures on the Internet. You’ll learn about the image tag’s many fine attributes, which make it such a long and cumbersome tag to write out. I’ll […]

HTML Lessons

©2013 Diane Presler. All rights reserved.