Dynadot — .com Registration $8.99

Need Tut/Help About PSD/HTML Combination

Spaceship Spaceship
Watch

thetzfreak

Established Member
Impact
19
Hey, everyone. I want to make a website for myself, and I know that the best way to do it is to use photoshop for the layout, then html for the content. This is what I need help on. Usually I make sites just using html, but they don't turn out as good. How do I make a psd version of a site template, then convert it to html? I've tried it before (with imageready actually), and it becomes just like a "box" in html, with a white background. I want to be able to edit it normally, and I want to learn how to do that.

Also, I've seen professional templates made that when one psd file is updated, the html updates by itself to look like the psd. How do I do that?

Thanks,
Ephi
 
0
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
Unstoppable DomainsUnstoppable Domains
Make a new image of the required size (800x600 or 1024x768), make a page as required. Now get the "Slicing Tool" and slice the image as you require... for example if there is an image then make a box around that image with slicing tool. Once you are done, go to file -> save for web. click the save button and under "save as type" choose HTML and images.

This will automatically cut up the images as you sliced them and generate and HTML that looks exactly like your original image in the browser.
 
0
•••
Hey, thanks for that. Am I supposed to put the body (the text) in photoshop or an html editor (frontpage)? The slices just make images, and I cannot add text to them in frontpage (after saving for web). I need there to be html text boxes in the photoshop for frontpage.

Thanks (ya I know that was pretty repetitive)
 
0
•••
bump
 
0
•••
You create an extra "slice" for the places where you wan't text. When you open it with dreamweaver/frontpage, you delete the slice in the middle. You can change the background colour of cells, and then type in it. A box with a border would consist of 5 slices, one top, one bottem, one left, one right, and one for the text. The one for the text is the image you delete later on in dreamweaver/frontpage.
 
0
•••
Sounds like you do not have experience in building website. First, you must know HTML.

What abdulmueid explained. Its from slice tool, after you convert it to html. View in source you see lots of <table>.
 
0
•••
HTML is useful, but it's not essential when WYSIWYG editors exist. There are 2 types of people - designers and coders...designers can't code well and vice versa.
 
0
•••
Thanks for replyings, guys; you're nice people :)
 
0
•••
Dynadot — .com Registration $8.99Dynadot — .com Registration $8.99

We're social

Unstoppable Domains
Domain Recover
DomainEasy — Zero Commission
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back