TeamPhotoshop
Reviews, updates and in depth guides to your favourite mobile games - AppGamer.com
Forum Home Latest Posts Search Help Subscribe

Newbie Question - creating a webpage

Page: 1 Reply
Oct 6th 2005#170737 Report
Member since: Oct 6th 2005
Posts: 2
Can someone help please

Im using Photoshop CS2 and ive had some web pages made up for me (www.rightmove360.com if anyone wants to have a look) and im trying to make some changes to them.

The guy who made them has given me a bunch of PSD files, which is fine, but when i try to save as a web page everything, including the text, is saved as a jpg.

I need to add some animation, hotspots, code, etc to the pages, is there any way I can get these files into an app (dreamweaver or something) where I can do this?

If anyone can point me in the right direction it would really help me out
Thanks
Steve
Reply with Quote Reply
Oct 7th 2005#170742 Report
Member since: Jul 15th 2001
Posts: 2019
slice up the sucker and save it in image ready? i kinda forget...haven't done it in awhile.

or if the psd's are already sliced up, which i imagine they would be, then just change whatever u need to change through that. coding u can just use any text editor, i used to use notepad or something.
Reply with Quote Reply
Oct 7th 2005#170744 Report
Member since: Oct 6th 2005
Posts: 2
Thanks, i got everything in imageready exactly how i would want my page, but how do i get from there to a web page without saving each section as a jpg and recreating the page in html.

Is there not a simple way of going from imageready to web page? im new to all this, dont forget!

PLEASE
Reply with Quote Reply
Oct 8th 2005#170765 Report
Member since: Apr 19th 2005
Posts: 80
I don't know anything about webpages, but I can tell you that animations can't be saved as a .jpg : they must be .gif . Everybody will be able to tell you this, but I couldn't resist :D .
Reply with Quote Reply
Oct 8th 2005#170766 Report
Member since: Oct 8th 2005
Posts: 32
[QUOTE=bon111]Is there not a simple way of going from imageready to web page? im new to all this, dont forget!

PLEASE[/QUOTE]
no. making a good website isn't supposed to be a simple process.

code generated from imageready is garbage; flat out garbage. it's not flexible @ all, so the moment you try to change the html it goes fubar'd.
Reply with Quote Reply
Oct 9th 2005#170771 Report
Member since: Oct 9th 2005
Posts: 1
Hello... what program are you uploading with ... if you are using DREAMWEAVER you can download the plug-in ... dreamweaver will take the files from ImageReady and put it all 2gether 4 you with the click of a mouse... i use dreamweaver mx 2004
Reply with Quote Reply
Oct 9th 2005#170782 Report
Member since: Oct 2nd 2005
Posts: 9
You'll have to forgive me as I took only one multimedia course in graphic design. But my understanding is this. Creating a web page is a 3-step process. Design first with Photoshop. At this point, everything is static.

When that's done, open ImageReady, and do your slices. Now slices serve several useful purposes. Here are 3:

1) Optimization: A slice with pure text can be optimized as a gif with very few colours. This saves on memory, and contributes towards a faster-loading webpage. Not a big deal for cable/dsl users, but many people are still stuck with dialup.

2) Rollovers: It's what you see on the left navigation bar of your webpage. As soon as your cursor "rolls over" one of the links, the box becomes a darker shade of blue. This is easy to pull off with ImageReady.

Basically, there are 2 versions for each box. A lighter and darker-coloured one. In its normal state, the box is lighter. In its rollover state, the box is darker. It's just a matter of setting up the rollover state.

Let's take "Virtual Tour" for instance. Have your "Web Content" window open and make sure you have the box slice selected. Click on that little arrow in the upper right corner, and choose "New Rollover" state. At that point, turn off the visibility for the layer that corresponds to the lighter-coloured box, and turn on the visibility for the darker-coloured box. (In its normal state, it should be just the opposite.)

There you have it. You apply the same concept for every single slice you want affected.

3) Links: Create a slice for every piece of text or image you want linked. Then you can save your file, but not as a jpg. Go to File --> Save Optimized as... and select HTML and Images from the Format drop-down menu. I would suggest you preview your page before proceeding though (an option at the bottom right corner of your toolbar). Just to make sure everything is in order.

Then you'll need to use a webpage program like Dreamweaver to enter the actual links. From there, you can click on your link slices, and enter the URLs in the Property window.

All in all, most of the work is done in Photoshop/ImageReady. If you play around too much in Dreamweaver, your page will turn out buggy. Like Derek said, the code generated from ImageReady isn't that flexible.
Reply with Quote Reply
Oct 9th 2005#170786 Report
Member since: Mar 18th 2001
Posts: 1604
Ok, you need to take a few steps back. you're starting with "I have the parts, how do i fix my car?" but you have no idea how the car works.

Check out all the HTML basics articles at webmonkey and get a feel for how the page is put together. Then come back and ask some q's about changing out the graphics, it'll all make a lot more sense.

chris
Reply with Quote Reply
Page: 1 Back to top
Please login or register above to post in this forum