알씨타운

안녕하세요, 알씨타운입니다.🤗 저번 포스팅에 이어 오늘도 웹 접근성에 대해 정리해보도록 해요! [ 이해의 용이성 ] 3.1 가독성 3.2 예측 가능성 3.3 콘텐츠의 논리성 3.4 입력 도움 출처 입력 3.4 입력도움 ​ ​ 1. 레이블 제공 ​ 레이블이란 사용자가 어떠한 입력 form에 내용을 입력할 수 있도록 입력의 용도 또는 역할에 대해 설명해주는 것을 말합니다. 스크린 리더는 입력form의 형태를 읽을 때 그냥 '편집창'이라고만 말합니다. 그래서 이 입력 양식이 무엇인지 용도를 설명하는 텍스트가 없다면 시각장애인은 해당 입력form을 인지하기 어렵기 때문에 반드시 사용자 입력에는 그에 대응하는 레이블을 제공해야 합니다. 1) 과 해당의 id값을 동일 시 시켜 사용자가 폼 요소에 대한 목적을 명확하..

안녕하세요, 알씨타운입니다.🤗 저번 포스팅에 이어 오늘도 웹 접근성 지침에 대해 알아보아요! [ 이해의 용이성 ] 3.1 가독성 3.2 예측 가능성 3.3 콘텐츠의 논리성 3.4 입력 도움 출처 입력 3.3 콘텐츠의 논리성 ​ ​ 1. 콘텐츠의 선형 구조 ​ 스크린 리더 등의 보조기기는 웹을 전체적으로 읽어 줄 때 소스 코드 순서대로 풀어서 접근합니다. 그렇기 때문에 웹 개발자들은 논리적인 순서로 콘텐츠를 제작하여야 합니다! 예를 들면 1) 계층 구조가 명백히 필요한 콘텐츠(ex. 조직도)를 마크업할 때 위의 사진 처럼 조직도를 단순히 이미지로만 만들어서 넣으면 웹 접근성에 부합하는 행위입니다! 비 장애인은 사이트에 나와있는 조직도가 단순히 이미지로 제작되어 있어도 눈으로 쉽게 볼 수 있지만, 시각 장애..

안녕하세요! 알씨타운입니다. 오늘은 웹 접근성 지침 중 3번째 원칙, 이해의 용이성에 대해 설명하겠습니다! 이해의 용이성은 콘텐츠는 장애 유무에 상관없이 이해 될 수 있도록 만들어야 하는 것인데요. [ 이해의 용이성 ] 3.1 가독성 3.2 예측 가능성 3.3 콘텐츠의 논리성 3.4 입력 도움 ​ 3.1 가독성 ​ ​ 1. 기본 언어를 표시 ​ 스크린 리더(화면 낭독 프로그램)가 자동 언어 전환을 지원하는 경우, 웹 페이지에서 주로 사용되는 언어를 명시해야 스크린 리더에서 선언된 언어로 전환해 읽어줍니다. 즉, 마크업 할 때 주로 사용하는 언어를 명시하도록 해야 합니다. 이런식으로 상단 html에 lang 속성을 이용해서 "ISO639-1"에서 지정한 두 글자로 된 언어 코드를 입력합니다. 기본적으로 많..

안녕하세요! 다시 돌아온 알씨타운입니다 🤗 오늘 살펴볼 사이트는 인포그래픽 제작 사이트입니다! 인포그래픽이란? 정보를 빠르고 분명하게 표현하기 위해 정보, 자료, 지식을 그래픽 시각적으로 표현한 것 위키백과 광고 디자인이나 포스터 디자인등의 영감을 얻고 싶으시거나 템플릿이 필요한 분들을 위해 가져와 봤어요~ 해외사이트에다가 로그인을 해야 이용이 가능한 경우가 대부분이어서 사용하는 데에 약간의 불편함이 있을 수도 있지만 다양한 디자인 레이아웃을 보는 데에는 너무 좋다고 생각합니다! ( 색 조합 같은 걸 참고하기도 좋구요! ) 1 VENNGAGE Free Infographic Maker - Venngage Join over 1 million people creating their own professiona..

