Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

How to optimize images for Better Web Design

Avatar for Masateru YOSHIMURA Masateru YOSHIMURA
October 30, 2020
Technology
0
2.1k

How to optimize images for Better Web Design

Webで使う画像について

Avatar for Masateru YOSHIMURA

Masateru YOSHIMURA

October 30, 2020
Tweet

More Decks by Masateru YOSHIMURA

See All by Masateru YOSHIMURA
Digital Design 2022-02
Avatar for Masateru YOSHIMURA mathatelle
0
380
Digital Design 2022-01
Avatar for Masateru YOSHIMURA mathatelle
0
270
Yoshimura Lab. 2022
Avatar for Masateru YOSHIMURA mathatelle
0
1.3k
create-website-html-2021
Avatar for Masateru YOSHIMURA mathatelle
0
150
Multiple pages
Avatar for Masateru YOSHIMURA mathatelle
0
710
How to design the individual page
Avatar for Masateru YOSHIMURA mathatelle
1
110
CodePen: Making your portfolio 2021
Avatar for Masateru YOSHIMURA mathatelle
0
150
single page
Avatar for Masateru YOSHIMURA mathatelle
0
880
What is the design
Avatar for Masateru YOSHIMURA mathatelle
2
310

Other Decks in Technology

See All in Technology
なぜ使われないのか？──定量×定性で見極める本当のボトルネック
Avatar for KAKEHASHI kakehashi
PRO
1
1.2k
Playwright x GitHub Actionsで実現する「レビューしやすい」E2Eテストレポート
Avatar for kinosuke01 kinosuke01
0
320
安いGPUレンタルサービスについて
Avatar for Aratako aratako
2
2.6k
AI活用によるPRレビュー改善の歩み ― 社内全体に広がる学びと実践
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
170
LLM-Readyなデータ基盤を高速に構築するためのアジャイルデータモデリングの実例
Avatar for Kashira kashira
0
200
re:Inventで気になったサービスを10分でいけるところまでお話しします
Avatar for Yuuki Yamashita yama3133
1
110
日本Rubyの会の構造と実行とあと何か / hokurikurk01
Avatar for Masayoshi Takahashi takahashim
4
880
因果AIへの招待
Avatar for Shohei SHIMIZU sshimizu2006
0
900
プロダクトマネージャーが押さえておくべき、ソフトウェア資産とAIエージェント投資効果 / pmconf2025
Avatar for Masato Ishigaki / 石垣雅人 i35_267
2
580
Snowflakeでデータ基盤を もう一度作り直すなら / rebuilding-data-platform-with-snowflake
Avatar for pei0804 pei0804
2
250
たかが特別な時間の終わり / It's Only the End of Special Time
Avatar for watany watany
29
7.9k
AI時代の開発フローとともに気を付けたいこと
Avatar for KAMEGAWA Kazushi kkamegawa
0
1.5k

Featured

See All Featured
The Psychology of Web Performance [Beyond Tellerrand 2023]
Avatar for Tammy Everts tammyeverts
49
3.2k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
10k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
9.8k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
9
1k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
127
17k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1032
470k
Navigating Team Friction
Avatar for Lara Hogan lara
191
16k
Fireside Chat
Avatar for paigeccino paigeccino
41
3.7k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.3k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.7k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k

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Ͱݕࡧ͠ɺ౴͑Λࣗ෼Ͱݟ͚ͭग़ͤΔΑ͏ʹ͠·͠ΐ͏ɻ ࣗ෼ͰղܾͰ͖ΔΑ͏ʹͳΔͱɺࣗश͕ḿΓϝΩϝΩͱ্ୡ͠·͢ɻ