윈도우 8 개발자 프리뷰 둘러보기 #3 인터넷 익스플로러(Internet Explorer 10)

윈도우 8은 윈도우 폰 7에서 보던 메트로 디자인을 채용하여 태블릿 PC에 알맞게 변했습니다. 물론 기존의 PC 사용자들을 위한 기능도 향상되었습니다. 부팅 속도가 단축되고, 클라우드(Windows Live)와 연계되었습니다. 아직 ‘개발자 프리뷰’ 버전이라 모든 게 완벽하진 않지만, 향후 마이크로소프트가 데스크톱용 윈도우를 어떻게 발전시킬 것인지 알 수 있어서 흥미롭습니다.

윈도우 8 개발자 프리뷰 둘러보기 #1 – 아크윈

태블릿 PC에 최적화된 윈도우 8.

현재 개발자 프리뷰 버전에서 제공되고 있는 인터넷 브라우저의 종류는 두 가지입니다.

▼ 기존의 데스크톱 PC 버전 및 태블릿 경험에 알맞은 2가지의 인터넷 익스플로러 10가 공존하고 있습니다.

 
데스크톱 및 모바일 버전 IE10 아이콘

이번 글에서는 주로 메트로 스타일의 태블릿 버전 IE10을 다루고 있습니다. 데스크톱 버전과 얼마나 다른지 한번 비교해 보세요.

 

인터넷 익스플로러 10: 데스크톱 PC 버전

▼ 데스크톱 PC 버전을 실행하면 기존의 인터넷 익스플로러 웹 브라우저와 동일한 모습을 보여 줍니다.

▼ 아래 스크린샷은 데스크톱 버전의 IE에서 ‘새 탭(New Tab)’ 페이지를 열어 놓은 모습입니다.

▼ Windows® Internet Explorer 10 Developer Preview의 버전은 10.0.8102.0 입니다. 업데이트 버전은 Pre-release (KB2587683)입니다.

▼ 계속해서 데스크톱 PC 버전의 모습입니다. 새 탭 페이지에 자주 방문한 페이지가 나타나는 모습을 볼 수 있습니다. 얼마나 자주 방문했는지 아이콘 아래쪽의 작은 바에서 보여주고 있습니다.

▼ 링크를 클릭하면 웹 사이트로 접속됩니다. 사용자 경험 관점에서 IE9의 그것과 크게 달라진 점이 없어서 데스크톱 버전에 대한 스크린샷은 이상으로 하겠습니다.

 

인터넷 익스플로러 10: 태블릿을 위한 메트로 스타일 “앱”

▼ 시작 화면에서 좌측 상단에 있는 인터넷 익스플로러 아이콘을 클릭합니다.

▼ 익숙한 인터넷 익스플로러 로고가 보이죠? 마치 앱과 같은 모습을 보여줍니다.

▼ 타일을 클릭해서 실행하면 IE10의 스플래시 화면이 나타납니다.

▼ 모바일 버전의 ‘새 탭(New Tab)’ 페이지는 아래와 같이 생겼습니다. 주소 표시줄을 클릭해도 이 페이지가 나타납니다.

▼ 새 탭 페이지도 메트로 인터페이스에 알맞게 생겼습니다. 파비콘에서 대표되는 색의 타일에 웹 사이트 이름만 나타나는 형태라 조금 심심한 느낌이 듭니다.

▼ 웹 페이지는 데스크톱 버전의 IE와 동일한 모습으로 렌더링 됩니다.

 

태블릿 버전이 데스크톱 버전과 다른 점?

보다 발전된 웹에서 사용자가 터치 중심 브라우징의 이점을 최대한 활용할 수 있도록 Windows 8의 메트로 스타일 브라우저는 최대한 HTML5만 사용하고 플러그 인이 없는 방식으로 개발되었습니다. 현재 이용되는 플러그 인 방식은 메트로 스타일 브라우징과 최신 HTML5 웹에 적합하지 않습니다.

플러그 인 없이 메트로 스타일 IE를 실행하면 배터리 수명이 늘어나고 사용자의 보안, 신뢰성 및 개인정보 보호 수준이 향상됩니다. 웹이 개발된 초창기에는 플러그 인이 중요했지만 그 이후 HTML5가 등장하면서 웹에 큰 발전이 있었습니다. 기존 플러그 인 기술과의 호환성을 제공한다면 메트로 스타일 UI의 브라우징 경험이 개선되기보다는 오히려 떨어질 것입니다.

메트로 스타일 브라우징과 플러그 인을 사용하지 않는 HTML5 – Windows 8 빌드

▼ 모바일 버전에서는 실버라이트, 어도비 플래시 등 확장 기능을 제공하지 않습니다. (사진을 클릭하면 크게 보입니다)

좌: 태블릿 모드 / 우: 데스크톱

