개발자용 Safari

앞서 가는 성능. 뛰어난 개발자 도구.
그리고 사용자를 웹 사이트에 머물게 만드는 강력한 새로운 방식.

CSS3

CSS 영역 새로운 사항

Safari는 웹 페이지에 대해 잡지처럼 복잡한 레이아웃을 지원합니다. CSS 영역은 복잡한 레이아웃 내의 콘텐츠가 서로 다른 영역에서 흐르도록 하면서도 연관성이 유지되도록 해 줍니다.

CSS 따옴표 새로운 사항

CSS 따옴표는 이제 언어를 감지하여 웹 페이지가 언어 문자 세트에 대해 올바른 따옴표를 표시하도록 해 줍니다.

CSS 필터

CSS 필터는 흐리게 및 그라데이션과 같은 고급 필터 및 픽셀 효과를 간단하게 생성할 수 있도록 해 줍니다. CSS 필터로 밝기에 변화를 주거나 색조를 조정하거나 색상을 반전시키거나 요소를 세피아나 흑백으로 변환할 수 있습니다. 개발자는 빠르고 부드러운 렌더링을 위해 하드웨어 가속화를 활용하면서 필터를 통합하고 이들 사이의 변화를 애니메이션화할 수 있습니다.

CSS 애니메이션

웹에 새로운 수준의 상호 운용성을 제공하는 개방형 표준인 CSS 애니메이션을 통해 웹 디자이너는 웹 요소에 대해 크기 조정, 회전, 페이드 및 기울이기를 수행하여 최첨단 웹 사이트를 만들 수 있습니다. Safari는 CSS 애니메이션을 지원한 최초의 웹 브라우저입니다.

CSS 효과

Safari가 개척한 CSS 효과는 개발자들이 코드 몇 줄만으로 눈길을 끄는 그래디언트, 정밀한 마스크, 굉장히 아름다운 반사 효과로 이미지와 사진을 더 멋지게 만들어 웹 사이트를 더욱 세련되게 개발할 수 있도록 합니다.

CSS3 웹 서체

CSS3 웹 서체를 통해 웹 디자이너는 '웹에 안전한 서체'에 제한받지 않고 원하는 서체를 사용하여 멋진 웹 사이트를 만들 수 있습니다. Safari는 사용자 설정 서체가 사용된 웹 사이트를 자동으로 인식한 최초의 웹 브라우저로, 필요한 경우 사용자 서체를 다운로드합니다.

CSS3 자동 하이픈 삽입

Safari는 CSS3 자동 하이픈 삽입을 지원해 개발자들에게 더 읽기 편한 웹 사이트와 텍스트 레이아웃을 제공하게 합니다.

CSS3 세로 텍스트

개발자들은 웹 페이지에서 세로 텍스트 레이아웃을 사용해 중국어나 일본어처럼 세로쓰기 텍스트를 사용하는 언어에 맞춘 웹 사이트를 만들 수 있습니다.

CSS3 텍스트 강조

텍스트 강조 속성이 적용되어, 동아시아 텍스트에서 일반적으로 사용되는 강조 기호를 웹 페이지에 표시할 수 있습니다.

CSS 캔버스

CSS 캔버스를 통해 웹 디자이너는 CSS를 사용하여 이미지를 배치할 수 있는 모든 곳에 캔버스 요소를 배치할 수 있습니다. Safari는 CSS Canvas를 지원한 최초의 웹 브라우저입니다.

HTML5

HTML5 미디어 지원

이제 웹 사이트는 다양한 대화형 미디어를 이미지를 전달하는 것만큼 쉽게 전달할 수 있습니다. HTML5 오디오와 비디오 태그를 최초로 지원한 브라우저인 Safari는 개발자들이 별도의 플러그인 없이도 미디어가 풍부한 웹 사이트를 만들게 합니다. 또한 미디어 태그는 풍부한 스크립팅 API를 제공해, 개발자들이 강력하고 새로운 컨트롤뿐 아니라 페이지의 스타일을 맞추는 컨트롤도 가능하게 합니다.

