Adobe 65045315 Photoshop Elements Manual - Page 303

Create hard-edged transparency in a GIF or PNG-8 file, Create a matted JPEG image

Page 303 highlights

USING PHOTOSHOP ELEMENTS 10 297 Optimizing for the web Create hard-edged transparency in a GIF or PNG-8 file Use hard-edged transparency when you don't know the background color of a web page, or when the web page background contains a texture or pattern. However, keep in mind that hard-edged transparency can cause jagged edges in the image. 1 In the Edit workspace, open or create an image that contains transparency, and choose File > Save For Web. 2 In the Save For Web dialog box, select GIF or PNG-8 as the optimization format. 3 Select Transparency. 4 Select None from the Matte menu. More Help topics "About the GIF format" on page 290 "About the PNG-8 format" on page 290 Create a matted JPEG image Although the JPEG format does not support transparency, you can specify a matte color to simulate the appearance of transparency in the original image. The matte color fills fully transparent pixels and blends with partially transparent pixels. When you place the JPEG on a web page with a background that matches the matte color, the image appears to blend with the background. 1 In the Edit workspace, open or create an image that contains transparency, and choose File > Save For Web. 2 In the Save For Web dialog box, select JPEG as the optimization format. 3 Select a color from the Matte menu: None, Eyedropper Color (to use the color in the eyedropper sample box), White, Black, or Other (to select a color using the Color Picker). When you select None, white is used as the matte color. More Help topics "About the JPEG format" on page 289 Dithering in web images About dithering Most web images are created by designers using 24-bit color displays (which display over 16 million colors), although some users view web pages on computers with 8-bit color displays (which display only 256 colors). As a result, web images often contain colors not available on some computers. Computers use a technique called dithering to simulate colors they can't display. Dithering uses adjacent pixels of different colors to give the appearance of a third color. For example, a red color and a yellow color may dither in a mosaic pattern to produce the illusion of an orange color that the 8-bit color panel doesn't contain. Last updated 1/2/2012

  • 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

297
USING PHOTOSHOP ELEMENTS 10
Optimizing for the web
Last updated 1/2/2012
Create hard-edged transparency in a GIF or PNG-8 file
Use hard-edged transparency when you don’t know the background color of a web page, or when the web page
background contains a texture or pattern. However, keep in mind that hard-edged transparency can cause jagged
edges in the image.
1
In the Edit workspace, open or create an image that contains transparency, and choose File
> Save For Web.
2
In the Save For Web dialog box, select GIF or PNG-8 as the optimization format.
3
Select Transparency.
4
Select None from the Matte menu.
More Help topics
About the GIF format
” on page
290
About the PNG-8 format
” on page
290
Create a matted JPEG image
Although the JPEG format does not support transparency, you can specify a matte color to simulate the appearance of
transparency in the original image. The matte color fills fully transparent pixels and blends with partially transparent
pixels. When you place the JPEG on a web page with a background that matches the matte color, the image appears to
blend with the background.
1
In the Edit workspace, open or create an image that contains transparency, and choose File
> Save For Web.
2
In the Save For Web dialog box, select JPEG as the optimization format.
3
Select a color from the Matte menu: None, Eyedropper Color (to use the color in the eyedropper sample box),
White, Black, or Other (to select a color using the Color Picker).
When you select None, white is used as the matte color.
More Help topics
About the JPEG format
” on page
289
Dithering in web images
About dithering
Most web images are created by designers using 24-bit color displays (which display over 16 million colors), although
some users view web pages on computers with 8-bit color displays (which display only 256 colors). As a result, web
images often contain colors not available on some computers. Computers use a technique called dithering to simulate
colors they can’t display. Dithering uses adjacent pixels of different colors to give the appearance of a third color. For
example, a red color and a yellow color may dither in a mosaic pattern to produce the illusion of an orange color that
the 8-bit color panel doesn’t contain.