ブラウザ対応の傾向と対策 2020 / Browser compatibility trends and countermeasures 2020

2020年1月15日に行われた「Markup Meetup #2 in LINKS UMEDA」での登壇「ブラウザ対応の傾向と対策 2020」のスライドです。

Transcript

1. هٚؗا㵚䑴ס
   ⥝⺸כ㵚瓀
     8FE
   .BSLVQ
   .FFUVQ
   
   叜姧　䇖 ׵׽יח
2. ☪㍑ס⫂㳊  هٚؗاⳂ⺸ 1$
    1$榫هٚؗاס㵚䑴
    هٚؗاⳂ⺸ تٌُ
    تٌُهٚؗاס㵚䑴
    1$تٌُ⪦鵟ס䗯㕔
    ױכ״
3. 舅䄕磆☭ ˝ 叜姧　䇖 ׵׽יח
   ˝ 劔䌋⚡炘ءٚشغ؞ٖ٭ه
 وٞٓ٭ب٘٤礴䦮儖鼧
   
 وٞرؠعꝧ氦鼧
 نٞ٤عؙ٤غتًبٔٛتع
   ˝ ꧅嚀ْ٭؜٭
 ̜خنعؘْؗؓ٭؜٭
 ̜䇗僖־׼杯绷
   ˝ 塶 ̚鶟丗
   ˝ 切䄫妨؛آךؤ٤عٚفت䍧ַיױ׌ 3 IUUQTTQBJBKQ
4. ע׋״מ לסهٚؗا؅䘶㲊׊י
 ظاؕ٤ꝧ氦؅
 车זיַױ׌־ 4
5. 
   هٚؗاⳂ⺸ 1$ 佅ע*OUFSOFU
   &YQMPSFSס䍚
   ̜
   ☪ע(PPHMF
   $ISPNFס䍚 5 ┩槡ס1$هٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖 $ISPNF
   
    *&
   
    4BGBSJ
   
    &EHF
   
    'JSFGPY
   
   
6. 
   هٚؗاⳂ⺸ 1$ 佅ע*OUFSOFU
   &YQMPSFSס䍚
   ̜
   ☪ע(PPHMF
   $ISPNFס䍚 6 仼儖ס1$هٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖 $ISPNF
   
    *&
   
    4BGBSJ
   
    &EHF
   
    'JSFGPY
   
    仼儖ךעױד*&ֿ
 Ⱏ䍚墦זיַ׾
7. 
   هٚؗاⳂ⺸ 1$ 䇗僖仼
   $ISPNJVNي٭تס&EHFٛٛ٭ت $ISPNJVN $ISPNF&EHF ס׈׼ם׾㴛ⶭ 䇗僖仼
   8JOEPXT
   ئَ٭ع磙▼ 7
8. 
   1$榫هٚؗاס㵚䑴 ˝ 㓹儖氳מע$ISPNF؅䘶㲊׊י ظاؕ٤ꝧ氦؅׊יַׄף荁 ַֿ'JSFGPY4BGBSJ&EHF׵澬鏀 ך׀׿ףםֽ荁ַ
   ˝ *&ע☪䏲׈׼ם׾بؘؓ⛥┖ֿ ◀䘶׈׿׾
   Ձ☪䏲ס勅♭ךע㵚䑴┘釐כ 銧זי䄐׊䶹ֻםַ 8
9. 
   1$榫هٚؗاס㵚䑴 *&סゖ갭憠
   ˝ )5.-$44+BWB4DSJQUמֽׄ׾僃二䤗软ס墜؆ל؅ئَ٭ع׊ יַםַ
    )5.-
   ̜
   UFNQMBUF ؤ٤ط٤صط٤وٝ٭ع
   QJDUVSFםל
    $44
   ̜
   QPTJUJPOTUJDLZ
   $44
   (SJE
   -BZPVU 二☼喋 םל
    +BWB4DSJQU
   ̜
   &4♓꡸ע׮ׯ⪒巶
   ˝ .JDSPTPGU׵*&־׼&EHF׫ס燯车؅䫟㝢׊יַ׾
    IUUQTUFDIDPNNVOJUZNJDSPTPGUDPNUXJOEPXTJUQSPCMPHUIFQFSJMTPG VTJOHJOUFSOFUFYQMPSFSBTZPVSEFGBVMUCSPXTFSCBQ 9
10. 
    1$榫هٚؗاס㵚䑴 *&מ㵚䑴׌׾㕙⺬סゖ갭憠
    ˝ )5.-$44+BWB4DSJQUמֽׄ׾僃二䤗软ס墜؆ל؅ئَ٭ع ׊יַםַ 10 ✳ֻ׾䤗软ֿ 㛻䆋מ⯆꡾ 僃二䤗软ם׼ 哧מך׀׾㵚 䑴ֿך׀םַ 䄄丗㘃ⱶ
