webmaster tools and all html editorsDesign Sphere Home
photoshop tutorials
html tutorials for beginners
html lessons for beginners
html tips for webmasters
about me
contact
professional banner design
low cost web site design
categorized programs
prize list
links

 

here are the sections and their content:

spherevisit

Webmaster Tools Section
to get the best html editors , graphic programs ,.......

spherevisit

Banner Design Section  to have your banner designed professionally and just for 15$

sphereWeb Design section is my web design service.I design professional and low cost web sites for your company.Also I design homepages.

sphereYou can find what program you want from catagorized Programs Section

spherelinks section contains links and webmaster resources.If you want to get listed put my small banner to your site and send e-mail

sphereA must visit part of my site is photoshop tutorials section.This section uptades every week.(now under construction)

sphereHtml Tutorials Section is the place you go through the steps and code a basic page.And Html Lessons Section is a course for you to learn the basics of html.

sphereAnd if you want to learn about me click the About Me link

CONTACT

 

Web Design

in this tutorial you will learn about giving link to an image and image map(image map=giving different links to parts of the same image)

first prepare an image for your pages menu; or you can use my basic menu pic for this tutorial

first define a map here is the code;

<map name="menu"><map>          ...then decide the shape I will only teach you the rectangular shape.here is   the code for this:

<area shape= "rect"coords="x,y,x2,y2"href="index.html">  ....and you must define the cordinates.x and y are the coordinates of the left top point of the first button and x2,y2 are the coordinates of the right bottom point of the button and href defines the url.

for example here is the code for my menu image:

<IMG src="menu2.gif" border="0"useMap="#menu" ismap>
<map name="MENU">
<area shape="RECT" coords="14,13,83,45" href="url.html">
<area shape="RECT" coords="14,79,83,108" href="url.html">
<area shape="RECT" coords="14,142,83,172" href="url.html"></MAP>

here is an example :

you can get the cordinates by following these steps in photoshop:

1.Open your menu image.hit window/show info .

2.move the mouse cursor to the top-left point of the first button the cordinates of this point will be x and y

3.move the cursor to the bottom-right of the button and the x,y will be the second points cordinates.then write them in the coords="x,y,x,y"

thats all!!

download this tutorial in a zip file!*!*!*!click!*!*!*!

(instructions.html,menu2.gif, are included)

Make your own free website on Tripod.com