웹 접근성 모든 사용자들이 인터넷을 이용할 수 있도록 웹 사이트와 애플리케이션을 설계하고 구현하는 것을 말합니다. 눈이 보이지 않는 사용자, 청각 장애가 있는 사용자, 지체적 장애가 있는 사용자 등 모든 사용자들이 인터넷을 자유롭게 이용할 수 있도록 환경을 제공하는 것입니다. 예를 들어, 쇼핑 사이트에서 제품에 대한 설명을 이미지가 아닌 텍스트로 게시하게 하여 시각 장애인들의 경우, Screen Reader 같은 프로그램이 대신 읽어주게 하는 것이 가능합니다. 이를 통해, 장애인들을 포함한 사용자층의 확대, 운전 중 같은 다양한 환경 지원,사회적 이미지 향상등의 효과를 얻을 수 있습니다. WAI-ARIA WAI-ARIA는 웹 접근성을 높이기 위해 개발된 웹 콘텐츠 접근성 지침(WCAG)의 일부로, 모든 ..
SEO
SEO SEO는 검색 엔진 최적화(Search Engine Optimization)의 약자로, 웹사이트의 검색 엔진 상위 노출을 목적으로 하는 기술입니다. 검색 엔진에서 사용자가 검색한 키워드와 관련된 정보를 찾아서 웹사이트의 순위를 결정합니다. SEO는 이러한 검색 엔진의 동작 원리를 이해하고 웹사이트를 최적화하여 검색 엔진 상위 노출을 유도하는 방법을 다룹니다. SEO는 크게 페이지 내부에서 진행할 수 있는 On-Page SEO와 웹 사이트 외부에서 이루어지는 Off-Page SEO 두 가지로 나뉩니다. Off-Page SEO는 광고나 소셜 미디어의 홍보를 사용하며, On-Page SEO는 주로 html의 요소와 요소를 사용하여 검색 엔진의 노출을 유도합니다 SEO에 영향을 미치는 요소 1. 요소 요..
웹 표준 웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’입니다. 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 담고 있습니다 크롬, 에지, 사파리, 오페라, 파이어폭스 등 최신 웹 브라우저들은 모두 웹 표준을 지원합니다. 웹 표준에 따라 페이지를 작성하면 유지 보수에 용이하고, 웹 호환성을 확보하고, 검색 효율성이 증대되면서, 웹 접근성 향상이 향상된다. Semantic HTML 시맨틱 HTML은 웹 문서의 구조와 의미를 명확하게 표현하기 위해 HTML 태그를 사용하는 것을 말합니다. 이를통해 해당 문서가 어떤 내용을 담고 있는지, 어떤 구조..
storybook
storybook Storybook은 React, Vue등의 다양한 프레임워크와 라이브러리를 지원하며, UI 컴포넌트를 개발하고 재사용성을 확대하기 위해 문서화하는 tool입니다. Storybook을 사용하면 컴포넌트를 개별적으로 개발하고 디버깅할 수 있으며, 각각의 컴포넌트를 미리보기하고 상호작용할 수 있는 문서화를 제공합니다. 버그를 사전에 방지하고 테스트 및 개발 속도를 향상하는 장점이 있으며, 애플리케이션 또한 의존성을 걱정하지 않고 빌드할 수 있습니다. storybook설치 먼저 리액트나 vue등을 설치한 폴더에서 터미널에 다음과 같이 설치한다. npx storybook@latest init Storybook 설치가 완료되면, /.storybook 폴더와 /src/stories 폴더가 생성된 것..