(HTML) div로 다 해도 화면 똑같은데 header section article 이런 시맨틱 태그 왜 쓰나요?

솔직히 좀 답답해서 여쭤봅니다. 저는 그냥 div에 class 붙여서 레이아웃 다 짜거든요. 근데 다른 사람들 코드 보면 header, nav, section, article, footer 이런 태그를 꼬박꼬박 쓰더라고요.

제가 테스트해보니까 이거나 저거나 화면엔 똑같이 나와요. 결국 div도 되고 section도 되는데 굳이 이름만 다른 빈 껍데기 태그를 왜 쓰는 건지 이해가 안 됩니다.

예를 들어 이 두 개가

<div class="header">...</div>
<div class="content">...</div>

이렇게 바꾸는 게

<header>...</header>
<main>...</main>

뭐가 그렇게 좋은 건가요? SEO에 좋다는 말도 있고 접근성 어쩌고 하는 말도 들었는데 구체적으로 뭐가 달라지는지 와닿지가 않아요. 스크린 리더라는 게 이 태그들을 실제로 다르게 읽어주는 건가요? 아니면 그냥 개발자끼리 코드 알아보기 편하려고 관례로 쓰는 건가요? 실제로 시맨틱 태그 써서 이득 본 경험 같은 게 있으면 듣고 싶습니다.