Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How to optimize images for Better Web Design

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Masateru YOSHIMURA Masateru YOSHIMURA
October 30, 2020
Technology
2.2k
0

How to optimize images for Better Web Design

Webで使う画像について

Avatar for Masateru YOSHIMURA

Masateru YOSHIMURA

October 30, 2020

More Decks by Masateru YOSHIMURA

See All by Masateru YOSHIMURA
Digital Design 2022-02
Avatar for Masateru YOSHIMURA mathatelle
0
390
Digital Design 2022-01
Avatar for Masateru YOSHIMURA mathatelle
0
280
Yoshimura Lab. 2022
Avatar for Masateru YOSHIMURA mathatelle
0
1.4k
create-website-html-2021
Avatar for Masateru YOSHIMURA mathatelle
0
170
Multiple pages
Avatar for Masateru YOSHIMURA mathatelle
0
720
How to design the individual page
Avatar for Masateru YOSHIMURA mathatelle
1
130
CodePen: Making your portfolio 2021
Avatar for Masateru YOSHIMURA mathatelle
0
160
single page
Avatar for Masateru YOSHIMURA mathatelle
0
890
What is the design
Avatar for Masateru YOSHIMURA mathatelle
2
330

Other Decks in Technology

See All in Technology
IaC コードを資産へ：AWS CDK 社内ライブラリと横断展開 / aws-summit-japan-2026
Avatar for k.goto gotok365
10
1.6k
AI 不只幫你寫 Code： 當專案從 300 暴增到 1500， 我們如何撐住 DevOps
Avatar for Bo-Yi Wu appleboy
0
230
Flow 不死：AI 時代 DevOps 的不變本質
Avatar for Cheng-Wei Chen cheng_wei_chen
2
510
自宅LLMの話
Avatar for Kazuto Kusama jacopen
1
720
BPaaSで進むAIオペレーションの現在地 AI実装が効く領域とスケーラビリティの選定と実装
Avatar for KentaroFujii kentarofujii
0
190
Agile and AI Redmine Japan 2026
Avatar for Kenji Hiranabe hiranabe
4
480
「勝手に広まる」人気 AI エージェントを爆速で作ろう！（AWS Summit Japan 2026講演資料）
Avatar for みのるん minorun365
PRO
10
2.5k
飲食店もAIで。レジ締めやハンディシステムをつくってる話 / Using AI for restaurant management
Avatar for VTRyo vtryo
0
170
気軽に使える"情報のハブ"としてのNotion活用　〜フロー情報の集積点 と、 Claude Code × Notion AI〜
Avatar for Ryo Okubo syucream
1
200
Microsoft のサポートとフィードバック総まとめ
Avatar for Murachi Akira murachiakira
PRO
0
110
2026年6月23日 Syncable Tech + Start Python Club にて
Avatar for Kimikazu Kato hamukazu
0
150
【セミナー資料】Claude Code をセキュアに使うための考え方と設定の勘どころ / Claude Code Webinar 20260616
Avatar for MasahiroKawahara masahirokawahara
2
470

Featured

See All Featured
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
500
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.1k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
Avatar for Katarina Dahlin katarinadahlin
PRO
1
3.6k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
201
75k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
Conquering PDFs: document understanding beyond plain text
Avatar for Ines Montani inesmontani
PRO
4
2.8k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
432
67k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
1.4k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
Avatar for Liv Day livdayseo
0
140
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.1k
Scaling GitHub
Avatar for Zach Holman holman
464
140k

Transcript

  1. 8FCͰ࢖͏ը૾

  2. 8FCαΠτͰը૾Λ࢖͏ཧ༝ ᶃ ݟͨ໨͕՚΍͔ʹͳΔ ᶄ ಺༰͕Θ͔Γ΍͘͢ͳΔ ͭ·Γɺ఻͍͑ͨ͜ͱ͕఻ΘΓ΍͘͢ͳΔɻ

  3. 8FCͰը૾Λ࢖͏ͱ͖ͷ஫ҙ఺ ᶃ σʔλྔ͸Ͱ͖ΔݶΓখ͘͞ʢ͍ܰʣ ˠେ͖͍ͱද͕ࣔ஗͘ͳΔʢॏ͘ͳΔʣɺ ɹར༻ऀʹ௨৴ෛՙΛ͔͚ͯ͠·͏ʢύέࢮʣ ᶄ ྑ͍ը࣭Ͱදࣔ͢Δ ˠσʔλྔͱͷόϥϯεΛΈͳ͕Β ɹ༻్ʹԠͯ͡࠷దԽ͢Δඞཁ͕͋Δ

  4. ಡΈํ ֦ுࢠ ը࣭ ಁա ༻్ +1&( δΣΠϖά KQH ྼԽ͢Δ ಁաͰ͖ͳ͍

    ࣸਅ 1/( ϐϯά .png ྼԽ͠ͳ͍ ಁաͰ͖Δ ϩΰɺਤͳͲ ৭਺͕গͳ͍΋ͷ 8FCͰ࢖͏ը૾ͷछྨ ͦͷ΄͔8FC1΍47(ɺ(*'ͳͲͷܗ͕ࣜ͋Δ͕ɺ͜ͷतۀͰ͸ѻΘͳ͍ɻ ͜ͷतۀͰ͸ࣸਅΛ࢖͏ࣄ͕ଟ͍ͷͰɺ+1&(ܗࣜΛ࢖͏͜ͱ͕ϝΠϯͱͳΔɻ কདྷతʹ͸8FC1͕ελϯμʔυͳܗࣜʹͳΔͱݴΘΕ͍ͯΔɻ ࣸਅΛ1/(ܗࣜʹ͢Δͱ σʔλྔ͕େ͖͘ͳΔέʔε͕ଟ͍ͨΊ ࣸਅΛ1/(ܗࣜʹ͠ͳ͍͜ͱʂ

  5. ը૾αΠζͷ࠷దԽ ෯ QYߴ͞ QYσʔλྔ.# ෯ QYߴ͞QY σʔλྔ,# ύιίϯ΍εϚϗͷϞχλͰ͸ ͜ͷαΠζͰे෼͖Ε͍ʹݟ͑ΔͷͰ খ͔ͯ͘͞͠Βར༻͢Δ

    J1IPOFͰࡱӨͨ͠ΦϦδφϧͷαΠζ ͜ͷ৔߹ σʔλྔ͸ ʹ ϊʔτ1$ͷը໘෯͸ QYલޙ ॖখ͢Ε͹

  6. ʁͳ͜ͱ͸(PPHMFݕࡧͰ ͍͍ͩͨղܾͰ͖Δ 8FC༻ͷը૾ʹ͍ͭͯ͸ɺ8FC্ʹେྔͷ৘ใ͕͋Γ·͢ɻ (PPHMFͰݕࡧ͠ɺ౴͑Λࣗ෼Ͱݟ͚ͭग़ͤΔΑ͏ʹ͠·͠ΐ͏ɻ ࣗ෼ͰղܾͰ͖ΔΑ͏ʹͳΔͱɺࣗश͕ḿΓϝΩϝΩͱ্ୡ͠·͢ɻ