26/3/2015

Optimizacindeimgenesparasuusoeninternet

Optimizacindeimgenesparasuusoeninternet
Sidespusdeleerestemanualtienesalgunadudayquierespublicarunapreguntapuedesusarelforode
videoedicion.org
http://www.videoedicion.org/foro
Lassiguientescategorasdelforoestnespecialmenterelacionadasconestemanual:
Fotografaeimagen(General)>http://www.videoedicion.org/foro/index.php?board=94.0
Porfavor,antesdepublicarnadaasegratequeconoceslasNormasdevideoedicion.org
Sitodavanoestsfamiliarizadoconelusodelforo,porfavor,consultalaAyudadevideoedicion.orgyla
AyudaparaelusodelforoSMFenvideoedicion.org
Siquiereseditaralgoenestapgina,porfavor,consultaCmoseeditaunapgina
Graciasportucolaboracin
http://www.videoedicion.orgRamnCutandaLpez(videoed)

NOTA:PuedescomplementarlainformacindeestemanualconelartculoCmohacerquelasimgenespesenpocodelaWikipedia
NOTA2:Sinoestsmuyinteresadoenentrarenlas"entraas"delaoptimizacinysloteinteresaalgo"rpidoyfcil"terecomendaraleer
nicamenteelapartadoMicrosoftImageResizer(ocmooptimizarconslo4clics)

Introduccin:porqudeberaoptimizar?
Antesdequete"calienteslacabeza"leyendoningnotroapartadodeestemanualquisieracontestaralapregunta
que,muyseguramente,teestshaciendo:Porqudeberaoptimizar(signifiqueloquesignifiqueoptimizar)
lasimgenesquesuboainternetconlofcilqueresultapincharen"Subir"paraalojarunaimageny
olvidarmedetodolodems?Bsicamentepordosmotivos:
Porhacermeunfavorpersonal.Silasimgenesestnoptimizadasseconsumemenosanchodebanda(se
generamenostransferenciasdedatos),loquemeevita,enlamedidadeloposible,tenerquecontratarms
anchodebanda...ytenerquepagarmsporello.Conlasimgenessucedecomocontodaslascosasde
ecologa.Casisiempretenemoslasensacindeque"porunafotonopasanada"perocuandosonMILESde
fotoslasquealojamoslasdiferenciasenlastransferenciasmensualespuedenserabismales,talycomo
veremosalolargodeestemanual
Porhacerleunfavoralosusuariosconconexionesmslentasodepagopordescarga(comoencasode
navegacin3G),yaquelasimgenesoptimizadascarganmuchomsrpidamenteporquesetransfieren
muchosmenosdatos.

Aclarandotrminos:tamaoypeso
Solemosdecirqueunaimagentieneuntamaode800x600,porejemplo.Tambineshabitualdecirqueunaimagen
tieneuntamaode300Kbytes.Esdecir,usamoslamismapalabra,tamao,parahablardedosconceptostotalmente
diferentes.Delmismomododecimosqueunaimagende1024x768esgrandeytambindecimosqueesgrande
porquetiene2Mbytes.Aunqueeneldaadaestaimprecisinnosuelesercausadeproblemasesesencialquealo
largodeestemanualquedeclaroentodomomentoaquaspectodeunaimagennosestamosrefiriendo.
Tamao,enpxeles:Siemprequeenestemanualhablemosnicamentedetamaovamosareferirnosalas
dimensionesdelaimagen.Lasimgenesseformanapartirdepuntosdecolor.Estospuntossellaman,
comnmente,pxeles.Cuantomspxeles(puntos)tengaunaimagenstatendrmayorresolucin,mayor
detalle.Estosecompruebafcilmentehaciendozoomsobrelaimagen.Enunaimagengrandepodremosver
muchosdetallesandespusdehaberampliado.Enunaimagenpequeanosirvedenadaampliarporquesolo
sevengrandescuadrosquedesvirtanporcompletolaimagen.
Entenderemosqueunaimagenes:
Grandecuandotengountamaosuperioroiguala1024x768pxeles(puntos)
Medianacuandosutamaooscileentre320x240y1024x768pxeles(puntos)
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

1/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

Pequeacuandosutamaoseainferiora320x240pxeles(puntos)
Muypequeacuandosutamaoseainferiora100x100pxeles(puntos)
Peso,enKbytes:Enestemanualllamaremospesoalespaciodediscoomemoriaquenecesitamospara
almacenarunaimagen.As,entenderemosqueunaimagenes:
Pesadacuandosupesoseasuperioroiguala1Mbyte(1.024Kbytes)
Pesomedianocuandosupesooscileentre300Kbytesy1Mbyte(1.024Kbytes)
Ligeracuandosupesoseainferiora300Kbytes
Muyligeracuandosupesoseainferiora100Kbytes

Quentendemosporoptimizar?
Sihasledolosdosprrafosanterioresintuirsqueloquepretendemosesdisminuirenloposibleelpesodelas
imgenes.Estoes,nuestroobjetivoeshacerquelasimgenesocupenelmenorespacioposibleenlamemoriao
disco.Deestamaneralograramoslosdosobjetivosplanteadosenlaintroduccin:
1. Silasimgenesocupanmenosespacioenelservidorparaalbergarelmismonmerodeimgenesnecesito
contratar(ypagar)menosespacioamiproveedor
2. Cuantomenospesotengaunaimagenmenosdatoshayquetransferirdesdeelservidorhaciaelusuarioy,por
tanto,segeneramenosgastodeanchodebanda(tambinpagomenos)ylanavegacinesmsrpida.
Peroaligerarpesonoesigualaoptimizar.Cuandohablamosdeoptimizarqueremosdecirlograrimgenes
delmenorpesoposiblesinunareduccindecalidadrealo,almenos,aparente.
Pongamosunejemplo.Fjateenlasdosimgenesquepresentoacontinuacinytratadeencontrarlas7diferencias:

Sihasencontradolasdiferencias....enhorabuena!...porquenolashay.Lacalidadenlasdosesexactamentela
misma.Sinembargo,laprimeraimagentieneunpesode204Kbytesmientrasquelasegundapesa3,45Kbytes.S...
hasledobien...nomeheequivocadoconlacoma.Siquierescomprobarlopinchaenlasimgenesconelbotn
derecho,veaPropiedadesycomprubalotumismo.Teniendolamismacalidad,laprimeraimagenpesacasi60
vecesmsquelaotra.Dichodeotromodo...enelespacioytiempoquehemosdescargadoUNAimagen
podramoshaberdescargado60.Teparecesuficientemotivoparaoptimizar?

Cualeseltruco?
Volviendoalejemploanterior...cmoesposiblequeteniendounacalidadidnticaunamismaimagenpueda
pesar60vecesmsqueotra?Qupuedohaceryoparaquemisimgenesbajendepesodeformatan
espectacular?
Hedereconocerqueheelegidounejemplo"fcil"parallamarlaatencin...perotienesqueadmitirqueelejemplote
haimpactactadoy,comopoco,tepicalacuriosidad...
Existendostiposdeimgenes,artificialesyreales,ylosdosseoptimizandeformadiferente.Lasimgenes
artificiales,comolaqueheusadoenelejemplo,permitenreduccionesdepesorealmenteasombrosasmanteniendo
un100%decalidad.Lasimgenesrealestambinpuedenreducirsupesodeformanotable,perosiemprehabruna
prdidadecalidad,aunquedependiendodecmolohagamoslaprdidadecalidad,aunquelahaya,puedellegara
serinapreciableparaelojohumano.

Burrogrande...andeonoande?
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

2/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

Todosestamosdeacuedoenquecuantomayoreseltamaodeunaimagen,estoes,cuandomspuntostenga,
tienemejorcalidad.Tienemsdetalle,msdefinicin,perolapreguntaes....realmentenecesitamossiempre
usarimgenesalamximaresolucin,conelmayortamaoposible?Lamayoradeusuariostrabajamoscon
resolucionesdemonitordeentre800x600y1600x1200puntos(pxeles),luegousarimgenesdeuntamaomayor
resultaademsdeintil,molesto,porqueparapoderverlaimagenalcompletoaparecernunasmolestasbarrasde
desplazamiento.Lasimgenespublicadaseninternetdeberantenerunanchomximodeentre400y800
puntos.Lostamaossuperiores,ademsdeentorpecerlanavegacin,aumentaninnecesariamenteelpesodela
imagenporquecuantosmspuntos(pxeles)tieneunaimagenmsinformacincontieneycuantamsinformacin
contienemspesofinaltendrelarchivodelaimagen.
Porfavor,tenestoencuentacuandovayasapublicarimgeneseninternet.Situsimgenestienenuntamao
superiora800puntoshorizontalesreducesutamaouofrece,almenos,unaversinreducidaparapresentarlaen
pantallayunaversincompletaparaquienquieraverlaimagenconel100%decalidad(verVnculosaimgenes)

Paletasdecoloreseimgenesartificiales
Elsecretoestenlamasa...ups...perdn...esoeradeotroanuncio.Loquequeradeciresquelaclavepara
aligerarunaimagenartificial,estoes,noreal,estenoptimizarsupaletadecolores.Lapreguntaahoraes...yqu
naricesesesodelapaletadecolores?(cmohacerloloveremosmsadelante)
Enlavidareallasimgenestienenmillonesdecolores,perocuandotrabajamosconimgenesartificiales,comolas
capturasdepantallaquesolemoshacerparaexplicarcmofuncionaunprograma,lohabitualesqueestastengan2,
4,16,32,64,128256colorescomomucho.LaprimeraimagendelejemploanteriorestguardadaenformatoBMP
de32bitsquealmacenanadamsynadamenosque4.294.967.296colores(msde4.000millonesdecolores)de
ahsugrantamao.Sinembargo,esaimagenslocontiene88coloresdiferentes.SienlugardeusarelformatoBMP
usamosunformatoquepermitalimitarlapaletadecolores,comoGIFoPNG,podemosgenerarunarchivoque
nicamenteguardelainformacindeloscoloresqueREALMENTEseusanenlaimagen.Sinperderniunsolobitde
informacinlaoptimizacindelpesodelarchivoesmximaenestoscasos,talycomohemospodidocomprobarcon
elejemploanterior.

Compresineimgenesreales
Todoslosquehemoscompradounacmaradefotosdigitalsabemoslodecepcionantequeescomprobarqueconla
memoriaoriginaldelacmarayusandolosajustesquevienenpordefetoapenasspodemoshacerunas20fotos.
Sinembargo,sibajamoselniveldecalidadpodemosaumentarelnmerodefotosquelacmaraescapazde
almacenarhastallegaraunas100aproximadamente.Elespaciofsicodisponibleenlamemoriadelacmaraesel
mismoperoelespacioqueocupanlasfotosvaraenfuncindelosajustesdecalidadytamaoqueleelijamos.
Los256coloresqueofrecenlaslaspaletasdelosformatosdearchivosartificialesresultandeltodoinsuficientespara
recogerlagamadecoloresdelavidareal.Paratrabajarconfotosrealistasseusaunaprofundidaddecolorde24
bits,estoes224coloreso,encristiano,algomsde16,7millonesdecolores.Optimizarlapaletadecoloresenun
imagenrealesposible,perolareduccinensupesoescasidespreciable,porloqueparaquelaoptimizacinde
imgenesrealesseaafectivahayqueusarotrosmtodosdeoptimizacin.
Existendiversosformatosdearchivoquepermitenreducirengranmedidaelpesodelasimgenesdecoloresreales,
peronosvamosacentrarexclusivamenteenunoporsercondiferenciaelmsempleado:elJPEG.Sepuedeafirmar
que,sinlugaradudas,elformatoJPEGeselmsusadoadadehoy.EncontramosimgenesJPEGeninternet,
CDs,cmarasdigitales,telfonosmviles,PDAs...Esms,losDVDsdevdeo,cmarasDV,DivX,televisinsatlite
odigitalterrestre...todosellosusanvariacionesdelformatoJPEGparaimgenesenmovimiento.

ElformatoJPEG
NOTA1:EnesteapartadovamosaofrecerunavisinsimplificadayprcticadecmotrabajarconelformatoJPEG.Siquieresampliarinformacin
sobreesteformatopuedesconsultarelartculoJPEG(JointPhotographicExpertsGroup)delaWikipedia.
NOTA2:Lasimgenesdeejemplonicamentesevenunaalladodelaotracuandosevisualizaestapginaconunaresolucindemonitorde,al
menos,1024puntos.Silasfotosteaparecenunaencimadelaotraenlugardeunaalladodelaotrapuedesusarlaversinparaimprimirpara
visualizarcorrectamenteelmanual.Disculpalasmolestias.Nomedicuentadeestedetallehastadespusdehabersubidolasimgenes,yahora
seramuylaboriosovolveraprepararlasconuntamaomenor.

ElformatoJPEGbasasupotenciaenlaexplotacindealgunascaractersticasdelavisindelojohumano,yaquele
damosmsimportanciaaunosdatosdelasimgenesqueaotros.LacompresinJPEGdesechadelasimgenes
aquellosdatosque,paraelojohumano,sonmenosimportantes.Estohacequepodamosverdosimgenes,una
comprimidayunasincomprimir,yasimplevistanosresulteimposiblediscernircualeslaoriginalycualesla
imagencomprimida,apesardequeenlacomprimidahayunaprdidadecalidadconrespectoalaoriginal.Hagamos
unnuevoconcurso.Vuelveaencontrarlasdiferencias...

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

3/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

Enestaocasinsquelashayaunqueanuestroojolecuestamuchotrabajoencontrar(siesquelasencuentra...)las
diferencias.Enlaprimeraimagensehadesechadobastanteinformacin,mientrasquelasegundaseralaoriginal.
Puedescomprobarquenoeslamismafotopinchandoconelbotnderechoenlasimgenesyviendolainformacin
quehayenPropiedades.Versqueelpesodelasmismasesde11Kbytesparalaprimerafotoyde53Kbytespara
lasegunda.Sipormsquemirasnolograsverdiferenciasdejaqueteecheunamanoofrecindoteunavisin
ampliadadealgunaszonasdelaimagen.

UnodelosmtodosqueutilizaelformatoJPEGparareducirelpesodelasimgenesesdividir,analizarycomprimir
laimagenenzonasde8x8pxeles.Comoconsecuencia,cuandoseusanaltastasasdecompresinaparecenloque,
incorrectamente,solemosllamar"pxeles"Decimosqueunaimagenest"pixelada"cuandoestaszonascuadriculadas
sonclaramentevisibles.Sitefijasenlaszona1verscomolacuadrculadelahablocomienzaaservisible,aunque
inclusoconlaampliacinquehehechodel500%hayquefijarseparanotarla,especialmentesinotieneslaoriginal
comoreferencia.Hemarcadoconlasflechaslazonaenlaquemssenotalacuadrcula.Podrahabercomprimido
mslaimagenparaqueseapreciaramsclaramente,peroentonceselejemplodeantesnohabratenidogracia
porquesehabravistoclaramentecualeralaoriginalycuallacomprimida.
Perolaprdidadecalidadnosloapareceenformadecuadrcula.Tambinhayprdidadedetalles.Fjateenlanube
quehayjuntoalaflechadeladerecha.Enlaoriginalestapequeanubeestpartidaendos,siendolapartedela
derechabastantemsgrandequeladelaizquierda.Enlasegundaimagenseveclaramentequelanubehasido
"encajonada"enunadeestascuadrculasysehaperdidolapequeapartedelanube,laqueestabaalaizquierda.
Porltimo,lagamacromticayluminosadelaimagentambinsufre.Fjateenloscoloresdelazona2enlasdos
fotos.Lasegundafoto,ademsdeperdermuchosdelosdetallesdelmar,estnotoriamentemsoscura.
Otroejemplo:

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

4/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

Fjateenlaszonasmaracadascon1y3yverscomoenlasegundaimagensehaperdidoladefinicindelos
contornosdelaisla.Ahoraelcontornonoes"limpio",sinoqueaparecealgoborroso,difuminadoenrectngulos.
Fjatetambineneldetalledelmardelazona2.Enlasegundaimagenelmaraparececomounamanchaborrosa.
Loincrebledespusdeverestasdiferenciasesvolveraverlasimgenessinampliarydejarselosojosbuscandolas
diferencias...Tevuelvoaponerlasimgenesdelejemplo.Adivinacualescual...(paracomprobarlopinchaenla
imagenconelbotnderechodelnavegadoryveaPropiedades)

Manosalaobra!
OptimizandoimgenesconAdobePhotoshop
AdobePhotoshopcuentaconunaherramientaespecficaparalaoptimizacindeimgenesdestinadasaser
publicadasenpginaswebqueessimplementeperfectaparalograrlosobjetivosplanteadosenestemanual.Para
accederaelladebesiraArchivo>GuardarparaWebSiguiendoconelenfoqueprcticodeestemanualveremos
cmo,optimizarnuestrasimgenesdemaneramsquesatisfactoriaconapenasunpardeclicsderatn.Dejaremos
fueramuchasdelasopcionesqueincluyeelmduloporquesuusonoesestrictamentenecesarioparalograrnuestro
propsito.Lgicamente,quienquiera,puedeexperimentaroconsultarladocumentacindelprogramaparaversus
posibilidades.
EchemosunvistazogeneralalmdulodeexportacinparaWeb.nicamentehemarcadoaquellaszonasquedeberas
tenersiemprebajocontrol.Elresto,comohecomentado,noesestrictamentenecesarioconocerlasy,portanto,no
comentarnadasobreellas:

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

5/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

1. Formatodearchivo:Estaprimeraopcinesfundamental,yaquenospermiteelegirelformatodearchivoen
quevamosagrabarnuestraimagen.ComovimosenelapartadoCualeseltruco?losformatosdestinadosa
imgenesartificialesalmacenanunmximode256colores(8bits)peropermitenoptimizarlapaletade
colores,mientrasquelosformatosdestinadosaimgenesrealesusanprofundidadesdecolorde16,7millones
decolores(24bits)peoincluyenmtodosdecompresindecalidadvariable.
SivamosaarchivarunaimagenartificialdebemoselegirelformatoPNG8oGIF
SivamosaarchivaruaimagenrealdebemoselegirelformatoJPEG

AdobePhotoshoppermiteguardarlasimgenesenotrosdosformatos,PNG24yWBMPquenodebemosusar
porserelprimerountipodearchivosinprdidadecalidadconelqueobtenemosarchivosmuygrandesyel
segundoportenerunaprofundidaddecoloresde1bit,estoeso,sloincluyedoscolores:blancoynegro.
2. Entrelazado:Cuandonavegasporinternethabrsvistoquehayalgunasimgenesquecargandegolpeyotras
quevanapareciendopocoapoco.Esoesprecisamenteloquecontrolaestacasilla.Cuandolamarcaslafotoel
navegadordeinternetcargapocoapocolaimagenenlugardeesperarahaberladescargadoporcompleto
antesdemostrarla.Marcarestacasillaaumentaeltamaodelarchivo,aunqueencantidadesdespreciables.
3. Tabladecolores:Estapestaaaparecenicamentecuandoenelapartado1hemoselegidolosformatosGIFo
PNG.Aqutenemoslaclaveparalaoptimizacindelasimgenesartificiales.Comovers,enesteapartado3
hayunidastreszonasporestartodasntimamenterelacionadas.
Colores:EnlapartesuperiornosencontramosconunacasillallamadaColoresquenospermiteelegir
unodeestosvalores:2,4,8,16,32,64,128256.Conestaopcinlimitamoselnmeromximode
coloresquetendrlaimagen.Lgicamentesielegimosunacantidadinferioraloscoloresqueposeela
imagenperderemoscalidadporquehabrquesustituirloscoloresoriginalesporcoloressimilares.
Photoshopofrecediversasopcionesparacontrolarcomosesistituyenloscoloresqueeliminamospero
,sincemente,creoquenomerecelapenacalentarsetantolacabezaparaunareduccinenelpesodela
imagencasidespreciable.Cuando,porelcontrario,elegimosunnmerodecoloressuperioralquetiene
laimagenpuedenpasardoscosas:
SielegimoselformatoGIFdeberemosajustardeformamanuallacantidaddecoloresalnmerode
coloresdiferentespresentesenlaimagen.Denohaceloaumentaremosinnecesariamenteelpesodel
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

