거의 아무도 사용하지 않는 인라인 HTML

대부분의 개발자는 , , 를 알고 있습니다.

아마도 , , , , , 와 같은 다른 태그들은 무시하고 있을 것입니다. 대신 을 사용하기 때문입니다.

이러한 요소를 사용하면 의미가 더해집니다. 스타일이 적용된 span은 기계에게 아무런 정보도 전달하지 못합니다. 반면, 이러한 요소들은 스크린 리더와 검색 엔진에 데이터를 제공합니다.

알아두면 유용한 요소들은 다음과 같습니다:

: 변경 사항을 추적합니다. 삭제된 텍스트에는 을, 새로운 텍스트에는 를 사용하세요. 이 둘은 함께 작동하여 수정 사항을 보여줍니다. • : 더 이상 정확하지 않은 콘텐츠에 사용합니다. 삭제와는 다릅니다. 오래된 가격과 같이 유효하지 않은 정보를 표시합니다. • : 화학식이나 수학 지수에 사용합니다. 단순히 텍스트를 작게 만들기 위한 용도로 사용하지 마세요. • : 수학이나 코드의 변수에 사용합니다. • : 관련성이 있는 텍스트를 강조합니다. 검색 엔진은 이를 사용하여 검색어 일치 항목을 보여줍니다. • : 툴팁을 통해 약어의 전체 버전을 제공합니다. • : 용어를 정의하는 특정 지점을 표시하는 데 사용합니다. • : 책이나 논문과 같은 저작물의 제목에 사용합니다. 사람의 이름에는 사용하지 않습니다. • : 인라인 인용구를 처리합니다. 브라우저가 자동으로 따옴표를 추가해 줍니다.

브라우저의 기본 스타일은 종종 보기 좋지 않습니다. 는 노란색 형광펜처럼 보이고, 는 무작위로 표시가 붙습니다.

이 태그들을 피할 필요는 없습니다. CSS만 추가하면 됩니다.

에 브랜드 색상을 입히고, 에 점선 밑줄을 적용해 보세요. 이렇게 하면 시맨틱 코드가 깔끔한 타이포그래피로 변합니다.

일 년에 한 번이라도 올바른 태그를 사용하는 것이, 콘텐츠의 실제 의미를 속이는 span을 사용하는 것보다 훨씬 낫습니다.

출처: https://dev.to/dimonb19a/the-inline-html-almost-nobody-uses-205d