Skip to main content
S
Solitaire Solidaire
Known Participant
April 20, 2023
Question

How to quickly slice a large PNG user case into multiple images for my Behance portfolio?

  • April 20, 2023
  • 2 replies
  • 3116 views

 

Hello Community,

I am working on my Behance portfolio and have a large user case created in Figma (1440x13325px), which I exported as a single PNG image. I would like to slice this image into multiple smaller images to optimize loading times.

Could anyone guide me through the process of slicing this large PNG image into multiple smaller images using Adobe Photoshop?

I am looking for a quick and efficient method to accomplish this task.

Any help or suggestions would be greatly appreciated!

Thank you in advance!

This topic has been closed for replies.

2 replies

jane-e
Community Expert
jane-eCommunity Expert
Community Expert
April 20, 2023

@Solitaire Solidaire 

There is a Slice tool in Photoshop that allows you to optimize each "slice" separately. Photoshop then creates a separate image for each "slice" as well as html code to put all the images into a table so they will appear to be one image again when viewed in a browser where the code will work. This was something we used before CSS and divs and is no longer recommended.

 

If you use slices, how will you put them back together again? Does Behance let you edit the xhtml code and use tables?

 

Jane

 

 

 

Stephen Marsh
Community Expert
Stephen MarshCommunity Expert
Community Expert
April 21, 2023

That was my first thought too Jane, however, as Save for Web has an 8192px limit, one would first need to crop the main file to fit the restriction, then slice multiple source files. Not impossible, just messy... But as you mention, at least Save for Web will generate the HTML code.

jane-e
Community Expert
jane-eCommunity Expert
Community Expert
April 21, 2023

@Stephen Marsh 

Do your scripts create the html code to put the smaller images into a table so it looks like one image again? If not, that might need to be hand-coded, assuming you can edit the html for Behance.

 

Jane

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices