JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。 Clever JPEG Optimization Techniques 1. 「8ピクセル」のグリッド 2. カラーの最適化 3. JPEG最適化の一般的なTips 1. 「8ピクセル」のグリッド JPEG画像は、あなたが既に知っているように8x8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8x8ピクセルを利用して、JPEG画像を最適化します。 画質10で作成したサンプル 二つの正方形は同じ大きさ（8x8ピクセル）です。左上のはきれいに見え、右下のは汚く見えると思います。 これらは、それぞれ8x8のグリッドに並べたもので、左上はグリッドに揃えたもの、右下はグリッドに揃っていないものです。 保存する際に画像は、8x8ピクセルのブロックに分けられるため
タグ
- すべて
- (1)
- B! (3)
- iPhone (1)
- .fla2 (6)
- 2ch (1)
- 3d (23)
- 4k (1)
- AIR2.0 (2)
- AMP (2)
- APIエコノミー (1)
- APNG (1)
- AWS (1)
- Adobe AIR (1)
- AdobeAIR (1)
- AdobeMAX2017 (1)
- AdobeXD (1)
- Androidタブレット (1)
- Angular (6)
- Angular CLI (1)
- Angular2 (4)
- Angular4 (1)
- AngularJS (2)
- Animate (1)
- AnimateCC (3)
- Apple (2)
- Away3DLite (6)
- B! (3)
- BEM (1)
- Babel (1)
- Brightcove (1)
- CI (1)
- CSS (33)
- CSS3 (7)
- CSS設計 (2)
- CoffeeScript (1)
- CreateJS (27)
- Crosswalk (1)
- DQN (1)
- ECMAScript (5)
- ECSS (1)
- ES Modules (2)
- ES2015 (1)
- ES2017 (3)
- ES2018 (1)
- ES2022 (1)
- ESM (1)
- Electron (1)
- Emmet (1)
- F-site (2)
- FME (1)
- Figma (5)
- FileReference (1)
- Flash Disの恨み (1)
- Flash Pro CC (1)
- FlashBuilder (4)
- FlashBuilder4 (4)
- FlashCS5 (5)
- FlashCatalist (1)
- FlashPlayer11 (1)
- FlashProCC (1)
- Flasher (1)
- Flashアニメ (1)
- Flashサイト (2)
- Flex3 (1)
- Git (3)
- GitHub (4)
- HTML (19)
- HTML5 Canvas (2)
- IE (3)
- Infinity3d (1)
- Jenkins (2)
- Kinect (1)
- LINE (1)
- LiquidFun (1)
- MAX2010 (36)
- MVC (1)
- Mac OS X (2)
- Metal (2)
- Microsoft (2)
- Microsoft Edge (2)
- ND3D (1)
- NHK (1)
- Node.js (2)
- OSCSS (1)
- PC (2)
- PHPStorm (2)
- PhoneGap (1)
- PixelBender (5)
- PixelBender3D (2)
- PixiJS (2)
- Progressiong (1)
- QuickBox2D (3)
- RIA (3)
- RTMP (1)
- React (12)
- React Native (2)
- Redux (1)
- SA3 (1)
- SCSS (1)
- SMACSS (1)
- STARDUST (6)
- SaaS (1)
- Safari (4)
- Sass (1)
- ScaleFormGFx (6)
- ScrollTrigger (1)
- SiON (7)
- Snap.svg (1)
- Sound (1)
- SoundJS (1)
- SourceTree (1)
- Starling (1)
- StyleSheet (1)
- Swift (1)
- Technology (1)
- Tool (1)
- Triangle3D (2)
- Tween (1)
- Tween24 (1)
- TweenJS (2)
- TypeScript (10)
- Udemy (1)
- UnionPlatform (1)
- VSCode (2)
- Vivus (1)
- Vue.js (6)
- WAI-ARIA (2)
- Web Accessibility (1)
- WebCamera (1)
- WebGL (20)
- WebGPU (2)
- WebP (1)
- WebStorm (2)
- WebXR (1)
- Webpack (3)
- Webデザイン (38)
- Web標準 (7)
- WireEngine3D (1)
- WordPress (1)
- XD (2)
- accessibility (3)
- actionscript (40)
- addon (10)
- adobe (32)
- adode (1)
- adsence (2)
- ae (3)
- aftereffects (22)
- air (65)
- air2 (1)
- ajax (3)
- alchemy (5)
- algorithm (1)
- alternativa (1)
- alternativa3d (24)
- ameba (1)
- amf (1)
- analytst (1)
- android (30)
- animation (1)
- api (3)
- aprilfool (1)
- ar (4)
- as (6)
- as2 (5)
- as3 (222)
- as3dmod (2)
- asdoc (2)
- away3d (34)
- b-mobile (1)
- bao_bao (1)
- beautifl (1)
- betweenAS3 (13)
- bitmapdata (6)
- biz (1)
- blender (10)
- blog (8)
- bloggie (1)
- book (2)
- box2d (10)
- browser (1)
- business (7)
- camera (2)
- canvas (4)
- capture (1)
- catalyst (2)
- cc (1)
- chome (1)
- chrome (2)
- cm (1)
- coding (1)
- collada (1)
- community (1)
- contest (1)
- contextfree (1)
- creativecommons (1)
- creator (1)
- crossdomain (2)
- cs4 (5)
- cs5 (4)
- csv (1)
- culture (1)
- decompiler (1)
- delicious (1)
- design (18)
- docker (2)
- dotfes (1)
- download (1)
- dreamweaver (1)
- ec (1)
- effect (1)
- emacs (1)
- encode (1)
- encoder (1)
- eps (1)
- event (2)
- excel (5)
- extension (1)
- extention (1)
- f5 (1)
- facebook (1)
- fake3D (2)
- falshbuilder (1)
- fdt (2)
- fft (1)
- firefox (10)
- firefox3.6 (1)
- fireworks (2)
- fitc (15)
- five3d (6)
- fladdict (2)
- flar (6)
- flare3d (2)
- flartoolkit (20)
- flash (240)
- flash10 (6)
- flashcamp (2)
- flashcs4 (3)
- flashdevelop (41)
- flashlite (2)
- flashplayer (1)
- flashplayer10 (13)
- flashplayer10.1 (5)
- flashsite (22)
- flaski (1)
- flazoo (1)
- flex (80)
- flex4 (15)
- flexbox (4)
- flexbuilder (1)
- flint (1)
- float (2)
- flv (10)
- fms (4)
- font (6)
- fp10 (1)
- fp10.1 (11)
- free (4)
- frocessing (4)
- fxug (1)
- gaia (1)
- gainer (1)
- game (16)
- generator (3)
- google (12)
- googlecode (1)
- googlemaps (3)
- greacemonkey (1)
- gridlayout (2)
- gsap (1)
- gulp (1)
- h264 (2)
- hatena (3)
- haxe (1)
- hdd (1)
- hdr (1)
- hero (3)
- heteml (1)
- htaccess (2)
- html5 (65)
- iOS (2)
- icon (4)
- icongenerator (16)
- ie6 (5)
- inspiration (1)
- ipad (3)
- iphone (43)
- iphoto (1)
- it (1)
- java (3)
- javascript (63)
- jiglib (11)
- jiglibflash (1)
- jitb (1)
- jpeg (1)
- jquery (7)
- js (15)
- jsdo.it (1)
- jsdoit (1)
- jsfl (13)
- json (1)
- jsx (1)
- kayac (7)
- ktween (1)
- libspark (1)
- lifehack (11)
- lifehacks (1)
- mac (23)
- macOS (1)
- macbook (2)
- macosx (7)
- marketing (2)
- material (1)
- max (6)
- memory (2)
- mindmap (1)
- mit (1)
- mixi (2)
- molehill (48)
- molehill_demo (3)
- motiongraphics (2)
- motionvr (2)
- movie (3)
- mp3 (1)
- munegon (1)
- muraken (1)
- mxml (8)
- mxp (4)
- mysql (3)
- neta (12)
- network (1)
- news (7)
- nitoyon (2)
- nvidia (1)
- o3d (1)
- oauth (1)
- openframeworks (2)
- oss (1)
- osx (1)
- papervision3d (14)
- parallels (1)
- particle (5)
- pasmo (1)
- pdf (1)
- performance (1)
- photo (5)
- photohsop (1)
- photoshop (16)
- php (8)
- plugin (2)
- portal (1)
- portfolio (1)
- postgresql (2)
- powerpoint (2)
- premiere (3)
- presentation (2)
- processing (1)
- prog (1)
- progate (1)
- programming (2)
- progression (92)
- progression4 (2)
- pv32d (1)
- pv3d (139)
- qtvr (5)
- quicktime (1)
- regexp (1)
- roxik (1)
- ruby (1)
- sandy (2)
- saqoosha (3)
- sbm (2)
- security (1)
- selenium (1)
- seo (15)
- silverlight (9)
- software (6)
- spark (5)
- sqlite (2)
- stage3d (4)
- svg (4)
- svn (3)
- swf (6)
- techfeed (13)
- teraco (3)
- tha (3)
- three.js (6)
- tiaa (2)
- tips (9)
- tutorial (2)
- tweener (4)
- tweensy (2)
- twitter (34)
- typography (4)
- union (4)
- unity (4)
- video (4)
- vimeo (2)
- vista (2)
- vr (3)
- wallpaper (2)
- web (16)
- webdesign (69)
- webservice (17)
- windows (4)
- wondefl (2)
- wonderfl (70)
- wonderfl本 (9)
- youtube (3)
- yugop (4)
- あとで読む (161)
- これはすごい (2)
- これはひどい (6)
- アクセシビリティ (2)
- アニメーション (3)
- ウェブサイト (4)
- スマホアプリ (2)
- セルクマ (3)
- データビジュアライゼ (4)
- パノラマVR (2)
- フォント (2)
- ブラウザ最新動向 (7)
- ホッテントリ応援 (18)
- マイクロインタラクシ (2)
- 映像 (2)
- 最適化 (2)
- 竹洞 (2)
- 結婚式ビデオ (2)
- flash (240)
- as3 (222)
- あとで読む (161)
- pv3d (139)
- progression (92)
- flex (80)
- wonderfl (70)
- webdesign (69)
- air (65)
- html5 (65)
tipsとphotoshopに関するyasu-logのブックマーク (2)
-
yasu-log 2009/07/02
JPEGのアルゴリズムを応用した実用的なチップス。技術的な裏付けを知っていると、技のクオリティーに違いでてくる。- design
- tips
- photoshop
リンク -
スクリーンショットを印刷してもクオリティを落とさないようにする方法
スクリーンショットをプロダクトの写真などと一緒に300dpiで出力する際にぼやけてしまう場合、スクリーンショットがシャープになるようにする方法をTurbo Photoから紹介します。 ビフォーとアフター Step 1: Capture the screen スクリーンをキャプチャします [Ctrl]キーを押しながら、[PrtSc]（プリントスクリーン）キーを押します。 アクティブなウインドウだけをキャプチャしたい場合は、[Ctrl]+[Alt]と[PrtSc]キーを押します。 Step 2: Paste in Photoshop Photoshopにペーストします Photoshopを起動し、新規ドキュメントを開きます([Ctrl]+[N]）。Photoshopはキャプチャに合わせたサイズで開きます。 スクリーンショットをペースト（[Ctrl]+[V]）します。 Step 3: Chang
-
1
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
処理を実行中です
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
設定を変更しましたx