Author Topic: Web Design Question.. (Read 334 times)

rabbidrabbit · « **on:** September 27, 2004, 06:35:27 PM »

OK,

Say I have a Photoshop Template of a page which I like. How do I get the rather large image to be of any use? Is there a way to import into Dreamweaver and use it as a background then place objects and fields on top of it? Or is it pretty much useless since its just one big image, or a collection of images as a .PSD...

Gunslinger · « **Reply #1 on:** September 27, 2004, 06:55:15 PM »

If you are using adobe Potoshop 7.0 or greater (i think) you should be able to export that to Adobe Image ready.

Image ready is a pretty cool proggie that can creat the page and write all the HTML required for it.

You kinda have to know what you are doing because, for instance, if you have a solid back round color it will make that one big JPG or GIF instead of using HTML wich loads way faster.

Also if you want any text IE articles or something add them in after the fact with an HTML editor after you make the template.

Banners and Buttons are ok though.

Eagler · « **Reply #2 on:** September 27, 2004, 07:04:58 PM »

in dreamweaver right click anywhere on your new blank page/template and click "page properties.."

choose your graphic as "background image"

problem is page/site loading times for ppl with slower connections ...

rabbidrabbit · « **Reply #3 on:** September 27, 2004, 08:00:29 PM »

OK,

Once I figure out Imageready it might be the trick. Straight saving it is about 320kish atm but I'm pretty sure I can parse it down. Thanks for the pointer.

Gunslinger · « **Reply #4 on:** September 27, 2004, 08:11:00 PM »

Quote

Originally posted by rabbidrabbit
OK,

Once I figure out Imageready it might be the trick. Straight saving it is about 320kish atm but I'm pretty sure I can parse it down. Thanks for the pointer.

Seriously though once you have a template THEN go back and scale things down.....IE backround color and such.

Also, a little tip when making templates in photoshop. USE SEAMLES textures and such.

IR will set up the page as a table with a bunch of different cells. You can reduce size on solid colors by taking a 1pixal x 1 pixal image of the color you want and setting it (in the cell/table you wish) as the "backround image". You can do the same thing with setting a "backround color" as well and using seamless texture images.

rabbidrabbit · « **Reply #5 on:** September 27, 2004, 08:40:19 PM »

what do you mean by "seamless " texture images?

Saintaw · « **Reply #6 on:** September 28, 2004, 10:34:33 AM »

Hiya DadRabit

I recommend you take a look at the tutorials here (most are videos or flash animated tutorials...very easy)

http://www.cbtcafe.com/dreamweaver/index.htm

Don't use a full sized image in the background, it will take ages to load, instead, use Photoshop/Fireworks or another software that will let you cut your image into table cells (well, cell contents realy... but you get the meaning).

I'm no designer, am a coder... but I do this on regular basis. Shoot me the file by email (saw AT onpoi.net) I'll send you back a sample.

Edit: I'm a git... there's not tutorial on slicing there... but nonetheless a good tutorial site to keep in mind

Here's a slicing tutorial: http://graphicdesign.about.com/library/tutorials/imageready/blslice.htm