겨미♡웹

DOM Script의 저자 제레미 키스(Jeremy Keith)가 쓴 방탄 Ajax가 출간되었습니다. DOM Script에서 올바른 DOM, 겸손한(unobtrusive) 자바스크립트에 관한 이야기를 했다면 이번엔 올바른 Ajax의 활용, 접근성을 확보하는 Ajax 개발론, 즉 겸손한(unobtrusive) Ajax에 대해 이야기하고 있습니다. 이 책에서의 Ajax는 Asynchronous JavaScript and XML가 아닌 미국과 영국 등에서 과거에 쓰였던 Ajax라는 단어의 뜻으로서 정의하고 있습니다. 쉽게 말해 Flex, Silverlight 등의 RIA을 포괄하는 의미라는 것입니다. 모든 웹 사이트, 웹 어플리케이션의 기본은 문서이다. 라고 이야기하는 이 책에서는 기본적인 문서((X)HTML..

웹 사이트 개발을 하다보면 하나의 폼에 여러 개의 제출 버튼을 써야하는 경우가 있다. 그 경우 자바스크립트를 사용하지 않고 원하는 기능을 구현하려면 어떻게 해야할까? IE의 버그로 인해 여러 방법 중 대부분이 사용이 어렵지만 submit 타입의 input 태그를 여러 개 넣어서 폼을 구성하면 버그 없고 자바스크립트 의존적이지 않은 결과물을 만들 수 있다. 그럼 실제로 각 글에 체크박스가 있어서 체크 후 삭제 혹은 이동하는 기능이 있는 게시판 목록을 만들어보자. 결과물은 다음의 그림과 같을 것이다. 그림을 보고 HTML 페이지를 만들어보자. 여러개의 폼 제출 버튼 예제 선택 제목 작성자 작성일 조회수 게시판 제목1 아무개 2007년 10월 13일 4 게시판 제목2 아무개 2007년 10월 13일 4 게시판..

페이징 기능을 포함한 게시물 리스트 화면이나 Breadcrumb 구조 등 다수의 공통적인 파라미터를 가지고 다녀야 하는 경우가 있다. 이 경우에 쓰이는 방법이 여러가지가 있는데 일반적으로 서버 사이드 스크립트를 통해 공통적인 파라미터를 묶어서 여러 개의 관련 링크에서 일관적으로 적용하도록 하는 방법이다. 그런데 다음과 같은 HTML 코드를 만들어내는 경우가 있다. (common1~3을 공통적인 파라미터라고 가정한 게시물 보기 화면) Breadcrumb 구조 등 다수의 공통적인 파라미터를 가지고 다녀야 하는 경우가 있다. 이 경우에 쓰이는 방법이 여러가지가 있는데 일반적으로 서버 사이드 스크립트를 통해 공통적인 파라미터를 묶어서 여러 개의 관련 링크에서 일관적으로 적용하도록 하는 방법이다. 그런데 다음과 ..

그림1은 현재 게시판의 분류나 바로가기 메뉴 등에서 선택 시 바로 폼을 전송시키거나 자바스크립트를 이용하여 페이지 전환을 하는 용도로 쓰이고 있다. 그러나 키보드 사용자나 자바스크립트를 사용할 수 없는 사용자를 고려하였을 때 위와 같은 사용은 불가하다. 자바스크립트가 불가능한 사용자를 위해 태그를 이용하여 서브밋 버튼을 추가하면 되지 않느냐? 그것은 반쪽짜리 접근성이다. 마우스 기능을 사용할 수 없는 사용자의 접근성이 상당히 저하되기 때문이다. 키보드 사용자는 select 태그의 목록을 활성화 시킨 후 아래 방향키를 한 번 누르는 순간 select 태그의 자바스크립트가 활성화되어 마치 목록 두 번째 요소를 선택한 듯한 결과를 보게 될 것이다. 전송 버튼을 넣고 select 태그의 onchange 이벤트를..

2012년까지 장애인 13만여명에 IT보조기기 보급 이밖에 장애인이 공공부분의 인터넷 사이트를 손쉽게 이용할 수 있도록 `웹 접근성 준수'를 제도화하기 위해 올해안에 웹 접근성 국가표준을 개정하기로 했으며 공공기관은 물론 민간기관들의 참여를 이끌어내기 위해 `웹 접근성 품질 마크'를 적극적으로 부여하기로 했다. 정부 차원에서 장애인들의 IT 활용 활성화를 추진하고 있다는 기사가 났다. 웹 접근성에 대해 국가 차원의 관심과 필요성이 더욱 늘어나게 되었다는 이야기이다. 좋던 싫던 관심이 있던 없던 웹 표준과 접근성은 점점 피할 수 없는 필수요소가 되어가고 있다. 장애인의 인터넷 접근 장치는 점점 늘어가는데 정보를 얻는 통로인 웹사이트가 그들을 소외시킨다면 정부의 이런 정책은 아무런 의미가 없을 것이다. 기사..

17일 사내에 발표할 웹표준과 웹접근성에 대한 슬라이드입니다. 웹표준과 웹접근성 (PDF 형식)

"파일을 원하는 갯수만큼 올릴 수 있는 폼으로 구성해주세요!" 웹을 업으로 하는 사람이라면 이 말 싫어하는 사람 참 많을게다. 몇 개의 파일 입력 상자를 고정해놓는다면 모를까? 입력 상자의 갯수를 동적으로 해달라는 요구는 그 처리의 귀찮음에 혀를 내두르지 않는 사람이 드물것이다. 귀찮고 오류가 일어날 소지가 많은 부분이다 보니, 관련 자바스크립트 라이브러리 라든지 Flash를 이용한 경우 라든지 심지어 ActiveX를 사용하는 경우(너무 많아서;;)까지 관련 라이브러리나 기술이 많이 생기게 되었다. 요즘은 오히려 훌륭한 공개 라이브러리가 많아서 - AJAX로 Progress Bar까지 구현해주는 라이브러리도 있다. - 불편함이 없다고 얘기해도 무방한 정도다. 하지만 HTML5는 자바스크립트라든지 외부 기..

벌써 군 제대 후 두 달 하고 이틀이라는 시간이 흘렀습니다. 2년 동안 상당히 제한적이었던 정보의 습득의 굴레를 벗고 나니, 영화 나비효과에서 주인공의 기억이 리셋될 때처럼 머리가 아프고 혼란스러운 날들을 보내고 있습니다. 제 상황이 이런 탓에 군 입대 전의 웹시장과 지금의 그것이 많이 비교하게 됩니다. 그런 의미에서 2년을 사이에 둔 웹의 나름대로 한 번 묘사하여 보고자 합니다. (제 관심사에 따른 주관적인 견해임을 미리 밝힙니다 ㅎㅎ) 2005년 봄, 군 입대 초읽기를 하고 있을 무렵 포털 사이트 - 네이버, 다음 등 - 는 네이버의 "지식인"의 독주와 그와 비슷한 서비스들의 도입이 이슈였던 것 같습니다. UCC(User Created Contents)라는 말은 없었지만 "지식인"은 이미 UCC였고,..

공공기관 홈페이지 2009년 까지 모두 표준화 IE 전용 JavaScript과 CSS, 구조화 되어 있지 않은 HTML... 요새 관련 기술도 많고 관심이 많은 이들도 많아져서 상당히 낙관적으로 생각한다. "잘 되겠지~" 라고... 무분별한 Ajax의 도용이 독이 될 것이 걱정이긴 하지만.. 시각장애인, 모바일 기기... 공공기관 사이트 수주를 하면 "시각장애인용 페이지가 따로 있어야 해요. 화면을 읽어주는 프로그램을 자동으로 설치해주고 어쩌고 저쩌고..." 시각장애인을 위한 접근성 확보를 위해 ActiveX를 쓰는 아이러니가 만연하다. 이건 "웹"이라는 공간에 대한 이해가 부족한게다. 표준화에 앞서 해결해야할 부분이다. 어플리케이션 수준의 ActiveX 이게 제일 문제다. OS를 직접 주무르는 수준인 ..

Flash도 좋고 Ajax도 좋고 ActiveX도 좋다. 하지만 "웹"이란 무엇보다도 "누구나" 차별없이 즐길 수 있는 공간이 아닐까? Linux User로서, Firefox User로서, ActiveX 설치를 꺼리는 User로서.. 혹은 이에는 해당하지 않지만 어떤 이유로든 "웹"을 통해 정보를 얻는 데 어렵던 적이 있던 사람이라면.. 웹사이트를 만드는 일을 하는 사람, 아니 그저 단순히 어떤 웹에 어떤 정보를 만드는 이라면 모두 이 사실을 기억해야 하지 않을까? "웹"을 통해 정보를 얻는 데 어려움을 겪었던 적 없는 사람??? 지금 내가 어려움을 겪고 있지 않다면 지금도 어려움을 겪고 있을.. 그래서 예전의 우리처럼 짜증내고 있을 사람들을 생각하자!