반응형 개발/브라우저와 네트워크24 Lighthouse : Accessibility Lighthouse : Accessibility Lighthouse는 웹사이트의 성능,접근성, SEO 등을 평가하는 오픈 소스 도구이다. Accessibility(접근성)은 웹 사이트가 모든 사용자, 특히 장애를 가진 사람들에게 편리한지 평가한다. Lighthouse의 Accessibility 점수를 향상시키는 것은 사용자 경험을 향상시키고 웹 사이트를 더 포괄적으로 만드는데 중요하다. 주로 적절한 html태그 사용, 대체 텍스트(alt text), 키보드 접근성 확보, label과 aria의 적절한 사용 등과 관려되어 있다. lighthouse로 검사를 했을때, button 의 접근성이 떨어진다고 나왔다. 인터넷이 검색해보니 aria-label 을 추가하라고 한다. 추가하니 점수가 83점에서 92점으로.. 2023. 9. 3. 사파리에서 navigator.clipboard.writeText 안되는 경우 사파리에서 navigator.clipboard.writeText 안되는 경우 navigator.clipboard.writeText는 웹API의 일부로 시스템 클립보드에 텍스트를 쓰는 기능을 제공한다. 이는 사용자가 웹사이트에서 텍스트를 복사하거나 사용자를 대신해 텍스트를 클립보드에 저장하게 할 때 유용하다. 이는 비동기적으로 동작하며 Promise를 반환한다. 사파리 브라우저에서 navigator.clipboard.writeText가 동작하지 않는 경우가 있다. 사파리 브라우저에서는 보안상의 이유로 사용자의 상호작용을 통해서만 navigator.clipboard.writeText가 동작한다. 예를 들어 클릭 이벤트 핸들러와 같은 사용자의 직접적인 상호작용에 의해서만 호출된다. 위 내용은 결론부터 적은 것.. 2023. 3. 20. document.referrer를 통한 유입매체 확인 콘솔창에 document.referrer를 입력하면 유저가 어디에서 왔는지 알 수 있다. 예를들어 코드스테이츠 랜딩페이지에서 지원하기 버튼을 통해 유어클래스 홈페이지에 진입하면 다음과 같이 이전 페이지를 확인할 수 있다. document.referrer를 확인할 수 없는 경우가 있는데, 링크를 통해서 진입한 것이 아니라 직접 주소를 입력해서 진입했을때이다. 회사에서 무슨일이 있었는가? GM팀에서 document.referrer를 통해 유입매체를 확인하려 했는데, url의 query가 짤린 도메인만 확인가능하다고 문의가 왔다. 예를들어 https://www.codestates.com/course/ai?utm_source=Kakao_notify 와 같은 페이지에서 지원하기 버튼을 눌러서 유어클래스에 도달했을.. 2022. 11. 15. Next/image로 회사 홈페이지 최적화 시도 레이지로딩 오케이 벗 로딩속도가 그리 향상되진 않은듯 본질은 노션이기떄문?? 라이트하우스로 검사할것 before after 그래도 LCP가 9.8에서 3으로 감소하였다. 2022. 9. 27. 이전 1 2 3 4 5 6 다음 반응형
