How to Create an Interactive Graphic on Your Website

When you are building a new website you will want to make it as interesting for visitors as possible. The site's appearance is one part of this, but it is also good to move beyond standard navigation buttons by turning graphics into clickable hyperlinks. These links can take the visitor on a tour of the site, or to a video explaining it. To make your graphics clickable you will need Adobe Photoshop and a web editing program like Expression Web that can create layers.

Instructions

    • 1

      Load the graphic you want to use onto your computer either by scanning it in or transferring from a storage media like a CD, SD card, flash drive or digital camera.

    • 2

      Open Photoshop. Select "File" and click "Open." In the dialog box browse to the graphic you loaded and open it.

    • 3

      Select the "Slice" from the toolbar and begin slicing your graphic into clickable sections. Name each slice, even the ones you don't plan to make clickable hyperlinks.

    • 4

      Select "File" and click "Save for Web or Devices." In the dialog that opens name your file, select a location to save to and save the slices as JPEG files.

    • 5

      Open Expression Web. Select "File" and click "Recent Web." Select the website you want to work on and open it.

    • 6

      Select the particular page you want to add the graphic to from those listed.

    • 7

      In the "Layers" panel click on the "Add Layers" icon. Click inside the layer. Go to "Insert" and browse to the images you created. Select one and it will be inserted inside the layer. Place it where you want it. Repeat this to add the other parts of the design.

    • 8

      Right-click on each slice that you want to create a hyperlink for. In the dialog select the page, graphic or file you want to link to. Save your work.

Related Searches:

References

Comments

You May Also Like

  • How to Create Interactive Ebooks

    Ebooks or electronic books are available to read or download online, either for free or for payment. They contain elements that the...

  • How to Create an Interactive Timeline

    Interactive timelines can be the perfect way to relate a large amount of information in an easily comprehensible format to your audience--particularly...

  • 3D Graphic Designer Programs

    3D Graphic Designer Programs. Three-dimensional graphic design is the use of 3D objects in interactive media for entertainment and educational purposes. In...

  • How to Create Interactive Presentations for Students

    Microsoft PowerPoint is a versatile, powerful application that provides myriad ways to create interactive presentations for students. PowerPoint's user-friendly ...

  • How to Create Interactive Newsletters

    By creating an interactive newsletter, you can report important information to your organization members. Interactive newsletters also provide organizations with a ...

  • How to Create an Interactive Web Calendar

    Businesses and social groups often look for ways to stay in touch with each other through an interactive web calendar. Planning becomes...

  • How to Create Graphic Art

    A graphic element can enhance the message of written copy in an advertisement, newsletter, flyer, web page, or most any media. You...

  • How to Make an Interactive Magazine

    Just exporting your magazine as a PDF file to duplicate what could appear in print ignores all of the interactive capabilities available...

  • Interactive Whiteboard Graphing Activities

    Interactive Whiteboard Graphing Activities. Statistical graphing in a classroom is traditionally done with paper and pencil, with students reading information from ...

  • How to Make a Free Interactive Website

    Free webhosting services give novice web builders the opportunity to explore the possibilities that owning a website can offer. These webhosting services...

Related Ads

Featured