HTML5 동영상을 위한 풀 스크린

이제 HTML5 <video> 태그를 통해 삽입된 비디오를 전체 화면으로 볼 수 있습니다. 풀 스크린 지원으로, 표준 기반 동영상을 최고의 경험으로 감상할 수 있습니다.

HTML5 비디오의 청각 장애인용 자막

Safari는 HTML5 비디오의 청각 장애인용 자막을 지원합니다. 웹 페이지의 HTML5 동영상에 청각장애인용 자막이 포함되어 있으면, 동영상 컨트롤의 CC버튼을 클릭해 자막을 볼 수 있습니다.

HTML5 위치정보

Safari는 HTML5 위치정보 기능을 지원하므로, 당신의 위치를 특정 웹 사이트와 공유하도록 선택해 지도나 근처 판매점과 같은 관련 정보를 제공받을 수 있습니다.

HTML5 섹션 요소

Article, aside, footer, header, hgroup, nav, 그리고 섹션 구성요소를 지원하므로, 개발자들이 시맨틱 마크업을 사용해 우수한 웹 디자인을 만들 수 있습니다.

HTML5 AJAX 기록

HTML5 AJAX 히스토리는 개발자들이 Safari의 이전 페이지 보기/다음 페이지 보기 내비게이션 버튼 동작에 따라 다이내믹하게 업데이트되면서도 매끄럽게 작동하는 인터랙티브 AJAX 응용 프로그램을 개발하게 합니다.

HTML5 샌드 박스 속성

iframe 요소에 대한 샌드 박스 속성을 지원하는 Safari는 iframe 내부에서 호스팅되는 콘텐츠 동작을 제한할 수 있습니다. 따라서 원하지 않거나 바람직하지 않은 콘텐츠를 전달할 수도 있는 스크립트 실행 또는 플러그인 로딩을 방지하여 iframe을 더 안전하게 만듭니다.

HTML5 드래그 가능 속성

Safari는 개발자들이 사진이나 이미지 같은 항목에 드래그 앤 드롭 사용자 인터페이스를 적용한 웹 사이트를 더 쉽게 만들게 합니다.

HTML5 서식 유효성 확인

Safari는 온라인 서식의 정보를 확인해 해당 웹 사이트의 서버로 정보를 전송하기 전에 서식이 정확한지 확인합니다. 입력 필드에 잘못된 정보가 입력되어 있으면 Safari는 해당 오류를 바로 알려 줍니다.

HTML5 Ruby

Safari는 웹 페이지의 메인 텍스트와 주석을 함께 표시할 수 있으므로, 한국어, 중국어, 일본어를 사용하는 웹 페이지에서 발음을 주석으로 표시할 수 있습니다.

HTML 4.01 지원

Safari는 웹 문서의 구조와 레이아웃을 정의하는 웹 사이트 구축 언어인 HTML 4.01을 지원합니다.

HTML5 오프라인 지원

웹 개발자들은 컴퓨터가 인터넷에 연결되어 있지 않을 때에도 사용할 수 있는 응용 프로그램을 만들 수 있습니다. HTML5 오프라인이 지원되므로, 당신의 컴퓨터에 저장된 웹 응용 프로그램을 언제든 즉시 사용할 수 있습니다. 이런 응용 프로그램과 마찬가지로, 웹 개발자들은 해당 응용 프로그램의 데이터를 당신의 컴퓨터에 저장하도록 선택할 수 있으므로, 당신은 필요한 정보를 언제든 확인할 수 있습니다. 응용 프로그램 및 데이터는 일반적인 SQL같은 데이터베이스에 응용 프로그램 캐시 또는 익숙한 쿠키 포맷으로 저장할 수 있습니다.

HTML5 Canvas