6/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

archivo.
SielegimoselformatoPNG8deberemoselegirsiempre256coloresporqueesteformatousa,deforma
automtica,nicamenteelnmerodecoloresdiferentespresentesenlaimagen.
Tabladecolores:Nosmuestra,deformavisual,todosloscoloresdiferentespresentesenlaimagen
Tipodepaleta:Enlaparteinferiorderechanosencontramosconestatilinformacinquenosindicael
nmerodecoloresdiferentespresentesenlaimagenyeltipodepaletaqueestamosusando.Esta
informacinesesencialparapoderajustarcorrectamenteelparmetroColorescuandotrabajamosen
formatoGIF.SiusasenformatoPNG8estacasillaesmeramenteinformativa.
4. Formato,pesoytiempodedescarga:Nuncadeberasperderdevistaestazona.Aquversentodo
momentoelformatodearchivoquehaselegido,elpesofinalquetendrlaimagenyeltiempoquetardaraen
descargarenunaconexinlentade28,8Kbit/s.Unpocomsarribadelazonamarcadacomo1hayuna
pequeaflechitanegraorientadahacialaderecha.Sipinchasenellapodrseleccionarotrostiposde
conexionesparacomprobarcuantotardaraendescargarconcadaunadeellas
5. Tamaodevisualizacin:Pordefectoaparecesiempreal100%mostrandoportantoeltamaorealdela
imagenPorquesimportanteestaopcin?Comonormageneralsilaimagennosepuedemostraralcompleto
conlavisualizacindel100%muyseguramentenuestraimagenesdemasiadograndeparasubirlaainternety
nosconvendrareducirletamao.Podemosreducireltamaodeunaimagendeformarpidaysencilla
mediantelapestaaTamaodeimagen.

1. Tamaooriginal:Aquveremoseltamaooriginaldenuestraimagen.Enelejemplovemosquela
imagenconlaqueestoytrabajandoesexageradamentegrandeparasubirlaainternet(1.728x1152)
2. Tamaonuevo:Aquindicaremosdeformamanualqutamaoqueremosquetengafinalmenteel
archivodeimagen.SitenemospinchadalacasillaRestringirproporcionesnosaseguraremosdeno
mantenerlasproporcionescuandoreescalamos.Enelejemploheindicadounaanchurade320pxelesy
laalturasehaajustadodeformaautomticaa213paramantenerlasproporciones.Denohabertenido
pinchada"Mantenerproporciones"laalturahabraseguidosiendode1.152pxeles.
3. Porcentaje:Tambinpodemosreescalarlaimagenusandounporcentajeenlugardeundatonumrico.
Enestecasolaimagenfinaltendruntamalodel18,52%conrespectoalaoriginal.Enmicasoestedato
haaparecidodeformaautomtica.Sicambioelporcentajedeformamanualentonceselnuevotamao
cambiartambindeformaautomtica.
4. Calidad:LaopcinpordefectoesBicbica.Damuybuenosresultados.Yonolocambiara
5. Aplicar:Cuandolotengastodolistopichaaquparaqueloscambiossehaganefectivos
6. CompresinJPEG:Laimagenquecontienelaszonasmarcadasalcomienzodeesteapartadosecorresponde
conelformatoPNG8.CuandoelegimosJPEGcomoformatodearchivodesaparecenalgunasopciones,comola
tabladecolores,yaparecenotrasespecficasdelJPEGqueveremosacontinuacin:

1. Formatodearchivo:ParaverestasopcionesesnecesarioqueestseleccionadoelformatoJPEG
2. Tipodecompresin:Aquencontramosunosajustespreestablecidosdecalidad.Prefieroajustar
manualmentelacalidadcomoseindicaenelpunto4acontinuacin
3. Pogresivo:Tienelamismafuncinqueelentrelazado.
4. Calidad:Estaessinduda,laopcinmsimportantedetodoelcuadrodedilogo.Aqudefinimosla
degradacindecalidadquetendrlaimagen.Valoresmspequeosdarncomoresultadoimgenesde
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

7/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

