티스토리 뷰

개발/HTML,CSS

SEO

네스사 2023. 4. 25. 15:41

SEO


  • SEO는 검색 엔진 최적화(Search Engine Optimization)의 약자로, 웹사이트의 검색 엔진 상위 노출을 목적으로 하는 기술입니다.
  • 검색 엔진에서 사용자가 검색한 키워드와 관련된 정보를 찾아서 웹사이트의 순위를 결정합니다. SEO는 이러한 검색 엔진의 동작 원리를 이해하고 웹사이트를 최적화하여 검색 엔진 상위 노출을 유도하는 방법을 다룹니다.
  • SEO는 크게 페이지 내부에서 진행할 수 있는 On-Page SEO와 웹 사이트 외부에서 이루어지는 Off-Page SEO 두 가지로 나뉩니다.
  • Off-Page SEO는 광고나 소셜 미디어의 홍보를 사용하며, On-Page SEO는 주로 html의 <meta> 요소와 <title> 요소를 사용하여 검색 엔진의 노출을 유도합니다

 

 

SEO에 영향을 미치는 요소


1. <title> 요소

  • <title> 요소는 검색 결과창에서 제목에 해당하는 요소로, <head> 요소의 자식 요소로 작성합니다.
  • <title> 요소의 내용에 따라서 검색 후 유입을 유도할 수 있습니다. 단, 제목이 너무 길거나 짧아서 사용자가 제목으로 사이트를 파악하기 어려워지면 유입률이 떨어집니다.
  • <title> 요소에 핵심 키워드가 포함되면 상위에 노출될 확률이 높아집니다. 그러나 같은 키워드를 반복하면 검색 시 불이익을 받을 수 있기에 핵심 키워드는 한 번만 포함시켜야 합니다

파란색의 큰 글씨가 <title>입니다.

 

 

2. <meta> 요소

  • <meta>요소는 HTML 문서에서 웹 페이지의 정보를 나타내기 위해 사용되는 태그입니다. 
  • 웹 사이트에서 다루고 있는 데이터가 무엇인지를 나타내는 것을 메타 데이터라 하며, <meta> 요소는 이 메타 데이터를 담는 요소입니다.
  • <meta> 요소도 <title>과 마찬가지로 <head> 요소의 자식 요소로 작성해 주는 것이 일반적입니다.

파란색의 큰 글씨 아래의 작은 설명이 <meta>의 내용입니다

  • <meta> 요소는 SEO를 위한 meta 요소와 오픈 그래프로 나눌 수 있습니다.
  • SEO를 위한 meta 요소는 name 속성을 사용하며, 구글같은 사이트에서 SEO를 위해서 사용하는 것이 목적입니다.
  • 오픈 그래프는 페이스북같은 소셜 미디어에서 웹 페이지의 정보를 노출시키기 위한 메타 데이터입니다.

 

SEO를 위한 meta 요소

<meta name="속성값" content="내용" />

 

name 속성값 설명
description 콘텐츠에 대한 간략한 설명입니다. 검색 결과에서 제목 밑에 뜨는 내용을 생각하시면 됩니다.
keywords 웹 페이지의 관련 키워드들을 나열할 때 사용합니다.
author 콘텐츠의 제작자를 표시합니다.

 

오픈 그래프 (open graph)

<meta property="속성값" content="내용" />
property 속성값 설명
og:url 페이지의 표준 URL입니다.
og:site_name 사이트의 이름입니다.
og:title 콘텐츠의 제목입니다.
og:description 콘텐츠에 대한 간략할 설명입니다. 검색 결과에서 제목 밑에 뜨는 내용을 생각하시면 됩니다.
og:image 미리보기로 표시될 이미지입니다.
og:type 콘텐츠 미디어의 유형입니다. 기본 값은 website로, video, music 등의 유형을 표시할 수 있습니다.
og:locale 리소스의 언어로, 기본값은 en_US입니다. 한국은 ko_KR입니다.

 

 

3.<hgroup> 요소

  • <h1>~<h6>까지를 의미하는 요소로, 콘텐츠의 제목을 표시하는 용도입니다.
  • 이런 요소는 중요한 내용을 포함할 가능성이 높기에 검색엔진에서 <hgroup> 요소의 내용을 중요하게 취급합니다.
  • 때문에 콘텐츠를 작성할 때 핵심 키워드를 의식해서 <hgroup> 요소에 넣어주는 것도 SEO에 도움이 됩니다.

 

 

'개발 > HTML,CSS' 카테고리의 다른 글

웹 접근성  (0) 2023.04.27
웹 표준  (0) 2023.04.25
storybook  (0) 2023.04.19
Styled Components  (0) 2023.04.18
Component Driven Development  (0) 2023.04.18
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2025/07   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
글 보관함