웹 디자이너는 Apple에서 원래 Dashboard용으로 고안한 HTML5 캔버스 기술을 통해 JavaScript 프로그램으로 스타일의 동적 규정이 가능한 HTML의 영역을 지정할 수 있습니다. Safari는 HTML Canvas를 지원한 최초의 웹 브라우저이며, 그 표준은 이제 인기 있는 대부분의 브라우저에서 지원되고 있습니다.

HTML5 웹 알림

웹 사이트는 뉴스 속보, 새로운 메시지 및 기타 알림을 통해 사용자를 최신 상태로 유지할 수 있습니다. 웹 사이트 알림이 다른 알림과 함께 화면의 오른쪽 상단 모서리 및 Mountain Lion의 새로운 Notification Center에 나타납니다. Safari에서 확장 프로그램을 활성화하여 알림을 보낼 수도 있습니다.

그래픽, 서체 및 텍스트

단락의 첫 줄이나 마지막 줄 분리 방지 새로운 사항

단락의 첫 줄이나 마지막 줄 분리 방지를 통해 페이지 나누기를 지정하고 웹 페이지 텍스트의 어색한 페이지 매김을 방지할 수 있습니다.

커닝 및 합자 새로운 사항

웹 페이지의 텍스트가 자동으로 Safari의 커닝 및 합자 지원을 활용합니다.

옆 방향 텍스트 새로운 사항

옆 방향 텍스트를 지원하는 Safari는 내부에 수평 텍스트가 있는 수직 텍스트 레이아웃을 지원합니다. 이는 동아시아 언어의 웹 페이지에 유용합니다.

하드웨어 가속화

하드웨어 가속화는 Safari가 그래픽 처리 유닛을 활용해 컴퓨팅 성능을 집중적으로 사용하는 그래픽을 표시해주기 때문에, HTML5 및 CSS3와 같은 표준이 브라우저에서 풍부한 인터랙티브 미디어를 매끄럽게 전달할 수 있습니다. Safari는 또한 플러그인 콘텐츠도 가속화합니다.

HTML5 캔버스를 위한 그래픽 가속화

Safari에서는 웹 페이지의 HTML5 캔버스 요소가 하드웨어 가속화를 활용하므로, 브라우저에서 기본으로 렌더링되는 대화식 그래픽이 더욱 빠른 성능을 발휘할 수 있습니다.

앤티 앨리어싱 서체

Safari의 앤티 앨리어싱 알고리즘 덕분에 선명하고 매력적인 서체를 향유할 수 있습니다. 이 알고리즘은 각 서체의 미묘함을 살리면서 각각의 글자를 선명하게 보여주므로 좋아하는 사이트를 기분 좋게 읽을 수 있습니다.

전후 관계에 따른 문자 변화

여러 서체의 경우, 문자의 형태와 간격이 단어 내의 위치에 따라 바뀔 수도 있습니다. 예를 들어, 아랍어와 같은 언어에서 단어 중간에 사용된 문자가 단어 끝에 사용된 동일한 문자와 형태가 다를 수도 있습니다. Safari는 다른 서체와 언어를 표시할 때 전후 관계에 따른 문자 변화의 상당 부분을 인식합니다.

색상 프로파일 지원

웹 이미지의 색상을 보정하는 유일한 브라우저인 Safari는 선명하고 정확한 색상을 전달합니다. Safari는 처음부터 ICC(International Color Consortium) 프로파일을 지원해왔으므로, 브라우저에서 보는 사진과 이미지가 최대한 원본에 가깝게 표현됩니다.

WOFF

WOFF(Web Open Font Format)를 지원하므로, 웹 디자이너들과 개발자들이 웹 사이트에 더욱 다양한 범위의 타이포그래피 옵션을 적용할 수 있습니다.

다국어 웹 콘텐츠

Safari는 다양한 문자, 숫자 체계, 필기 방향, 통화, 도량형, 날짜와 시간 형식, 시간대를 포함한 세계 전 지역의 웹 콘텐츠를 다룰 수 있게 디자인되었습니다.

IDN 지원

