정보
요청한 주제가 아래에 표시됩니다. 그러나 이 주제는 이 라이브러리에 포함되지 않습니다.

Windows Phone 8용 웹 개발

2014-06-18

적용 대상: Windows Phone 8 및 Windows Phone Silverlight 8.1 | Windows Phone OS 7.1

 

Windows Phone용 Internet Explorer는 데스크톱용 Internet Explorer를 기반으로 하지만 웹 개발자가 고려해야 하는 몇 가지 차이가 있습니다. 이 항목에서는 Windows Phone OS 8.0(Internet Explorer 10 기준) 및 Windows Phone OS 7.1(Internet Explorer 9 기준)에 대한 이러한 몇 가지 차이점을 자세히 설명합니다. 모바일 웹 사이트 디자인에 대한 일반 정보를 보려면 휴대폰 브라우저용 웹 사이트 디자인을 참조하세요.

이 항목에는 다음 단원이 포함되어 있습니다.

 

Windows Phone OS 8.0 및 Windows Phone OS 7.1 에서는 Windows Phone용 Internet Explorer에 대해 서로 다른 수준의 지원을 제공합니다.

Windows Phone OS 8.0 의 지원되는 표준 및 기술

Windows Phone OS 8.0 용 Internet Explorer는 이 항목의 Windows Phone OS 8.0 용 Internet Explorer에서 지원되지 않는 기능 섹션에 나열된 항목을 제외하고 개발자용 Internet Explorer 10 가이드에 나열된 기술 및 표준을 지원합니다.

Windows Phone OS 8.0 Internet Explorer에서 지원되는 추가 기능

다음 기능은 Windows Phone OS 8.0 용 Internet Explorer에서는 지원되지만 데스크톱 버전의 Internet Explorer 10에서는 지원되지 않습니다.

  • HTML5 geolocation에 대한 GPS 지원. Windows Phone 에서는 장치의 위치 스택을 사용하고 가능한 경우 GPS를 사용합니다.

  • 이 항목의 뷰포트 설정 섹션에 나열된 뷰포트 META 태그 및 해당 설정에 대한 지원.

  • 텍스트 배율 조정에 대한 지원.

  • 이 항목에 나오는 사용자 지정 CSS를 사용하여 텍스트 크기 조정 섹션에 설명된 CSS 속성 –ms-text-size-adjust에 대한 지원.

  • <meta name="misapplication-tap-highlight" content="no"/>와 같은 링크 강조 표시 사용자 지정 및 사용 안 함 설정에 대한 지원.

Windows Phone OS 8.0 Internet Explorer에서 지원되지 않는 기능

다음 기능은 데스크톱 버전의 Internet Explorer 10에서는 지원되지만 Windows Phone OS 8.0 용 Internet Explorer에서는 지원되지 않습니다.

  • InPrivate 검색

  • CSS 터치 보기 – 특히 개요, 스크롤 및 가속 스크롤.

  • 제스처 이벤트에 관련된 회전 및 각도 이벤트.

  • -ms-hyphens 지원.

  • 인라인 HTML5 동영상.

  • VBScript 지원

  • ActiveX 지원

  • 스크립트를 사용하여 창을 대상으로 하는 기능 등, 창 교차 통신

  • 브라우저 도우미 개체, 도구 모음 및 기타 관련 항목을 통한 확장성

  • 바이너리 동작, HTC, HTML+TIME 및 VML 등, 이전 웹 기술 지원

Windows Phone OS 7.1 의 지원되는 표준 및 기술

Windows Phone OS 7.1 용 Internet Explorer는 이 항목의 Windows Phone OS 7.1 용 Internet Explorer에서 지원되지 않는 기능 섹션에 나열된 항목을 제외하고 개발자용 Internet Explorer 9 가이드에 나열된 기술 및 표준을 지원합니다.

Windows Phone OS 7.1 Internet Explorer에서 지원되는 추가 기능

다음 기능은 Windows Phone OS 7.1 용 Internet Explorer에서는 지원되지만 데스크톱 버전의 Internet Explorer 9에서는 지원되지 않습니다.

  • HTML5 geolocation에 대한 GPS 지원. Windows Phone 에서는 장치의 위치 스택을 사용하고 가능한 경우 GPS를 사용합니다.

  • 뷰포트 설정 섹션에 포함된 뷰포트 및 해당 속성에 대한 지원.

  • 이 항목 뒷부분에 나오는 사용자 지정 CSS를 사용하여 텍스트 크기 조정 단원에 설명된 CSS 속성 –ms-text-size-adjust에 대한 지원.

Windows Phone OS 7.1 Internet Explorer에서 지원되지 않는 기능

다음 기능은 데스크톱 버전의 Internet Explorer 9에서는 지원되지만 Windows Phone OS 7.1 용 Internet Explorer에서는 지원되지 않습니다.

  • InPrivate 검색

  • 추적 보호

  • 피싱 방지 지원

  • Internet Explorer 8 문서에 대한 이전 버전과의 호환성 Windows Phone OS 7.1 용 Internet Explorer는 이러한 문서를 Internet Explorer 9 모드로 렌더링합니다.

  • 스크립트를 사용하여 창을 대상으로 하는 기능 등, 창 교차 통신

  • 멀티스트림 HTML5 오디오

  • EOT, TTF/OTF 및 WOFF 등, 다운로드 가능 글꼴

  • CMYK 이미지 지원

  • VBScript 지원

  • ActiveX 지원

  • 브라우저 도우미 개체, 도구 모음 및 기타 관련 항목을 통한 확장성

  • 활성 문서 지원

  • 바이너리 동작, HTC, HTML+TIME 및 VML 등, 이전 웹 기술 지원

  • 모든 문서 모드에서 양방향 텍스트 언어에 대한 완벽한 지원

  • 서로게이트 쌍 지원

  • Jscript용 JIT 지원

  • 일부 <video> 태그 특성 및 이벤트 Windows Phone OS 7.1 용 Internet Explorer는 오디오 또는 동영상 파일의 사전 로드를 지원하지 않으며 오디오 또는 동영상 파일의 자동 재생도 지원하지 않습니다. 따라서 preloadautoplay 특성은 지원되지 않으며 canplaycanplaythrough 이벤트도 지원되지 않습니다.

  • 레이아웃 뷰포트를 기준으로 고정 위치에 요소 위치 지정.