menorpesopero,lgicamente,tambindemenorcalidad.Miconsejoesquevayasexperimentandocon
diferentesvaloresparaencontrarelvalorconelque,reduciendoalmximoelpesofinaldelarchivo,la
calidadnoseveaafectadaenexceso.Mientrasseexperimentaconestosvaloressueleserdebastante
utilidadfijarseenlainformacindeformato,pesoytiempodedescarga.Ahpodremoscomprobarsila
prdidadecalidadquesufrelaimagenmereceonolapena.
Porltimo,cuandolotengastodoconfiguradoatugustodaleaGuardarylisto!

MicrosoftImageResizer(ocmooptimizarconslo4clics)
Aveceslobueno,bonitoybaratoexisteo,enestecaso,lobueno,sencilloybarato.ImageResizeresunadelas
MicrosoftPowerToys,unasherramientasgratutasdesconocidasparaunagranmayoradeusuariosperoqueamplan
elsistemaoperativoMicrosoftWindowsaadindolealgunasfuncionalidadesmuyinterantes.Sunicoinconveniente
esestareningls,perosontansencillasquepocoinglssenecesitasaberparausarlas.
ImageResizerpermitecambiareltamaodeunaimagenreduciendodeformamuyconsiderablesupeso.Sufacilidad
deusoselogragraciasaunasimplicidaddeusoextrema,peroclaro,tantasimplicidadselograofreciendounnmero
muy,muylimitadodeopcionesdeconfiguracin.Entreellaslasquemsseechademenosesunniveldecalidad
finalpersonalizada.TodaslasimgenesobtenidasatravsdeImageResizerestnenformatoJPEGylacalidades
bastantebuena,aunquejustoenellmitede"demasiada"compresin.Laventajadeesaformadetrabajar,no
obstante,esquelograremosimgenesdeunpesomuy,muycontenidoconunacalidadvisualtodavabastante
buena.
LasMicrosoftPowerToyssepuedendescargaraqu:
http://www.microsoft.com/spain/windowsxp/downloads/powertoys/xppowertoys.mspx
ElenlaceadirectoaImageResizerenelmomentodeescribirestemanualesste:(siesteenlaceserompeenel
futuroagradeceraquelocorrigiraisvosotrosmismos,obienquemeavisraisparaqueseayoquienlocorrija)
http://download.microsoft.com/download/whistler/Install/2/WXP/ENUS/ImageResizerPowertoySetup.exe

InstalandoImageResizer
Lainstalacinesextremadamentesencilla.Noobstanteincluyoaqulascapturasdepantallasparaquealosqueles
"asusta"elinglssepanentodomomento"qulesdice"elprogramadeinstalacin:
1. Pantalladebienvenida:Tedalabienvenida,teinformaquevasainiciarelprogramadeinstalacinyte
avisaqueelprogramaestprotegidoporderechosdeautor.Esgratis,peronolibre(decdigoabierto)

2. Licenciadeuso:Lospuntosmsimportantesson:
ParapoderusaresteprogramaesnecesariocontarconunacopiavalidadadeWindows(esdecir,original)
(Sloparaprogramadores)Noestpermitidodecompilarelprogramaparaaccederalcdigofuente.
Quedaprohibidasuventa
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

8/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

Comotodoelsoftwarenorteamericano,hayciertospasesenlosqueesilegalusarproductosdeMicrosoft
(Verhttp://www.microsoft.com/exporting/)
Comotodoslosprogramas,noofrecengarantaalgunaporsuusoniaceptasningntipoderesponsabilidad
derivadadesuuso
Paracualquiercuestinlegalreferenteaesteprogramaseaplicarlalegislacinnorteamericana.

3. Nombreyorganizacin

4. Instalacincompletaopersonalizada:Sieligespersonalizadanicamentepuedeselegireldirectoriode
instalacin(c:\windows\systen32pordefecto)YonocambiaranadaydejaraComplete.

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

9/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

5. ltimopaso:Instalar

OptimizandoconImageResizer

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

10/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

ParaoptimizarconImageResizernicamentehayquepincharenlasimgenesquequierasoptimizaronelbotnderechoy
seleccionarImageResizerdeentrelasopcionesqueaparecenenelmencontextual

Acontinuacinaparecerlasiguienteventanaenlaquepodremoselegireltamaoquetendrlaimagenquequeres
reescalar.

1.
2.
3.
4.
5.

Pequea.Seajustaauntamaode640x480pxeles
Mediana.Seajustaauntamaode800x600pxeles
Grande.Seajustaauntamaode1024x768pxeles
Porttil(paramvilesyPDAs).Seajustaauntamaode200x320pxelescomomximo
Opcionesavanzadas.Cuandopinchamosaqusedespliegannosnuevasopcionesqueveremosacontinuacin

1. Tamaopersonalizado.Tepermiteelegirqutamaofinaltendrlaimagen
2. Reduceeltamaodelasimgenes,peronolasampla.Esdecir,sinuestraimagenoriginaltieneun
tamaode800x600yseleccionamosuntamaode1024x768elcambiodetamaonoseharefectivo.
3. Reescalarlaimagenoriginal.Cadavezquereescalamosunaimagensegeneradeformaautomticaun
nuevoarchivoconeltamaomodificado.Simarcamosestacasillaperderemoslaimagenoriginaly
obtendremoslaimagenreescaladaconelmismonombredearchivoquelaoriginal
4. Volveralmodobsicodetrabajo.Vuelvenadesaparecerlasopcionesqueacabamosdevereneste
apartado.

ConvertirconImageResizermuchasimgenesdeformasimultnea
HemosdichoqueparaconvertirUNAimagenhemosdepincharenellaconelbotnderechoperoquocurresi
quierereescalartodaslasimgenesdeunacarpeta?Puesseleccionatodaslasimgenesquequierastransformary
pinchaencualquieradeellasconelbotnderecho.LatransformacinseharefectivaparaTODASlasimgenesque
http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

11/12

26/3/2015

Optimizacindeimgenesparasuusoeninternet

hayasseleccionados.Porsitodavanolosabas,indicoacontinuacinalgunosmtodosdeseleccinmuytiles
cuandoqueremosseleccionarmltiplesarchivos:
ParaseleccionartodaslasimgenesdeunacarpetapuedespresionardeformasimultnealasteclasControlyE
Paraseleccionarungrupodeimgenescorrelativas,porejemplo,sitienesunacarpetacon100imgenesyquiere
seleccionardela25ala50,aprietamaysculas,pinchaconelbotnizquierdoUNAvezenlaimagen25yluego,SIN
SOLTARMAYSCULAS,pinchasunavezenlaimagen50.
ParaseleccionarvariasimgenespinchaUNAVEZconelbotnizquierdoentodaslasquequierasseleccionarSIN
SOLTARLATECLACONTROL

Notodoslosnombresdearchivossonbuenos
Cuandonosetienemuchaexperienciaenlapublicacindecontenidosdeinternetesmuyfrecuenteencontrarnoscon
quealgunasdelasimgenesquehemosusadonocargan.Enlamayorpartedelasocasioneselproblemaesalgotan
simplecomoqueelnombredearchivonosigueunasnormasbsicas.Notodoslosservidoressonigualde
"delicados"enesteaspectoyunaarchivoimagenconeesensunombre,porejemplo,puedecargarperfectamente
enunservidordeterminadomientrasquesiusamosesemismoarchivoenunservidordiferentepuedequeentonces
nocargue.
Paraevitarestosproblemaslomssensatoesseguirestasrecomendacionesquenosgarantizarnqueelnombrede
nuestroarchivonuncaserconflictivoenningnservidor.
Evitatildesyotroscaracteresespecialescomoee,vocalestildadas,signosdeinterrogacinoexclamacin,
etc.
Nousesespacios.Sinecesitassepararloidealsonguionesbajoscomo_en_este_ejemploopuntos
como.en.este.otro.ejemplo
Usanombresdearchivosdemenosde32caracteres.
Puedesverlaversinonlinedeestedocumentoen:
http://www.videoedicion.org/documentacion/article/optimizaciondeimagenesparasuusoeninternet

http://www.videoedicion.org/documentacion/article/printer/optimizaciondeimagenesparasuusoeninternet

12/12