영어가 아닌 웹 주소의 사이트도 접속할 수 있습니다. Safari는 IDN(Internationalized Domain Name)을 지원하므로, 개발자는 영어 외의 글자 및 문자가 포함된 URL을 사용할 수 있습니다.

유니코드 지원

Safari는 국제적으로 통용되는 인코딩 표준인 유니코드(Unicode)를 지원하므로 아랍어, 영어, 일본어를 비롯해 어떤 언어로 구성된 웹 콘텐츠라도 볼 수 있습니다.

오른쪽에서 왼쪽으로 쓰는 텍스트

Safari는 다방향 텍스트 렌더링을 지원하므로, 문자를 오른쪽에서 왼쪽으로 쓰는 언어로 된 웹 사이트도 보여줄 수 있습니다.

손쉬운 사용

비디오 자막 새로운 사항

WebKit는 이제 Mountain Lion 및 Lion에서 대역 외 자막을 지원합니다. 이제 대역 내 자막이 Mountain Lion에서 지원됩니다.

이미지 세트용 고 DPI 새로운 사항

이미지 세트용 고 DPI 기능이 지원되므로 픽셀 밀도가 높은 디스플레이에 언제 고해상도 이미지를 사용해야 하는지를 손쉽게 지정할 수 있습니다.

HTTP의 엄격한 전송 보안 새로운 사항

웹 사이트는 이제 https만 사용하여 연결해야 하는지를 지정할 수 있습니다.

페이지 표시 이벤트 새로운 사항

Safari는 이제 페이지 표시 API를 지원합니다.

웹 음성 API

웹 음성 API를 지원하는 Safari는 텍스트를 음성으로, 음성을 텍스트로 변환할 수 있으므로, 개발자는 액세스 가능한 음성 기반의 웹 앱을 만들 수 있습니다.

ARIA 지원

Safari는 ARIA(Accessible Rich Internet Applications)를 지원합니다. ARIA 표준은 개발자들의 다이내믹 웹 콘텐츠 개발을 도와서 장애가 있는 사람들도 더욱 쉽게 접근할 수 있게 합니다. ARIA로, 사이트들은 AJAX 및 JavaScript와 같은 우수한 테크놀로지를 활용해 보조기술과 더욱 쉽게 상호작동할 수 있습니다.

HTML5 비디오의 청각 장애인용 자막

이제 Safari는 동영상을 더 많은 사람에게 보여줄 수 있습니다. HTML5 <video> 태그를 사용하여 청각 장애인용 자막이 포함된 비디오가 웹 페이지에 삽입되어 있는 경우 비디오 컨트롤의 'CC' 단추를 클릭하면 청각 장애인용 자막이 표시됩니다.

HTML5의 텍스트 트랙 시간 지정

개발자는 자막과 같은 미디어 구성요소와 함께 나타나는 텍스트의 시간을 지정할 수 있습니다.

HTML5 미디어 동기화

Safari는 여러 HTML5 미디어 구성요소를 재생하도록 조정하는 웹 페이지를 지원합니다. 웹 사이트 개발자가 동영상 트랙에 수화 통역을 입힐 수 있고 수화 통역을 영상에 맞출 수도 있습니다.

Safari Extensions

개발 용이

Safari Extensions는 표준 웹 기술 즉, HTML5, CSS3, JavaScript를 통해 구축되었습니다. 따라서 웹 개발자라면, Safari용 확장 프로그램을 웹 사이트와 같은 느낌으로 개발할 수 있습니다.

내장된 개발자 도구

Safari는 확장 프로그램 빌더를 통해 개발 작업을 간소화합니다. 스크립트, 스타일시트, 명령을 복잡한 텍스트 파일에 수동으로 입력하는 대신 확장 프로그램 빌더에서 양식처럼 작성하기 쉬운 템플릿으로 되어 있는 확장 프로그램 리소스를 보고 선택할 수 있습니다.

Safari Developer Program

