Photoshop CS5: The Missing Manual

Creating Web-Page Mockups and Image Maps

As you've learned throughout this book, Photoshop is an amazingly powerful image editor, which means it's great for designing web pages. In fact, Photoshop has a tool that'll let you slice your design into Web-friendly pieces that, when clicked, lead to whatever web address you want to link them to. Photoshop churns out the proper code that you can paste into your own web page using your favorite HTML editor.

But does all that mean you should use Photoshop to build a website? Heck, no. Remember how back in Chapter 14 you learned that, even though Photoshop has a powerful text tool, you shouldn't use it to create a book? The same principle applies here. While you could use it to build real web pages, you shouldn't; you're much better off using a program designed for the job, like Adobe Dreamweaver. That said, the Slice tool comes in really handy in a few situations:

• Building a website prototype. If you've designed a website for a client in Photoshop and want to give him an idea of how the site will look and behave, you can use the Slice tool to get it done fast. If you slice up your design and assign different hyperlinks to navigation bars, you can give your client a good idea of how the navigation in the final website will feel.

• Making an image map. If you want to add hyperlinks to certain portions of a single image, you can do it with the Slice tool.

• Making an image-heavy page load a little faster.Chopping images into pieces makes them load ...