Using the slicing tool for Web output

Report · May 17, 2021

I have a simple artboard that is divided into 10 slices...

To create the export the slices for Web, I choose "Save for Web (Legacy"

Choose output to be in JPG

And when I hit the preview table the output isn't in table format. See below...

What am I doing wrong?

<html>
<head>
<title>Art & Illustration</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div style="position:absolute; left:0px; top:0px; width:371px; height:187px;">
<div style="background-image:url(Untitled-1_01.jpg); position:absolute; left:0px; top:0px; width:150px; height:187px;" title="">
</div>
<div style="background-image:url(Untitled-1_02.jpg); position:absolute; left:150px; top:0px; width:221px; height:104px;" title="">
</div>
<div style="background-image:url(Untitled-1_03.jpg); position:absolute; left:150px; top:104px; width:221px; height:17px;" title="">
</div>
<div style="background-image:url(Untitled-1_04.jpg); position:absolute; left:150px; top:121px; width:221px; height:16px;" title="">
</div>
<div style="background-image:url(Untitled-1_05.jpg); position:absolute; left:150px; top:137px; width:221px; height:14px;" title="">
</div>
<div style="background-image:url(Untitled-1_06.jpg); position:absolute; left:150px; top:151px; width:129px; height:36px;" title="">
</div>
<div style="background-image:url(Untitled-1_07.jpg); position:absolute; left:279px; top:151px; width:19px; height:36px;" title="">
</div>
<div style="background-image:url(Untitled-1_08.jpg); position:absolute; left:298px; top:151px; width:20px; height:36px;" title="">
</div>
<div style="background-image:url(Untitled-1_09.jpg); position:absolute; left:318px; top:151px; width:18px; height:36px;" title="">
</div>
<div style="background-image:url(Untitled-1_10.jpg); position:absolute; left:336px; top:151px; width:35px; height:36px;" title="">
</div>
</div>
</body>
</html>

Report · May 17, 2021

Tables in web design are a thing of the past. They are not used anymore.

Back in CS3 (and maybe a couple versions after that) you could configure the output HTML. You can't do that anymore. The only way to get the HTML at all is to copy it from that browser preview. The HTML that Illustrator generates has been deprecated for years, so they just abandoned doing it at all and you are basically stuck with the most modern HTML code it was ever capable of.

Use a web editor to code the HTML.

Report · May 18, 2021

Thank you!

Adobe Community

Using the slicing tool for Web output

Explore related tutorials & articles