개발자는 안전하며 표준에 기반한 Safari용 확장 프로그램을 만들 수 있습니다. 도구 막대를 위한 버튼을 제작하거나 당신만의 확장 막대를 만들어보세요. 웹 페이지와 상호 작용하고 웹 콘텐츠가 표시되는 방식을 변경해 보십시오. 무료 Safari Developer Program에는 확장 프로그램 개발을 시작하는 데 필요한 모든 것이 포함되어 있습니다.

서명 및 보안됨

Safari Developer Program 회원은 Safari Extensions에 서명할 수 있는 디지털 인증서를 무료로 받을 수 있습니다. 이 인증서를 통해 확장 프로그램의 업데이트를 제3자가 아닌 개발자 본인이 제공할 수 있습니다.

Safari Dev Center

Safari 개발자 센터는 Safari 확장 프로그램 제작에 도움이 되는 예제 코드, 프로그래밍, 변환 가이드를 포함해 확장 프로그램 개발을 위한 다양한 기술 리소스를 제공합니다.
Safari Dev Center 방문

추가 특징

Safari 푸시 알림 새로운 사항

Apple 푸시 알림을 사용하여 뉴스 및 기타 알림을 통해 사용자를 최신 상태로 유지할 수 있습니다. 사용자가 OS X Mavericks의 Safari에서 웹 사이트의 알림에 등록하면 Safari를 실행하지 않는 경우에도 Mac 앱 알림처럼 표시되는 푸시 알림을 보낼 수 있습니다. 사용자는 해당 알림을 클릭하여 Safari에서 웹 사이트를 실행할 수 있습니다. 더 알아보기

고정 위치 지정 새로운 사항

고정 위치 지정을 통해 사용자가 스크롤할 때도 요소가 Safari 윈도우 내에 남아 있도록 할 수 있습니다.

WebKit 아이콘

WebKit

Apple이 출시한 오픈 소스 렌더링 엔진인 WebKit은 OS X과 iOS에서 Safari를 구동합니다. WebKit은 놀라운 성능과 확장 표준 지원이 주요 특징이며 오픈 소스이므로, 개발자들은 WebKit 코드를 검토하고 개발자 커뮤니티에 기여할 수 있습니다.

웹 오디오 API

개발자는 게임 또는 악기 시뮬레이터와 같은 풍부한 미디어 콘텐츠가 있는 웹 응용 프로그램에서 오디오 효과를 생성하고 사용자화할 수 있습니다. 개발자는 오디오 재생 시간에 대한 세밀한 제어를 제공하는 웹 오디오 API를 통해 HTML 5 미디어 요소의 오디오 소스를 처리하고 공간적인 사운드 효과를 생성하며 JavaScript로 직접 오디오를 처리할 수 있습니다.

Acid 2 준수

Web Standards Project에 의해 디자인된 Acid 테스트는 웹 브라우저에서 최신 인터넷 표준을 준수하는지 여부를 확인합니다. Acid 2는 HTML, CSS 및 PNG 표준의 새로운 특징에 대한 호환성을 테스트합니다. 표준화에 앞장 서온 Safari는 2005년 10월 27일에 Acid 2를 통과했습니다. 인기가 많은 다른 어떤 브라우저보다도 2년 반이나 앞선 것입니다.

Acid 3 준수

Safari는 Acid 3를 통과한 최초의 웹 브라우저입니다. Acid 3는 다이내믹 차세대 웹 사이트를 만드는 데 사용되는 CSS, JavaScript, XML, SVG를 포함한 웹 표준이 사용된 페이지를 브라우저가 완전히 렌더링하는지 테스트합니다.

포맷된 XML 파일

개발자들이 스타일이 규정되지 않은 XML 파일을 다운로드하면, Safari가 해당 정보를 알아보기 쉬운 문서 트리 포맷으로 보여주므로 더 쉽게 읽을 수 있습니다.

미디어 캐싱

Safari는 HTML5 응용 프로그램 캐시를 사용하는 웹 응용 프로그램을 위해 오디오와 비디오 데이터를 저장할 수 있으므로, 오프라인 미디어 재생이 가능하고 인터넷 연결이 느릴 때에도 더 나은 미디어 성능을 발휘할 수 있습니다.

