Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Akash deep Shakya
2,550 Pointshow to best convert psd to html css
hi,
just starting a course. what is best way to convert web page designed in photoshop to html/css/js?
5 Answers
James Barnett
39,199 PointsLearn to code HTML & CSS and once you can do that it's trivial to use a PSD design as a starting point for coding HTML & CSS.
Akash deep Shakya
2,550 PointsI have finished html and css. I also know a bit of jquery.
What I am trying to learn is. Should I slice different elements in psd and use save to web feature in photoshop and start working on top of it. Or should I start working as taught on html courses where I would look at psd file and write html/css.
James Barnett
39,199 PointsThe problem with slicing is that it loads a lot of images which increases HTTP requests and thus page load time. Also images increase the page weight relative to CSS so that also increases page load time.
In general if it can do with CSS then you should probably do it that way unless you have a compelling reason not to. Such as the time it would take to do in CSS really isn't worth the speed savings of using an image.
Alex Jackson
8,574 PointsI'm with James on this one - load times will definitely suffer...just not worth it, especially if you're considering the range of devices which may be using the site.
Akash deep Shakya
2,550 PointsThanks all. I have successfully finished the project. Loadtime for 1 page website with about 20 images, 1.2 seconds. Thanks to, http://kraken.io/
James Barnett
39,199 PointsOptimizing images will only optimize the size of the image not the time it takes for HTTP requests. 2 seconds is the absolute max time load time before a user will abandon the site. Your site's load time could probably be half that if you followed Google's Page Speed best practices
Akash deep Shakya
2,550 PointsYeah. I had already tested the site using one of the site optimisation tool and had followed all these steps. So wasn't too far off..