Hướng dẫn sử dụng Photoshop

Chng 16: Ti u ho hnh nh trn trang web
Photoshop CS
Ni dung ca trang ny thuc bn quyn ca B tc Monte Cristo - Final Fantasy v www.vietphotoshop.com. Nhng bi vit
trong ny c th c in ra dng vi mc ch c nhn v phi thng mi. Nu bn mun pht hnh li trong trang web ca bn lm
n lin lc vi ti hoc t nht phi trch dn li ngun l: B tc Monte Cristo - Final Fantasy v www.vietphotoshop.com
c nhng hnh nh hiu qu trn trang Web, hnh nh ca bn phi c c s cn bng hi ho

gia kch thc file nh v cht lng nh. S dng Adobe Photoshop v Adobe Image Ready, bn c
th ti u ho hnh nh ca bn nhng hnh nh ny c th c ti xung nhiu ln t my ch
m khng b mt i nhng chi tit quan trng, trng sut, cc thnh phn chuyn dch chng hn
nh bn nh. (image map)
Trong bi hc ny, bn s hc cch lm sau:
Ti u ho cc tp tin dng JPEG v GIF, iu chnh cc xc lp ti u ho t c s

cn bng gia kch c nh v cht lng nh.
Xc nh trong sut cho mt nh.
X l hng lot cc tp tin nhm t ng ho qu trnh ti u ho.
Bi hc ny cn 1 ting 30 pht hon tt. Bi hc ny c son dnh cho Adobe Photoshop v

Adobe ImageReady.
Ch : Nhng ngi s dng Window 2000 cn m nhng tp tin bi hc trc khi s dng chng.
bit thm thng tin, xem phn Copying the Classroom in a Book files trang 3.
www.vietphotoshop.com - Dch bi Nguyn Tn S
Photoshop CS
S dng Photoshop v ImageReady ti u ho hnh nh

Ti u ho l qu trnh chn dng, phn gii, v cc xc lp v cht lng nh mt nh c hiu
qu, bt mt
v tin ch cho cc trang duyt web. Ni mt cch n gin, chnh l s hi ho gia kch c nh v
cht lng nh. Khng c mt tp hp cc xc lp n l no c th ti u ho mc hu hiu ca mi
loi nh, ti u ho i hi nhn xt v mt thm m ca con ngi.
Cc tu chn nn thay i tu theo dng tp tin khi lu. Bn nn lm quen vi nhng loi dng tng
qut.
Dng JPEG c thit k gi li mu rng v sng r ca nhng nh c tng mu

lin tc (chng hn nh nhng nh ch t mu gradient). Dng ny c th tiu biu cho
nhng nh
s dng hng triu mu.
Dng GIF hiu qu i vi nhng nh nn mu c v nhng nh c nhng vng mu lp li

(chng hn nh ngh thut ng thng, cc biu tng v nhng hnh minh ho c ch).
Dng ny s dng mt bng gm 256 mu th hin hnh nh v h tr cho trong sut
ca nn.
Dng PNG hiu qu i vi nhng nh nn mu c v gi c chi tit sc nt. Dng PNG-8

s dng bng 256 mu th hin 1 nh. Dng PNG-24 h tr mu 24 bit (hng triu mu),
tuy nhin nhiu ng dng trnh duyt trc y khng h tr cc tp tin dng PNG.
Dng WBNG l dng chun cho vic ti u ho cc hnh nh i vi cc thit b di ng chng

hn nh in thoi di ng. Dng WBMP h tr mu 1 bit, c ngha l nhng nh dng WBMP
ch cha nhng im nh mu en v mu trng.
Ch : c thng tin v vic s dng cc dng PNG v WBNG, xem phn Tr Gip ca Photoshop.
Adobe Photoshop v Adobe ImageReady s cho bn mt phm vi iu khin hiu qu i vi vic nn
kch thc tp tin ca mt nh trong khi ti u ho cht lng nh th hin trn mn hnh. Bn c th
p dng mt tp hp cc thit lp ti u cho mt tp hp nh, mt nh ri, mt lp (layer) hay 1 tm
phim chp (slice).
Trong bi hc ny bn s ti u ho v lu cc hnh nh dng JPEG v GIF. Trong cc bi tp tip
theo sau, bn s lm vic vi mt lot nh c thit k s dng trn trang web cho cc t chc du
lch gi tng.
Photoshop (qua hp thoi Save for web) v ImageReady (qua bng Optimize) c nhiu kh nng ging
nhau v vic ti u ho hnh nh. Th d, bn c th s dng trnh ng dng chn mt mng rng
Photoshop CS
cc dng tp tin v cc xc lp cho ph hp vi cc mc tiu i vi d n ca bn. Bn cng c th

dng mt trong hai chng trnh so snh nhng nh t k bn nhau c mc ti u ho khc
nhau ca cng mt tp tin. S dng nhng c im ti u ho v bng mu trong Adobe Photoshop
v ImageReady, bn c th lm ti a tnh trn vn ca mu sc trong khi lm cho kch thc tp tin
nh gim ti thiu.
Bt u
Bn s lm phn u tin ca bi hc ny trong Photoshop nhng ng thi cng c th lm trong
chng trnh ImageReady. Khi bt u bn s phc hi li nhng thit lp ng dng mc nh cho
Photoshop nhng m t trong phn ch dn ph hp vi nhng thit lp trong vng lm vic
ca Photoshop.
Bi hc ny xoay quanh ho trang ch cho t chc du lch gi tng.
1. Khi ng Photoshop trong khi nhn phm Ctrl+Alt+Shift (window) hoc Command +Option+Shift
(Mac OS) phc hi nhng u tin mc nh. (Xem Phc hi nhng u tin mc nh trang 4).
Khi nhng dng thng bo xut hin, chn Yes xc nh rng bn mun thit lp li nhng u tin,
chn No hon li vic thit lp mn hnh mu ca bn,v chn Close ng li mn hnh
Welcome.
2. Bm nt File Browser trn thanh tu chn cng c m n ra.
3. Trong bng cc th mc ca File browser, xc nh v chn th mc Lesson 16 trong th mc
Lesson.
Nhng nh nh ca 3 tp tin bt u v kt thc khc nhau xut hin trong bng cha nh nh, nhiu
nh trong s nhng nh ny c v hon ton ging nhau.
4. Chn-nhng khng m ra nh nh c tn 16Start1.psd nh ny c sng ln v metadata xut
hin trong bng Metadata.
Photoshop CS
5. Chn nh nh c tn 16End1.jpg. Ch l kch thc tp tin c lit k trong phn metadata th

nh hn nhng nh ny trong ging nh nh 16Start1.psd.
6. Ln lt chn v xem trc nhng tp tin Start v End khc trong th mc Lesson 16.
7. Nhp p tp tin nh 16Start1.psd m n trong Photoshop. ng File Browser li bng cch
hoc bm vo nt c biu tng File Browser
trn thanh tu chn cng c 2 ln (mt ln a n
v pha trc v mt ln ng n li) hoc bm nt Close trong ca s ca File Browser.

