Converting PSD to (Functional) html

Discussion in 'HTML & Website Design' started by jpinheiro, Aug 16, 2008.

Thread Status:
Not open for further replies.
  1. #1
    I need help like a tutorial on how to make a psd into an html document.


    I have a PSD Web Document i designed and need to convert it to the html
     
    jpinheiro, Aug 16, 2008 IP
  2. C a s p e r

    C a s p e r Peon

    Messages:
    313
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I to would like to know more one this. As I dont have the macromeda program in the tutorials I have seen
     
    C a s p e r, Aug 16, 2008 IP
  3. nicangeli

    nicangeli Peon

    Messages:
    828
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    0
    #3

    It's not as simple as you may think, and there won't be a tutorial that will explain how to code YOUR photoshop document.

    Each .psd to .html conversion will differ, it takes a good understanding of HTML and CSS to be able to do this.

    If you want, post a screenshot of the .psd and I am sure somebody will give you the basics...
     
    nicangeli, Aug 16, 2008 IP
  4. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #4
    Well, 99% of the time if you have a PSD and not HTML, IMHO you are working backwards.

    But that's me.

    When I DO end up having to work from some goof assed painting done by a so-called 'designer' the first thing I do is just figure out what content there is, mark it up in semantic HTML completely ignoring what it it going to look like, then bend that markup to my will creating the layout in CSS (without the fancy graphics) - then and ONLY then do I go into a paint program to create the images that will be hung upon it ... which 99% of the time means using the PSD only as a rough guide since 'traditional' image slicing methods is the same as forcing your page down on it's knees in front of a donkey.

    Hence why I think starting from a PSD is for retards.
     
    deathshadow, Aug 16, 2008 IP
  5. CharlesHurst

    CharlesHurst Peon

    Messages:
    29
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I'll do it for you if you want to pay me. ;)
     
    CharlesHurst, Aug 16, 2008 IP
  6. almondj

    almondj Peon

    Messages:
    768
    Likes Received:
    11
    Best Answers:
    1
    Trophy Points:
    0
    #6
    Slice it into the desired images you want using the slice tool ("K" I believe.) Then save for web and from the options/drop down makes sure HTML and Images is selected.

    (It may not read "HTML and Images.")
     
    almondj, Aug 16, 2008 IP
  7. bloodvanille

    bloodvanille Greenhorn

    Messages:
    27
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #7
    If you want to convert to HTML, i suggest you get Dreamweaver and learn positioning in dreamweaver.
     
    bloodvanille, Aug 16, 2008 IP
  8. blueparukia

    blueparukia Well-Known Member

    Messages:
    1,564
    Likes Received:
    71
    Best Answers:
    7
    Trophy Points:
    160
    #8
    I suggest doing the opposite what bloodanille said.

    Listen to Deathshadow. Make a rough HTML and CSS sketch first, then start throwing in images.
     
    blueparukia, Aug 16, 2008 IP
  9. psychotronic

    psychotronic Peon

    Messages:
    133
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #9
    you can use adobe image ready as a start. It will produce an html output from psd file
     
    psychotronic, Aug 17, 2008 IP
  10. risoknop

    risoknop Peon

    Messages:
    914
    Likes Received:
    24
    Best Answers:
    0
    Trophy Points:
    0
    #10
    Listen to deathshadow. He knows his stuff.

    You should start with a layout and content placement first and then when you already know what will be where you should make the PSD file...

    But in your case it will be best if you start with some basic CSS layout and slowly start modifying it, adding there images, colors until you get the desired looks.
     
    risoknop, Aug 18, 2008 IP
  11. salihpk

    salihpk Banned

    Messages:
    689
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Its not easy.You can slice the PSD file and save it as html.But its not professional and latest.
     
    salihpk, Aug 18, 2008 IP
Thread Status:
Not open for further replies.