Support for web authors
Graphics in SharePoint Designer and FrontPage: adding an image
to a web page
Each image that appears on a web page is a separate file - the web
page merely contains links to the image files, telling a web browser to display
a particular image at a particular point on the page. To add an image to your
page you must first place the image file on the web server and then create a
link to it from your page.
How to add an image to a web page
First, you need to import the image file into your website.
- From the File
menu choose Import, then File.
- When the Import window appears, click on the
Add File button.
- In the Add File to Import List window, set
Files of type to All files.
- Use the Look in drop-down list to find the image file on your
C: drive, or wherever you keep it. Select the file you want by clicking on
it, then click on the Open button. This adds your chosen file to the
Import window; click on the OK button and the files will be
imported into your website and will then be available for display on web
pages.
Note: you can import more than one file at a time by using CTRL-click
when selecting files.
Now, insert the image on your web page.
- Open your page for editing.
-
To add the image to your page, position the cursor where you want the image to
appear and from the Insert picture
menu choose Picture, then From File.
- Now find and select your imported image file, click on OK and the
image will be added to your page.
- You should always add alternative text for any image on your web
pages - this provides the pop-up caption you see in Internet Explorer when
you leave the pointer over an image; it also makes information about the
image available to visually-impaired users. To add alternative text:
- In SharePoint Designer you will be automatically prompted
to add 'alternate text' whenever you add an image.
- In FrontPage 2002, right-click on the image and edit the
picture's properties, then click on the 'General' tab at the top of the
dialogue box that pops up. Here you will see the 'Alternative
representations' - 'Text' field, where you can add your alternative text.
You can make further refinements to the way your image appears on the page in
the Picture Properties dialogue box. Particularly useful are the options
to align the image so that it sits either to the left or right of the
page, with text flowing around it. It's usually safest to align larger images to
the right, so that chunks of text are not left isolated below the image, as
shown below.
[Next: resizing images]
[Graphics in SharePoint Designer and FrontPage: contents]