$30 off During Our Annual Pro Sale. View Details »

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

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

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

もりてつ

January 15, 2020
Tweet

More Decks by もりてつ

Other Decks in Technology

Transcript

  1. هٚؗا㵚䑴ס
    ⥝⺸כ㵚瓀
     8FE

    .BSLVQ.FFUVQ
    叜姧 䇖 ׵׽יח

    View Slide

  2. ☪㍑ס⫂㳊
     هٚؗاⳂ⺸ 1$

     1$榫هٚؗاס㵚䑴
     هٚؗاⳂ⺸ تٌُ

     تٌُهٚؗاס㵚䑴
     1$تٌُ⪦鵟ס䗯㕔
     ױכ״

    View Slide

  3. 舅䄕磆☭
    ˝ 叜姧 䇖 ׵׽יח

    ˝ 劔䌋⚡炘ءٚشغ؞ٖ٭ه

    وٞٓ٭ب٘٤礴䦮儖鼧

    وٞرؠعꝧ氦鼧

    نٞ٤عؙ٤غتًبٔٛتع
    ˝ ꧅嚀ْ٭؜٭

    ̜خنعؘْؗؓ٭؜٭

    ̜䇗僖־׼杯绷
    ˝ 塶 ̚鶟丗

    ˝ 切䄫妨؛آךؤ٤عٚفت䍧ַיױ׌
    3
    IUUQTTQBJBKQ

    View Slide

  4. ע׋״מ
    לסهٚؗا؅䘶㲊׊י

    ظاؕ٤ꝧ氦؅

    车זיַױ׌־
    4

    View Slide

  5. هٚؗاⳂ⺸ 1$

    佅ע*OUFSOFU&YQMPSFSס䍚̜☪ע(PPHMF$ISPNFס䍚
    5
    ┩槡ס1$هٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖

    $ISPNF
    *&
    4BGBSJ
    &EHF
    'JSFGPY

    View Slide

  6. هٚؗاⳂ⺸ 1$

    佅ע*OUFSOFU&YQMPSFSס䍚̜☪ע(PPHMF$ISPNFס䍚
    6
    仼儖ס1$هٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖

    $ISPNF
    *&
    4BGBSJ
    &EHF
    'JSFGPY
    仼儖ךעױד*&ֿ

    Ⱏ䍚墦זיַ׾

    View Slide

  7. هٚؗاⳂ⺸ 1$

    䇗僖仼
    $ISPNJVNي٭تס&EHFٛٛ٭ت
    $ISPNJVN $ISPNF&EHF
    ס׈׼ם׾㴛ⶭ
    䇗僖仼
    8JOEPXTئَ٭ع磙▼
    7

    View Slide

  8. 1$榫هٚؗاס㵚䑴
    ˝ 㓹儖氳מע$ISPNF؅䘶㲊׊י
    ظاؕ٤ꝧ氦؅׊יַׄף荁
    ַֿ'JSFGPY4BGBSJ&EHF׵澬鏀
    ך׀׿ףםֽ荁ַ
    ˝ *&ע☪䏲׈׼ם׾بؘؓ⛥┖ֿ
    ◀䘶׈׿׾
    Ձ☪䏲ס勅♭ךע㵚䑴┘釐כ
    銧זי䄐׊䶹ֻםַ
    8

    View Slide

  9. 1$榫هٚؗاס㵚䑴
    *&סゖ갭憠
    ˝ )5.-$44+BWB4DSJQUמֽׄ׾僃二䤗软ס墜؆ל؅ئَ٭ع׊
    יַםַ
    )5.-̜UFNQMBUF ؤ٤ط٤صط٤وٝ٭ع
    QJDUVSFםל
    $44̜QPTJUJPOTUJDLZ $44(SJE-BZPVU 二☼喋
    םל
    +BWB4DSJQU̜&4♓꡸ע׮ׯ⪒巶
    ˝ .JDSPTPGU׵*&־׼&EHF׫ס燯车؅䫟㝢׊יַ׾
    IUUQTUFDIDPNNVOJUZNJDSPTPGUDPNUXJOEPXTJUQSPCMPHUIFQFSJMTPG
    VTJOHJOUFSOFUFYQMPSFSBTZPVSEFGBVMUCSPXTFSCBQ
    9

    View Slide

  10. 1$榫هٚؗاס㵚䑴
    *&מ㵚䑴׌׾㕙⺬סゖ갭憠
    ˝ )5.-$44+BWB4DSJQUמֽׄ׾僃二䤗软ס墜؆ל؅ئَ٭ع
    ׊יַםַ
    10
    ✳ֻ׾䤗软ֿ
    㛻䆋מ⯆꡾
    僃二䤗软ם׼
    哧מך׀׾㵚
    䑴ֿך׀םַ
    䄄丗㘃ⱶ

    View Slide

  11. 1$榫هٚؗاס㵚䑴
    א׿ך׵*&㵚䑴؅걘㲘־׼姲״׼׿ג㕙⺬
    ̜鹟䥃罈עח
    11
    了׾
    *&ךꞦ鈋ך׀׾ؤ٤ط٤ص؅⯆꡾׌׾
    ⮯乢ꄋך㵚䑴׌׾

    View Slide

  12. 1$榫هٚؗاס㵚䑴
    *&؅⮉׿ף؝٤؝٤僃二䤗软؅✳זי0,־
    12
    ˝ א׿ב׿┉㲊סبֵֿؘؓ׾
    ˝ א׿ב׿斻舅ס嚀耆׵ֵ׾
    辐炐Ⳃ⛼澬鏀յ☼喋澬鏀ע
    䑫׿׍מ

    View Slide

  13. هٚؗاⳂ⺸ تٌُ

    ┩槡סٓفٜؕهٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖

    13
    4BGBSJ
    $ISPNF
    ┩槡氳מע

    $ISPNFֿ⨣ⳙ

    View Slide

  14. هٚؗاⳂ⺸ تٌُ

    仼儖סٓفٜؕهٚؗابؘؓ 4UBUDPVOUFS鐧׬յ䇗僖

    14
    4BGBSJ
    $ISPNF
    仼儖ךע

    4BGBSJֿ㏆⠠

    View Slide

  15. تٌُ榫هٚؗاס㵚䑴
    ˝ ㎁⫂⺸ׄם׼㓹儖氳מ$ISPNFכ4BGBSJסײ㵚䑴׌׿ףゖ갭ם׊
    ˝ هٚؗاסف٭ة٘٤׻׽׵04סف٭ة٘٤מ❣㰆׊׷׌ַ
    "OESPJEױךյJ04ױךע$44+BWB4DSJQUך辐炐Ⳃ⛼מ⯆꡾
    㛡丗
    גד׊⹿ַف٭ة٘٤עبֿؘؓ丗םסך扛釱׊י׵墜؆
    לゖ갭ם׊
    ˝ J04ע䙫㛙כ☼喋䄐樟┘⪮⺬ֿ㛡ַ
    Ձ 㲔嚀ךס䒝⪌׽ם澬鏀؅
    15
    ❆ֻף׆׿̜

    View Slide

  16. تٌُ榫هٚؗاס㵚䑴
    ⹿ַ04ס㵚䑴敯媲
    ˝ "OESPJE̜ױךכס8FC7JFX
    'MFYCPYעي٤ر٭وٝنؔشؠتֿ䑒釐
    $44(SJE-BZPVUֿꪜ㵚䑴
    &4ֿꪜ㵚䑴
    ˝ J04̜ױךע釐嫰䙫
    'MFYCPYױךעي٤ر٭وٝنؔشؠتֿ䑒釐
    $44(SJE-BZPVUע־׼
    &4ע־׼
    16

    View Slide

  17. 1$تٌُ⪦鵟ס䗯㕔
    㵚䑴敯媲؅鐧׬׾̜$BO*VTF DBOJVTFDPN

    17

    View Slide

  18. 1$تٌُ⪦鵟ס䗯㕔
    㵚䑴敯媲؅鐧׬׾̜.%/׵⺨ꯁ泘מ㵚䑴敯媲ֿ鬼זיַױ׌
    18

    View Slide

  19. 1$تٌُ⪦鵟ס䗯㕔
    نؚ٤عס䣽ַ
    ˝ ⺱׋ئؕثסنؚ٤عך׵牊
    걉מ׻זי嘦䆋յ┕┖⛣糋յ
    ؜٭ؼ٤ءֿ樟םזי׀ױ׌
    Ձ 04מ׻זי嘅嶖סنؚ٤ع
    ֿ樟ם׾յ׌ם؂ה釤ֻ亠׵
    樟ם׾סך釐嫰䙫
    19
    ᕟΰγοΫ
    ώϥΪϊ֯ΰ
    Roboto
    FUDʜ

    View Slide

  20. ױכ״
    ˝ 1$׵تٌُ׵㵚䑴敯媲յ䄫㕙بؘؓע仼չ㚺؂זיַ׀
    ױ׌
    ˝ לסهٚؗاյف٭ة٘٤㵚䑴؅车ֹסֿ荁ַ־׵侇ס
    孱׿ך㚺؂זיַ׀ױ׌
    ˝ ⹿ַهٚؗاע鸵䈱םذِؕ٤ءך䩰ייյ二䤗软؅
    ✳זיⲖ曍氳מؤ٭ظؔ٤ءյꝧ氦׊יַ׀ױ׊׺ֹ
    ˝ 二䤗软ס㵚䑴敯媲ٛئ٭زյⳂ⛼澬鏀׵䑫׿׍מ
    20

    View Slide


  21. ֵ׽ֿכׇֹ׉ַױ׊גն

    View Slide