본문 바로가기

Web

모바일 웹 사이트에서 바로가기 아이콘 만들기 아이폰과 안드로이드 폰은 웹 페이지의 바로가기를 장치 화면에 추가하는 기능을 제공해주고 있습니다. 그래서 앱과 같이 아이콘을 설정해놔서 사용자가 앱 실행하는 방법과 같이 아이콘을 클릭해서 모바일 사이트에 접근할 수 있도록 할 수 있습니다. 아이폰과 안드로이드 아이콘 등록 방법은 link태그를 이용하면 되는데, 설정하는 방법은 조금 다르니 아래를 참고하시기 바랍니다. 1. iOS 기본 아이폰이 제공하는 UI 처리 : 아이폰은 자동으로 모서리가 둥글게 되고, 아이콘 위쪽은 밝게, 아래는 어둡게 자동으로 광택 효과가 적용 1.1 기본 아이폰이 제공하는 UI 처리 사용시 1.2 기본 아이폰이 제공하는 UI 처리 사용하지 않을시 apple-touch-icon.png 가 기본 이름이지만 임의대로 할수도 있습니다. .. 더보기
오페라 모바일 에뮬레이터(Opera Mobile Classic Emulator) 오페라 모바일 에뮬레이터(Opera Mobile Classic Emulator) 모바일 기기별로 오페라 브라우저를 확인할 수 있다. 모바일 웹 서비스 개발시 매우 유용한 툴인것 같다. 스크립트로 작성된 메뉴 부분이 실제 모바일기기와 다르게 작동하는 사소한 버그가 있긴 하지만 괜찮은 툴인것 같습니다. 웹페이지나 홈페이지를 굳이 스마트폰이나 모바일기기로 보지 않고도 모바일에서 어떻게 보이는지 확인할수 있습니다. http://www.opera.com/ko/developer/mobile-emulator 에서 다운 받으면 됩니다. 버전은 아래와 같이 3개이며 각자 환경에 맞게 다운로드 하면 됩니다.Opera Mobile Classic Emulator 12.1 for Windows Opera Mobile Class.. 더보기
Zen-Coding의 신세계 젠코딩(Zen Coding)은 CSS Selector 방식으로 빠른 코딩과 HTML, XML, XSL 그리고 다른 구조의 코드 유형을 편집하기 쉽게 해 주기 위한 플러그인의 집합이다 이 프로젝트는 2009년에 Sergey Chikuyonok에 의해 만들어졌으며 Chikuyonok과 젠코딩 유저들에 의해 지속적으로 활발하게 개발되고 있다. 도구는 고 프로파일 텍스트 에디터의 숫자로 통합되어왔으며 몇몇의 플러그 인은 젠코딩 팀과 개별적으로 실행시키는 다른 사람들에 의해 개발된다. 젠코딩은 기본적으로 소프트웨어의 부분을 사용한다기 보다 엔진을 바로 사용한다는 점에서 다른 텍스트 에디터와는 구분된다. 젠코딩은 현재 MIT에 의해 오픈 소스로 공개되고 있다. zen-coding(Set of plugins for .. 더보기
메타태그를 이용한 IE 쿼크모드(호환성보기) 설정 IE(인터넷 익스플로러)의 경우 여러 가지 버전이 있습니다. IE7, IE8, IE9 그리고 최근엔 IE10이 나온 바로 그것입니다. 그런데 이들 IE간에 버전차이로 인해 같은 웹 문서라 하더라도 다르게 보여지는 경우가 있습니다. 그것은 이들 IE 버전에 따라서 마크업과 CSS를 다르게 랜더링을 하기 때문입니다. 이러한 문제를 해결하기 위해서 MS에서 제공하는 기능이 바로 "호환성 보기" 라는 기능입니다. 이 "호환성 보기" 라는 기능을 통해서 IE 버전이 다르더라도 같은 화면을 볼 수 있도록 합니다. 그리고 호환성 보기를 다른 말로 쿼크모드라고 합니다. 하지만 이러한 호환성 보기 기능을 모든 사용자들이 직접 사용하길 바라는 것은 무리겠지요? (호환성 보기 기능을 모르는 사용자도 많으니까요.) 홈페이지를.. 더보기
쿼크모드(Quirks mode)와 표준모드(Standard mode) 웹 브라우저는 두 가지 렌더링 모드를 지니고 있는데 쿼크모드(Quirks mode)와 표준모드(Standard mode)이다. 즉 브라우저는 선언된 doctype에 따라 렌더링할 모드를 선택하게 되는데 이 과정을 doctype sniffing 또는 doctype switching이라고 한다. 브라우저가 출력하고자 하는 문서가 최신이라고 판단하면 표준모드(standard mode)로 렌더링을 하는데 CSS2 스펙에 따라 CSS가 적용되었다는 것을 의미한다. 반면 브라우저가 예전문서라고 판단을 하면 쿼크 모드(quirks mode)로 렌더링을 하게 된다. 이 모드에서는 이전 세대의 브라우저에 맞는 비표준적 방법의 CSS를 적용한다. 즉 쿼크모드의 목적은 오래된 웹페이지들이 최신 버전의 브라우저에서 깨져 보이.. 더보기