Ti u ho 1 nh JPEG (Photoshop)
Trong bi hc ny, bn s ti u ho nhng tp tin va dng JPEG va dng GIF. Mc tiu ca
bn l thit lp nhng la chn ti u nhng tp tin nh ca bn nh, hiu qu nhng vn p mt.
Hin gi, kch thc ca nh 16Start1.psd ln hn mc l tng s dng trn 1 trang web. Bn s
so snh nhng dng tp tin nn khc nhau thy nh no c
nn cao nht m khng mt i qu nhiu cht lng nh.
Photoshop CS
S dng hp thoi Save For Web

Hp thoi Save For Web trong Photoshop cho bn thy nhng tm nh t bn cnh nhau nhng khc
nhau do vic s dng nhng thit lp ti u ho khc nhau. Bn c th so snh cc phin bn khi lm
vic, chnh cc thit lp ti u v tm xem nhng khc bit cho n khi bn c c s kt hp kh d
gia kch thc v cht lng ca nh.
1. Vi tp tin ca nh 16Start1.psd ang m v kch hot trong Photoshop, chn File >Save for Web.
Ch : Nu th 4-up cha c chn trong ca s nh, hy chn n.
Photoshop t ng a ra 3 thit lp ti u ngoi nh gc ra. Ch thng tin c trnh by di mi

nh gm c kch thc tp tin v thi gian (tnh bng giy) cn thit ti nh xung. Bng u tin
cho thy nh gc. Cc bng th 2, 3, 4 th hin s kt hp khc nhau ca vic thit lp ti u i vi
nh ny bao gm dng tp tin (nh GIF hoc JPEG) v gii thut gim mu (nh Selective, Perceptual
hay Web)
2. gc di tri ca hp thoi Save For Web, chn 300% t menu pop-up Zoom Level bn c th
nhn thy nhng chi tit ca nh.
So snh nhng nh vi cc thit lp ti u khc nhau.
3. Bm vo 1 trong 4 tm nh con tr bin thnh biu tng hnh bn tay v ko nh bn c th
thy nhng khc bit gia nhng nh c ti u ho v nh gc.
4. Nhn cn thn cc vng sau y: vn bn gc di phi ca nh, vng trn np hp th tng
phn vi nn tri mu xanh, bng ca cnh ca r st ca
hp th ln,vng ni ln ca hp th r st v nhng chi tit khc ca nh.
Photoshop CS
So snh cc dng GIF, JPEG v PNG c ti u ho

Bn c th to tu bin bt k nh no trong 3 nh c ti u ho trong hp thoi Save For Web.
lm iu ny, bn chn xem trc 1 trong nhng nh c ti u ho ri chn cc thit lp cho n
pha bn phi ca hp thoi. Qua vic th nghim vi nhiu thit lp khc nhau, bn s c c
tng hay thit lp no ph hp nht vi mc ch ca bn.
Ch : Khi thc hin cc thao tc trong bi hc ny, hy s dng cng c nh t l thng xuyn
bn c c ci nhn ton cnh ca bc nh v thy c nhng chi tit nh cho bn thy nhng
khim khuyt m bn khng nhn thy phng i nh hn. Mi thao tc ng ch nhng ch dn
yu cu bn phng to hay thu nh.
1. Chn nh xem trc c ti u ho gc trn phi ca hp thoi Save For Web.
2. Trong menu pop-up Preset bn phi hp thoi, chn GIF 128 Dithered (nu nh ny cha c
chn)
Thng tin c trnh by ngay bn di nhng thay i ca nh xem trc. (xem hnh)
Photoshop CS
Hy Ch nhm im nh mu xm quanh hp th b st bao ph v trong phn nn vung xanh l

cy pha sau con s 4 trong biu tng.
Bn s dng 2 phin bn pha di ca nh so snh vic ti u ho ca tp tin GIF 128 Dithered
vi vic ti u ho ca dng JPEG v PNG.
3. Bm vo phin bn nh gc di tri chn n v chn cc tu chn JPEG sau y, mi thi
im chn 1 ln trn menu pop-up Preset:
JPEG Low. Ch l cc chi tit nh v vn bn nhn nhm khng chp nhn c.
JPEG High. Cht lng nh c ci thin nhng kch c nh cn hn gp 3 ln. (Xem hnh)
JPEG Medium. Vi thit lp ny, cht lng nh c th chp nhn c v kch thc nh
thp hn phin bn vi tu chn l JPEG High hoc GIF.
Ch : Bn c th chn mc cht lng trung bnh khc cho tp tin JPEG bng cch g vo hoc
ko con tr v bn phi ca hp thoi Save For Web.
V bn th cc thit lp khc nhau ca dng GIF v JPEG, bn s dng nh xem trc th t
th mt dng khc.
Photoshop CS
4. Chn nh nm gc di phi ri s dng menu Preset chn dng PNG-8 128 dithered.
D cc kt qu ny cho kch c tp tin nh hn nh gc, cht lng nh khng p bng nh JPEG
Medium, cng c kch c tp tin nh hn. Hn na, nhiu trnh duyt trc y khng c c dng
PNG. lm cho nh ny tng thch vi cc trnh duyt trc y, bn s lu tp tin ny cho trang
Web bng cch s dng
ti u ho ca dng JPEG Medium.
5. Chn dng JPEG Medium ca nh c ti u ( gc di tri ca hp thoi) v chn hp kim
Progressive.
Ch : Khi mc Progressive c chn, bt k khi no vic ti hnh nh xung bng nhiu con ng
xy ra, mi con ng gia tng cht lng hnh nh.
6. Bm Save. Trong hp thoi Save optimized as, dng tn mc nh 16Start1.jpeg v lu tp tin ny

trong cng th mc vi tp tin gc ca Photoshop.
7. Chn File > Close ng tp tin 16Start1.psd v ng lu nhng thay i ca bn.
Ti u ho mt nh dng GIF
By gi bn s ti u ho mt nh c cch iu ho thnh nhng mu nht, c ngha l nhng
vng m cc im nh k bn nhau c gi tr mu RGB tng t nhau. Bn s ti u ho nh ny
dng GIF v so snh cc kt qu ca bng mu khc v cc thit lp ho sc. D bn c th lm c
phn ny trong Photoshop, bn s dng ImageReady.
Photoshop v ImageReady c nhiu c im chung nhng c mt s thao tc no bn c th lm
trong Photoshop nhng khng th lm c trong ImageReady v ngc li. Mt s thao tc c
thc hin ph hp hn trong mt trnh ng dng ny hay trnh ng dng khc.
Nu bn c mt tp tin ang m, khi bn nhy t trnh ng dng ny sang trnh ng dng khc, tp tin
s nhy sang trnh ng dng bn ang m. Nu bn c nhiu
tp tin ang m, ch c tp tin kch hot mi c m trong trnh ng dng m bn va nhy sang.
Photoshop CS
Nu khng c tp tin no c m, bn c th nhy ti hoc lui t trnh ng dng ny sang trnh ng

