Hatebladder

JPEG画像をより美しく、より軽量に最適化するテクニック | コリス

JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。Clever JPEG Optimization Techniques1. 「8ピクセル」のグリッド2. カラーの最適化3. JPEG最適化の一般的なTips1. 「8ピクセル」のグリッドJPEG画像は、あなたが既に知っているように8×8のピクセルのブロックから成り立っています。画質を低くする...

URL

http://coliss.com/articles/build-websites/operation/design/howto-jpeg-optimization-techniques.html

Tags

画像処理 web制作 webデザイン tips テクニック photoshop お役立ち *あとで読む デザイン 画像 design image jpeg 写真 まとめ coliss webdesign *tips あとで読む あとで *photoshop チュートリアル ノウハウ *webdesign これはすごい 読み物 あとでよむ 興味はある 研究 便利 technique performance *webデザイン pc 技術 資料 *web制作 photo jpg 雑学 あとで試す *まとめ adobe web 豆知識 cg graphic blog graphics webdev チューニング パソコン 画像編集 絵 ツール 高速化 tool 最適化 create プログラミング art trivia fireworks 参考 へぇ *design なるほど optimization web design

ブックマーク：

このエントリーをブックマークしているユーザー

• pink_dark
• kudakurage
• amaria
• ko6_2
• SABO-HANI
• hati-8
• soma1080
• mikelito
• YUKI14
• tanakaBox JPEGは8x8グリッド。
• konruri
• gjw
• papanu
• yuu-kuni
• favril
• cptskgj
• shadowbirds
• Japanese_paris jpg最適化
• mya_sun
• hati-bit_punk
• sulfurous
• tang40
• ma2acworks
• aeka これを懇々と言って聞かせたいんだよおじさんは
• katainu
• takhino
• wish-fav
• nonfly
• bioweb
• hamuzou_66 ここまでは知らなかった、メモメモ
• akky_cc あなたの知らない世界/8*8、Labカラー使用、100は使わないの3本でお送りします
• force8
• hifumi19
• kettle22
• oknacky
• archaic-smile
• hoge_systemz
• kyotaweb
• syokatu10
• aist
• north_green
• teru-7
• s-edy
• katoyuu
• darwinia
• panko033
• wiger_tazz
• minomo8530
• yoyoprofane
• Nemui_09
• urawareds
• iNo
• zekexx
• okabayaya
• nsyee
• fugashi
• lecreuset
• SISY
• sudo44ug
• ryonino
• benediktine
• saylan
• hiro360
• cioringo
• kulurel
• star_123
• annkisaragi
• fallfull
• ofsilvers 知らないことだらけ
• sivipp
• jinyama
• goroyung
• works244
• solunaris149
• darumen
• Vitalsine
• RY0P
• Minefujio
• inthesoup
• wagamichi
• magohat
• caraldo_k
• pudechige
• pon_nao
• kasahi
• keshitai
• fake_rasukaru
• tepe JPG軽量化
• snt-f
• boonies
• Evocacion
• fa-100s フォトショップ保存テクニック
• yorozuna
• kiyokichi 　「高いコントラストを持つ小さい画像の場合、Photoshopで画質51にしてJPEGを保存するのは有用なテクニックです」知らなかったｗｗｗｗｗｗｗｗｗｗ
• Alsus
• yosshi71jp
• blik
• sibasho
• hayasi-n
• mobile_snk
• ryo-htn JPEGの最適化。バナー作成に役立つかも。
• tdstr
• hoehoe3
• corirakumaso
• pirano
• marhythm
• Caihua
• sssxxxsssxxxsss
• naoto5959
• rider-2
• geogeo1103
• wasai
• Akineko
• sokuhan
• ginjaf
• imaginary_line 「あなたが既に知っているように」スマン。知らなかった。
• yfukad
• des_cubes
• sbg3
• utalab
• tokinoatai
• KEN_T
• ecue
• gam-22
• kyuns
• kirohoppe
• takuya_28
• delorean
• d-2up
• seuzo
• ichao130
• f503kk
• tboffice
• moofmoof
• takasick
• party_trap
• HLYGRL
• shaotoy
• scottie-nippon
• aureliano
• shima-yan
• keijix
• paranod
• mossamossa
• lupin3rd
• czblue
• masa720
• ojizo
• wayaguchi
• kibitaki
• efcl jpegの最適化 8*8ピクセル 画質50を境にカラーダウンサンプリング
• verify1987
• sononon
• yoiIT
• blue_tiger
• minew
• thinkvibe
• mionosuke フォトショユーザーだが、意味がわからん。8ピクセルのグリッドってどうやって表示させるの？
• rokushou
• U-8
• kyanosil
• staygold81
• sw_lucchini
• GUY
• Wacky
• Bell000
• shimatansh
• toucan
• nyomonyomo
• YAK
• dekillcaner
• avoidnotes
• sig
• Hexane
• matuka
• azuhata
• co8co8
• okinawa800 Ｊ　ＰＥＧ画像
• taka222
• kokemono
• letitock
• wtr
• theart
• katoooh
• johnny74656
• roripop
• namhat
• hirofumix
• tardyon
• F-name
• acek6832
• shion214
• camelslug
• kanewo
• takuma1021
• daddyscar
• justynasty
• smtp
• kasane_yuuhi 8ピクセルのグリッドに揃えて配置する｜イメージのモードを「Lab カラー」にして、最適化をする｜JPEGで保存する際に、100の画質は使用しない｜高いコントラストを持つ小さい画像は、フォトショで画質51にしてJPEG保存
• yanmani
• millionbank
• shi-che
• Pandasista
• uenoantenna
• agw
• bookmarkcity
• udukiyukia
• toiry
• starsky5
• K-ism
• mhigashi
• semi
• pinkr
• youichirou
• ma_chupic_chu
• yng13 JPEGは8x8ピクセルでうんぬんって知らなかった！
• atcgouch
• rkzm
• farmax 画像の保存テク
• qinmu 《高いコントラストを持つ小さい画像の場合、Photoshopで画質51にしてJPEGを保存するのは有用なテクニックです。》
• tmgkey
• iriso
• gaya1114
• spman
• idoya
• hiro_kot
• purupurulip-246
• velvet1113
• uniom
• hatemochi
• atxx
• Yuichirou
• o122334444
• yuming
• lid
• raderjp
• masterkton
• adsty JPEGの仕様やPhotoshopの機能を活かしたテクニック。
• nomonsterinme
• yzx
• Fubuki
• nyannyanboo
• sasapurin
• kazufsaf
• echol
• mimimi0101
• nobukn
• hamachi
• omine3 ほっほー…サイズもちっさくしてこれほどまでに美しいとは
• karimer 画像
• nawoshi
• magiciansred
• lepton9
• mktx
• makeplex 画質100はばか。
• mkpy
• yohmei
• asiamoth Photoshop の 画質: 100 で保存してた（「うは、オレってばリッチ☆」）けど、95 にしてみよう……。
• lowgain
• mizukinman photoshop,JPEG,軽量,最適化
• GYAOUI
• ritsuca_ms
• natiko_10
• bluetraveler03
• yuu-h JPEG
• aykt
• pega2s
• taco1975
• katapad
• cymbalsx
• chobiw
• color_of_experience これは有益な情報
• k_ume75
• skymay
• moorishidol
• AoNeko
• gyu-tang
• fujii_isana
• somar
• bluesunday
• ysdnbhr
• mojanir
• Psyentist
• mk69 これは知らなかった、、。
• k_wizard
• inferno_flame
• tsuyop
• tomokid
• thesecret3
• gagaga777
• hihi01 なにを言っているのかぜんぜんわからない。
• cumacuma
• bkhd
• erijii
• turbolog
• mock_on
• t100
• dal
• yosshi JPEG
• masikure
• ricebread 画質50と51でかなり変わる画像があるなー。51のほうが小さくなる画像は見つけられなかったけど。
• Re75
• sumege
• asashigu
• TakiTake
• kyrkry
• hmdak
• jakoten2000
• euparo
• tanisuke
• shiney326
• carmaine
• gogatsu26
• wato8282
• itochan 確認用に、圧縮前の元画像が欲しいな…　／　かなりはしょってるので、元記事も読んだほうがいい
• takemix
• nagacy
• guldeen 8ピクセル単位の事情は知ってた／俺は一旦BMP保存したのち「QUAJPG」（http://www.vector.co.jp/soft/win95/art/se172521.html）を使ってます。同画質でPhotoshop圧縮よりデータ量が軽い。
• ykop
• isaisstillalive
• dkoji
• inava
• anw
• Yoshlog
• earth-x
• skrck0o0
• modata
• primevision
• yuki78
• plain7d
• pitworks
• godagoda
• surftide7
• tskx2
• ametyoko
• usk-cba
• stolpnik
• satidama つpng
• sokol_jun
• colamune
• eijin
• Ashby
• caprocks5
• shi6ma3
• serimaryo
• kokkuri
• hiroomi
• hatada
• maga-h
• gilbraid
• asada_santohei
• evasojail
• netch
• junpe1
• don_ashill
• fukurow57 「51」早速使ってます。
• qingyuan JPEG・・・大事です！
• tsukitaro 1枚目の画像は衝撃的。意味も知らなかった。でも実用的かどうかは・・・？
• hiro_2005
• pure_mashiro
• tanukisoba54
• astrocyte
• darau
• wazanaka
• lux
• marukoro3150
• deg84 8*8のことすら知らなかったわけで・・・
• Nove
• soratokimitonoaidani
• neutral00
• cz8686
• worldgazer
• stkyoto
• shaketoba
• kuntolabo
• k_kumahachi
• cosmicstarz
• k75mix
• shiko-tama
• rhythmcan2
• C-bee いつか必要になる知識かもしれないな・・・
• kurocos
• higedaru
• zenibuta
• letoro_mania
• adkuri
• bonno-108
• shg ここまで計算してデザインするなんて、凄いです。
• mag_latte
• shidho 覚えておく。
• ureyubo
• nisshin-k
• t4nch0
• stkeyboad
• takahirox
• pgin
• pane
• asmblr
• swat
• asonas
• WaSp これは知らんかった
• Chupacabra
• nakachop 8×8ピクセルってことすら知らなかった
• yukem
• Fou
• hirali
• yoshi_zo
• seinn
• yokoken
• serupi9
• chanmarry
• fourth
• zerr3596
• Peter_40
• mamuchi
• yggdra_w
• kyukyu9101f >>高いコントラストを持つ小さい画像の場合、Photoshopで画質51にしてJPEGを保存するのは有用なテクニックです。<<最適化のウラワザっぽいの。今度試してみようかな。
• tk18
• hrm-ed
• ido8
• hayahiro1
• pentaro25
• rafbm
• ayumi_123
• rikusora
• dimentity
• m_bold17
• chogechogepan photoshop
• heinze
• tricolor96
• u-c-h-i
• s_ohkubo
• mix_bird
• lenore
• maido99
• hyu-ruri
• Serru
• siromado
• wnp
• kumahara
• cube_tamayura
• digital_pop Web画像　サイズダウンのTIPS。有用。
• haru_o
• daiskip
• zaqwerty
• bornite
• ozzwar
• natchonbrike
• kkkik6704
• klim0824
• amanoiwato
• sea_side つーかJPEG2000かJPEGXRを普及させればいいはなしじゃんよ。
• wartanenemon
• kirishima2813
• miyamoya
• saka39
• ishidam
• karajishibotan
• kyoon
• fujiifujiko
• kamemoge
• ak9
• mvsw
• sinsara
• akane_ichimiya
• omu-raisu
• kuroiotona
• Layzie
• tacshiss
• kiyo560808
• kommunity
• sobagara12
• ZeroFour photoshop前提で話が進んでいるのが何ともだけど、わずかな編集でこうも変わるのか…。
• con_mame
• TempFile
• engineering
• GSOHB7 目から鱗。
• tsuki-rs
• shige_cust
• otchy210 美しさ優先なら、PNG を使用すべき。グリッドに合わせて軽量化できるようなくっきりした画像なら、GIF の方が軽量 (PNG 代替も可)。それ以外のケースでは JPEG が有利な場合も。何でも JPEG ってどうなん？
• shin-go へえー
• ytogi
• iizukaw
• k_gobo
• pikumi jpg保存するときはこれをみる
• mrhdms
• a2de 「JPEG画像は、あなたが既に知っているように8×8のピクセルのブロックから成り立っています」初めて知りました。jpegって赤がダメだよね
• iolite
• natukusa
• summersby
• fumysan
• bye-bye_jupiter
• locomo07 JPEG最適化
• truefaith
• falkbeer
• Trino-o-niku ふうむ
• vanish_l2 Photoshopで画質51にしてJPEGを保存するのは有用なテクニックです。
• chiko
• hvc-001 へー！
• rizocchi
• egoistfollower
• sucrose
• nymphomania
• sibatanwn
• u1_113
• jimoop
• MINi
• matsuko1103
• studio2y
• hitotakuchan
• syomu
• PREFAB
• shadow-toon
• t_43z
• uk-ar
• meeeres
• t_moko23
• pepereke
• naomiholy
• kowji
• ikasamaH
• kojitron 　8ピクセルのグリッドにそろえる、Labカラーを使った最適化作業、画質に気を配る（100は使わないように他）の3点。 / 50と51で画質が劇的に変わるのは経験上知ってたけど、理由がわからなかったのよね。
• kurosaki0826
• kno 画質は100でも意味なかったとな
• tama_space
• sh0uka
• hrstt
• torinanban
• isabro
• fnymmtm
• tanakara_botamochi
• sunfl
• tk7800u web
• keney
• DOGEAR
• yasuf
• piroz
• singlx
• caramelpuddingmeister
• tonkas
• trecky_1701e
• cwaxxx
• genkakukingyo
• hysteric_cat
• pw6
• furuj
• Xitect
• yoshiii
• hxhh8107
• Kippis-S 経験的に画質51で保存していたけど（50と51の差は操作してみるとよくわかる）、ちゃんとした根拠があったんだ。安心した。
• eclucifer
• lovely
• tamuo
• jyousou0815 jpeg画像　処理　最適化　きれい
• kono1
• kotatsuma
• sirocco
• daikix
• hakodama
• kazu69web
• kawacho777
• tenkunmama
• okusa75
• bokutoakushu
• yoshitetsu
• anicho
• uniuni-saru
• moyashi16
• mackey13
• smartbear
• boasorte0822
• Flippy
• Malle
• hys111
• jay926
• miccweb
• imaraya
• richard_raw 役立つかは微妙だが面白いですね。
• j-ishi
• p2d
• Eis
• showya
• minarukuji
• drillbits
• adecisivemoment
• sachi_pop
• bwhr
• klein_leaf
• yuichiro0526
• sora-kumano
• tafuta
• r_takaishi
• marupon
• guren004
• raihuru
• Watson
• fumiko703
• came8244
• harumomo2006 全然ご存知じゃありませんでした
• masamasa22
• asm-orz
• flakwing
• Urume
• bokunaru
• okv
• jun1_1020
• bookmarkhate
• toguo
• st2001
• chabonkozou
• uzulla
• laddertothemoon
• stripe
• ikusayohei
• acqua_alta
• everydaysongs
• kose
• tkamu
• Craftworks
• Kmusiclife
• shigekicks1
• club_underground
• nia
• fm00ak00
• hanabimaru
• hirat2
• uly
• pomo123
• ta3
• tch
• yono
• silvetjude
• hidehish
• hg_masa 原理を知っていることは以外と重要
• yukiastheair
• tricot1 なるほどー目からうろこ
• kkeisuke
• kyma
• nazu8722
• Hiro28
• mitz_777
• mk16
• tm8r
• d-nkt
• tangkai-hati
• Azr_pp
• famico
• keipeace photoshopでJPEGで保存する際に、100の画質は使用しないでください
• deeeki
• daichiman
• gami
• okezilla
• spectacle
• yomotsu
• yc8325
• t02026yi
• iflancy
• n00dle
• hitsujibane
• kakei
• dealforest 1. 「8ピクセル」のグリッドでそろえる 2. カラーの最適化(Labカラー) 3. JPEG最適化の一般的なTips(画質が50以下だとカラーダウンサンプリングがかかるから51でする方が軽量化)
• ralfx
• tomozo167
• amino_yu
• silverscythe
• me5655
• nugget
• vogelzug
• batta
• koujirou6218
• Masanovski
• moeprj
• vanishatea
• pyawk 画質100＝非圧縮じゃなかったのかーっ！
• hatanaoki
• solid_method
• roku_i
• Zephyrs
• morehaste
• apple9
• blanc2005
• mojaru
• akillerOKN
• kinu3
• teruyastar
• qqqqqppppp
• tocoto
• f-nyoro
• A410
• clownboy-zuzu JPEG画像は、あなたが既に知っているように8×8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8×8ピクセルを利用して、JPEG画像を最適化します。
• t32k
• hatesouta
• mizchi
• tsutomura
• decimal
• wavement
• jampanDVN
• kougeisha
• yosshi-k
• suzuki107 全然知りませんでした！
• haiji505
• miracle1998
• tarao
• misarine3
• ben-kei
• anatomy1999
• potato777
• sabro
• geektsq
• kuwato-desu
• rdcs
• van600
• pikosounds
• globalwe6
• hayakawa1978
• cammy30
• sleepily 8×8=51
• higepenguin
• AKI_R903
• toaruR
• pycol
• shingori
• sbtqe
• y55
• haribote-nobody
• inspironmini883
• caquu
• grocky
• RitaCinquetti
• sumomomimi
• granchio23
• webdea
• kakinotane-orz
• rikuo
• stepbros
• takmimazda
• tgt
• cosmo
• goto0
• yasu-log JPEGのアルゴリズムを応用した実用的なチップス。技術的な裏付けを知っていると、技のクオリティーに違いでてくる。
• yaba
• SABAKU
• Ivan_Ivanobitch
• mok024
• vv_boow_vv
• trypeople ほぇぇ。参考にしてみよう。
• ganx
• kk-momiji jpg保存時
• Rewish
• mitchikeuchi なんだかファミリーベーシックを思い出した。
• rob-oco-n

JPEG画像をより美しく、より軽量に最適化するテクニック | コリス

上へ戻る