230 likes | 447 Views
제 2 회 대학생 IT 동아리 Festival. 제목을 뭘로 지어야 쓰겄는가 ?. KAIST SPARCS 박용수 <pcpenpal@sparcs.kaist.ac.kr>. 인터넷이 대세인 요즘 , 우리의 컴퓨터 환경 ?. Microsoft Windows Internet Explorer. 대안은 있다 !. 여러 가지 웹 브라우저들 Internet Explorer Mozilla Firefox Opera Safari W3M Lynx 질문 저는 저 외의 다른 이름의 브라우저를 본 적이 있는데요 .
E N D
제2회 대학생 IT 동아리 Festival 제목을 뭘로 지어야 쓰겄는가? KAIST SPARCS 박용수 <pcpenpal@sparcs.kaist.ac.kr>
인터넷이 대세인 요즘, 우리의 컴퓨터 환경? • Microsoft Windows • Internet Explorer
대안은 있다! • 여러 가지 웹 브라우저들 • Internet Explorer • Mozilla Firefox • Opera • Safari • W3M • Lynx • 질문 • 저는 저 외의 다른 이름의 브라우저를 본 적이 있는데요. • 위에 적혀있는 게 세 개 뿐인데, 너무 적지 않습니까?
렌더링 엔진(Rendering Engine) • 브라우저의 핵심 • HTML, CSS 등을 받아서 모양을 만들고 그림 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN“ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko"> <head> <meta name="keywords" content="SPARCS,KAIST,컴퓨터,공학,전산학,연구,학술,동아리,스팍스,카이스트,한국과학기술원"/> <link rel="stylesheet" type="text/css" href="/style.css"/> <meta http-equiv="Content-Type" content="text/html; charset=EUC-KR"/> <title>처음 - SPARCS</title> </head> <body id="sparcsindex"> ...
Mozilla Firefox • 요즘 사람들에게 점점 많이 알려지고 있는 화제의 프로그램 • 오픈 소스로 개발되고 있는 웹 브라우저 • 10대 천재 소년이 개발자로 참여하고 있다는 그 브라우저 • 미국에서 신문에 광고가 되었다는 그 브라우저 • IE의 점유율을 계속 깎고 있다는 그 브라우저 • IE 7.0을 조기 출시하도록 압박한 그 브라우저
Firefox의 좋은 점/특징 • 탭 브라우징 • 팝업 차단 • 확장 기능 • 테마 • 빠르고 안전 • W3C 표준 준수 • 빠른 업데이트 및 버그 수정 • 빠른 기능강화 All-in-One Gesture FastDic Sage Adblock QuickNote Gmail Notifier Web Developer
애로사항 • 모양이 이상해진다 • 링크나 기타 기능이 제대로 작동하지 않는다 • 전자결재를 할 수 없다 • 브라우저를 이유로 접속 거부를 당한다
무엇이 문제인가? • Internet Explorer에서만 쓸 수 있는 비표준HTML 태그, 자바스크립트 및 ActiveX의 남용 • 웹 표준을 정확히 지키면 어디서든 OK • 비표준 사용의 문제는 대한민국이 특히 심각함 • 생각해 볼 문제 • 웹 표준이라는 것이 무엇입니까? • 구체적으로 무엇이 어떻게 문제인가요?
Firefox의 의의 • 사람들에게 웹 표준 및 웹이 지향하는 바를 알림 • 비표준 기술이 갖는 문제점을 알림 • IE의 독점 체제를 무너뜨림 • Firefox에서 확장되는 여러 좋은 프로그램 및 개발 환경의 개발 분위기를 조성
웹 표준 자세히 알아보기 (1) • W3C – World Wide Web Consortium • 웹 표준 및 지침을 만드는 국제적 컨소시엄 • 사명 • 웹의 모든 잠재력을 이끌어 내기 위하여...(Leading the Web to its Full Potential...) • http://www.w3.org/ • 여기서 만든 작품들 • CSS, HTML, XHTML, XML, XSL 등 • 각종 유명한 사람/단체 참여 • 마이크로소프트 포함!
문제 해결 (1) • 웹의 표준을 지키는 홈페이지를 만들면 된다! • IE는 표준을 지킨다 • IE가 다른 브라우저들보다 표준을 덜 지원하므로 IE를 상한선으로 생각하고 만든다 • IE가 6.0 이후로 아직까지 발전이 없음 • ActiveX를 최대한 쓰지 않는다 • 다른 방법: 다른 브라우저를 지원할 수 있게 여러 종류의 프로그램을 만든다 • 참고: 구글
웹 표준 자세히 알아보기 (2) • XHTML과 CSS • XHTML • HTML을 XML에 맞게 재구성 • 내용과 형식의 분리를 지향 • 언제 어디서 무엇으로 보아도 잘 볼 수 있는 환경이 목표 • CSS • 내용을 꾸밀 형식을 지정 • 필요한 공부(?) • HTML 4.01 • XHTML 1.0/1.1 • CSS level 1
문제 해결 (2) • 가지고 있는 홈페이지가 표준을 지키는지 알아보자 • W3C에서 Validation Service를 제공함 • XHTML, CSS 등을 검사할 수 있음 • Firefox의 확장 기능 중 Validation을 해 주는 프로그램이 있음 • 주로 틀리는 것들 • DOCTYPE 선언이 있는가? • Entity를 제대로 사용하였는가? • 디자인을 위해 <table> 태그를 남용하지 않았는가? • <marquee>등의 비표준 태그를 사용하지 않았는가? < > & ‘ “
웹 표준 자세히 알아보기 (3) • 자바스크립트 • ECMAScript 표준이 있다 • DOM(Document Object Model) • 자바스크립트 등에서 웹 페이지의 구성 요소들을 참고하기 위한 객체 모델 • W3C의 표준이 있음 • 필요한 공부(?) • ECMAScript • DOM level 1
문제 해결 (3) • 가지고 있는 홈페이지가 자바스크립트나 DOM 사용에 문제가 없는지 알아보자 • 대부분의 브라우저는 자바스크립트의 문제는 에러로 알려 줌 • Firefox의 DOM Inspector를 사용하면 도움이 된다 • 주로 틀리는 것들 • document.all 대신 document.getElementByID • 스크립트에 주석 처리
Plugin 알아보기 • 웹에서 프로그램을 실행시켜 더 많은 일을 할 수 있게 해주는 것 • Firefox의 확장 기능과는 다르다 • 딱히 표준이라는 것이 없음 • 별 문제가 되지 않는 것 • 자바 애플릿, 플래시 • 문제가 심각한 Plugin • ActiveX(IE Plugin) • 문제가 있는 듯한 Plugin • Firefox Plugin
문제 해결 (4) • Plugin을 최대한 쓰지 말자 • 구글은 Plugin 없이도 다양한 기능을 웹만으로 구현하고 있다 • 모든 브라우저의 Plugin을 다 만드는 것은 힘든 일 • 보안 등의 문제로 Plugin을 쉽게 설치하지 못하게 하는 것이 대세 • 대한민국 큰일났다! • 전자결재 등에 사용되는 공인인증서 시스템 • ActiveX 이외에 구현된 것이 없음 • 대한민국전자정부 홈페이지는 ActiveX를 사용 • 국가 차원에서 해결해야 할 일
웹 표준 자세히 알아보기 (4) • WAI (Web Accessibility Initiative) • W3C의 웹 접근성을 위한 노력 • 단순히 기술적으로 표준을 준수하는 것 그 이상을 위하여 • 누구나 쉽게 접근할 수 있는 웹을 만들기 위하여 • 남녀노소 장애인 모두 • 지침 제공 • Web Content Accessibility Guidelines 1.0 (WCAG 1.0) • Authoring Tool Accessibility Guidelines 1.0 (ATAG 1.0) • User Agent Accessibility Guidelines 1.0 (UAAG 1.0) • XML Accessibility Guidelines (XAG)
문제 해결 (5) • WAI 지침에 맞는 홈페이지를 만들자 • 잘 만들어진 홈페이지들을 참고하자 • 웹 표준화 관련 커뮤니티들의 도움을 받자 • 한글 Mozilla 포럼 웹 표준화 프로젝트 • Cross Browsing 가이드 • KLDP에서도 활발한 논의중 • 이런 사실을 다른 사람들에게 알리자!
보너스(?) • Firefox를 사용해봅시다! • 써보고 마음에 드셨다면 홈페이지에 다음과 같은 배너를 달아봅시다! • 홈페이지를 표준에 맞도록 고치고 다음의 배너를 달아봅시다! • 마소 2월호의 Firefox 관련 기사들을 읽어봅시다!
참조 (1) • W3C 관련 • http://www.w3.org/ • http://www.w3c.or.kr/ • Mozilla Firefox 관련 • http://www.mozilla.org/ • http://www.mozilla.or.kr/ • Cross Browsing 가이드 • http://www.mozilla.or.kr/docs/web-developer/standard/ • 커뮤니티 • http://kldp.org/ • http://forums.mozilla.or.kr/viewforum.php?f=9
참조 (2) • 한국전산원 http://e-standard.nca.or.kr/ • 정보통신접근성향상표준화포럼 http://www.iabf.or.kr/ • tem9p – Cross Browsing에 적합한 자바스크립트 수집 • http://tem9p.kldp.net/ • 구글의 노력 • Google Suggesthttp://www.google.com/webhp?complete=1&hl=en • Gmailhttp://www.gmail.com/ • CSS Tableless Web Sites • http://www.meryl.net/css/about.php