뷰포트 레이아웃은 문서 콘텐츠가 배치되는 방식과 텍스트가 페이지에서 줄 바꿈되는 위치를 제어하는 직사각형 영역입니다. Windows Phone용 Internet Explorer는 다음 뷰포트 META 태그 및 값 쌍 설정을 지원합니다.

속성 이름

width

뷰포트의 너비를 설정합니다.

정수 또는 device-width가 될 수 있습니다.

값의 범위는 320 ~ 10,000입니다.

기본값은 320입니다.

Windows Phone 8 업데이트 3 단말기(8.0.10492 이상 버전이 있는 단말기)에서 device-width는 160 * 인치 단위로 나타낸 실제 화면 너비 값을 반환합니다. 실제 화면 너비를 확인할 수 없는 경우에는 device-width에서 화면 해상도에 비례하는 예상 값을 반환합니다.

height

뷰포트의 높이를 설정합니다.

정수 또는 device-height가 될 수 있습니다.

값의 범위는 480 ~ 10,000입니다.

user-scalable

사용자가 뷰포트 크기를 조정할 수 있는지, 즉 콘텐츠 내에서 확대/축소될 수 있는지 여부를 나타냅니다.

yes 또는 no

권장되는 기본값은 yes입니다.

참고참고:

일부 브라우저에서 사용할 수 있지만 minimum-scale, maximum-scaleinitial-scale 속성은 현재 Windows Phone용 Internet Explorer에서 지원되지 않습니다.

Windows Phone용 Internet Explorer는 개발자들이 –ms-text-size-adjust CSS 속성을 설정하여 웹 페이지 텍스트 크기를 제어할 수 있는 옵션을 제공합니다. 사용자가 페이지 요소를 두 번 탭하면 Windows Phone용 Internet Explorer에서는 두 번 탭한 요소가 화면의 보이는 영역 내에 들어가도록 뷰포트 크기가 조정됩니다. 해당 텍스트도 적절한 크기로 조정됩니다. 개발자들은 조정된 텍스트 크기를 제어하거나 해당 속성을 끄도록 선택할 수도 있습니다.

참고참고:

뷰포트 태그가 있으면 –ms-text-size-adjust 속성이 무시됩니다.

다음 예제는 HTML 페이지에 대한 텍스트 크기 조정 기능을 끕니다.

html { -ms-text-size-adjust:none }

다음 예제는 HTML 페이지의 본문에 대한 자동 텍스트 크기 조정 기능을 켭니다.

body { -ms-text-size-adjust:auto }

다음 예제는 HTML 페이지의 분할에 대해 텍스트 크기를 150%로 조정합니다.

div { -ms-text-size-adjust:150% }

CSS 고정 위치 지정을 사용하여 위치 지정된 요소는 Windows Phone OS 8.0 용 Internet Explorer와 Windows Phone OS 7.1 용 Internet Explorer에서 서로 다르게 작동합니다. Internet Explorer Windows Phone OS 8.0(및 데스크톱)에서 고정 요소는 브라우저 창의 클라이언트 보기를 기준으로 위치가 지정됩니다. 즉, 요소가 오른쪽 아래 모퉁이에서 보기에 고정되어 있으면 사용자가 페이지를 위, 아래, 왼쪽, 오른쪽으로 스크롤하더라도 항상 오른쪽 아래 모퉁이에서 보기에 고정되어 표시됩니다. Windows Phone OS 7.1 에서 고정 요소는 문서 자체를 기준으로 위치가 지정되며 사용자가 페이지를 스크롤할 경우 보기에 그대로 유지되지 않을 수 있습니다. 즉, 요소가 문서의 오른쪽 아래 모퉁이를 기준으로 고정된 경우 사용자는 웹 페이지의 오른쪽 아래 모퉁이로 이동할 때만 이 요소를 볼 수 있습니다.

참고참고:

사용자가 문서를 확대 또는 축소하면 고정 요소는 그에 따라 크기가 조정됩니다.

데스크톱 브라우저와는 달리 Windows Phone용 Internet Explorer에서는 사용자가 ActiveX 컨트롤 같은 타사 플러그 인을 다운로드하거나 설치할 수 없습니다. 따라서 웹 페이지에서 사용자에게 플러그 인을 다운로드할지 묻는 메시지를 표시하지 않습니다.

Windows Phone 8 단말기의 WebBrowser 컨트롤이 올바르게 초기화되도록 하려면 다음 예에서 보듯이 HTML 콘텐츠로 이동하기 전에 Browser_Loaded 이벤트 처리기가 IsScriptEnabled 속성을 true로 설정하는지 확인합니다.


        private void Browser_Loaded(object sender, RoutedEventArgs e)
        {
            Browser.IsScriptEnabled = true;
            Browser.Navigate(new Uri(MainUri, UriKind.Relative));
        }

표시: