주의 Crosswalk 브라우저는 2017년 2월 릴리즈21을 마지막으로 개발이 중단되었습니다. WebView(웹뷰)란 안드로이드에 내장된 브라우저 모듈로써, 네이티브 앱 제작 시 사용할 수 있으며 HTML문서를 해석하고 출력하는 기능을 합니다. (iOS에서는 UIWebView) WebView의 한계 WebView는 HTML5의 모든 기능을 완벽하게 실행하지 못하고, 하드웨어 가속을 사용하지 못합니다. 2D렌더링, 대용량 동영상, WebRTC, WebAudio 지원하지 않으며, CSP(Content Security Policy) 설정불가 등 일부 보안취약점도 존재합니다. WebView는 안드로이드 버전별로 버전이 다르기에 버전 별로 파편화가 발생할 수 있습니다. 구글은 더 이상 안드로이드 4.3 이하의 ..

ViewPort란 모바일 브라우저에서 웹컨텐트를 출력하는 영역으로써, 일반 PC의 브라우저에는 존재하지 않는 개념입니다. ViewPort는 웹페이지의 너비와 높이, 확대/축소 상태를 설정할 수 있게 해주며, 이를 통해 웹컨텐트가 최적의 상태로 표현될 수 있도록 도와줍니다. 모바일을 위한 웹페이지를 제작할 때 태그를 통해 ViewPort의 크기, 줌인/줌아웃 값을 설정할 수 있습니다. ViewPort를 지원하지 않는 대부분의 PC 브라우저는 이 설정을 무시합니다. width: ViewPort의 가로크기를 지정합니다. 1024로 설정할 경우 ViewPort의 가로픽셀 개수는 1024개가 됩니다. 허용되는 값의 범위는 200~10,000입니다. height: ViewPort의 세로에 해당하는 픽셀의 개수입니다..

format-detection 스마트폰의 브라우저는 전화, 주소, 이메일 등을 발견하면 자동으로 링크를 걸게됩니다. 이를 제어하기 위해 아래 meta 태그를 사용합니다. 위 설정은 브라우저가 컨텐트 내의 전화, 주소, 이메일을 발견해도 링크를 자동으로 걸지 않게 합니다. tap-highlight IE 11에서 링크를 탭할 경우, 터치된 대상을 명확하게 표시하기 위해 시각적으로 강조하는 기능이 있습니다. 이 기능은 대체로 유용하지만, 이미지링크 혹은 스타일이 적용된 링크의 경우 사용자 경험을 떨어뜨리는 요인이 되기도 합니다. 이를 위해 다음과 같은 태그 설정은 이러한 시각적 강조기능을 제거합니다. cordova-plugin-whitelist cordova에서 지원하는 보안설정을 위 플러그인 입니다. 이 플..

Cookie에 대한 이해 쿠키는 ASP.NET, PHP와 같은 특정 기술영역에 국한된 것도 아니고, 특정 Client나 Server에만 국한된 기술도 아닙니다. 쿠키는 수십 년 전부터 사용되어 왔으며 최근에는 HTTP에 있어서 없어서는 안될 정도로 광범위하게 이용되고 있습니다. 어떠한 서버도 HTTP통신을 한다면 쿠키를 주고 받을 수 있으며, 클라이언트에서도 쿠키에 접근하고 관리할 수 있습니다. 또한 HTTP와 HTTPS사이에도 쿠키를 교환할 수 있으며, 같은 도메인이라면 서로 다른 Scheme일지라도 쿠키를 공유할 수 있습니다. 쿠키는 서버에서도, 클라이언트에서도 생성할 수 있습니다. 일단 쿠키가 한번 생성되면 브라우저는 해당 쿠키 정보를 기억하게 됩니다. 그리고 이후의 모든 요청(Request)에 쿠..

HTTPS란? HTTPS는 Web을 구성하는 프로토콜 중 하나인 HTTP 프로토콜의 보안강화버전이라고 볼 수 있습니다. HTTP는 Hyper text transfer protocol의 약자로서 하이퍼텍스트를 통한 전송 규약을 말합니다. 즉, 서버와 브라우저 사이에 하이퍼텍스트 문서를 교환하고 전송하는데 사용되는 통신규약입니다. 여기서, 하이퍼텍스트 문서란 문서 내에 하이퍼링크를 통해 하이퍼텍스트 문서를 유기적으로 결합하고 참조할 수 있는 문서를 가리킵니다. 쉽게 말해 링크를 통해 문서가 유기적으로 연결된 문서가 하이퍼텍스트 문서라고 볼 수 있습니다. (href란 Hyper Reference의 약자) 이러한 HTTP프로토콜은 다양한 문서를 연결하고 보여주는 데에는 문제가 없으나, 중요한 정보를 전송하는데 ..

원문자 확인사항 원문자 사용 시 "font-family:'MS Gothic';"으로 설정해주셔야 글자크기가 고르게 나타납니다. 50이상의 수를 표현하는 경우 혹은 배경색상을 주고자 할 경우, Unicode 대신 border-radius, border를 활용하여 직접 원을 표현하는 것도 하나의 방법입니다. numberpile 등의 무료 웹폰트를 활용하는 방법이 있으나, SEO 측면에서는 좋은 방법이 아닐 수 있습니다. ⓪ ⓪⓪ ① ①① ② ②② ③ ③③ ④ ④④ ⑤ ⑤⑤ ⑥ ⑥⑥ ⑦ ⑦⑦ ⑧ ⑧⑧ ⑨ ⑨⑨ ⑩ ⑩⑩ ⑪ ⑪⑪ ⑫ ⑫⑫ ⑬ ⑬⑬ ⑭ ⑭⑭ ⑮ ⑮⑮ ⑯ ⑯⑯ ⑰ ⑰⑰ ⑱ ⑱⑱ ⑲ ⑲⑲ ⑳ ⑳⑳ ㉑ ㉑㉑ ㉒ ㉒㉒ ㉓ ㉓㉓ ㉔ ㉔㉔ ㉕ ㉕㉕ ㉖ ㉖㉖ ㉗ ㉗㉗ ㉘ ㉘㉘ ㉙ ㉙㉙ ㉚ ㉚㉚ ㉛ ㉛㉛ ㉜ ㉜..