Log In

내가 그의 이름을 불러주기 전에는
그는 다만
하나의 몸짓에 지나지 않았다.
내가 그의 이름을 불러주었을 때,
그는 나에게로 와서
꽃이 되었다.
-김춘수 꽃-

Semantic: 의미의, 의미론적인

들어가기에 앞서서 굳이 김춘수의 꽃을 써본 이유는 사실 별 의미 없다.
이것이 바로 Semantic과 Non-Semantic의 차이이다.

1. Tag

Non-Semantic Elements

div나 span과 같은 태그들 처럼 내부에 어떤 함축적인 의미를 가지지 않은 요소들이다.

Semantic Elements

1. header
2. nav
3. main
4. article 등등

반면 Semantic Elements들은 개발자와 컴퓨터에게 의미를 가지고 가독가능하게 하는 요소들이다.

Difference

Non-Semantic

<div class="header"></div>
<div class="intro"><div>
    <div class="section">
        <div class="articles">
            <div class="article"></div>
            <div class="article"></div>
        </div>
        <div class="featured-blog"></div>
    </div>
    <div class="footer"></div>

Semantic

<header>
    <nav></nav>
</header>
<section></section>
<main>
    <section>
        <article></article>
        <article></article>
    </section>
    <aside></aside>
</main>
<footer></footer>

위의 코드들을 도식화하면 아래 그림과 같다.

2.Web

Semantic Web:현재의 컴퓨터처럼 사람이 마우스나 키보드를 이용해 원하는 정보를 찾아 눈으로 보고 이해하는 웹이 아니라, 컴퓨터가 이해할 수 있는 웹을 말한다. 즉 사람이 읽고 해석하기에 편리하게 설계되어 있는 현재의 웹 대신에 컴퓨터가 이해할 수 있는 형태의 새로운 언어로 표현해 기계들끼리 서로 의사소통을 할 수 있는 지능형 웹이다.
[네이버 지식백과] 시맨틱 웹 [Semantic Web] (손에 잡히는 IT 시사용어, 2008.02.01)

semantic web

위키피디아에서 있는 글을 찾아봤다.
시맨틱 웹(Semantic Web)은 '의미론적인 웹'이라는 뜻으로,현재의 인터넷과 같은 분산환경에서 리소스(웹 문서, 각종 화일, 서비스 등)에 대한 정보와 자원 사이의 관계-의미 정보(Semanteme)를 기계(컴퓨터)가 처리할 수 있는 온톨로지 형태로 표현하고, 이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다. 웹의 창시자인 팀 버너스리가 1998년 제안했고 현재 W3C에 의해 표준화 작업이 진행 중이다.

Semantic Web은 결국 컴퓨터가 더 직관적으로 이애할 수 있느냐 없느냐의 차이인 것 같다. 4차 혁명이 지속되고 인공지능이 발전한다면 Machine에게 Computer라는 단어를 주면 C O M P U T E R이라는 단어의 배열이 아닌 인간이 이해하는 0과1로 연산을 도와주는 그 기계라고 이해할 수 있게하는 웹의 형식이다.

3. Semantic과 Non-Semantic

Semantic이라는 것은 결국 의미가 있냐 없냐의 차이인데
위의 도식들을 보면 그냥 이것 저것 뭉텅뭉텅 놓아둔 것과
어떤 의미를 지닌 것들의 차이라고 볼 수 있을 것 같다.

조금더 나아가서 얘기한다면 개발자와 machine 둘다에게 의미를 가지는 것 이라고 생각한다.

예를 들어보자.
꽃은 식물에서 씨를 만들어 번식 기능을 수행하는 생식 기관을 말한다.
어린이가 꽃을 식물도감에서 보기 전에는 이런식의 접근이 힘들다.
꽃이다 꽃이다 하다보면 언젠가 꽃이라는 정의(definition)을 생각하는게 순서이다.

div라는 구조로 둘러쌓인 왼쪽의 코드와 header, main등 의미를 가진 구역이 나누어진 코드는 겉으로 표현되기에는 똑같을 수 있겠지만 그 속을 뜯어보면 다를 수 밖에 없다.

Semantic을 쓰는 이유

Three idiots, 2009

아하! 결국은 편하게 쓰기 위해서이다. 세 얼간이라는 영화에서 지퍼를 예로 들면서 결국 기계라는 것은 편하게 하기 위해서 만드는 모든 것이라고 한다.

Semantic을 쓰면 보기에 용이하고 서로가 의미를 가지기에 그냥 div를 보는 것보다 Header라고 암시된 부분을 보면 '아 이것은 header구나!'라고 생각할 수 있게 된다. 결국 우리는 필요에 의해서 무언가를 만드는 존재니까 말이다.

Search engine optimization (SEO) is the process of improving the quality and quantity of website traffic to a website or a web page from search engines.
검색 엔진 최적화(SEO)는 검색 엔진으로부터 웹사이트나 웹페이지에 대한 웹사이트 트래픽의 품질과 양을 개선하는 과정이다.
-wikipedia-

더 중요한 측면은 검색 엔진 최적화(search engine optimization, SEO)이다. 검색엔진이라는 것은 우리가 알기 어려운 코드와 알고리즘으로 짜여져있다.
극단적인 예로 div를 읽는 코드가 있지만 나중에 의미론적인 Semantic이 main stream을 차지한다고 생각해보자. 그렇다면 검색엔진은 Header를 가진 html을 더 우선 순위에 놓을 것이고 그것은 노출적인 측면에서 엄청난 수입의 차이를 가져올 것이다.

적절한 도메인 이름을 설정하거나, 웹 표준을 준수하면서 포스트의 가독성과 웹페이지 로딩 속도를 최대로 끌어 올리고, 메타태그 작성이나 링크의 적극적 활용, 본문 태그, 부제목 태그 등 적절한 키워드를 선택해서 사용해야 한다.

Non-Semantic은??

그렇다면 Non-semantic은 항상 안 좋은 것인가? 아니다. 지퍼가 있어도 단추가 있듯이 구글링을 하면 여러가지 자료가 나오지만 결국은 단순한 작업들이나 기본작업들을 할때 Non-semantic을 지혜롭게 사용하는 것이 좋다고 한다.

Log Out

인간은 필요에의해 무언가를 발명한다. 발견하기도 하고. 컴퓨터가 만들어지고 사람들은 많은 부분에서 컴퓨터를 이용하고 의존한다. 그리고 그 서비스 중에는 인터넷이 있고 우리가 실제로 '눈'에 보는 많은 것은 인터넷의 창들이고 사이트들이다. 그러나 그 안을 뜯어보면 무수한 코드로 되어있고 그 더 안쪽은 결국 0과 1로 이루어져있다.
그것을 어떻게 더 쉽게, 직관적으로 사용할 수 있을지에 대한 고민의 결과가 현재는 Semantic 이라고 생각한다. 사람이 쓰기에도 더 의미가 있어보이지만 동시에 Machine에게 (사실 Machine의 동작원리까지 가면 엄청 복잡하겠지??)A.I를 어떻게 가르치는지까지는 알기 힘들어도 더이상 컴퓨터가 생각없이 그냥 입력과 출력만 존재하는 기계가 아니라는 시대의 요청에 따라 컴퓨터들끼리도 의미가 있는 무언가를 만들어간다고 생각한다.

한줄 코멘트

어렵다.