Upgrade to Pro — share decks privately, control downloads, hide ads and more …

접근성/SEO를 고려한 프론트엔드 프레임워크 개발

yamoo9
November 23, 2018
0
110

접근성/SEO를 고려한 프론트엔드 프레임워크 개발

접근성/SEO를 고려한 프론트엔드 프레임워크 개발 - 2018 IAT 컨퍼런스 발표 자료

yamoo9

November 23, 2018
Tweet

More Decks by yamoo9

See All by yamoo9
Green Academy Seminar 2019
yamoo9
1
61
WCAG
yamoo9
0
320
패러다임 전환 - FrontEnd Dev.
yamoo9
0
240
2018 웹 테크 콘서트 - JavaScript 천천히 시작하기
yamoo9
0
290
모바일 UI 레이아웃 디자인 (CSS Grid + Frameworks) 2018
yamoo9
0
1.2k

Featured

See All Featured
Designing the Hi-DPI Web
ddemaree
280
34k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
Imperfection Machines: The Place of Print at Facebook
scottboms
265
13k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.2k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
109
49k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Speed Design
sergeychernyshev
25
620
Code Reviewing Like a Champion
maltzj
520
39k
Building Adaptive Systems
keathley
38
2.3k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k

Transcript

  1. 6"-BC!ZBNPPZBNPP!OBWFSDPN ੿ࠁ੽Ӕࢿӝࣿஶಌ۠झ TFTTJPO *"5$POGFSFODF ੽Ӕࢿ4&0ܳҊ۰ೠ
 ೐ۿ౟ূ٘೐ۨ੐ਕ௼ѐߊ

  2. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ঠޖ ZBNPP ٣੗ੋআఊ %FTJHO5IJOLJOH ѐߊআఊ

    ੽Ӕࢿ4&0আఊ %FWFMPQ5IJOLJOH
 "Z4&05IJOLJOH

  3. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ੽Ӕࢿ4&0ܳҊ۰ೠ ೐ۿ౟ূ٘೐ۨ੐ਕ௼ѐߊ

  4. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHMDL.TW8 ѐߊಁ۞׮੐੹ജ 1BSBEJHN4IJGU

  5. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM9JTB ೐ۿ౟ূ٘ѐߊझఖ੄߸ച FWPMVUJPOPG'SPOU&OE%FWFMPQ

  6. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  7. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  8. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  9. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  10. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  11. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  12. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  13. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJP

  14. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  TUBUFPGKTDPN +BWB4DSJQU౟ے٘ 5IF4UBUFPG+BWB4DSJQU

  15. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  16. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష 

  17. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  NPNFOUDPLS ೐ۨ੐ਕ௼ܳഝਊೠਢࢲ࠺झ 8FC4FSWJDFVTJOH'SBNFXPSLT

  18. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM[E7&N1 ೐ۨ੐ਕ௼بੑӝ 5IF*OUSPEVDUJPOPG'SBNFXPSL

  19. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM[E7&N1 ழझథஹನք౟ഝਊ 6TJOH$VTUPN$PNQPOFOUT

  20. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HJUIVCDPNZBNPP8FC$PNQPOFOU 8$ਢ಴ળ)5.-ਢஹನք౟ 8$8FC4UBOEBSE8FC$PNQPOFOU

  21. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM6GX4B ೐ۨ੐ਕ௼द੘ೞӝ (FUUJOH4UBUFE'SBNFXPSL

  22. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM6GX4B ೐۽ં౟ݒפ੷(6* 7VF1SPKFDU.BOBHFS

  23. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ੽Ӕࢿ4&0ܳҊ۰ೠ ಁ۞׮੐੹ജ੉੹द؀੄ ೐ۿ౟ূ٘ѐߊ

  24. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ੽Ӕࢿ4&0ܳҊ۰ೞ૑ঋח ಁ۞׮੐੹ജ೐ۨ੐ਕ௼द؀੄ ೐ۿ౟ূ٘ѐߊ

  25. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  :".00/*/&!ZBNPPZBNPP!OBWFSDPN ࢚׼൤ࠂ੟ೞѱ߸҃ػ ೐ۿ౟ূ٘ѐߊജ҃ ೐ۨ੐ਕ௼ࢎਊद 


    ߔূ٘ѐߊജ҃җ
 ਬࢎೞѱ߸҃ؽ HJUIVCDPNZBNPPOVYU#MPH I'm a Fullstack 
 Developer

  26. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ݆਷੽Ӕࢿޙઁܳղನೠ
 ೐ۨ੐ਕ௼ഝਊࢲ࠺झѨష 3FWJFXGSBNFXPSLVUJMJ[BUJPOTFSWJDFT XJUINBOZBDDFTTJCJMJUZJTTVFT

  27. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ా੉޷૑۽ٜ݅য૓Ӓې೗੿ࠁ ؀୓ఫझ౟ࠗ੤  ఃࠁ٘۽੽Ӕࠛоמೠ୓௼߅झ ߡౡݽন੄ਃٜࣗ

    It's ridiculous

  28. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  It's ridiculous ా੉޷૑۽ٜ݅য૓Ӓې೗੿ࠁ ؀୓ఫझ౟ࠗ੤ 

    ఃࠁ٘۽੽Ӕࠛоמೠ୓௼߅झ ߡౡݽন੄ਃٜࣗ

  29. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM)): BMUࣘࢿഝਊ VTJOH"MUFSOBUF5FYU The drinks

    are on me!

  30. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM2#7/.+ ನழझਃࣗഝਊ VTJOH'PDVTBCMF&MFNFOUT The drinks

    are on me!

  31. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPT[XWKLR ੽Ӕࢿѐࢶ *NQSPWFBDDFTTJCJMJUZ

  32. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ോ؀ಪߣഐੑ۱द ൦౟੿ࠁܳ ٍןѱঌѱغחޙઁ I'm so

    pissed off 
 right now!

  33. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHM&5'/ BSJBEFTDSJCFECZࣘࢿഝਊ VTJOH8"*"3*" The drinks

    are on me!

  34. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPTOW ੽Ӕࢿѐࢶ *NQSPWFBDDFTTJCJMJUZ

  35. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ੋૐઁೠदр੿ࠁܳपदрਵ۽ ࢎਊ੗ীѱঌ۰઱૑ޅೞחޙઁ It's ridiculous

  36. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHMP1E+" BSJBMJWFࣘࢿഝਊ VTJOH8"*"3*" The drinks

    are on me!

  37. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPT[RPOSZP[ ੽Ӕࢿѐࢶ *NQSPWFBDDFTTJCJMJUZ

  38. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  Ӓ৻ীب݆ࣻ਷੽Ӕࢿ ޙઁоৈӝ੷ӝࢲࠁৈ Shaking My Damn

    Head . . .

  39. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ޙઁоޥ૑חঌѷחؘ Ӓ۠੉ঠӝחѐߊೞӝ੹ী
 ೧઱ݶજਗ਼ই ѐߊೠറী
 ੉ঠӝೞݶ൨ٜਗ਼ই

    수정할 게 한 두개가 
 아니잖아?

  40. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HJUIVCDPNWVFBZWVFBYF ೐ۨ੐ਕ௼੽Ӕࢿೱ࢚ਸਤೠ೒۞Ӓੋ 1MVHJOUPJNQSPWFGSBNFXPSLBDDFTTJCJMJUZ

  41. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPTWMPQS ѐߊ઺੽ӔࢿѨࣻ "DDFTTJCJMJUZBVEJUJOHEVSJOHEFWFMPQNFOU

  42. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  Ѩ࢝ূ૓୭੸ച 4&0 ޙઁܳо૓
 41"೐ۨ੐ਕ௼ܳഝਊೠࢲ࠺झ 4FBSDIFOHJOFPQUJNJ[BUJPO

    4&0 JTTVFT4FSWJDFT VTJOHUIF41"GSBNFXPSL What . . . 
 should I read?

  43. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHMU,OU) ಕ੉૑ஹನք౟߹ݫఋ੿ࠁҙܻ೒۞Ӓੋ .BOBHFQBHFNFUBJOGPJO7VFDPNQPOFOUT

  44. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPTZKSLZ 4&0ѐࢶ *NQSPWF4FBSDI&OHJOF0QUJNJ[BUJPO

  45. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  TTSWVFKTPSH ࢲߡࢎ੉۪٘؊݂ 443 ೒۞Ӓੋ 7VFKT4FSWFS4JEF3FOEFSJOH

  46. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  OVYUKTPSH /VYUKT೐ۨ੐ਕ௼ 7VF .FUB 443

     6OJWFSTBM7VFKT"QQMJDBUJPO

  47. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  DPEFTBOECPYJPTROZMLOM 4&0ѐࢶ *NQSPWF4FBSDI&OHJOF0QUJNJ[BUJPO

  48. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ROZMLOMTTFDPEFTBOECPYJP ࢲߡࢎ੉۪٘؊݂Ѿҗ 4FSWFSTJEFSFOEFSJOHSFTVMUT

  49. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ROZMLOMTTFDPEFTBOECPYJP 4&0 ":ѐࢶ *NQSPWF4FBSDI&OHJOF0QUJNJ[BUJPO"DDFTTJCJMJUZ

  50. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  WVFTFSWFSSFOEFSFSա/VYUKT೐ۨ੐ਕ௼
 ೡѪহ੉/PEFKTѐߊജ҃ਵ۽ݽف
 ߄Լঠೞਗ਼ই ӒѤખ൨ٜয
 ਋ܽ੉޷׮ܲѐߊജ҃ਸы୶Ҋ੓׮Ҋ

    우리는 Node.js 
 개발 환경이 아니라고!

  51. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHMDQ/K: /PEFKTоইצѐߊജ҃ীࢲ੄؀਽ 8IBUUPEPJOBOPO/PEFKTEFWFMPQNFOUFOWJSPONFOU

  52. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  QSFSFOEFSJP 1SFSFOEFS޷ٜਝয +BWB4DSJQUXFCTJUFUPCFDSBXMFEQFSGFDUMZCZTFBSDIFOHJOFT

  53. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  Q A 

  54. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  ZBNPPHJUCPPLJPWVFBZTFP ੽Ӕࢿ4&0ܳҊ۰ೠ
 গ೒ܻா੉࣌ઁ੘о੉٘࠘ "DDFTTJCJMJUZ4&0CBTFEBQQMJDBUJPO
 DSFBUJPOHVJEFCPPL

  55. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  BZHJUCPPLJPXDBH ਢ௑బஎ੽Ӕࢿо੉٘ۄੋ 8FC$POUFOUT"DDFTTJCJMJUZ(VJEFMJOF

  56. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  BZHJUCPPLJPHSBQIJDTBSJB ࢎۈਸਤೠ੿ࠁӒې೗٣੗ੋ 8"*"3*"(SBQIJDT.PEVMF

  57. 6"-BC!ZBNPPZBNPP!OBWFSDPN −ѐߊജ҃੄߸ച  −੽Ӕࢿ੉गѨష  HPPHMOT$;R *"5ஶಌ۠झߊ಴੗ܐ *"5$POGFSFODF1SFTFOUBUJPOT