Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

How to optimize images for Better Web Design

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
400
Digital Design 2022-01
Avatar for Masateru YOSHIMURA mathatelle
0
290
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
730
How to design the individual page
Avatar for Masateru YOSHIMURA mathatelle
1
130
CodePen: Making your portfolio 2021
Avatar for Masateru YOSHIMURA mathatelle
0
170
single page
Avatar for Masateru YOSHIMURA mathatelle
0
900
What is the design
Avatar for Masateru YOSHIMURA mathatelle
2
340

Other Decks in Technology

See All in Technology
構造で守らせる　データ・法務・セキュリティ・開発チームとつくる AI時代のデータガバナンスとデータ基盤のリアル
Avatar for LegalOn Technologies, Inc legalontechnologies
PRO
1
540
1週間、Opus封印でお願いします
Avatar for KintoTech_Dev kintotechdev
0
210
背中から、背中へ　ー 社外コミュニティで学んだ「雑に背中を押す」という恩送り ー / easygoing encouragement and pay forward to community
Avatar for naiban naitosatoshi
0
330
Claude Codeから見る、エンジニアの世界の変容とその先
Avatar for Oikon oikon48
6
4.3k
正解のない研修に放り出されて / Being thrown into a training program with no right answers
Avatar for akira ohno ohnoeight
1
150
LLM-as-a-Judgeは本当に信頼できるのか――評価器を評価する話
Avatar for Takaaki Yayoi taka_aki
3
1.1k
ガチで放置できるClaude Code実行環境の作り方.pdf
Avatar for Lamaglama39 lamaglama39
5
9.8k
これだけは抑えておきたい！後悔しない re:Invent の過ごし方 / AWS re:Invent 2026 prestudy
Avatar for Masanori Yamaguchi kinunori
2
390
撮るだけでは終わらない。ソニーが挑むB2Bカメラソリューション開発
Avatar for ソニー株式会社 sony
0
110
小規模OSSモデルは サイバーセキュリティ業務に どこまで使えるか
Avatar for isao takaesu bbrbbq
0
300
Adversary Infrastructure Hunting101
Avatar for DiscoNinja disconinja
0
160
Obsidian Vault Architectures
Avatar for Daisuke Masuda x5gtrn
PRO
0
170

Featured

See All Featured
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
22k
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
4
4k
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
650
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
380
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
2
540
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
464
34k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
1
530
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1.6k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
Avatar for UX Y'all uxyall
1
3.5k
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
490
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.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Ͱݕࡧ͠ɺ౴͑Λࣗ෼Ͱݟ͚ͭग़ͤΔΑ͏ʹ͠·͠ΐ͏ɻ ࣗ෼ͰղܾͰ͖ΔΑ͏ʹͳΔͱɺࣗश͕ḿΓϝΩϝΩͱ্ୡ͠·͢ɻ