Imagine that you have just walked into an art gallery. The pieces of art hang on well-lit
expanses of white wall. There’s ample spacing between the works, so that each has its own
presence without any distraction from those adjacent. The rooms are very spacious and it’s
easy to find your way around the building. As you wander from room to room, you notice
that within each of these rooms the works of art relate to each other. You know that, behind
the scenes, a curator has put a lot of thought into the experience you have in this gallery
while viewing the art.
A gallery web site should be conceptually similar to a real-life gallery such as this.
You want to provide a clean, flexible space for your images to be displayed, with a
corresponding sense of order and cohesion.
Creating an Image Page
The web page that displays your photograph, along with a title and possibly a description,
is the equivalent of the expansive, blank walls in a real-life gallery.
Let’s walk together through a basic example of how to create an image’s page. We’ll
create the markup; add some style for the typography and colors of the images’ titles
and descriptions; style frames, margins, and layout; and provide the placement of the
navigational thumbnails.
Building a Basic Example
As always, our image’s page requires that we use well-structured markup:
photo.html (excerpt)
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
lang="en">
No comments:
Post a Comment