Adobe 38039927 User Guide - Page 220

Defining how HTML tables are exported

Page 220 highlights

ADOBE FIREWORKS CS3 215 User Guide Note: Use caution when selecting None as a menu option for slice auto-naming. If you select None as the option for any of the first three menus, Fireworks exports slice files that overwrite one another, resulting in a single exported graphic and a table that displays this graphic in every cell. Defining how HTML tables are exported Slicing defines how the HTML table structure appears when a Fireworks document is exported for use on the web. When you export a sliced Fireworks document to HTML, your document is reassembled using an HTML table. Each sliced element from the Fireworks document resides in a table cell. Once exported, a Fireworks slice translates to a table cell in HTML. You can specify how a Fireworks table is reconstructed in a browser. Among other options, you can choose whether to use spacers or nested tables when exporting to HTML: • Spacers are images that help table cells align properly when viewed in a browser. • A nested table is a table within a table. Nested tables do not use spacers. They may load more slowly in browsers, but because there are no spacers, it is easier to edit their HTML. For more information about HTML, see "Exporting HTML" on page 280. To define how Fireworks exports HTML tables: 1 Select File > HTML Setup, or click the Options button in the Export dialog box. 2 Click the Table tab. 3 Select a spacing option from the Space With pop-up menu: Nested Tables - No Spacers creates a nested table with no spacers. Single Table - No Spacers creates a single table with no spacers. This option can cause tables to be displayed incorrectly in some cases. 1-Pixel Transparent Spacer uses a 1-pixel-by-1-pixel transparent GIF as a spacer that is resized as needed in the HTML. This generates a 1-pixel-high row across the top of the table and a 1-pixel-wide column down the right side. 4 Select a cell color for HTML slices: • To give cells the same background color as the document canvas, select Use Canvas Color. • To select a different color, deselect Use Canvas Color and select a color from the color pop-up window. Note: If you select a color from the color pop-up window, it applies only to HTML slices; image slices continue to use the canvas color. 5 Select what to place in empty cells from the Contents pop-up menu: None causes empty cells to remain blank. Spacer Image places a small transparent image called spacer.gif in empty cells. Non-breaking Space places an HTML space tag in empty cells. The cell appears hollow. Note: Empty cells occur only if you deselect Include Areas Without Slices in the Export dialog box during export. 6 Click OK. For more information about specifying HTML export options, see "Setting HTML export options" on page 287. Note: You can specify unique table export settings for sliced objects for each document. Or you can use the Set Defaults button on the Document Specific tab of the HTML Setup dialog box to apply defaults for all new documents.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166
  • 167
  • 168
  • 169
  • 170
  • 171
  • 172
  • 173
  • 174
  • 175
  • 176
  • 177
  • 178
  • 179
  • 180
  • 181
  • 182
  • 183
  • 184
  • 185
  • 186
  • 187
  • 188
  • 189
  • 190
  • 191
  • 192
  • 193
  • 194
  • 195
  • 196
  • 197
  • 198
  • 199
  • 200
  • 201
  • 202
  • 203
  • 204
  • 205
  • 206
  • 207
  • 208
  • 209
  • 210
  • 211
  • 212
  • 213
  • 214
  • 215
  • 216
  • 217
  • 218
  • 219
  • 220
  • 221
  • 222
  • 223
  • 224
  • 225
  • 226
  • 227
  • 228
  • 229
  • 230
  • 231
  • 232
  • 233
  • 234
  • 235
  • 236
  • 237
  • 238
  • 239
  • 240
  • 241
  • 242
  • 243
  • 244
  • 245
  • 246
  • 247
  • 248
  • 249
  • 250
  • 251
  • 252
  • 253
  • 254
  • 255
  • 256
  • 257
  • 258
  • 259
  • 260
  • 261
  • 262
  • 263
  • 264
  • 265
  • 266
  • 267
  • 268
  • 269
  • 270
  • 271
  • 272
  • 273
  • 274
  • 275
  • 276
  • 277
  • 278
  • 279
  • 280
  • 281
  • 282
  • 283
  • 284
  • 285
  • 286
  • 287
  • 288
  • 289
  • 290
  • 291
  • 292
  • 293
  • 294
  • 295
  • 296
  • 297
  • 298
  • 299
  • 300
  • 301
  • 302
  • 303
  • 304
  • 305
  • 306
  • 307
  • 308
  • 309
  • 310
  • 311
  • 312
  • 313
  • 314
  • 315
  • 316
  • 317
  • 318
  • 319
  • 320
  • 321
  • 322
  • 323
  • 324
  • 325
  • 326
  • 327
  • 328
  • 329
  • 330
  • 331
  • 332
  • 333
  • 334
  • 335
  • 336
  • 337
  • 338
  • 339
  • 340
  • 341
  • 342
  • 343
  • 344
  • 345
  • 346
  • 347
  • 348
  • 349
  • 350
  • 351
  • 352
  • 353
  • 354
  • 355
  • 356
  • 357
  • 358
  • 359
  • 360
  • 361
  • 362
  • 363
  • 364
  • 365
  • 366
  • 367
  • 368
  • 369

ADOBE FIREWORKS CS3
User Guide
215
Note:
Use caution when selecting None as a menu option for slice auto-naming. If you select None as the option for
any of the first three menus, Fireworks exports slice files that overwrite one another, resulting in a single exported
graphic and a table that displays this graphic in every cell.
Defining how HTML tables are exported
Slicing defines how the HTML table structure appears when a Fireworks document is exported for use on the web.
When you export a sliced Fireworks document to HTML, your document is reassembled using an HTML table.
Each sliced element from the Fireworks document resides in a table cell. Once exported, a Fireworks slice translates
to a table cell in HTML.
You can specify how a Fireworks table is reconstructed in a browser. Among other options, you can choose whether
to use spacers or nested tables when exporting to HTML:
Spacers are images that help table cells align properly when viewed in a browser.
A nested table is a table within a table. Nested tables do not use spacers. They may load more slowly in browsers,
but because there are no spacers, it is easier to edit their HTML.
For more information about HTML, see “Exporting HTML” on page 280.
To define how Fireworks exports HTML tables:
1
Select File > HTML Setup, or click the Options button in the Export dialog box.
2
Click the Table tab.
3
Select a spacing option from the Space With pop-up menu:
Nested Tables — No Spacers
creates a nested table with no spacers.
Single Table — No Spacers
creates a single table with no spacers. This option can cause tables to be displayed incor-
rectly in some cases.
1-Pixel Transparent Spacer
uses a 1-pixel-by-1-pixel transparent GIF as a spacer that is resized as needed in the
HTML. This generates a 1-pixel-high row across the top of the table and a 1-pixel-wide column down the right side.
4
Select a cell color for HTML slices:
To give cells the same background color as the document canvas, select Use Canvas Color.
To select a different color, deselect Use Canvas Color and select a color from the color pop-up window.
Note:
If you select a color from the color pop-up window, it applies only to HTML slices; image slices continue to use
the canvas color.
5
Select what to place in empty cells from the Contents pop-up menu:
None
causes empty cells to remain blank.
Spacer Image
places a small transparent image called spacer.gif in empty cells.
Non-breaking Space
places an HTML space tag in empty cells. The cell appears hollow.
Note:
Empty cells occur only if you deselect Include Areas Without Slices in the Export dialog box during export.
6
Click OK.
For more information about specifying HTML export options, see “Setting HTML export options” on page 287.
Note:
You can specify unique table export settings for sliced objects for each document. Or you can use the Set Defaults
button on the Document Specific tab of the HTML Setup dialog box to apply defaults for all new documents.