dng khc. Trong mi trng hp, x l ch l mt ci bm chut.
S dng khng gian lm vic ca ImageReady c xc nh trc
Trc khi bt u lm vic trn mt tp tin mi, bn s nhy t Photoshop sang ImageReady. Bn s
sp xp li vng lm vic bng cch chn mt trong nhng khng gian lm vic c xc nh trc
lun lun sn c trn menu con vng lm vic ca ImageReady.
1. Trong Photoshop bn bm nt chuyn sang ImageReady cui hp cng c chuyn t
Photoshop sang ImageReady.
Ch : Nu bn khng c b nh (ram) chy 2 trnh ng dng ny cng mt lc, thot khi

Photoshop v bt u vi ImageReady.
2. Trong ImageReady, chn Window > Workspace > Optimization Palette Locations.
Ch c b Palette ch yu cn thit cho thao tc ti u ho c m ra trong vng lm vic : Nhm
Palette ti u ho v nhm Palette Color Table, cng vi hp cng c v thanh tu chn cng c. Nu
bn cn mt Palette khc ti mt thi im no , bn c th m li n bng cch chn n trn menu
Window.
Chn nhng thit lp ti u trong ImageReady

Trc y trong bi hc ny, bn dng cc thit lp ti u ca Photoshop c tch hp trong hp
thoi Save For Web. Trong ImageReady, cc tu chn tng t xut hin trong Palette Optimize.
1. Trong ImageReady, chn File > Open v m tp tin 16Start1.psd trong th mc Lesson16 trong th
mc Lesson.
nh ny c c to ra trong Adobe Illustrator v c mnh ho thnh dng Photoshop. nh ny
c cha nhiu vng mu c.
2. Bm tab 2-up trong ca s nh.
Photoshop CS
Phin bn ca nh c ti u ho c chn bn tay phi ca ca s.

3. Trong menu Preset pop-up trn Palette Optimize, chn tp tin GIF 128 No Dither.
4. Nu cn, bm mi tn m rng tu chn Color Table trn Palette Optimize ri chn Perceptual
trn Menu pop-up Reduction.
10
Photoshop CS
11
Photoshop CS
Chn mt gii thut gim mu

Mt trong nhng cch gim kch thc tp tin l gim s mu trong nh. Photoshop c th tnh ton
nhng mu cn thit nht cho bn da trn nhiu gii thut sn c. Bn xc nh gii thut no c
s dng bng cch chn t menu Color Reduction Algorithm gii thut no bao gm nhng tu chn
sau y:
Cm nhn (Perceptual): To mt bng mu thng thng bng cch a ra nhng mu u tin m
mt ngui c cm nhn ln hn.
Chn lc (Selective): To mt bng mu tng t vi bng mu Perceptual nhng u tin nhng
vng mu rng v gi li nhng mu ca trang Web. Bng mu ny
thng to ra nhng nh c hon chnh mu ln nht. Phn chn lc (Selective) l tu chn mc
nh.
Thch nghi (Adaptive): To bng mu thng thng bng cch ly mu nhng mu t quang ph
thng xut hin nht trong nh. Th d, mt nh ch c mu xanh l cy v xanh bin to ra mt bng
mu ch yu ch c mu xanh l cy v xanh bin. Hu ht cc nh u tp trung cc mu vo nhng
vng c bit ca quang ph.
Web s dng bng mu chun gm 256 mu thng thng i vi cc bng mu Window v Mac OS
8-bit (256 mu). H thng ny m bo c rng khng c s ho sc no c p dng cho cc
mu khi nhng hnh nh c th hin s dng mu 8 bit. Bng ny cn c gi l bng Web an
ton. Nu hnh nh ca bn c t mu hn tt c mu trong palette mu, nhng mu bt thng b loi
i.
T to (Custom): Gi li bng mu hin hnh nh mt bng mu c nh khng cp nht theo nhng
thay i ca hnh nh.
Window hoc Mac OS S dng bng mu mc nh ca h thng l 256 mu da trn mu thun nht
ca nhng mu RGB. Nu nh ca bn c t mu hn s mu tng cng trong palette mu, mu bt
thng cng b loi.
Thanh trng thi cui ca s nh th hin phng i v thng tin hu ch khc v nh c ti u
ho v nh gc.
12
Photoshop CS
A. Kch thc tp tin v thi gian ti xung hnh nh c ti u ho

B. Kch thc ca nh c ti u ho v nh gc.
Bn c th to tu bin cho loi thng tin xut hin y.
5. thanh trng thi, chn Size/Download Time (56.6 Kbps Modem/ISDN) trong menu pop-up gia
ri chn Image Dimension t menu pop-up bn phi.
Tc ti xung 56.6 Kbps thng thng hn tc 28.8 Kbps. Kch thc ny th hin kch c ca
nh bng nhng im nh. y l iu quan trng cn bit d nh lm th no cho 1 nh ph hp
vi 1 mu ca trang Web c thit k trc.
V bng mu
Palette Color Table th hin nhng mu m vic s dng tu chn gim mu dnh cho tp tin c
kch hot hin hnh. S lng mu dng trong nh ny c lit k di y ca palette vi nhiu
nt khc nhau.Bn c th ly li kch c ca Palette hoc dng thanh cun xem tt c cc mu.
Bn cng c th thay i cch cc mu c sp xp trong Palette bng cch bm chut vo mi tn
nh menu palette Color Table ri chn phng php phn loi : theo scmu, theo sng, hoc
theo mc ph bin thng dng.
Nhng biu tng khc nm ngay trn bng mu mu cho bit mu mu hin hnh (nu mu mu
c chn),cho d mt mu c b kho li hay khng, v cho d mt mu l mu b gii hn trn trang
(web). Bn s hc hi thm nhiu v vic nhn din v s dng nhng c im ny khi tin hnh qua
bi hc ny.
Ch : Trong Photoshop, bng Color Table nm trong hp thoi Save For Web.
13
Photoshop CS
iu khin ho sc v cc mu gim
Bn c th thy rng mt s vng no ca nh b lm m. Hin tng lm m ny l do ho
sc. K thut ny c dng nhi nhng mu khng c trong bng mu. Th d, mu xanh bin v
mu vng c th ho trn theo mt mu (gm nhng mnh mu nh c ghp li vi nhau) to ra
mt o gic c mt mu xanh l cy khng nm trong bng mu.
Khi ti u ho hnh nh, hy Ch 2 loi ho sc c th xy ra:
Ho sc ng dng: xy ra khi ImageReady hoc Photoshop c nhi nhng mu c trong nh

gc nhng khng c trong bng mu ti u m bn xc nh. Bn c th iu khin ho sc
ng dng bng cch ko con trt Dither vo bng Optimize.
Ho sc trnh duyt: c th xy ra bn cnh ho sc ng dng. Ho sc trnh duyt xy ra khi

