Skip navigation
Currently Being Moderated

PSD to DIV Layout

Feb 24, 2013 2:15 AM

Hi all,

I have a PSD web layouts, i dont know how can i re-create same template for website with help of DIV.

Iam find out a lots of tutorial but its not more conveint.

Plz help for this


  • Currently Being Moderated
    Feb 24, 2013 8:22 AM   in reply to manojb05

    Hi Manu,


    It is great that you are working with a design package to create a mockup for your website. However, it is only a mockup and you still need to do the hard work yourself. You can use the Photoshop images for backgrounds etc, but that is as far as it goes.


    Have a look here g-a-set-of-website-designs-step-by-step/ to see the work that goes into creating a web page from a graphics program.


    Please keep in mind, if there was an easier way, the author (an expert) of the article would have found it.

    Mark as:
  • Currently Being Moderated
    Feb 24, 2013 9:57 AM   in reply to manojb05

    PSD is sometimes presented to the client.  If they approve the design, then we set out to re-build it with HTML & CSS.



    Nancy O.

    Mark as:
  • Currently Being Moderated
    Feb 24, 2013 12:19 PM   in reply to Nancy O.

    When I am designing with a designer, I ask him for a .PSD file with all of the layers. What I send to my client is a .PDF file so that my client, who often cannot open a .PSD file, will be able to look at it and determine if they like the design.


    Then I begin with Dreamweaver to design the site based on the .PSD, using elements in the layers. Generally takes me a good day to crank out the first page, whereupon I will then have something for the client to approve as a working web page. When they approve that, I convert that to a Dreamweaver Template (DWT) and start churning out the website.



    Mark as:
  • Currently Being Moderated
    Feb 24, 2013 3:53 PM   in reply to manojb05

    You may want to have a look at this framework for rapid prototyping of a web site.


    You can use the images from PS, while the page is fully RWD (responsive web design).

    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points