▼ 플래시로 구성된 웹 사이트는 모바일 모드에서 제대로 보이지 않게 됩니다.

좌: 태블릿 모드 / 우: 데스크톱

▼ 유튜브 동영상도 플래시로 되어 있어서 모바일 버전에서는 보이지 않는군요.

좌: 태블릿 모드 / 우: 데스크톱

▼ 하지만 HTML5으로 동작하는 멀티미디어의 재생은 모바일 버전에서도 가능합니다.

▼ http://www.youtube.com/html5 페이지에서 HTML5 평가판을 사용하면 유튜브 동영상을 HTML5로 볼 수 있게 됩니다. 이렇게 하면 모바일 버전에서도 동영상이 제대로 나타납니다.(로그인이 필요할 수 있습니다)

 

태블릿을 위한 IE10 인터페이스

▼ 메트로 스타일의 IE10은 주소 표시줄이 화면 아래쪽에 위치하고 있습니다.

▼ 탭 브라우징과 관련된 메뉴는 위쪽에 있습니다.

▼ 태블릿 PC에 적당한 큼직큼직한 아이콘으로 탭 브라우징을 할 수 있습니다.

▼ 주소표시줄 메뉴 오른쪽에 있는 송곳(?) 모양의 메뉴를 누르면 현재 보고 있는 페이지를 시작 화면에 고정(Pin to start)할 수 있습니다.

▼ 시작 화면에서 마치 별도의 앱처럼 웹 사이트를 구동할 수 있습니다.

▼ 새 탭 페이지에도 방금 고정했던 웹 사이트가 나타납니다. 화면 우측에 '고정된(Pinned)’에 위치하고 있습니다.

▼ 종이처럼 생긴 아이콘을 누르면 2가지 메뉴가 나옵니다.

▼ 먼저 페이지에서 찾기(Find on page)를 해 볼까요?

▼ Ctrl+F를 눌렀을 때와 마찬가지로 ‘페이지 내 검색’ 기능을 사용할 수 있습니다.

▼ 아래쪽에 나오는 검색 상자에 찾고 싶은 단어를 입력하면, 페이지 내에서 일치하는 곳을 노란색으로 강조합니다.

▼ 데스크톱 보기(Use desktop view)를 누르면 현재 보고 있는 웹 페이지를 데스크톱 버전으로 볼 수 있습니다.

▼ 갑자기 데스크톱 버전으로 웹 사이트가 나타나니 조금 당황스럽네요…

▼ 모바일 버전에서는 링크에 마우스 오른쪽 단추를 누르면 아래와 같은 단축 메뉴가 나타납니다. 본문에서는 마우스 오른쪽 단추를 누르면 메뉴만 표시되고, 데스크톱과 같은 메뉴(즐겨찾기 추가, 소스 보기와 같은…)가 나타나진 않습니다.

 

메트로 스타일 인터넷 익스플로러 10: 검색

▼ 윈도우 키 + F를 눌러 Internet Explorer를 선택한 후, 검색어를 입력하면 아래와 같이 웹 검색에 바로 접근할 수 있습니다.

▼ 위 스크린샷을 부분 확대한 모습입니다. Internet Explorer가 검색 대상으로 선택된 것을 확인할 수 있습니다.

▼ IE10에서 기본으로 지정된 검색 엔진의 결과가 나타납니다.

▼ 주소 표시줄에 문자를 입력하면 자동 완성된 웹 사이트 주소 뿐 아니라, 관련 사이트들을 나열해 줍니다. 단어를 입력할 때 마다 실시간으로 결과가 달라지는 것을 확인할 수 있습니다.

▼ 주소 표시줄에 arch를 입력하면 archvista.net, arch7.net, archwin.net 등 관련된 웹 사이트가 함께 나오는 것을 볼 수 있습니다.

 

[팁] 모바일 버전이 아닌 데스크톱 버전 IE에서 링크를 열기

기본적으로 윈도우 개발자 프리뷰에서는 HTML 파일이나 각종 웹 페이지가 윈도우에서 열리는 경우, 모바일 버전을 우선시하도록 되어 있습니다. 이 설정을 데스크톱을 우선시 하도록 변경하는 방법을 알려드립니다.

▼ 마우스를 화면 좌측 하단으로 가져가서 시스템 메뉴에 접근합니다. 그리고 Settings를 누릅니다.

▼ Default view for links 메뉴를 선택합니다.

▼ 링크를 데스크톱에서 열 것인지(Do you want links to open in desktop?) 물어봅니다. [Yes]를 누르면 OK입니다.

윈도우 8 개발자 프리뷰의 인터넷 익스플로러에 대한 추가적인 정보를 얻으려면 아래 링크를 방문해 보세요.

• 메트로 스타일 브라우징과 플러그 인을 사용하지 않는 HTML5 – Windows 8 빌드