mt trnh duyt web s dng nhng mu nhi 8 bit (256 mu) xut hin trong bng mu ca
nh c ti u ho nhng khng nm trong bng h thng do trnh duyt web s dng. Bn
c th iu chnh ho sc trnh duyt bng cch di chuyn nhng mu c chn vo
nhng mu web an ton trong bng Color Table.
Trc khi bn ti u ho nhiu hn, hy phng ln nh ti 200% hoc hn v so snh cc vng

chuyn tip gia nhng nh tht v nn mu c trong c 2 phin bn: nh c ti u ho v nh
gc c ti u ho. Trong nh gc, nh chp cch iu m dn vo nn. Trong nh c ti u ho,
s dch chuyn mang tnh t ngt v c cc ng bin th. Cng vy, hy Ch nhng dy mu
my hnh cu vng vng pha trn bn phi ca nh thung lng.
Gim palette mu
nn kch c tp tin c nhiu hn, bn c th gim lng mu trong bng Color Table. Phm vi
s mu b gim thng gi li cht lng hnh nh p trong khi gim dung lng tp tin cn thit
lu tr nhng mu tha mt cch ngon mc.
Hin gi, 128 mu to ra tp tin 16Start1.psd c th hin trong tu chn Colors trong bng Optimize
bn di Color Table. Mc tiu cui cng ca bn trong c phn ny l gim con s mu xung cn 32
m khng lm hng i bc nh.
1. m bo rng nh ti u ho c chn v cm nhn (Perceptual) c chn trong bng
Optimization. Ch kch c tp tin hin hnh.
2. Trn menu pop-up zoom y ca s nh, chn 200% hoc ln hn hoc s dng cng c phng
i phng ln tm nh ca bn. m bo rng bn phng i
ln bn bt u thy hin tng im nh ho ca nh.
14
3. Dng cng c Hand Tool
Photoshop CS
, chn nh bn phi ca th 2-up v ko bn c th nhn thy nhng
im sau y: Bng rm ca cy dng, mt s cy thung lng v nh ni vi mu xanh da tri

nht bn phi ca n.
4. Trong tu chn Colors trong bng Optimize, g hoc chn s 32 trong menu pop-up.
Ch gim ng k ca kch c tp tin nhng c 3 vn . Bng gia nhng hng cy dng by

gi l mu nu sm thay v l mu xanh l cy sm, trong khi nhng cy hnh thung lng l mu
xanh l cy sm thay v mu nu. Nhng m my trn bu tri thung lng mu nu c sc r rt trong
a sc mu.
15
Photoshop CS
5. Chn li tr s 128 trong tu chn Colors Mt cch hin nhin, ch n thun gim bng mu th
khng gii quyt c vn ny. y khng phi l kin hay. Tuy nhin, c mt s k thut m bn
s th sp ti y s cho nhng kt qu kh quan hn.
Tng ho sc to gi nhng mu b thiu
Trc khi bt u phng thc ny, bo m l bng Optimize vn cn th hin tu chn Perceptual
as the Reduction v
tr s 128 i vi Colors. Trong hnh thung lng, Ch dy mu nu kiu gradient trong nhng m
my. Bn s tp trung vo phn ny ca nh v bng cy dng khi bn chnh sa trong ch ny.
1. Bn di mc Dither trong bng Optimize, chn Diffuse trong menu pop-up Method v ko con trt
n 100%.
By gi mt mu m lm du s chuyn tip mu sc v vng my. Bt k s thay i no trong vng

cy dng u khng ng ch
2. Chn li tr s 32 trong tu chn Colors.
16
Photoshop CS
Hnh cy dng trng c v thm ch cn t hn trc y. Vng ny c mu xanh l cy sm gi y

xut hin nhng m nu sm trn mu xanh l cy va. Nhng m my trong vng thung lng trng
phng hn nhng bu tri trn thung lng v nhng nh ni - c hai trc y u l nhng mu
thun nht th by gi c m.
3. Ko con trt Dither xung 50% v th vi nhng t l khc.
ImageReady gim thiu ti a ho sc trong nh ny nhng khng c t l ho sc no s gi
nhng bng m khng lm tn hi n nn xanh l cy. Cng vy, gim t l ho sc s to ra
nhng sc a sc trong nhng m my bn trn thung lng.
4. Chn li Dither ti 100%
5. Chn li tu chn Colors l 128. (Gi nguyn nhng thit lp ca Dither.)
Bng cy dng mt ln na li bin thnh mu xanh l cy sm v cc m th khng hin r. Trong
khi kch thc tp tin nh hn nh gc cha c ti u ho, nh c ti u ho hi ln hn mt
cht m khng c ho sc. Bn cn nhiu vic phi lm ti u ho tp tin ny, hy sang ch k
tip.
Phn minh ho hiu ng t l ho sc khc nhau trn mt nh, xem hnh 16-2 trong phn mu sc.
Kho cc mu gi li cc chi tit ca hnh nh
Trong cc phng thc trc y, bn thy cch gim s lng mu c th lm mt mt s chi tit
trong nh, thm ch sau khi bn tng ho sc. By gi bn s hc cch kho nhng mu c bit
m bo nhng mu ny khng b gim trong bng mu.
Khi bt u thao tc ny, m bo bng Optimize th hin Perceptual, 128 mu v thit lp ho sc
l 100%.
1. Trong hp cng c, chn cng cEyedropper v bm chn mu xanh l cy sm nht. Bn s thy
trong bng cy dng ly mu mu .
Ch l hin gi mu xanh l cy sm xut hin trong bng Foreground Color swatch trong hp cng
c v mu mu li ti i vi mu xanh l cy sm trong Color Table sng ln vi ng bin mu trng.
17
2. Bm biu tng hnh chic kho
Photoshop CS
cui bng Color Table kho mu xanh l cy c chn.
Kho mt mu mu dnh u tin cho nhng mu khng b kho. Nu bn gim i s lng mu t

128 xung tr s thp hn, nhng mu b kho khng ng vi danh sch nhng mu khng b kho.
3. Trong bng Optimize, tr gi tr Colors v tr s 32

By gi bng mu xanh l cy trng p mt nhng hy Ch s ho sc c m ny i vo trong
vng bu tri trong thung lng mu nu v nhng vng ni mu xanh ca nh, bt u trng ging nh
mt cn bo tuyt. Mt ln na, nhng cy trong thung lng l ra l mu nu th li l mu xanh l cy
sm. D vy bn nn tip tc c gng.
4. Nhn gi thanh spacebar con tr thay i t biu tng cng c Eyedropper thnh biu tng
bn tay
. Ko tm nh phn na nh b che bi nh thung lng v phn na nh b che bi nh
ni.
5. Trong palette Optimize, chn tr s 128 trong tu chn Colors.

Tip tc sang ch k tip, bn s kho c nhiu mu hn cho n khi nh c c kt qu chp
nhn c.
18
Photoshop CS
Ch : Bn c th m mt mu b kho bng cch chn mu mu trong Color Table v bm nt

