N-Screen과 HTML5, 웹표준 팁&테크
아래 내용은 <2011 인터넷 이용환경개선 오픈 세미나> 中 N-Screen과 HTML5, 웹표준 팁&테크 관련 강연 내용을 정리 요약한 것이다. 일시+장소: 2011년 06월 02일 목요일, KISA 아카데미 세미나실
웹표준 국내 현황 (김주영 팀장, 한국인터넷진흥원)
- 국내 IE 점유율 92%(국외 45%대) 유지, 비표준 액티브X 과다 사용
- 국내외 웹브라우저 시장 점유율(’11. 4월 기준)
– 국내 IE 92.96%, 크롬 3.64%, 파이어폭스 2.38% 순
– 전세계 IE 44.52%, 파이어폭스 29.67%, 크롬 18.29% 순 - 웹 브라우저 시장 점유율 변화 그래프 via 위키피디아
N-Screen 종결자, HTML5 (조만영 대표, 미래웹기술연구소)
View more presentations from 미래웹기술연구소 (W3LABs)
- 과거에도 N-Screen 환경은 존재했다.
- 현재와의 차이점은 Network의 유무
- N-Screen은 Connected Lifestyle에서 비롯
회사에 출근해서 컴퓨터를 켠 후 가장 먼저 하는 일은 무엇일까?
–> 인터넷이다. =Connected Life를 의미
- 멀티 디바이스의 시대 사람들이 원하는 것
–> Seamless 언제 어디서나, 어느 기기에서도 끊김없는 이용 환경 - 이것이 N-Screen 대응이 대두된 본질
- 사용자 경험에서부터 출발해야 한다.
- N-Screen의 종결자들 –> 브라우저 성능이 향상됐다. 웹표준으로 만들면 된다.
– CSS
– HTML5
– Javascript
– SVG(Scalable Vector Graphics)
- N-Screen 사용자 환경
– 이동중 애플 아이폰(iOS) > 회사 PC(Window7) > 집 타블렛PC(Android)
– 서비스 제공자의 입장 =X 사용자의 입장
– 플랫폼에서의 단절, 소프트웨어의 단절 –> Cross + Platform / Device 환경 구축 필요 –> 웹표준
- Web UI technology 참고 사이트
– 유튜브 www.youtube.com/xl
– 쇼핑몰 www.teegallery.com/
– jQTouch jqtouch.com/
– Sencha Touch www.sencha.com/products/touch/
- N-Screen 시대적 마인드가 필요하다
– N-Screen 시대는 인터넷의 가전으로의 진입을 의미
– 어느 하나의 기술이 모든 것을 장악하지 못한다.
– 가장 중립적이고 범용적인 기술이 각광 –> 웹
모바일 웹표준과 콘텐츠 제작사례 (송태민 과장, SK커뮤니케이션즈)
- 모바일?
= WAP을 의미했다.
– HTML5는 인력비용이 많이 든다. 나중에 하자고 결론
- 모바일 그리고… 앱
– 네이티브앱, 웹앱, 하이브리드앱으로 구분
– 무선NATE = WAP Mobile 년 1조 매출.
– 돈 버는 모바일 시장은 앱뿐? –> SK컴즈는 WAP의 UI를 유지하면서 수익을 거둘 수 있는 가온(중간)을 지향.
– 예) us.illyssimo.com
- 모바일 UI
– 변천사: WAP(2008) –> WAP UI 그대로 –> 정적 UI –> 현재 UI
– WAP mobile Design: 메인페이지 용량 30Kbyte 이하(아이콘 1개당 5Kbyte), 컬러수 256 이하, png 8bite 저장, 3개 템플릿 운영
- 모바일 웹표준 Tip&Tech
– 모바일 사이트 확인 방법: Firefox 모바일 다운로드 페이지에서 > PC용 Firefox 모바일 버전 다운로드(Fennec)
– 파이어폭스 브라우저에서 확인: 파이어폭스 다운로드&설치 > User Agent Switcher 애드온즈 부가기능 설치
> 도구 > Default User Agent > iPhone 3.0 선택
– 파이어폭스의 iPhone 3.0 모드에서 동영상 검색 후 클릭하면 MP4로 다운로드 가능
– 웹표준 따르는 모바일웹 앱, 이렇게 만들자-블로터닷넷 >>
- www.standard.pe.kr : 송태민 과장의 웹표준 카페
- 모바일 웹 모범사례 via W3C