11. 
    1$榫هٚؗاס㵚䑴 א׿ך׵*&㵚䑴؅걘㲘־׼姲״׼׿ג㕙⺬
    ̜
    鹟䥃罈עח 11 
    了׾ 
    *&ךꞦ鈋ך׀׾ؤ٤ط٤ص؅⯆꡾׌׾ 
    ⮯乢ꄋך㵚䑴׌׾
12. 
    1$榫هٚؗاס㵚䑴 *&؅⮉׿ף؝٤؝٤僃二䤗软؅✳זי0,־ 12 ˝ א׿ב׿┉㲊סبֵֿؘؓ׾
    ˝ א׿ב׿斻舅ס嚀耆׵ֵ׾ 辐炐Ⳃ⛼澬鏀յ☼喋澬鏀ע 䑫׿׍מ
13. 
    هٚؗاⳂ⺸ تٌُ ┩槡סٓفٜؕهٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖 13 4BGBSJ
    
     $ISPNF
    
     ┩槡氳מע
 $ISPNFֿ⨣ⳙ
14. 
    هٚؗاⳂ⺸ تٌُ 仼儖סٓفٜؕهٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖 14 4BGBSJ
    
     $ISPNF
    
     仼儖ךע
 4BGBSJֿ㏆⠠
15. 
    تٌُ榫هٚؗاס㵚䑴 ˝ ㎁⫂⺸ׄם׼㓹儖氳מ$ISPNFכ4BGBSJסײ㵚䑴׌׿ףゖ갭ם׊
    ˝ هٚؗاסف٭ة٘٤׻׽׵04סف٭ة٘٤מ❣㰆׊׷׌ַ
     "OESPJEױךյJ04ױךע$44+BWB4DSJQUך辐炐Ⳃ⛼מ⯆꡾ 㛡丗
     גד׊⹿ַف٭ة٘٤עبֿؘؓ丗םסך扛釱׊י׵墜؆ לゖ갭ם׊
    ˝ J04ע䙫㛙כ☼喋䄐樟┘⪮⺬ֿ㛡ַ
    Ձ 㲔嚀ךס䒝⪌׽ם澬鏀؅ 15 ❆ֻף׆׿̜
16. 
    تٌُ榫هٚؗاס㵚䑴 ⹿ַ04ס㵚䑴敯媲
    ˝ "OESPJE
    ̜
    ױךכס8FC7JFX
     'MFYCPYעي٤ر٭وٝنؔشؠتֿ䑒釐
     $44
    (SJE
    -BZPVUֿꪜ㵚䑴
     &4ֿꪜ㵚䑴
    ˝ J04
    ̜
    ױךע釐嫰䙫
     'MFYCPYױךעي٤ر٭وٝنؔشؠتֿ䑒釐
     $44
    (SJE
    -BZPVUע־׼
     &4ע־׼ 16
17. 
    1$تٌُ⪦鵟ס䗯㕔
    㵚䑴敯媲؅鐧׬׾̜
    $BO
    *
    VTF
    DBOJVTFDPN 17
18. 
    1$تٌُ⪦鵟ס䗯㕔
    㵚䑴敯媲؅鐧׬׾̜
    .%/׵⺨ꯁ泘מ㵚䑴敯媲ֿ鬼זיַױ׌ 18
19. 
    1$تٌُ⪦鵟ס䗯㕔
    نؚ٤عס䣽ַ
    ˝ ⺱׋ئؕثסنؚ٤عך׵牊 걉מ׻זי嘦䆋յ┕┖⛣糋յ ؜٭ؼ٤ءֿ樟םזי׀ױ׌
    Ձ 04מ׻זי嘅嶖סنؚ٤ع ֿ樟ם׾յ׌ם؂ה釤ֻ亠׵ 樟ם׾סך釐嫰䙫 19 ᕟΰγοΫ ώϥΪϊ֯ΰ Roboto FUDʜ
20. 
    ױכ״ ˝ 1$׵تٌُ׵㵚䑴敯媲յ䄫㕙بؘؓע仼չ㚺؂זיַ׀ ױ׌
    ˝ לסهٚؗاյف٭ة٘٤㵚䑴؅车ֹסֿ荁ַ־׵侇ס 孱׿ך㚺؂זיַ׀ױ׌
    ˝ ⹿ַهٚؗاע鸵䈱םذِؕ٤ءך䩰ייյ二䤗软؅ ✳זיⲖ曍氳מؤ٭ظؔ٤ءյꝧ氦׊יַ׀ױ׊׺ֹ
    ˝ 二䤗软ס㵚䑴敯媲ٛئ٭زյⳂ⛼澬鏀׵䑫׿׍מ 20
21. 磙 ֵ׽ֿכׇֹ׉ַױ׊גն