안녕하세요, 알씨타운입니다!😁 저번 포스팅에 이어 2번째 지침, 운용의 용이성 중 쉬운 네비게이션 검사 항목에 대해 정리 해보겠습니다! [ 운용의 용이성 ] 2.1 입력장치 접근성 2.2 충분한 시간 제공 2.3 광과민성 발작 예방 2.4 쉬운 네비게이션 2.4 쉬운 네비게이션 ​ ​ 1. 반복 영역 건너뛰기 웹 페이지마다 공통적으로 들어가 있는 영역은 페이지를 로드할 때마다, 반복되는 부분을 보여 줍니다. 주로 반복되는 영역의 예 중 하나가 header, 메뉴(navigation)부분 입니다. 비장애인은 웹페이지를 눈으로 스윽 볼 수 있기 때문에 메뉴가 반복되어 나타나도 큰 불편함이 없지만 스크린 리더 사용자나 키보드 tab키를 통해서만 웹을 이용할 수 있는 사람은 매번 페이지를 새로고침하거나, 다른 ..

알씨타운 블로그에 오신 것을 환영합니다! 🤗 요즘 일교차가 커 아침저녁으론 쌀쌀하고 낮에는 날씨가 무척 더운데요. 건강관리에 유의하시길 바래요~ 포토샵을 이용하여 디자인을 할 때 제가 자주 사용하는 것이 있는데요! 바로 브러시입니다. 브러시를 사용하면 패턴도 간단하게 만들 수 있을 뿐만아니라 텍스처, 모양 등을 표현할 때 쉽고 빠르게 쓸 수 있기 때문이죠! 오늘은 인터넷에서 무료로 제공하는 포토샵 브러시 사이트 5곳을 소개해볼까 합니다. 생각보다 퀄리티 좋은 사이트를 찾는 게 쉽지 않았어요 😅 ※ 무료 사이트에서 다운 받으실 때에는 항상 저작권 라이센스를 확인 후 다운받아 주세요! ※ 1 BRUSHEEZY Photoshop resources for everyone. Download millions of ..

안녕하세요! 알씨타운입니다!😄 웹 접근성 지침 두번째 운용의 용이성에 대해 이어서 공부하도록 해요! [ 운용의 용이성 ] 2.1 입력장치 접근성 2.2 충분한 시간 제공 2.3 광과민성 발작 예방 2.4 쉬운 네비게이션 2.2 충분한 시간 제공 ​ ​ 1. 응답 시간 조절 ​ 시간 제한이 있는 콘텐츠는 응답 시간을 조절할 수 있도록 만들어야 사용자가 시간 제한 콘텐츠를 인식하기 수월합니다. 사실 웹을 제작할 때 시간 제한이 있는 콘텐츠(ex. 로딩페이지)는 되도록 피하는 것이 좋습니다. 하지만 은행사이트처럼 보안 문제로 시간제한이 필요한 경우에는 어떻게 응답 시간을 알려주는 지 알아보도록 합시다. 은행 사이트의 경우 보안 문제로 인해 시간 제한에 대한 안내가 필요합니다. 어떠한 안내사항을 제공하지 않고 ..

어서오세요! 알씨 타운입니다! 🤗 모방은 창조의 어머니다 아리스토 텔리스의 저서 『시학』 中 여러분들은 디자인 영감을 어디서 받으시나요?? 디자인 감각을 키우기에 다른 사람들의 작품을 많이 접하는 것만큼 좋은 방법은 없는 것 같아요! 오늘은 디자인을 참고할 수 있도록 모아놓은 사이트 5곳을 소개해보려고 합니다! 시작해봅시다! 1 DRIBBLE Dribbble - Discover the World’s Top Designers & Creative Professionals Discover the world’s top designers & creatives Dribbble is the leading destination to find & showcase creative work and home to the wo..