Lock mt ln na.
Kho nhiu mu ngn chn ho sc khng mong mun

Mt thch thc khi lm vic vi 32 mu l tm c 32 mu l tng. Nh bn thy trong phng
thc trc y, chnh sa mt hiu ng ho sc khng mong mun hoc dch chuyn mu trong mt
vng c th pht sinh mt s vn trong mt s vng no .
Th l b i qu trnh kho mu, bn s tip tc chnh li hnh nh bng cch kho nhiu mu. Bn s
chn la nhiu ln gia 32 mu v 128 mu. Kho mu gc khi gim xung 32 mu s gy ra ho
sc khng mong mun hoc c s thay i mu sc. Bn kho mt mu mt ln na, iu quan trng
l xem li c tm nh mt cch thn trng xem vic kho mu a n nhng h lu no.
1. Chn cng c Eyedropper v bm chn mu nu sm hin gi ang nm chnh gia nhng cy
trong nh thung lng. Bm nt Lock di y bng Color Table kho mu c chn.
Mt hnh vung nh xut hin trong th swatch cho thy mu ny b kho.

2. Lp li bc 1 thm 3 ln na, ly mu v kho cc phn sau y:
Vng tri mu nu va trong vng thung lng.
Vng tri nu sm gc trn tri ca nh ni.
Vng tri xanh nht bn phi nh ni.
19
Photoshop CS
3. Gim tu chn Colors xung tr s 32.

4. Nhn gi thanh spacebar con tr bin thnh biu tng bn tay v ko nh bn c th thy
ba rng pha trc ni, phn s 4 v vn bn gc di phi ca nh. By gi chp nh trong nh
mu xanh b ho sc khng th chp nhn c.
5. Thay i s lng mu v tr s 128 v s dng cng mt k thut m bn p dng bc 1 v 2
kho mu xanh sm phn chp nh ri tr li tu chn Colors chn tr s 32.
Phn chp nh trng rt p nhng gi y phn vn bn mu khaki b ho sc n n trng ging
nh hoa giy sc s. C ln; bn sp t ti mc tiu ri .
6. Tr s lng mu v tr s 128 v dng k thut m bn s dng bc 1 v bc 2 kho
mu. Trong tu chn Colors, chn tr s 32.
7. Kho st tng vng ca nh m bo rng khng c s dch chuyn no ca mu sc ri chn
File > Close.
Nu bn mun lm nh th, bn c th tip tc kho cc mu, chng hn nh mu sm hn ngay
chnh gia cy cau da hoc mt s mu khc.
Ch : C s ho sc khng th trnh khi c chng hn nh nhng vng c t mu ch
gradient. Mi mt trong 4 khi nh mu c ch gradient tch nn mu c khi nh m n cha.
Ho sc l chn la tt nht hi ho hiu qu ca nh v ngoi hnh ca nh i vi nhng thay i
mu gradient.
Nu bn th nghim vi vic ti u ho cc tp tin nh, bn s thy rng nht mu ca nh c th
xy ra khi bng mu b gim di 32 mu. Tht vy, hu nh nhng tm nh n gin nht, thm ch
32 mu, cng c th b gim st ng k. i vi vic nn mt tp tin nh dng GIF, c gng dng s
lng mu t nht th hin cht lng m bn cn.
20
Photoshop CS
Phn minh ha nh nhng gi tr ca palette khc nhau, xem hnh 16-1 phn mu.
Gim thiu ho sc trnh duyt

