티스토리 정보 저장소

이미지 ALT·파일명·크기 최적화｜코어 웹 바이탈 안정화 실전핵심: 이미지는 검색·접근성·속도를 동시에 좌우합니다. ALT 한 문장 규칙, 파일명 표준, 픽셀/용량 최적화, 그리고 width/height·srcset·loading 같은 속성 세트만 지켜도 LCP·CLS·INP가 안정화됩니다. 아래 체크리스트와 예시를 그대로 적용해 보세요.📑 목차왜 중요한가ALT 작성 규칙: 정보성 한 문장파일명 규칙: kebab-case·버전·출처크기·용량·포맷(WebP/AVIF)HTML 속성 세트(width/height·srcset·lazy)실전 점검표FAQ실행 요약1) 왜 중요한가ALT는 스크린 리더 사용자에게 내용을 전달하고, 검색 크롤러에 이미지-문맥 연결 신호를 제공합니다. 파일명은 식별성과 관리 편의성을 높..

모바일 우선 티스토리 점검표｜폰트·여백·이미지 비율·탭 네비게이션핵심: 방문자의 70% 이상이 모바일입니다. 글은 작은 화면 기준으로 설계해야 하며, 폰트·여백·이미지·탭 네비게이션이 체류 시간과 가독성을 좌우합니다.📑 목차폰트·줄간격·문단 폭여백·행간·리스트 가독성이미지 비율/용량/표기 규칙탭 네비게이션·고정 바모바일 우선 점검표(표)오늘부터 실행 요약1. 폰트·줄간격·문단 폭본문 폰트 크기: 16–18px(선호 17px), 제목은 단계별 1.25–1.35배 비율.줄간격(line-height): 1.7–1.85(가독–스크롤 균형값).문단 폭: 모바일 기준 18–22자/줄(영문 45–75cpl) 유지.문단 간격: 본문–본문 12–16px, 본문–소제목 18–24px.리스트: 항목 길이는 1–2문장, 아..