다음을 통해 공유


Windows 8의 고정된 사이트를 위한 고품질 시각적 요소

Windows 8의 고정된 사이트에서는 사이트 개발자가 Windows 시작 화면에서 사이트의 고정된 사이트 타일에 대한 사이트 아이콘(즐겨찾기 아이콘)을 제공할 수 있는 방법에 대해 설명하고 있습니다. 보다 높은 해상도의 시각적 요소를 제공해 주기를 원하는 대부분의 공유 피드백은 사용자의 고정된 사이트 타일에서 사이트 브랜드 효과를 향상시키기 위한 것입니다. Windows 8 Release Preview에서는 이러한 것이 가능합니다. 우리는 PNG 타일 이미지를 제공하고 타일의 배경색을 지정할 수 있는 기능을 추가했습니다.

다음은 사이트의 즐겨찾기 아이콘 및 자동으로 결정된 색상을 사용하는 고정된 사이트 타일(왼쪽)과 사용자 지정 타일 색상을 사용하는 고해상도 PNG(오른쪽)의 예를 보여 줍니다.

Fresh Tweets 데모의 기본 타일@BenThePCGuy 다음의 Fresh Tweets 데모에 대한 타일

마크업

Meta 태그는 타일의 이미지 및 배경색을 지정합니다. 예를 들면 다음과 같습니다.

<meta name="msapplication-TileImage" content="images/benthepcguy-144.png"/>

<meta name="msapplication-TileColor" content="#d83434"/>

타일 이미지는 정사각형(144px X 144px) PNG여야 합니다. 최상의 결과를 얻으려면 타일의 색상과 일치하는 배경 대신 투명 배경을 사용하는 것이 좋습니다. 타일 색상은 CSS의 #rrggbb 표기법, CSS 색상 이름 또는 CSS rgb() 함수를 사용하여 16진수 RGB 색상으로 지정할 수 있습니다.

업데이트된 Fresh Tweets 데모에서 작동하는 이 동작을 참조하십시오.

참고: IE10에서는 사이트에서 추가 대역폭 비용이 발생하지 않도록 사용자가 사이트를 시작 화면에 고정한 경우에만 타일 이미지를 다운로드합니다.

결론

Internet Explorer 10을 사용하여 웹 개발자는 고정된 사이트 타일에 대한 뛰어난 품질의 사이트 중심 시각적 요소를 만들 수 있습니다. 이를 통해 Windows 8 시작 화면에 사이트의 브랜드가 더욱 부각되고 나머지 앱 및 콘텐츠 타일과 보다 시각적으로 통합되어 보이도록 할 수 있습니다. 개발자는 Windows 8에서 다양한 해상도로 실행되는 장치에 필요한 대로 크기를 조정하는 고품질 아이콘을 하나만 제공하면 됩니다.

또한 사이트에서는 알림을 공유하고 사이트를 신속하게 탐색할 수 있는 점프 목록을 제공할 수 있습니다. 작업 방법은 Windows 8의 고정된 사이트를 참조하십시오.

이러한 간단한 기능을 웹 사이트에 추가하여 Windows 8에서 그 효과를 극대화해 보시기 바랍니다.

- Internet Explorer 프로그램 관리자, Rahul Lalmalani