Trong Photoshop, hp thoi Save For Web v trong ImageReady, bn c th xem ho sc ng dng
trc tip trong nh c ti u ho. Bn cng c th xem trc ho sc trnh duyt ph xut hin
trong nh cui cng khi xem trong 1 trnh duyt s dng ch xem 8 bit.
Nh bn bit trc y, nhng nh bao gm cc mu khng an ton web phi tri qua qu trnh
ho sc khi th hin trong 1 trnh duyt web ch 8 bit v trnh duyt m phng mu khng xy ra
trong bng h thng 8 bit. T ImageReady, bn c th xem trc cch mt nh c ti u ho s
nh th no khi c ho sc trong 1 trnh duyt Web.
bo v mt mu khng b ho sc trong trnh duyt, bn c th dch chuyn web mu , i mu
ra mt gi tr tng ng gn nht trong bng Web. V d bng Web bao gm nhng mng mu
ph xut hin trong c bng h thng Window v Mac OS. Cc mu trong bng Web th hin m
khng ho sc trong cc trnh duyt trn bt c nn no.
1. Vi tp tin nh 16Start2.psd c m ra, chn View > Preview > Browser Dither ( du kim xut
hin bn cnh dng lnh.) Ch rng ho sc trnh duyt xy ra trn bu tri v dc ca nh thung
lng cho d bn kho mu nu va ca bu tri trc y trong bi hc ny. Bn s dch chuyn
web mu gim ho sc trnh duytn trong nh ny.
Ch : Nu bn khng thy ho sc, tng phng ln hoc tt phn xem trc ho sc trnh
duyt ri tr v quan st hiu ng. Bn c th bt/tt phn xem trc ho sc trnh duyt bng cch
nhn phm Ctrl+Shift+Y (Windows) hoc Command+Shift+Y (Mac OS)
2. Thot ra khi ch xem trc trnh duyt nhng ln ny nhn nt Ctrl+Shift+Y (Window) hoc
Command+Shift+Y (Mac OS) hoc bn c th dng lnh View > Preview > Browser Dither mt ln na.
3. Chn cng c Eyedropper v bm vo bt k ni no trn vng bu tri thung lng. Mu mu c
chn trong bng Color Table.
21
4. Bm nt Web-shift
Photoshop CS
y bng Color Table.
Mu mu i v tr trong bng v mt vin kim cng nh xut hin chnh gia mu mu cho thy rng
n c dch chuyn sang mu tng ng gn nht ca Web.
5. S dng cng mt k thut, chn mt mu mu nu nht hn trn dc ca thung lng v bm
ntWeb-shift mt ln na.
6. Chn View > Preview > Browser Dither, hoc nhn Ctrl+Shift+Y (Window) hoc
Command+Shift+Y(Mac OS) xem trc tp tin trong ch ny.
Ho sc trnh duyt mt i khi nhng vng c chn v phn cn li ca nh l c th chp nhn
c.
7. Chn View > Preview > Browser Dither b chn n ri chn File > Save.
Bng cch dch chuyn web nn mu nu, bn i mu ca n thnh mt mu c th hin th m
khng b ho sc bi trnh duyt Web trn h thng 256 mu.
Ch : Trong Photoshop CS v ImageReady CS bn c th chuyn i nhanh mt mu sang mu
khc hoc sang trng sut.Vic chuyn i ny gn li tt c nhng im nh xut hin mu chn
thnh mu mi hoc trng sut. bit thm thng tin, xem phn tr gip ca ImageReady.
22
Photoshop CS
Ti u ho cc Slice
Cc nh thit k chuyn nghip thng kt hp cc loi ngun nh khc nhau thnh mt nh n
thun trong Photoshop hoc ImageReady. Th d, bn c th to mt tp tin nh gm nhng nh c
nhng vng mu nht v kiu in kt hp vi nhng nh c tng mu lin tc hoc nhng nh khc
ch t mu theo t l v bng phc tp. Rt kh t c nhng kt qu tho ng khi ti u ho
nhng nh nh th nu ch s dng n thun mt phng n ti u ho.
Nu bn chia nh thnh tng slice, bn c th ti u ho tng slice ri bit lp. Th d, bn c th ng
dng vic ti u ho dng GIF cho mt s vng trong 1 nh trong khi ng dng vic ti u ho dng
JPEG hoc PNG cho cc nh khc. lm iu ny, bn ch vic chn mt slice ring (dng cng c
chn slice) v thit lp tu chn ti u ho trong hp thoi Save For Web (Photoshop) hoc bng
Optimize (ImageReady).
Xc nh trong sut ca phn nn
Bn c th s dng trong sut ca phn nn t mt i tng ha khng phi l hnh ch
nht ln nn ca trang Web; nhng vng ngoi bin ca i tng c xc nh l trong sut,
mu nn ca trang Web th hin xuyn sut. Bn c th xc nh trong sut ca phn nn i vi
cc nh dng GIF v PNG.
Chuyn i lp nn (Background) thnh lp bnh thng
Trc khi bn s dng kh nng ca tp tin dng GIF gi li trong sut, bn phi to trong
sut trong nh ca bn. Bn s lm iu bng cch di i phng mu trng xung quanh nh. bt
u tin trnh ny, u tin bn s chuyn i lp Background thnh lp bnh thng v lp
Background lun lun b kho v khng th c trong sut.
1. m bo rng tp tin 16Start2.psd ang c m trong ImageReady.
2. Chn nh gc bn tri ca ca s nh.
3. Chn Fit on Screen t menu Zoom Level gc pha tri bn di ca ca s nh.
4. Chn Window > Layer m bng Layers ri m menu ca bng layers v chn Layers Options.
23
Photoshop CS
5. Bm OK ng hp thoi Layer Options m khng thay i nhng thit lp mc nh ( k c tn

Layer 0). Lp ny gi y xut hin trong bng Layer l Layer 0.
Layer Background khng th cha bt c thng tin no v trng sut v theo nh ngha, khng c
g pha sau n c nhn thy. Nu bn c gng dng mt trong nhng k thut thng c th thay
th cc im nh mu bng nhng im nh trng sut, kt qu s l cc im nh gc s c
chuyn thnh mu nn c chn hin hnh thay v tr thnh nhng im nh trng sut.
S dng cng c Magic Eraser to trng sut
Trong phn ny ca bi hc bn s s dng cng c Magic Eraser chuyn i nhanh nn mu trng
pha sau cc nh v ch vit thnh cc im nh trng sut.
Tuy nhin, bn khng mun xo bt k im nh mu trng no c th xut hin bn trong nhng tm
nh mu. Bn s hon tt iu ny qua 2 bc.
1. m bo rng nh gc bn tri ca ca s nh c chn. Bn c th xo nhng im nh nn ch
trong nh cha c ti u ho, ch khng phi trong nh c ti u ho.
2. Chn cng c Magic Eraser l cng c n nm di cng c Eraser.
24
Photoshop CS
3. Trong thanh tu chn cng c, m bo rng hp kim Contiguous ang c chn.

4. Bm vo nn trng xung quanh nhng nh mu.
Mu checkerboard thay th nn trng cho thy rng vng ny trong sut

5. Bm chn vng mu trng hnh ch nht ang nm chnh gia 4 khi mu.
Gi y hu ht phng nn mu trng b xo ngoi tr nhng hn o nh gm nhng im nh
25
Photoshop CS
mu trng trong vng c ch c khp kn.

Chuyn i nhng vng mu trng b c lp thnh trong sut
Cng c Magic Eraser khng xo nhng vng mu trng b c lp trong vng ch v tu chn
Contiguous ang c chn trong thanh tu chn cng c.
Mt cch chnh sa im ny l phng to ra v bm vo mi vng mu trng trong cc ch, ging y
nh bn bm vo hnh ch nht mu trng nm gia nh.
Thay v th, bn s s dng mt phng php hot ng hu hiu hn nhiu trong nhng trng hp
c mt s ln cc vng nh nm ri rc m bn mun xo trong khi mun gi li nhng vng c cc
im nh mu tng t m bn khng mun xo.
1. Trong thanh tu bin cng c i vi cng c Magic Eraser, b tu chn Contiguous.
2. Chn cng c Rectangular Marquee v cn thn v mt vng chn hnh ch nht bao quanh ch
Corners trong nh gc nm bn tri.
3. Bm gi phm Shift con tr bin thnh biu tng 1 du cng nh xut hin v ko 1 vng chn
khc hnh ch nht quanh ch Travel v ch of. Hai vng chn tr thnh mt vng. (Bn c th to
vng chn ring bit cho ch of nu bn thch gi phm Shift v ko gia tng vng chn. Hoc bn
c th thm 1 khi mu vng nh khi bn chn ch Travel v ch of.)
26
Photoshop CS
4. Chn cng c Zoom v phng ln bn d nhn thy nhng vng nm trong vng chn (khong
300%).
5. Chn cng c Magic Eraser ri cn thn bm vo nn mu trng trong ch O.
Cc im nh mu trng trong ch O c chuyn i thnh cc im nh trong sut, tng t cc

im nh trong ch A v R trong ch Travel v ch O trong ch of cng c tc dng nh vy.
6. Chn Select > Deselect ri chn File > Save.
Hon tt bng Color Table
Mc d ngi ta t ngh trong sut l mt mu, n khng c xem nh 1 trong 32 mu trong bng
mu i vi hnh nh.iu ny c ngha l bn cn li hnh nh mt ln na tm ra bt k ho
sc no khng th chp nhn c gy ra do s chuyn dch sang trong sut.
1. Cun hoc chn cng c bn tay v ko xem xt tt c cc vng ca nh.
Ch hin gi c ho sc nng trong vng mu xanh xung quanh cy dng.
27
Photoshop CS
2. Chn nh c ti u ho nm bn phi ca s nh.

3. Trong tu chn Color ca palette Optimize, chn tr s 128.
4. Chn cng c Eyedropper v bm chn vng mu xanh va gc trn bn phi ca nh cy dng.
5. Trong bng Color Table, bm vo biu tng kho kho mu.
6. Trong palette Optimize, chn tr s 32 l s lng mu.

7. Cun hoc s dng cng c bn tay xem hnh mt ln na, xc nh rng nh c s cn bng
hi ho gia ho sc v kch thc tp tin. Chn File > Close.
Xem trc trong sut
By gi bn s xem trc trong sut trong trnh duyt ca bn. V c im xem trc trong
ImageReady th hn hnh nh ny trn trang web vi nn trng, bn s thay i mu ca nh c
th thy trong sut.
1. Trong ca s nh, chn nh c ti u ho (nm bn phi)
2. Trong bng Optimize, m bo hp kim Transparency c chn.
28
Photoshop CS
Chn Transparency chuyn i nhng vng trong nh gc vi m c nh hn 50% sang m

c nn trong nh c ti u ho.
3. Chn mu Matte trong palette Optimize m color picker ri chn bt k mu g tr mu trng.
Bm OK ng color picker.
4. Chn File > Preview In v chn trnh duyt web t menu con
Ch : s dng lnh Preview In, bn phi c mt trnh duyt Web ci trn h thng ca bn.
Nu nh cha m ra, trnh duyt u tin bt u ri hin nh c ti u ho gc trn tri ca
ca s trnh duyt. Trnh duyt ny cng cho bit kch thc im nh, kch thc tp tin, dng tp tin
v cc thit lp ti u ho cho nh cng vi m HTML c dng to ra phn xem trc.
29
Photoshop CS
5. Thot khi trnh duyt khi bn kt thc phn xem trc nh.
Xn vng nn tha
D phn nn ca nh t chc du lch gi tng hin gi c cha cc im nh trng sut nhng khng
th hin, nhng im nh ny vn cn chim khng gian tp tin, tng thm kch thc ca nh. Bn c
th xn i phn vng nn khng cn thit ci thin b cc ca nh v ti u ho kch thc tp tin.
1. Trong ImageReady, chn Image > Trim.
Bn s dng lnh Trim xn nh theo trng sut hoc mu im nh ca vng bin tha.
2. Trong hp thoi Trim, chn cc im nh trng sut nu cha c chn v bm OK.
30
Photoshop CS
ImageReady xn vng trng sut tha ra khi nh.

3. Chn File > Save Optimized As.
4. Trong hp thoi Save Optimized As, dng tn mc nh (16Start2.gif) v bm chn Save.
5. Trong hp thoi Replace Files, bm Replace (nu n xut hin)
6. Chn File > Close.
7. Bn s c nhc lu tp tin
16.Start2.psd trc khi ng n li. i vi bi hc ny bn kt thc vi tp tin ny nn khng cn
lu nhng thay i cui cng.
To s trong sut ho sc
Trong phn ny ca bi hc 16, bn s to mt trong sut ho sc cho 1 nh ho c dng
trong 1 vng khc ca Web site cho t chc du lch gi tng. Bng cch to mt ho sc t bng
m c thnh trng sut, bn s c th to ra mt s chuyn dch uyn chuyn t nh ny sang
phng nn thuc bt k mu no trn trang m khng phi lm li bt c vic g.
Bn s lm iu ny trong 2 th tc. u tin bn s p dng mt hiu ng bng vo nh. Tip n
bn s thm ho sc vo bng n pha trn thnh mu nn cho trang Web. Bn c th lm
iu ny trong Photoshop v ImageReady, s dng cc phng php iu khin ging nhau trong
nhng v tr hi khc mt cht.
Thm 1 bng
Tp tin bn s lm vic c tc dng nh mt nh m nhng ngi s dng bm vo m trn 1
31
Photoshop CS
trang khc ca Web site. Bn s thm 1 bng vo nt ny lm cho nh ni ln trn phn nn,
nhn mnh rng n l thnh phn tng tc ca trang ny.
1. Chn File > Open ri chn tp tin 16Start3.psd trong th mc Lesson16 ca th mc Lesson.
2. Nu cn, chn Window > Layers m bng Layers ri chn layer1 nu n cha c chn.
3. Chn nt Add A Layer Style cui bng layers ri chn Drop Shadow t menu.
4. Trong hp thoi Layer Style, nhp vo cc gi tr nh sau:
i vi mc Opacity ko con trt hoc g vo gi tr 65%.
i vi mc Distance, ko con trt hoc g vo tr s15px.
i vi mc Spread, ko con trt hoc g vo tr s 10%.
i vi Size, ko con trt hoc g vo tr s 15px.
5. Bm chn OK ng hp thoi Drop Shadow.
6. Chn File > Save.

Thm ho sc trong sut vo bng
Nh bn bit, ho sc chnh l 1 phng php to s chuyn tip mu trong bng mu gii hn.
iu ny hu ch i vi cc trang Web v bn c th bt chc s gim mu lin lc hn m khng
lm nh hng n kch c tp tin v ti xung nhanh.
1. (Ch p dng trong Photoshop) Vi tp tin 16Start3.psd ang m, chn File > Save For Web m
hp thoi Save For Web. Bc ny khng cn thit trong ImageReady.
32
Photoshop CS
2. Bm th Optimized trong hp thoi Save For Web (Photoshop) hoc ca s nh (ImageReady) ri

thit lp cc tu chn sau y bn phi hp thoi Save For Web (Photoshop) hoc bng Optimize
(ImgeReady):
Trong menu Preset, chn GIF 128 Dithered.
Chn hp kim Transparency nu hp ny cha c chn.
Trong menu Dither dnh cho Transparency, chn Diffusion.
Trong tu chn Amount, dng con trt hoc nhp tr s 64%.
3. Bm Matte swatch m hp Color Picker. Chn bt k mu no khc mu trng v bm OK.

(Chng ti chn R=250, G=234, B=212), mu nu nht lm ni bt nhng mu xanh trong nh hp th.
thy c hiu ng ca thit lp li (matte), c gng phng ln khong 400% v thm ch ti
1600% l ti a bn nhn thy cc im nh ring r trong ho sc. Ch rng cc im nh
nm st ra ca hp th v vng khung mu xanh l mu sm,v nhng mu khc gia tng ho trn
vi mu matte v tr nm xa ra. Thu nh li cn 100%.
33
Photoshop CS
4. Lm 1 trong cc vic sau:
(Trong Photoshop) y hp thoi Save For Web, bm vo nt c biu tng trnh duyt
hoc bm mi tn chn trnh duyt t menu.
(Trong ImageReady) S dng nt Preview In Default Browser hoc menu con Preview In trn
menu File m tp tin trong 1 trnh duyt.
5. Trong trnh duyt, Ch cch bng c ho trn vo mu matte nn. Khi xem xong ti liu,
ng trnh duyt hoc tr v Photoshop hay ImageReady
6. Bm nt Save trong hp thoi Save For Web (Photoshop) hoc chn File > Save Optimized
(ImageReady).
7. Trong hp thoi Save Optimized, chp nhn cc thit lp mc nh v tn ca tp tin (16Start3.gif)
34
Photoshop CS
v lu tp tin trong Lessons/Lesson16 folder.

