21-12-14일 시맨틱 태그와 웹 표준, 접근성에 관하여..

우선 스터디 발표 주제와 동일하다. 스터디를 준비하면서 다른 개발자들의 적어둔 글을 읽고 내용을 한대모아

내 방식대로 재해석하고 검증?을 해보는 시간을 보낼 예정이다. 

.

.

 

시맨틱 웹 이란 직관적으로 해석을 하면 의미론적인 웹 이 되겠다. 

우리가 적제적소에 알맞을 태그를 사용해야 하는 포괄적인 의미로 설명 되시겠다..!

 

시맨틱 태그는 브라우저, 검색엔진, 개발자 모두에게 콘텐츠의 의미를 명확히 설명하는 역할을 하게 되는데

예를 들면 header 부분을 보고 해당 페이지에 중요한 내용을 기대하기는 어려울 것이다. 

이렇게 해당 태그마다 기대하는 코딩이 있는데, 글쓴이는 이 이미지를 참 좋아한다. 

 

 

필요에 따라 nav는 header 영역 안으로 들어가는 경우도 꽤나 있는 것 같다. 

그리고 section 안에 또다시 header 와 article, footer 로 또 다시 분리 할 수 있는데, 

참 헷갈리는게 이 section 과 article 이다. 기사 내용을 생각하면서 이해하면 쉽다고

하는데 글쓴이는 아직 스스로 이해했다고 말하기 참 어려움.. 그래서 여기서 끄적여본다. 

.

.

 

서로 article 이 부모태그가 되었다가 section 이 부모태그가 되었다가 하지만 결론적으로

제일 큰 차이점은 해당 내용을 발췌하여 확인했을때 글에 이상함이 없어야 한다는것인데..

그렇게 되면 결국 section을 쓸 일이 별로 없을 것같다는게 내 생각이다. 

가끔... 한두번씩은 쓰겠지..

.

.

 

그리고 우리가 시맨틱 마크업을 적절하게 잘 사용했을 경우 오는 이득은

1. 개발자의 의도가 명확히 드러나고, 이는 곳 코드의 가독성을 올려준다. 이는 곳 유지보수에도 큰 이점으로 작용한다. 

2. 검색엔진보단 의미론적으로 문서 정보를 전달 할 수 있고, -> 이는 이해하지 못함. 

2-1. 검색 엔진 또한 시맨틱 요소를 이용하여 효과적인 크롤링, 인덱싱(검색할때 발생하는 비효율적인 문제를 해결하기 위한 대표적인 방법)이 가능해졌다. 

.

.

 결국 위에 내용을 아무리 읽어봤자 하고싶은 말은 

화면에 어떻게 표현되는지도 물론 중요하지만 !!  내가 사용한 태그를 알맞게 잘 썼느냐 이다. div, span 남발과 section 인지 article인지 모르면서 화면을 열심히 구성해 봤자 결국 마지막엔 웃지 못할 상황이 닥친다는 말인듯 하다. 

결론. 시맨틱 태그를 먼저 이해하고, 개념을 잡아가면서 코딩을 하면 뿌리가 탄탄한 나무로 성장 할 가능성이 생긴다!

.

.

 

아직 지래짐작으로 이해하는 정도지만 스스로도 몇번씩 정독을 할 예정이다. 

내가 이해하고, 해석한 내용이 정답인지는 100000% 확신은 없지만 틀렸으면 얼른 다시 고치러 돌아와야지머..

코딩도 중요하지만 공부도 중요하다! 프론트 엔드 개발자는 화면에 보여지는 코딩만 하는 사람이 아니다!!! 화이팅!!