개발자
초보 코린이 프론트엔드 개발자 입니다. img 태그를 사용할 때 alt 속성을 넣지 않으면 아래와 같은 경고가 나오는데요 img elements must have an alt prop, either with meaningful text, or an empty string for decorative images. 왜 alt속성을 넣어줘야 하나요? 어차피 안보이는거... 고수님들 부탁드립니다.
답변 5
인기 답변
1. 구글 이미지 검색시에 alt 태그가 검색 순위에 영향을 줍니다 2. 윗분 말씀대로 시각장애인 분 대상으로 음성 서비스를 제공할 때 alt 태그를 사용합니다 그러므로 디스크립션이 구체적일 수록 좋은데 예를 들어 "아기" 보다는 "우는 아기"가 더 낫고 그것 보다도 "밥을 달라고 떼쓰며 우는 아기"가 더 낫습니다 링크 참조하세요 https://www.youtube.com/watch?v=dEbl5jvLKGQ (2분 부터) 그런데 db에서 임의의 이미지를 query문으로 불러와 뿌려주는 경우에는 안 넣는 경우도 있습니다 netflix, spotify 들어가셔서 devtools키고 이미지 보시면 alt태그 디스크립션 설명 거의 없습니다
익명
작성자
2023년 03월 09일
오 그렇군요.. 설명 감사합니다 링크도 들어가볼게요!
인기 답변
접근성 때문이에요. 시각장애자의 경우 이미지를 볼 수 없어요. 이때 스크린리더기 등으로 웹서비스를 사용할 수 있는데 img태그의 경우 스크린리더기가 alt속성에 정의된 텍스트를 읽어줘요. 만약 콘텐츠로서 의미가 없는 이미지라면 빈 스트링으로라도 alt속성을 명시해줘야해요, 두번째는 seo 때문이에요.
익명
작성자
2023년 03월 09일
아 그런 부분을 생각 못했네요.. 서비스 만들 때 이런 부분도 더 깊이 생각해 봐야겠어요..
1. 접근성 스크린리더 와 같은 보조기기로 탐색을 하는 사용자가 이미지 요소를 만났을 때 이미지에 포함된 정보를 제공하는 데 사용됩니다. 장식 이미지인 경우 alt=“”와 같이 설정하여 스크린리더가 읽지 않도록 설정할 수 있습니다. 정보가 담긴 경우라면 해당 정보를 대체텍스트로 작성해 주셔야해요. 2. 이미지가 올바르게 표시되지않을 때(잘못된 연결 또는 네트워크 오류 등) 해당 이미지 정보를 제공할 수 있습니다. 3. seo
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
지금 가입하면 모든 질문의 답변을 볼 수 있어요!