Websites with Photoshop

[Imoddedu]

Alright so I've made this "template" I guess in photoshop. I've heard that you can slice it up somehow to make it into some HTML code or something along that line. Does anybody know how to do that?

[KILLA-COW]

Dreamweaver, i'm sure there's ways you can procure this program if you are short on money....

[Surfa]

What has Dreamweaver got to do with it.


Basically you need to use the slice tool to outline all the different parts you want to be separate images then you can do a file save for the web and choose html and images.



Edit: This is not recommend though as it creates messy code and sometimes it can be easier to slice them up then write the code yourself.

[Imoddedu]

Ok thanks. Do I need to slice the gradients on the left and right and all that?

[Surfa]

Well you could but I wouldn't because I would make it the background image.

[BlekksPoncho]

Wow don't. Learn HTML and CSS, photoshopped sliced websites are disgusting and also I would change the design a bit, the links are a bit eurgh.

[Ennui]

You can slice it just to get the images you need and then code them in manually, professional web designers slice their stuff in PS all the time, they just don't use pre-generated code...

[Imoddedu]

Yea, I wasn't planning on just slicing it. I know HTML & CSS so I'm good.

[Imoddedu]

How do I slice those buttons? They are sideways and the box doesn't fit them.

[KILLA-COW]

Becuase dreamweaver does it all for you you smartarse?

[Surfa]

Becuase dreamweaver does it all for you you smartarse?

Really, oh damn I must have missed the big button that makes a site from image.

But seriously if dreamweaver does do it all for you then visual studio does all the coding for you.

[abathor]

Fuck Dreamweaver, learn how a website is actually constructed, including valid XHTML and CSS, then write it and add in the images yourself via image tags and css background properties. Your diagonal links are probably not going to work very well, I'd suggest making them horizontal. Not everything on your webpage needs to be an image you know, especially if search engine optimization and accessibility are a goal, which I'm guessing you aren't so bothered about.

[mky]

^^^

Dreamweaver ftl.

[abathor]

^^^

Dreamweaver ftl.

All you need to make a website is Photoshop and notepad++, and a copy of various web-browsers to check it works.

If all the graphics have been supplied and your html and css is up to scratch then technically you could make one in MS notepad.

[Dr. Delta]

What has Dreamweaver got to do with it.


Basically you need to use the slice tool to outline all the different parts you want to be separate images then you can do a file save for the web and choose html and images.



Edit: This is not recommend though as it creates messy code and sometimes it can be easier to slice them up then write the code yourself.

This just makes tables with background images. Not (really) usable for decent websites.