From PSD to HTML

Discussion in 'HTML & Website Design' started by 13-year old blogger, Mar 15, 2008.

  1. #1
    Guys I heard that I need to create a psd file and then slice and name the parts. I've did that and saved the theme for web. Now I can open the theme in a text editor but I'm completely lost of what should I do next. For the best support I'll give 2$ via paypal :) Sorry for the dummy questions, but I'm very interested in learning how to code my theme up. Try adding me to gtalk as

    Thanks for anyone that replies.
     
    13-year old blogger, Mar 15, 2008 IP
  2. highhobbiescom

    highhobbiescom Peon

    Messages:
    392
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Ask a designer here to do a PSD to HTML chop for you. But $2.00 isn't worth opening the file. Good luck.
     
    highhobbiescom, Mar 15, 2008 IP
  3. 13-year old blogger

    13-year old blogger Banned

    Messages:
    103
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    nope I won't spend 60$ for a easy task. I already know how to code a theme :) Anyone want to get hes coded for free? pm me and we'll see what can I do.
     
    13-year old blogger, Mar 15, 2008 IP
  4. 13-year old blogger

    13-year old blogger Banned

    Messages:
    103
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #4
    offer over :D
     
    13-year old blogger, Mar 15, 2008 IP
  5. roje0913

    roje0913 Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    This is a good reference for you to use: http://www.psdtohtml.com/
     
    roje0913, Mar 15, 2008 IP
  6. FunkyFresh

    FunkyFresh Peon

    Messages:
    499
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    are you offering free coding?
     
    FunkyFresh, Mar 15, 2008 IP
  7. Spider-Man

    Spider-Man Banned

    Messages:
    2,684
    Likes Received:
    211
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Just so you know, nobody would work for anything less than $5 an hour here, and even that is the most desperate of prices. A full PSD to HTML theme would take more than an hour, to say the least.
     
    Spider-Man, Mar 15, 2008 IP
  8. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #8
    And makes your site a gazillion times bigger than needed so folks on dialup can wait a month before your 1Mb PSD loads as a web page : )
    You can but you don't need to do it this way and it's not even recommended.
     
    Stomme poes, Mar 15, 2008 IP
  9. FunkyFresh

    FunkyFresh Peon

    Messages:
    499
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #9
    so what is the recommended way?
     
    FunkyFresh, Mar 15, 2008 IP
  10. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #10
    You take your content, and mark it up with well structured, semantic and well formed (x)html, then apply css rules to define the presentation. Slicing and dicing is a holdover from table layouts and is only very rarely needed for modern coding methods.

    cheers,

    gary
     
    kk5st, Mar 15, 2008 IP
  11. blackE36

    blackE36 Peon

    Messages:
    53
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Don't slice it in photoshop if you're planning on doing any SEO. Tables are horrible for so many reasons and you can find a really good XHTML/CSS coder on here. I've found a couple coders on here so let me know if you need a recommendation.
     
    blackE36, Mar 15, 2008 IP
  12. SitPoMk

    SitPoMk Peon

    Messages:
    457
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #12
    Took the words right out of my mouth (fingers?) :D

    The slice into tables approach is outdated, slow, unprofessional, and doesn't coincide with standards these days. Also, as said already, its horrible for SEO as the technique assumes your text will be an image file. (not the main text of course, but nav bars and headers and that type of stuff)

    CSS is the way to go. Read up on it and get a good designer. (and pay him more than 2 bucks :D)

    Best of luck ;)
     
    SitPoMk, Mar 15, 2008 IP
  13. FunkyFresh

    FunkyFresh Peon

    Messages:
    499
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #13
    well you will still need to slice in photoshop, I think what was misinterputed was that you will still end up slicing in photoshop to get the look you want, but just dont let photoshop do the coding for you. I think thats what people mean at least
     
    FunkyFresh, Mar 16, 2008 IP
  14. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #14
    Nope, I mean you don't do slicing and dicing, period. It is not needed. You use Photoshop and other graphic manipulation applications to create/modify graphic elements that will be used in web pages. You do not bind your pages to the graphics; the graphics are supplemental.

    cheers,

    gary
     
    kk5st, Mar 16, 2008 IP
  15. SitPoMk

    SitPoMk Peon

    Messages:
    457
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #15
    Well what I do is creat a whole mock-up of the site in photoshop. Because it's simple to rapidly create the look you want like that and I assume most people do the same thing.

    Then after that, I don't even dare touch the slice tool. I manually extract things out of the mock-up such as a strip for the background, gifs for the buttons, and maybe whatever my creative mind could think of. Except almost all images backgrounds, I almost never use images as text.

    For buttons in nav bars and such, I have a single file that is a "button background" and I use HTML to put text over the button background.
    wow i hope im not talking too much and confusing everyone

    bottom line - i create a mock-up and just base my CSS design off that. Trying to get it as close to the mock-up as possible. and no text as images, except for probably the logo n stuff.

    -Sasha
     
    SitPoMk, Mar 16, 2008 IP
  16. chouxpastry2002

    chouxpastry2002 Well-Known Member

    Messages:
    365
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    103
    #16
    lol there are ample of tutorials available on the internet for conversion of PSD to CSS/XHTML just google for some i m sure you will get some good ones if not pm me i ll give you some good informative sites.

    Sam.
     
    chouxpastry2002, Mar 16, 2008 IP
  17. FunkyFresh

    FunkyFresh Peon

    Messages:
    499
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #17
    yes thats what I meant, I use the leas amount if images possible and never use text images unless it is a very special font, logo, etc.
     
    FunkyFresh, Mar 16, 2008 IP
  18. SitPoMk

    SitPoMk Peon

    Messages:
    457
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #18
    Right on, I'm actually considering writing a tutorial myself.
    Maybe even a couple and making a nice little site (with some nice little adsense) :)

    Sasha
     
    SitPoMk, Mar 16, 2008 IP
  19. RelevantBuZZ_PR

    RelevantBuZZ_PR Guest

    Messages:
    101
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #19
    I think you have the right intent but the way it's coming across is confusing. There are times when slicing is the correct method while other times using purely CSS to control the presentation is. I strongly believe in CSS and will never design a site without it. Yet, I will not be narrow thinking it's the only way to do something.
     
    RelevantBuZZ_PR, Mar 16, 2008 IP
  20. SitPoMk

    SitPoMk Peon

    Messages:
    457
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #20
    I see what you're saying about the narrow thinking, but Can you provide a common example of when using a table of sliced images would be the optimal way to go?
     
    SitPoMk, Mar 16, 2008 IP