Using Graphics On Your Own

Including images in your site and controlling their layout with CSS, as you learned to do in this lesson, can increase the visual impact your site has upon visitors .

You'll need to select, edit, and optimize your images with an image-editing program. Consider the content of each image when deciding whether to go with GIF, JPEG, or PNG.

Use the techniques you practiced in this lesson to insert graphics into the pages in your own site.

As you incorporate the images, create CSS styles to control placement of the visuals.

Keep the accessibility issues discussed at the beginning of this lesson in mind when you are integrating images into the site.

What You Have Learned

In this lesson, you have:

Used background image (pages 171174)
Placed images with accessibility attributes in the page (pages 175180)
Resized images and reset them to their original dimensions (pages 180181)
Positioned images (pages 182183)
Added a border around an image (pages 184185)
Assigned names and alt attributes to images (page 185)
Used the Assets panel to manage images in the site (pages 186189)
Managed images with the Favorites List (pages 190191)
Adjusted the space around images (pages 191192)
Inserted an image placeholder (pages 193195)
Cropped an image (pages 196197)
Adjusted the brightness and contrast of an image (pages 198199)
Created an image map (pages 200204)

Lesson 6. Creating Tables

Tables allow you to present information in an organized manner; they contain rows and columns that intersect to form cells in which you can place content. Cells can then be merged to create larger cells . Tables can be used to present a wide variety of content, from tabular data that needs to be presented spreadsheet style to visual treatments with combinations of graphics and HTML text.

Tables can be used to control layout. By arranging content within table cells, you can place objects in specific locations on a page and create more complex visual arrangements. Tables were one of the HTML elements that initially gave designers and developers control over the layout of their sites. Keep in mind, however, that using CSS (Cascading Style Sheets) can be a better method of developing the layout and design of a page because it provides a wider number of layout choices and appearance options while

In this lesson, you'll create tables that contain text and graphics while learning how to augment layouts with tables and use them in conjunction with CSS.

giving designers and developers a better control over the look and feel of the entire site. Table-based layouts are generally more restrictive ; you can achieve a greater degree of flexibility with CSS. Additionally, CSS is more efficient, more accessible, and meets the current standards of Web development as defined by the W3C. Because support for the latest CSS can be limitedolder browsers in particular have poor support for CSStables can still be useful. As a result, and considering that many older sites that you might work with are likely to use tables for design purposes, it is important to understand the concepts and techniques of table-based layout.

If you want to view the final result of this lesson, open index.html from the Completed/Schedule folder within the Lesson_06_Tables folder.

What You Will Learn

In this lesson, you will:

Learn how to create tables to control the layout of your pages
Modify the table properties, including border, background, spacing, color , alignment, and size
Create accessible tables
Import tabular data from spreadsheets
Modify a table by adjusting rows and columns
Sort a table
Export a table
Determine the optimal size of your layout
Create your page design using Layout mode
Import a tracing image