12 {{ upvoteCount | shortNum }}
12 {{ upvoteCount | shortNum }}

PSD to HTML Question.

by lgibbon Banned
10 replies
  • WEB DESIGN
    • |
Hi Guys,
I have a PSD file for a website.
I assume I need to slice the PSD graphic into
smaller gif files.
I guess these smaller files need to be inserted
into correct size tables to fit them all together.
Is this as time consuming as I think it's going to be
or is there something that will do the job simply?
#html #psd #question
  • Profile picture of the author joe_webmonger
    ImageReady will let you slice up your PSD file and automatically create the HTML file to put it all together, as well as place any hyperlinks you need, etc. The steps to do so are pretty easy, and can be found online easy enough, although I don't think the result is all its chocked up to be, since everything is positioned so precisely, you cannot customize it. (I'm using ImageReady version CS2 - and Adobe no longer makes ImageReady in CS4)

    Personally I make my comps in Photoshop, but once the design is finalized, then crop out those images I need and place them manually. Makes it much cleaner, and easier in the long run.
    {{ DiscussionBoard.errors[290333].message }}
  • Profile picture of the author Victor
    You would slice the graphic in Photoshop and then you can use Dreamweaver to edit your html. Photoshop has the ability to create the html for you and then you can use Dreamweaver to make any changes.

    The graphics you slice don't need to be in .gif format either. You can use jpeg, png or gif.

    In my opinion, the time consuming part is creating the graphics and writing the sales copy. The setting up of the page layout in html is usually the easiest part.

    Good Luck!
    {{ DiscussionBoard.errors[290476].message }}
    • Profile picture of the author lgibbon
      Banned
      Thanks for the replies.
      How exactly do you slice the PSD file.
      Is there a tutorial somewhere?
      {{ DiscussionBoard.errors[296312].message }}
      • Profile picture of the author gotlinks
        Originally Posted by lgibbon View Post

        Thanks for the replies.
        How exactly do you slice the PSD file.
        Is there a tutorial somewhere?
        Well if you want I can make you a video tut dude, just pm me and Ill whip it up real quick!
        Signature
        Learn the secrets to growing your Youtube Channel!

        - Feel free to private message me about anything. I love to help people and you are definitely no exception!
        {{ DiscussionBoard.errors[296862].message }}
      • Profile picture of the author spearce000
        Originally Posted by lgibbon View Post

        Thanks for the replies.
        How exactly do you slice the PSD file.
        Is there a tutorial somewhere?
        Photoshop Master Adobe Photoshop Video Tutorials. I must declare an interest here.
        {{ DiscussionBoard.errors[298451].message }}
  • Profile picture of the author .silent
    I don't go about this way, it doesn't seem very effective to me. The hype today is all about XHTML and CSS coding. If you were to hire a coder, it would cost around $30-$150. However much you pay is how much quality you get. BUT, if you really want to do it yourself, don't use slices, don't use Imageready. Crop the images you need out, and use notepad or another editor (or WYSIWYG) to do tableless XHTML/CSS coding. It will ensure faster loading time, and a more professional look. I use DreamWeaver, it seems to work just fine. You aren't going to get it perfect if you've never done it before, just letting you know.
    Signature
    Design Inspiration at it's finest. Get inspiration on your next project, or just get some real eye candy!
    -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
    PM me for $15 PSD designs (normally $50), only 5 spots available and the price goes up!
    {{ DiscussionBoard.errors[296548].message }}
  • Profile picture of the author Stephen Saha
    Hi Leslie,

    If its a simple design just slice the psd file (using the size tool in the left tools panel). Export the images (File --> save for web & devices -->) to a location. Create a HTML file using those images.

    If its a complex design, I prefer using FireWorks instead of ImageReady. You can slice the psd file and auto update an HTML file. The complete design page alongwith links & rollovers is created.

    If you need any further help let me know.

    Rgds,

    Stephen
    Signature
    {{ DiscussionBoard.errors[299665].message }}
  • Profile picture of the author smd_vivek
    Try Fireworks
    One of the best software available for Web design and Development

    Best of Luck
    {{ DiscussionBoard.errors[304173].message }}
  • Profile picture of the author BrainDance
    I'll slice it for you at no cost and set it up in dreamweaver with html, just contact me directly via email. I dont check messages or sign in here to answer messages every day
    thanks
    Linda
    linda@ecoversource.com
    Signature
    ================================
    I am taking on only ecover design work for the next 90 days. Rates are 47.00 for single cover, discounts for multiple..just ask! No payment until completed.     http://www.d27portfolio.com for sample works
    {{ DiscussionBoard.errors[305669].message }}
  • Profile picture of the author v7web
    Hi lgibbon,
    If you get stuck, I will do a psd to valid xhtml/css for €50
    {{ DiscussionBoard.errors[343900].message }}

Trending Topics