Website Design in Photoshop?

[feri]

What do you guys think of creating the entire page layout in Photoshop then saving for web. Once this is done then slicing it up in image ready. Then using Dreamweaver to insert the image and adding the rest of the linking, frames etc.?? Any drawbacks to doing it this way?

 

[blueark]

It depends on the site. Many people create sites this way, and it certainly helps in terms of getting a basic layout.

The main problem I find is that the layout becomes too 'static'. In other words, sites might work well at one resolution, but at higher resolutions, there'll be a lot of blank space outside the page, and at lower resolutions (or smaller browser windows), part of the design might get cut off. Also, if you add HTML text into certain areas, some people with poor sight might force the text to enlarge and this might break the layout up.

Personally, I would use Photoshop & Imageready or Fireworks to create an 'ideal' layout, then I go through the HTML and make some parts of the table 'flexible'. For example, an area of flat color would become a single cell that doesn't have a fixed width/height. It's not easy, though, sometimes requiring a lot of trial and error, and certainly requiring a lot of testing in different browsers.

Having said all that, some layouts work quite well at a fixed size, and if that's the route you want to take, just be sure to fix the font sizes throughout.

 

[SPYDERIX]

I almost always create my page layouts in PS and then switch to IR to optimize and save the images. Then I code the page myself and stick everything together.

Like blueark said, it is a pain in the ass, to get everything to work properly, especially in all browsers. You just have to play around with it until it works.

Hope this helps!

NATE
design@spyderix-designz.com

http://www.spyderix-designz.com

 

[BDNFLNC]

I create most every page in PhotoShop first.

Better yet, at work I have a designer that creates them in PhotoShop. Then he drops me the PSD file and I cut the slices as I need them using ImageReady.

I don't let ImageReady build the HTML, I just cut the "Selected Slices" and save them in my images folder.

Same as what you are asking basically.

I have found this method to be extremelt efficient and easy. Especially when I need to change only one link in the nav maybe. All I have to do is open the file in ImageReady and I can adjust the slice and resave just that slice. Easy enough.

I never have problems building for all browsers. Things work really well and fit cohesively in MAC and PC versions of about 5 browsers. All in how you put the page together.

Of course, I build in pixels...not percentages. That may be some of it.

My boss just decided that I could start building 705 wide instead of our usual 605. After some hesitation...I gave in. Yay!

 

[briteyes]

Create in PS save as a psd, take it in Fireworks which is bundled with Dreamweaver anyway, This preserves the layers and allows for easier optiming and arraging on the page. Also future editing is easier in FW from Dreamweaver.