8. Chn File > Save lu tp tin 16Start3.psd hoc ng tp tin li khng cn lu.
Ti u ho tp vic x l hng lot tp tin
ImageReady h tr vic x l hng lot qua vic s dng Droplets - biu tng cha nhng hot ng
dnh cho ImageReady thc hin trn 1 hoc nhiu tp tin. Droplets d to v d s dng. to
mt droplet, bn ko biu tng droplet ra khi bng Optimize vo trong desktop. s dng n, bn
ko 1 tp tin hoc 1 th mc qua biu tng droplet trn desktop.
1. Trong ImageReady, chn File > Open, m bt k tp tin no trong th mc ch Lessons/Lessons16.
2. Th nghim vi cc dng tp tin khc nhau v cc thit lp khc trong bng Optimize nh bn mun
cho n khi bn hi lng vi kt qu. (Chng ti s dng nh dng , JPEG, High cho cht lng v tu
chn Progressive.)
3. Ko biu tng Droplet
ra khi bng Optimize v t bt c ni no trn Desktop. (Nu bn ang
s dng Window, c th bn phi ly li kch thc ca s ImageReady thy c desktop.)
4. ng tp tin li (khng lu)

5. T Desktop ko th mc ch t th mc Lesson16 trong th mc Lessons v th n vo droplet
x l hng lot cc nh ho trong th mc.
ImageReady ti u ho mi nh v thm nh Web vo th mc ch.
35
Photoshop CS
6. Trong ImageReady, m bt k hoc tt c cc tp tin c nh dng JPEG trong th mc ch.

Ch l tt c u c ti u ho theo cc thit lp xc nh khi droplet c to ra.
7. Thot ImageReady. By gi bn kt thc chng trnh v bi hc ny.
36
Photoshop CS
Cc cu hi n tp
1. i vi vic ti u ho hnh nh, u l nhng u im ca vic s dng ImageReady so vi
Photoshop?
2. Color Table l g?
3. Khi no th ho sc trnh duyt xy ra v lm th no bn c th gim thiu s ho sc trnh duyt
trong 1 nh?
4. Mc ch ca vic gn matte color cho nh GIF l g?
Cc cu tr li n tp
1. Tht s c nhiu li im khi s dng mt trnh ng dng ny i vi trnh ng dng khc trong vic
ti u ho.C Photoshop ln ImageReady u c th thc hin c mt phm vi rng ri nhng thao
tc nhm ti u ho nh. ImageReady c nhiu c im chuyn Web m bn s khng tm thy trong
Photoshop, nhng ti u ho hnh nh khng phi l mt trong nhng c im ny.
2. Color Table l mt bng cha cc mu s dng nh 8 bit. Bn c th chn 1 color table cho nh GIF
v PNG-8, thm, bt v chnh sa mu trong Color table.
3. Ho sc trnh duyt xy ra khi mt trnh duyt Web nhi nhng mu xut hin trong bng mu ca
nh nhng khng xut hin trong h thng hin th ca trnh duyt.
bo v mt mu khi ho sc trnh duyt, bn c th chn mu trong bng Color Table ri bm
chn nt Web-shift cui bng dch chuyn mu sang mu
tng ng gn nht ca n trong bng Web.
4. Qua vic xc nh mt li mu (matte color), bn c th pha trn phn no cc im nh trong sut
trong 1 nh vi mu nn trong trang Web ca bn. Vi li (matting), bn c th to nhng nh GIF
vi ra mm mi khng c rng ca ho sc nh nhng vo mu nn ca trang Web. Bn cng c th
xc nh ho sc
thnh trong sut.
www.vietphotoshop.com - Nguyn Tn S
|Trang ch| |Photoshop CS| |Chng 17|
37

Hướng dẫn sử dụng Photoshop

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Hướng dẫn sử dụng Photoshop

Uploaded by

Copyright:

Available Formats

Chng 16: Ti u ho hnh nh trn trang web

c nhng hnh nh hiu qu trn trang Web, hnh nh ca bn phi c c s cn bng hi ho

Ti u ho cc tp tin dng JPEG v GIF, iu chnh cc xc lp ti u ho t c s

Xc nh trong sut cho mt nh.

X l hng lot cc tp tin nhm t ng ho qu trnh ti u ho.

Bi hc ny cn 1 ting 30 pht hon tt. Bi hc ny c son dnh cho Adobe Photoshop v

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

S dng Photoshop v ImageReady ti u ho hnh nh

Dng JPEG c thit k gi li mu rng v sng r ca nhng nh c tng mu

Dng GIF hiu qu i vi nhng nh nn mu c v nhng nh c nhng vng mu lp li

Dng PNG hiu qu i vi nhng nh nn mu c v gi c chi tit sc nt. Dng PNG-8

Dng WBNG l dng chun cho vic ti u ho cc hnh nh i vi cc thit b di ng chng

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

cc dng tp tin v cc xc lp cho ph hp vi cc mc tiu i vi d n ca bn. Bn cng c th

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

5. Chn nh nh c tn 16End1.jpg. Ch l kch thc tp tin c lit k trong phn metadata th

trn thanh tu chn cng c 2 ln (mt ln a n

v pha trc v mt ln ng n li) hoc bm nt Close trong ca s ca File Browser.

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

S dng hp thoi Save For Web

Photoshop t ng a ra 3 thit lp ti u ngoi nh gc ra. Ch thng tin c trnh by di mi

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

So snh cc dng GIF, JPEG v PNG c ti u ho

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

Hy Ch nhm im nh mu xm quanh hp th b st bao ph v trong phn nn vung xanh l

JPEG Low. Ch l cc chi tit nh v vn bn nhn nhm khng chp nhn c.

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

6. Bm Save. Trong hp thoi Save optimized as, dng tn mc nh 16Start1.jpeg v lu tp tin ny

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

Nu khng c tp tin no c m, bn c th nhy ti hoc lui t trnh ng dng ny sang trnh ng

Ch : Nu bn khng c b nh (ram) chy 2 trnh ng dng ny cng mt lc, thot khi

Chn nhng thit lp ti u trong ImageReady

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

Phin bn ca nh c ti u ho c chn bn tay phi ca ca s.

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

Chn mt gii thut gim mu

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

A. Kch thc tp tin v thi gian ti xung hnh nh c ti u ho

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

Ho sc ng dng: xy ra khi ImageReady hoc Photoshop c nhi nhng mu c trong nh

Ho sc trnh duyt: c th xy ra bn cnh ho sc ng dng. Ho sc trnh duyt xy ra khi

Trc khi bn ti u ho nhiu hn, hy phng ln nh ti 200% hoc hn v so snh cc vng

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web

3. Dng cng c Hand Tool

, chn nh bn phi ca th 2-up v ko bn c th nhn thy nhng

im sau y: Bng rm ca cy dng, mt s cy thung lng v nh ni vi mu xanh da tri

Ch gim ng k ca kch c tp tin nhng c 3 vn . Bng gia nhng hng cy dng by

www.vietphotoshop.com - Dch bi Nguyn Tn S

Chng 16: Ti u ho hnh nh trn trang web