SEO 썸네일형 리스트형 Next.js SEO plugin 이용하기(feat. next-seo, next-sitemap) 키워드: next-seo, next-sitemap, SEO, robots.txt, sitemap, canonical URL 상황 지금까지는 Next.js 프로젝트에서 _document.tsx와 next/head를 이용하여 meta/link tag를 작성했다. next-seo 라는 패키지를 이용해서 더 간단하고 가독성있게 SEO 관련 설정을 하고자 한다. 해결 과정 next-seo 패키지를 설치한다. (https://www.npmjs.com/package/next-seo) yarn add next-seo 먼저 seo.config.js 파일을 생성하고, 모든 페이지에서 사용할 전역(Default) SEO properties를 작성한다. 설명을 위해 사이트 이름 등은 'example'로 한다. // seo.c.. 더보기 웹접근성(web accessibility), SEO 개선하기 프로젝트: loplat homepage 키워드: web accessibility, SEO, lighthouse, semantic tag, screen reader, aria 상황 로플랫 홈페이지를 chrome lighthouse로 검사한 결과, a11y과 SEO에서 만족스럽지 못한 점수가 나왔다. 패스트캠퍼스에서 'TheRED: 견고한 UI 설계를 위한 마크업 가이드 by정찬명' 이라는 강의를 수강한 뒤, 홈페이지 웹접근성 개선을 위한 작업을 수행하였다. 해결과정 'HeadingsMap'이라는 크롬 확장 프로그램을 이용하여 페이지의 heading 구조를 확인해보았다. heading tag는 (구글 등의) 웹 크롤러가 페이지의 목차를 파악하는데 중요한 태그이며, 스크린 리더 사용자가 페이지를 빠르게 탐색할.. 더보기 이전 1 다음
