Templates by BIGtheme NET
Home / Basics / Convert Psd to Html CSS Photoshop CS6 Tutorial for Beginners

Convert Psd to Html CSS Photoshop CS6 Tutorial for Beginners

There are many ways to convert Image to HTML. But here I discovered a very easy and professional method to convert file PSD to HTML and CSS. In this method you can covert the code in tag as well as css. The graphics quality of your web page will also good.  Now Convert Psd to Html CSS Photoshop CS6 Tutorial for beginners is here below step by step. By using this technique you can work professionally as freelancer or in graphics markets. Let’s learn this guide step by step. I you create an ebay page in Photoshop CS6 and convert into
HTML/CSS with Div tag.

Convert Psd to Html CSS Photoshop CS6 Tutorial for Beginners

Step 1:

Just take an image of eBay web page. So i will go to Ebay page and take snap shoot by pressing key “print Screen” on keyboard. press CTRl + V in paint and save this image in jpg format.  Now open the image in Photoshop.

image in PHotoshop cs 6


Step 2:

Pick up the slice tool in Photoshop and slice the all the page part like that.

Page slice with tool

Step 3:

Go to file and save as Web. In this dialog box save for web go to optimize menu -> edit output setting. Here you will find slice option and slice output table and Css. Select the css or table you want output code. I just select generate CSS output option because i want my webpage code in CSS coding. I selected generate CSS -> by class and it.

generate Css option

Step 4:

After saving an additional window will open. In below select the HTML and Image and all user slice option and save webpage.

save option in html

Step 5:

After that, two folder create image and webpage code folder. Just open the code file into notepad.

css code in notepad

That’s above css code for our generated webpage file. Just edit it according to your requirements. At last open in internet browser. Our require webpage is ready and converted psd to html in CSS code.


About Ali Imran

Howdy! I’m + Ali Imran and CEO of Photoshophelps.com. I have passed BS Computer Science degree in the year of 2013. I’ve a great experience in Content Writing, Photoshop, Graphics Designing, SEO, , Web Developing and Web Designing.

Leave a Reply

Your email address will not be published.

ăn dặm kiểu NhậtResponsive WordPress Themenhà cấp 4 nông thônthời trang trẻ emgiày cao gótshop giày nữdownload wordpress pluginsmẫu biệt thự đẹpepichouseáo sơ mi nữhouse beautiful