Photoshop and web design??

[brintonwhite]

First of all let me say I hope this question makes sense and also that I hope I can post it here.

Secondly, here is an example of what I am talking about, (I made it using various photoshop tutorials)
http://www22.brinkster.com/tallpox


Ok, here is the questions. [Could you please imagine some buttons going down the right hand side]. I made this in photoshop and am now wondering how make it interactive (buttons changing colour on mouseover) Do I have to slice it up or something and then put it into dreamweaver?

I would also like to have Different text appearing in the large, light grey area on the left when different buttons are pressed?

I know all these things can be done because I have seen things like this a million times. I can use dreamweaver a little and know how to put tables into a pge and buttons into the tables - no problem, but this combination of photoshop and dreamweaver has me very confused.

I hope you can help me out or point me in the right direction to tutorials.

Many thanks.

[DDD]

what you need to learn in Image Ready. This is a program that is already inside of Photoshop. And the answer to your woes is closer than you think. Actually in the help file within photoshop is some good stuff on Image Ready. Under the help menu open the help files then search for Image Ready. And that should get you going with relative ease. Not to complicate matters but you could be better servered doing this from fireworks since you are using DreamWeaver. The round trip editting is the bomb. Otherwise those help files will get you going. Then you can search the forum and the sticky post up at the top of this forum.

good luck and post again if you get stuck.

[ironikart]

Alternately, you can use photoshop slices and export as a html file ('save as web' option). This way you can edit the html in dreamweaver and just add rollover images. This takes a bit of stuffing around and imageready is just as good for rollovers.

Exported html from photoshop saves each slice as a seperate image layed out on a html table. Try slicing up your picture and see what happens. I uses slices alot.

[eilsoe]

me 2, I think PS and DW are great together :)

making rollover buttons in DW is just a matter of a few clicks with the mouse, never tried it the imageready way.. hmm..

[brintonwhite]

thanks guys, i'll look into all this

cheers

[teet]

i would definetly use imageready for simple rollovers...it can be really confusing at first (it took me a good hour to create my first rollover) but once you get the hang of it, you can do rollover effects on your navigation in 1-2 minutes. search this forum for "imageready rollovers" or something like that

the other cool thing about imageready, is that when you "save optimized as" it saves the file as an HTML file...thus, all you have to do is open up the html file in your favorite editor (like notepad!) and plug in your content.


I would also like to have Different text appearing in the large, light grey area on the left when different buttons are pressed?

you could do this using iframes, but it would probably be better just to have each button link to a new, almost duplicate page (the content in the box would be different of course).

-teet