끄적끄적

마크업하면서 무의식적으로 사용하기만 했던 벤더 프리픽스(vendor prefix)의 개념에 대해 정리하고자 한다. CSS3 표준으로 확정되기 이전이나 브라우저별로 다르게 제공하는 기능을 사용하기 위해서는 벤더 프리픽스를 사용해야 한다. 각 브라우저에서 판별이 가능한 접두어를 붙여서 해당 브라우저에서 인식할 수 있도록 도와주는게 바로 벤더 프리픽스이다. -ms-transform:... // Internet Explorer -moz-transform:... // FireFox -webkit-transform:... // Chrome & Safari & Android -o-transform:... // Opera transform:... // 표준 코드 맨 아래에 위치 transform 속성은 위에 처럼 벤더..

WAI-ARIAWeb Accessibility Initiative - Accessible Rich Internet Applications의 약자로, WAI는 W3C에서 웹 접근성을 담당하는 조직이며 ARIA는 리치 인터넷 어플리케이션을 위한 W3C의 접근성 명세이다. 필요성 리치 인터넷 어플리케이션(RIA)는 웹 어플리케이션의 장점은 유지하면서 기존 웹 브라우저 기반 인터페이스의 단점인 늦은 응답 속도, 데스크톱 어플리케이션에 비해 떨어지는 조작성 등을 개선하기 위한 기술의 통칭이다. 이러한 리치 인터넷 어플리케이션이 많아지면서 HTML을 사용하여 동적인 웹 어플리케이션의 접근성을 보장하지 못하는 경우가 생겨나게 되었다. 이 때문에 스크린리더를 사용하는 시각장애인들이 이러한 환경에서 웹 컨텐츠를 이용하는..

모웹 마크업에 Lottie 애니메이션 라이브러리를 사용하게 되면서 알게된 점들을 정리해보았다.개요After Effects 애니메이션을 실시간을 렌더링 하는 iOS, android, react-native, web 라이브러리이며, Bodymovin 이라는 오픈소스를 이용한 After Effects 확장 기능을 사용해서 json 형식으로 추출한 애니메이션 데이터를 사용하여 웹상에서 애니메이션을 렌더링한다. Lottie 메인사이트: https://airbnb.design/lottie소개: https://airbnb.design/introducing-lottie가이드: http://airbnb.io/lottie/web/getting-started.htmlGitHub: https://github.com/airbn..