EventSource

Safari는 서버의 실시간 푸시 알림을 지원합니다. EventSource를 사용하는 웹 응용 프로그램은 해당 웹사이트의 서버와 더 빠르고 더 안정적인 커뮤니케이션을 할 수 있습니다.

WebSocket

WebSocket를 지원하는 Safari는 빠른 쌍방향 커뮤니케이션 링크로 웹 응용 프로그램 서버와 통신하므로, 채팅과 같은 온라인 활동이 더 빠르고 필요한 대역폭도 더 적습니다.

MathML

MathML(Mathematical Markup Language)을 지원하는 Safari는 개발자들이 이미지 파일을 사용하지 않고도 웹 페이지에 수학 기호를 넣을 수 있게 해줍니다.

ECMA 262 버전 5.1 지원 새로운 사항

Safari는 JavaScript의 최신 표준 버전인 ECMA 262 버전 5.1을 지원하여 차세대 고급 대화식 웹 응용 프로그램을 사용할 수 있도록 해 줍니다.

JSON 지원

JSON(JavaScript Object Notation)을 기본으로 지원하는 Safari는 JSON을 사용하는 웹 응용 프로그램이 더 빠르고 안전하게 실행되게 합니다.

전체 화면 웹 페이지

풀 스크린 JavaScript API로 개발자들은 플러그인 없이도 매력적인 웹 경험을 만들어낼 수 있습니다.

SVG 1.1 지원

웹 개발자는 Safari의 SVG(Scalable Vector Graphics) 지원을 활용하여 크기에 상관없이 근사해 보이는 서체, 그래픽 요소 및 애니메이션을 그때 그때 만들 수 있습니다. 예를 들어 지도 사이트는 종종 SVG를 사용하여 위치와 목적지를 기준으로 운전 경로를 도출해 냅니다.

ICC 색상 프로파일 지원

Safari는 고급 색상 관리 기술을 사용하여 웹 이미지를 풍부하고 정확한 색상으로 전달합니다. 사실, Safari는 ICC(International Color Constortium)프로파일을 지원한 최초의 브라우저로, 처음부터 지원했으므로 브라우저에서 보는 사진과 이미지가 최대한 원본에 가깝게 표시됩니다.

플러그인 지원

플러그인은 브라우저의 기능을 확장하는 추가 기능입니다. Safari는 표준 Netscape 플러그인 아키텍처를 지원하므로 Flash, Shockwave, QuickTime을 비롯한 인기있는 모든 종류의 인터넷 플러그인과 호환됩니다.

스크립터블 플러그인(Scriptable Plug-in)

Safari는 스크립터블 플러그인을 지원하므로, 개발자들이 페이지에서 표준 구성요소와 상호작용하는 플러그인을 만들 수 있습니다. 예를 들어 플러그인을 통해 자동차의 외관을 사용자화할 수 있습니다. 자동차 옵션을 넣고 빼는 것에 따라 스트립트가능 플러그인은 차의 가격 표시도 업데이트할 수 있습니다.

Java 지원

Safari는 Java를 지원하므로 Java 플러그인 콘텐츠를 포함하는 웹 페이지를 사용할 수 있습니다.

XML 1.0 지원

XML(Extensible Markup Language)은 업계에서 많이 사용되는 오픈 스탠더드로, 구조화된 데이터 제작, 관리, 공유에 활용됩니다. 기본 XML 지원이 Safari에 내장되어 있으므로 JavaScript 프로그램이 XML 데이터 피드를 효율적으로 읽을 수 있습니다.

LiveConnect 지원

Safari는 LiveConnect를 지원하므로 인기 있는 엔터프라이즈 웹 응용 프로그램에 대한 호환성이 보장됩니다. LiveConnect는 Java와 JavaScript가 함께 작동할 수 있도록 하여 더욱 완벽한 브라우징 환경을 제공합니다.