Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Webフォントことはじめ。Getting started with web fonts.
Search
Takafumi Omuro
July 26, 2018
Technology
0
110
Webフォントことはじめ。Getting started with web fonts.
Takafumi Omuro
July 26, 2018
Tweet
Share
More Decks by Takafumi Omuro
See All by Takafumi Omuro
生成AIで生産性向上
tomuro
0
430
Cloudflare Workers の実行時間が遅くなることがある
tomuro
0
14
生成AI使ってますか? 〜Amazon Bedrockで試してみよう〜
tomuro
2
310
Morisawa Fonts 新プランでのStripe導入事例
tomuro
0
130
Cloudflareを活用したWebフォントサービスの概要
tomuro
0
250
Stripeでサブスクリプションに割引を適用したときの注意点
tomuro
0
340
クラウドを利用したサブスクリプションサービスに向けて内製化開発に切り替えた話
tomuro
2
560
SESからSendGridに変更したけど移行で問題が出た話
tomuro
1
2.1k
なぜ老舗企業がOktaでDXを実現できたのか?
tomuro
1
590
Other Decks in Technology
See All in Technology
事業成長の裏側:エンジニア組織と開発生産性の進化 / 20250703 Rinto Ikenoue
shift_evolve
PRO
3
22k
IPA&AWSダブル全冠が明かす、人生を変えた勉強法のすべて
iwamot
PRO
2
150
開発生産性を組織全体の「生産性」へ! 部門間連携の壁を越える実践的ステップ
sudo5in5k
2
7.2k
改めてAWS WAFを振り返る~業務で使うためのポイント~
masakiokuda
2
260
KubeCon + CloudNativeCon Japan 2025 Recap Opening & Choose Your Own Adventureシリーズまとめ
mmmatsuda
0
280
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
27k
いつの間にか入れ替わってる!?新しいAWS Security Hubとは?
cmusudakeisuke
0
130
高速なプロダクト開発を実現、創業期から掲げるエンタープライズアーキテクチャ
kawauso
2
9.4k
関数型プログラミングで 「脳がバグる」を乗り越える
manabeai
1
190
LangChain Interrupt & LangChain Ambassadors meetingレポート
os1ma
2
320
Zero Data Loss Autonomous Recovery Service サービス概要
oracle4engineer
PRO
2
7.8k
オーティファイ会社紹介資料 / Autify Company Deck
autifyhq
10
130k
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
690
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Automating Front-end Workflow
addyosmani
1370
200k
Building Applications with DynamoDB
mza
95
6.5k
What's in a price? How to price your products and services
michaelherold
246
12k
Typedesign – Prime Four
hannesfritz
42
2.7k
How to Ace a Technical Interview
jacobian
278
23k
Fireside Chat
paigeccino
37
3.5k
Transcript
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ͜ͱ͡Ί .JY-FBQ4UVEZ גࣜձࣾϞϦαϫখࣨو࢙
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ࣗݾհ w ໊લɿখࣨو࢙ʢΦϜϩλΧϑϛʣɹɹɹ w ॴଐɿגࣜձࣾϞϦαϫ ɹɹɹΤϯλϓϥΠζࣄۀ෦։ൃ෦ ɹɹɹΫϥυϑΥϯτγεςϜ՝ w झຯɿόΠΫʢ:;'3ॴ༗ʣ
ɹɹɹ57ήʔϜʢϞϯϋϯɺεϓϥτΡʔϯʣ w ͖ͳॻମɿϑΥʔΫ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ΞδΣϯμ w 8FCϑΥϯτͱʁ w 8FCϑΥϯτͷ͍ํ w ϑΥϯτඳըλΠϜϥΠϯ w ຊޠϑΥϯτͷ
w 8FCϑΥϯτ࠷దԽ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ࠓͷΰʔϧ w ΰʔϧ w 8FCϑΥϯτΛ͑ΔΑ͏ʹͳΔ͜ͱ w ϑΥʔΫΛݟ͚ΕΔΑ͏ʹͳΔ͜ͱ w ͢͜ͱ
w 8FCϑΥϯτͷ͍ํʹ͍ͭͯ w ͞ͳ͍͜ͱ w 8FCϑΥϯτબఆͳͲͷσβΠϯʹ͍ͭͯ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͱʁ w ϝϦοτ w ࣗ༝ͷߴ͍8FCσβΠϯ w ΞΫηεϏϦςΟͷ্ w σϝϦοτ
w ϑΥϯτϑΝΠϧͷμϯϩʔυʹґΔԆදࣔ w ຊޠͳͲจࣈछͷଟ͍ϑΥϯτͰ༰ྔ͕େ͖͍
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͱʁ IUUQTXXXPODIPTIPLVKQ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͱʁ IUUQTXXXDJUZTIJCVZBUPLZPKQ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͷ͍ํ w $44A!GPOUGBDFA @font-face { font-family: "MyFont"; src: url("fonts/MyFont.woff");
} w $44AGPOUGBNJMZA body { font-family: "MyFont"; } ˡϑΥϯτ໊ʢԿͰ͍͍ʣ ˡϑΥϯτͷॴ ˡ!GPOUGBDFͰࢦఆͨ͠ϑΥϯτ໊
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͷ͍ํ w $44A!GPOUGBDFA @font-face { font-family: "MyFont"; src: url("fonts/MyFont.woff")
format("woff"), url("fonts/MyFont.ttf") format(“ttf"); } w $44AGPOUGBNJMZA body { font-family: "MyFont"; } ˣTSDϑΥʔϧόοΫͰ͖·͢ ˢϨΨγʔϒϥβ͚ʹ ɹෳॻ͍ͨΓͰ͖·͢
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͷ͍ํ w $44A!GPOUGBDFA @font-face { font-family: "MyFont"; src: url("fonts/MyFont.woff")
format("woff"), url(“fonts/MyFont.ttf") format(“ttf"); } w $44AGPOUGBNJMZA body { font-family: "MyFont", serif; } ˣGPOUGBNJMZϑΥʔϧόοΫͰ͖·͢
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτͷ͍ํ w $44A!GPOUGBDFA @font-face { font-family: "MyFont"; src: url("fonts/MyFont.woff")
format("woff2"), url(“fonts/MyFont.ttf") format(“ttf"); } w $44AGPOUGBNJMZA body { font-family: "ascii", "͔ͳ", "ࣈ"; } ˣӳޠɺ͔ͳɺࣈͷॻମΛΓସ͑Δ͜ͱͰ͖·͢
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period swap
period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ UJNF
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period swap
period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ '0*5 'MBTIPG*OWJTJCMF5FYU จࣈ͕දࣔ͞Εͳ͍
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE UJNF ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period
swap period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ ϑΥϯτμϯϩʔυྃ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period swap
period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ '065 'MBTIPG6OTUZMFE5FYU จࣈͷνϥ͖ͭൃੜ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE UJNF ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period
swap period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ ͜͜·Ͱʹμϯϩʔυ Ͱ͖ͳ͍ͱதஅ͞ΕΔ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE UJNF ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period
swap period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ $ISPNF 'JSFGPYT
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE UJNF ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period
swap period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ *& &EHFT
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE UJNF ϑΥϯτඳըλΠϜϥΠϯ w $44'POUT.PEVMF-FWFM w 5IF'POU%JTQMBZ5JNFMJOF IUUQTESBGUTDTTXHPSHDTTGPOUTGPOUEJTQMBZUJNFMJOF block period
swap period font failure period ݟ͑ͳ͍จࣈͰ ϨϯμϦϯά ସϑΥϯτͰ ϨϯμϦϯά ϑΥϯτऔಘதஅ 4BGBSJʿ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ຊޠϑΥϯτͷ w ༰ྔ͕େ͖͍ ྫ͑ɺ(PPHMFͷ/PUP4BOT$+,Λར༻͢Δ߹ʜ ༻్ ϑΝΠϧ໊ ༰ྔ ݟग़͠
/PUP4BOT$+,KQ#PMEPUG .# Ϧʔυ /PUP4BOT$+,KQ.FEJVNPUG .# ຊจ /PUP4BOT$+,KQ3FHVMBSPUG .#
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ຊޠϑΥϯτͷ w άϦϑʢࣈܗʣ͕ෳࡶ ෳࡶͳάϦϑΛখαΠζͰදࣔ͢Δͱʜ ᳵ ɾQU ɾQU ᳵ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w 8FCϑΥϯτϑΥʔϚοτ format ໊শ આ໌ ิ UUG 5SVF5ZQF'POU
5SVF5ZQFΞτϥΠϯ (FOFSBM PUG 0QFO5ZQF'POU $''ΞτϥΠϯ (FOFSBM XP⒎ 8FC0QFO'POU'PSNBU 8FCϑΥϯτ༻ͷѹॖϑΥϯτ 8FC XP⒎ 8FC0QFO'POU'PSNBU XP⒎ͷѹॖΞϧΰϦζϜվળ൛ 8FC FPU &NCFEEFE0QFO5ZQF *&͚ͷ.4ಠ༷ࣗ -FHBDZ TWH 4DBMBCMF7FDUPS(SBQIJDT 47(ܗࣜͷϑΥϯτ -FHBDZ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w αϒηοτ ຊޠͰΑ͘͏จࣈ͚ͩͷϑΥϯτʹͨ͠߹ ˞+*49ୈҰਫ४ࣈɺه߸ɺجຊϥςϯจࣈɺ͔ͳɺΧφ ࢀߟࢿྉʣ5BLBOPSJ0LJ ΠψͰΘ͔ΔΣϒϑΥϯτ
1ද ϑΝΠϧ໊ ࠷దԽલ ࠷దԽޙ 80'' ࠷దԽޙ 80'' /PUP4BOT$+,KQ#PMEPUG .# ,# ,# /PUP4BOT$+,KQ.FEJVNPUG .# ,# ,# /PUP4BOT$+,KQ3FHVMBSPUG .# ,# ,#
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w "QQMFͷ8FCαΠτͷ߹ จࣈఔʴXP⒎ѹॖ IUUQTXXXBQQMFDPNKQ ϑΝΠϧ໊ ༰ྔ 4'1SP+1@SFHVMBSXP⒎
,# 4'1SP+1@TFNJCPMEXP⒎ ,#
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w ࠷దԽ݁ߏΊΜͲ͍͘͞Ͱ͢ΑͶʜ
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w 8FCϑΥϯταʔϏεΛ͏ʂ IUUQTUZQFTRVBSFDPN
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE 8FCϑΥϯτ࠷దԽ w αϒηοτͱϑΥʔϚοτม͕ࣗಈͰߦΘΕ·͢ʂ '065ʢνϥπΩʣσϑΥϧτઃఆͰ੍ʂ IUUQTUZQFTRVBSFDPN
$PQZSJHIU.PSJTBXB*OD"MM3JHIUT3FTFSWFE ࢀߟࢿྉ w ΠψͰΘ͔ΔΣϒϑΥϯτʢബ͍ຊʣ ˣۀ൛ͰϦχϡʔΞϧ ΣϒϑΥϯτ࣮ફϚχϡΞϧେଚلʢஶʣ IUUQTXXXBNB[PODPKQEQ IUUQTESBGUTDTTXHPSHDTTGPOUT IUUQTUZQFTRVBSFDPN w
$44'POUT.PEVMF-FWFM w 5ZQF4RVBSF