Photoshop - How to slice and export the layout in PSD to HTML

Learn how to use Aodbe Photoshop's slicing tool to export your web layout images

Yeah, td bele?

Because more new software has been released for site layout development, Adobe Photoshop still remains designers' main tool. And most likely it will go on much longer, even if its initial purpose is not that.

And many people have doubts or do not understand what it is like to transpose the layout of Photoshop into code. I myself have received several questions about this part, from the construction of a website. Just so you have an idea, there are people who still think that exporting HTML via Photoshop is the ideal solution.

Because of this I recorded a video where I explain how to export in the right way and show how important it is for the Designer to have basic knowledge of HTML and CSS at the time of export. In it I show how you should export the layout in the right way and then put it in the code

Watch the video below:

How to slice and export your website layout in Photoshop

Exporting photoshop images is super simple and relatively fast.  There's no secret to doing it the right way. But this (slicing and exporting the images) is only part of the process. After exporting the images you need to insert them into the code for your site to be published and actually work. And then, for that, of course you need to understand at least HTML and CSS.

If you have realized the importance of what I speak in the video, you can acquire our HTML & CSS Solidarity eBook to start taking your first steps on the web.

And also check out other Photoshop tips in this other video.

Don't forget to subscribe to our Youtube channel so you know what's new, ???


And you use Adobe Photoshop to create interfaces? Already exporting in the right way? You can leave your comment below.😀

Until later.

Big hug!

David Arty

Hi I am David Arty, founder from the blog Chief of Design.
I am from São Paulo, Brazil. I work with design, mainly with web design, since 2009. I try to transform crazy and complex ideas into simple, attractive and functional pieces.