16 {{ upvoteCount | shortNum }}
16 {{ upvoteCount | shortNum }}

photoshop to HTML/CSS

by watsonovedades
14 replies
  • WEB DESIGN
    • |
Hi Warriors

I need a good course to learn how to create websites from photoshop designs?
ay WSO or good prodcuct you can recommend?

Thanks in advance
#html or css #photoshop
  • Profile picture of the author mmrumii
    I can't understand that , why don't you try to search on google find out this type of question. I think you should search on google. I'm sure google will help you in a second.
    Signature
    Blog about Content Locking and CPA
    {{ DiscussionBoard.errors[6774196].message }}
    • Profile picture of the author lindamriana
      Originally Posted by mmrumii View Post

      I can't understand that , why don't you try to search on google find out this type of question. I think you should search on google. I'm sure google will help you in a second.

      many option at google make me confuse ,you have any recommendation??im need too..thankyou^^
      {{ DiscussionBoard.errors[6774613].message }}
  • Profile picture of the author Shaolinsteve
    I would Scout on Youtube for more visual training. There are a number of people on there who give you the basics and some who can help you from start to finish.

    Take a look and hopefully you will find some things of interest.
    Signature
    {{ DiscussionBoard.errors[6775559].message }}
  • Profile picture of the author DilawerPirzada
    Oh! What do you mean by Photoshop, there is no coding for Photoshop to create a website with. You can use images in your website with the help of CSS and HTML and add designed Photoshop photos in but not possible to create a website with Photoshop.

    Hope you understand.
    {{ DiscussionBoard.errors[6780402].message }}
  • Profile picture of the author fxbattleground
    try lynda dot com
    {{ DiscussionBoard.errors[6782296].message }}
    • Profile picture of the author ronc0011
      Photoshop doesn't make website, it's not webdesign software. It can make images for use on websites but to make the website to put the images on you will need web design software like Dreamweaver. There are several free such softwares like Visual Web Developer and there are several others there is a lot more to a website than a collection of pictures . Photoshop does have a function called slice that will cut up an image to be used in a web page and then save that image as an html file and that is all it is. Just a file that has an image cut up and placed in containers so it displays in a webpage. It doesn't do anything. Also the container it uses is a table which you don't want to use.
      {{ DiscussionBoard.errors[6782515].message }}
  • Profile picture of the author WebsiteBegin
    Don't try and make a template on photoshop and then use it as a website, if that's what you're thinking. When it comes to the different resolutions, screen sizes, devices, etc., you will get burnt when it doesn't fit right. Just saying.

    Learn to use HTML and CSS and design from that. Code is poetry.
    Signature
    WebsiteBegin | Learn to Build and Manage an Amazing Website

    Follow me on Twitter - Joeb3219
    {{ DiscussionBoard.errors[6782644].message }}
  • Profile picture of the author ginoman
    To create websites from Photoshop drawings, you:
    1. create the website design
    2. use your slice select tool to segment your design
    3. choose file > save for web & devices

    A good youtube tutorial on slicing a psd template, and how to code it is:

    How To Slice Photoshop PSD Template Overview Lesson 1

    You'll have to search for that, because I couldn't post the url due to my new account here... but it's the first of 17 videos in that lesson.

    If you need to learn how to create the psd first, then search for this video on YouTube instead:

    Create Your Own PSD Photoshop CS4 Template Layout Lesson1
    {{ DiscussionBoard.errors[6784245].message }}
  • Profile picture of the author prtt75
    do you mean converting PSD to CSS?

    1.) Learn CSS commands
    2.) Use a nice HTML/CSS editing software
    3.) Take a sample site (search for Google for free CSS templates, ex. CSS Templates (page 1 of 54) - Free CSS Templates) that closely resembles your design
    4.) See how it is done
    5.) Apply what you've learned in your project
    *------------------------------------------------*
    6.) Code a more complex design (advanced) with AJAX/Javascript
    Signature
    Free Downloads: 30,000 Video & Audio Clips
    {{ DiscussionBoard.errors[6787602].message }}
  • Profile picture of the author ericfox
    According to me PSD to HTML is necessary step in website development, Every site goes through a Photoshop to HTML process, before it goes live on the World Wide Web (WWW) for the audience.
    Signature

    We are experts in BigCommerce Custom Design, Template Customization and SEO

    {{ DiscussionBoard.errors[6799364].message }}
    • Profile picture of the author clickbump
      Originally Posted by ericfox View Post

      According to me PSD to HTML is necessary step in website development, Every site goes through a Photoshop to HTML process, before it goes live on the World Wide Web (WWW) for the audience.
      While many sites originate from a PSD "comp" or design, its still perfectly fine to visualize the design and build it up directly in css. That's how I do it at least.
      Signature
      {{ DiscussionBoard.errors[6799768].message }}
      • Profile picture of the author ronc0011
        Originally Posted by clickbump View Post

        While many sites originate from a PSD "comp" or design, its still perfectly fine to visualize the design and build it up directly in css. That's how I do it at least.
        That's how I do it too. Why would I want to draw a picture of my site just to make a bunch of extra work and coding for myself. Besides I'm still not all that fond of the slice process and what it gives you as far as code goes. Generally speaking My goal is to create a page that is as light weight as possible and you're not going to get that using slices.
        {{ DiscussionBoard.errors[6799845].message }}
    • Profile picture of the author ronc0011
      Originally Posted by ericfox View Post

      According to me PSD to HTML is necessary step in website development, Every site goes through a Photoshop to HTML process, before it goes live on the World Wide Web (WWW) for the audience.
      Actually that's not at all true. Some of us just take our images and place them into our web pages. Take for instance this page on the warrior forum. You see all the colored fields, the red boxes the black/ drark gray buttons, the little icons The buttons and the icons are likely the only parts that were done in Photoshop or some other graphics software. The red boxes are just a div or table cell with a background color applied. So in other words the page was most likely designed and coded as a single step. I seriously doubt that the page started out as a Photoshop image.
      {{ DiscussionBoard.errors[6799809].message }}
  • Profile picture of the author ChrisMoon
    I just visualize and do it in css. Have tried using Photoshop but it took more time
    Signature

    GreyGable

    {{ DiscussionBoard.errors[6799868].message }}

Trending Topics