19 {{ upvoteCount | shortNum }}
19 {{ upvoteCount | shortNum }}

PSD to HTML conversion

by harkon
16 replies
  • WEB DESIGN
    • |
I would like to have your opinion on my conversion of The Point Free PSD Website Template from Os Templates to HTML.

The template:



My work: The Point

I do not want you to comment the design itself but rather the success of the conversion.

Thank you in advance!
#conversion #html #psd #psd to html conversion
  • Profile picture of the author onekeys
    very good i will say only the font-size look a little smaller .Btw where did you learn to convert psd into html im currently looking for a ressource to do that can you give me some leads.
    {{ DiscussionBoard.errors[9200247].message }}
    • Profile picture of the author harkon
      Originally Posted by onekeys View Post

      very good i will say only the font-size look a little smaller .Btw where did you learn to convert psd into html im currently looking for a ressource to do that can you give me some leads.
      Thank you.
      I thinkI took the correct size of the font from the PSD template.
      I went through several tutorials from Lynda.com, but their PSD to HTML tutorial was about a fixed width page so I read through the documentation of Bootstrap in order to create a responsive template and this is the result.
      Signature
      WordPress Development Services
      {{ DiscussionBoard.errors[9200274].message }}
    • Profile picture of the author webresponsive
      PSD to HTML Tutorial: Code a Photoshop File to a Working Website

      you learn this url you help it
      {{ DiscussionBoard.errors[9246373].message }}
  • Profile picture of the author harkon
    Only one comment? I don't believe I have done it perfect. There must be a flaw in the conversion.
    Signature
    WordPress Development Services
    {{ DiscussionBoard.errors[9203536].message }}
  • Profile picture of the author webcosmo
    Almost perfect conversion, except the underline of the footer red links, main menu font size too small, and the search button )) Else it`s great, even responsive. Good job!
    Signature


    {{ DiscussionBoard.errors[9203563].message }}
    • Profile picture of the author harkon
      Originally Posted by webcosmo View Post

      Almost perfect conversion, except the underline of the footer red links, main menu font size too small, and the search button )) Else it`s great, even responsive. Good job!
      The main menu font size is 12px. I forgot to add it. It is done now.
      Thank you!
      Signature
      WordPress Development Services
      {{ DiscussionBoard.errors[9203670].message }}
  • Profile picture of the author Xydra
    i'd suggest using different font type,especially on the menu.

    Other than that good job

    P.S : Is this HTML or HTML5?
    {{ DiscussionBoard.errors[9203640].message }}
    • Profile picture of the author harkon
      Originally Posted by Xydra View Post

      i'd suggest using different font type,especially on the menu.

      Other than that good job
      Are you referring to the main navigation font size? I just changed it to 12px - the same size as that of the psd files.

      Originally Posted by Xydra View Post


      P.S : Is this HTML or HTML5?
      Let me consult the W3C Validator:
      Signature
      WordPress Development Services
      {{ DiscussionBoard.errors[9203685].message }}
      • Profile picture of the author webcosmo
        Originally Posted by harkon View Post

        Are you referring to the main navigation font size? I just changed it to 12px - the same size as that of the psd files.



        Let me consult the W3C Validator:
        Hahaha that was funny ))) I mean asking some "expert" questions when it`s so simple to check for yourself Anyways,what's the catch with being html5 or not? I think that a site should workfor everyone and thats it.
        Signature


        {{ DiscussionBoard.errors[9212333].message }}
        • Profile picture of the author harkon
          Originally Posted by webcosmo View Post

          Hahaha that was funny ))) I mean asking some "expert" questions when it`s so simple to check for yourself Anyways,what's the catch with being html5 or not? I think that a site should workfor everyone and thats it.
          HTML 5 has more semantic tags while HTML 4, for example, is supported by more browsers (more older browsers). At the moment I'm not concerned whether my templates are html 5 or 4.
          Signature
          WordPress Development Services
          {{ DiscussionBoard.errors[9212460].message }}
  • Profile picture of the author copilu0
    you did a very good job!
    Signature
    Snow Blower Garage
    Electric Toothbrush Reviews
    {{ DiscussionBoard.errors[9205005].message }}
  • Profile picture of the author bridgettewilliams211
    Some front is so small. It can be better if you use larger (14).
    {{ DiscussionBoard.errors[9211302].message }}
    • Profile picture of the author harkon
      Originally Posted by bridgettewilliams211 View Post

      Some front is so small. It can be better if you use larger (14).
      These are personal preferences. My idea was to preserve the original sizes of the elements and not to determine which font size is best for an element.
      Signature
      WordPress Development Services
      {{ DiscussionBoard.errors[9212308].message }}
  • Profile picture of the author Shashie
    Hi Harkon,
    1.
    work looks neat very good job, you also made it responsive
    2. "reserve the original sizes of the elements and not to determine which font size is best for an element"
    Good principle to convert as it is as per the sample, this is one thing most people who convert PSD 2 HTML change without the clients permission
    You maintained integrity to the Original
    GoodLuck, great job
    {{ DiscussionBoard.errors[9245666].message }}
  • Profile picture of the author Mostafa82
    it's really good, but it's too wide maybe if you make it 950px width it will be better. That's my opinion.
    Signature
    $420/week just for your opinions http://globaltestmarket.com
    {{ DiscussionBoard.errors[9248782].message }}
    • Profile picture of the author harkon
      Originally Posted by Mostafa82 View Post

      it's really good, but it's too wide maybe if you make it 950px width it will be better. That's my opinion.
      Thank you for your opinion. The theme originally took 100% of the original width of the screen but I decided to reduce it to 90%. Reducing the overall width with be the easiest thing to do.

      Edit: I heeded your advice and set the max-width of all sections to 1000px (the original width of the template). It will not be a good idea to reduce the width of the original template to 950px. I'm open for other suggestions for changes to the design that do not contradict the original template.
      Signature
      WordPress Development Services
      {{ DiscussionBoard.errors[9251445].message }}

Trending Topics