폰트 preload 웹 폰트는 일반적으로 다른 리소스와 함께 다운로드 되는 경우가 많아서 성능 문제가 발생할 수 있음 이를 해결하기 위해 preload를 사용 preload를 사용하면 웹폰트를 브라우저가 미리 다운로드하기 때문에 페이지 로딩 속도가 빨라짐 (as 속성은 리소스 유형, type은 mime유형, crossorigin은 다른 도메인에서 폰트를 가져올 때 사용) preload는 페이지 성능을 개선할 수 있는 방법이지만, 폰트를 미리 다운로드 할 수 있는 만큼 많은 양의 폰트를 사용한다면 페이지 로딩 시간을 되려 증가시킬 수 있음 그리고 현재 페이지에서 사용하지 않는 폰트여도 폰트를 다운로드 할 수 있음 로컬폰트 로딩 CSS에서 폰트를 선언하게 되면 폰트를 무조건 다운로드 하게 됨 (불필요한 리소..
크로스 브라우징이란? 크로스브라우징이란 서로 다른 웹 브라우저(크롬, 사파리, 파이어폭스, 엣지 등등)에서 사용자에게 웹페이지가 동일하게 보여지는 것 혹은 작동하는 것을 의미 웹 페이지의 호환성을 해결하기 위한 것 그렇다면 크로스브라우징이 필요한 원인은 무엇일까? 브라우저 마다 랜더링 엔진이 다르기 때문 브라우저별 렌더링 엔진 (참고) 웹 브라우저의 랜더링 엔진은 HTML, CSS 및 JavaScript 문서를 받아들여서 웹 페이지를 렌더링하는 소프트웨어 (Chrome의 Blink, Firefox의 Gecko, Safari의 WebKit, Microsoft Edge의 EdgeHTML 등) 크로스 브라우징 작업 1. 웹 서비스에서 가장 높은 점유율을 가진 브라우저를 알아보기 - 구글애널리틱스나 브라우저 점..
웹 표준이란? 월드 와이드 웹의 콘텐츠에 대한 규약이나 규칙으로, 웹 페이지를 만들 때 지켜야 하는 규칙 웹표준은 W3C에서 제정하고 html, css, javascript와 같은 웹에서 사용되는 기술의 표준을 제시한다. 웹 표준을 준수한다는 것은 올바른 html, css, javascript를 페이지가 가지고 있다는 것을 의미 웹 표준를 지키면 얻을 수 있는 효과 1. 웹 페이지의 접근성을 개선한다. 다양한 브라우저에서 동일한 콘텐츠를 보여줄 수 있음 고령자, 장애인을 포함한 다양한 사용자층이 웹페이지를 탐색하기 용이함 2. 개발자 측면에서 유지보수가 용이하다. 3. SEO에 도움을 준다. HTML 시맨틱 태그란? html 문서의 구조와 의미를 구체적으로 설명하기 위해 HTML5에서 추가된 태그 대표적..