HELP! What is the best method to convert a PSD to an HTML page?
I have been given an important project and need to demonstrate my skill in designing a working web page from a PSD file.
What is the most efficient way or industry method of converting a PSD page created by someone and turn it into a functional web page (I have dreamweaver).
Do i have to slice the buttons in photoshop first and other content which may be used?
There are also form fields in the PSD file, that seem styled and fancy - how would i go on about creating useable forms?
Do I need to give the whole layout any divs? Or just convert it into an HTML & Images page then add links to the buttons which will be pictures that I Have sliced up?
I have a general idea but if someone who knows about this could assist me then that would be great.
slicing the whole matching template what you want to make clearly make the html and css
You need to clarify whether you are allowed to use the PSD merely as a guideline, or whether you are literally expected to build the page from it? Also, is the page required to be responsive? I.e.
1. If given the choice I would use the PSD as no more that a guide, but it is pointless doing that if you are tasked to build the page from it!
2. In either case, bodies of text should NOT be presented as images. They score badly as the web rating bots cannot read them!
3. If you are tasked to build the page from the PSD (Ugh), then I would suggest:
a) Identify all the elements that need to respond to user input, and crop each of them and save as JPEGs.
b) Blank out any bodies of text. These will need to be added as machine readable text.
c) Convert the PSD to a JPEG at a range of qualities, e.g.: 80%, 70%, 60% and 50%.
d) Do A:B comparisons of the JPEGs to the original at 2x magnification.
e) Choose the JPEG where the degradation of the quality is acceptable given the design criteria. (Some clients may require photo-realistic quality, others may prefer a quicker load time).
e) Save the JPEGs in case the client is not satisfied with the quality or load time achieved. You may then easily substitute as required.
4. Build the page using position:absolute. This will allow you to overlay text and graphics freely.
if you like i could built it for you
their is a lot of websites which is doing this job but i do automaticly converter from this website
Hi,Even I am looking for the same,thank you for the post,I got useful information through this post.
I am looking for the same information, the information thanks
Originally Posted by Digitalgarden
This could be one of my references
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)