마크다운을 이용한 블로그 글쓰기

마크다운

우리는 블로그에 글을 쓸 때 블로그에 탑재된 에디터를 사용합니다. 블로그 에디터는 글자를 굵게 하는 등 서식을 이용할 때에는 마우스를 이용해야 합니다. 특히 전문적인 글이나 고도의 집중을 요구하는 글은 마우스에 손이 가면서 집중이 흐트러지게 되지요. 그래서 키보드 타이핑만으로도 어느 정도 서식이 가능하도록 해주는 언어가 바로 마크다운입니다. 최근 워드프레스나 티스토리 블로그에도 마크다운 기능을 탑재하면서 글쓰기 환경이 좋아지고 있습니다. 몇 가지 문법을 배우는데 시간이 걸리지만, 쉽게 배울 수 있으니 한번 배워서 사용해 보는 것은 어떨까요?

마크다운 에디터 중 하나인 아톰(ATOM)을 사용하여 이 글을 작성했습니다.

---

마크다운이란?

마크다운

위키백과(마크다운)는 아래와 같이 설명합니다.

마크다운(markdown)은 일반 텍스트 문서의 양식을 편집하는 문법이다. README^{설치방법이나 사용법을 적어 놓은 문서} 파일이나 온라인 문서, 혹은 일반 텍스트 편집기로 문서 양식을 편집할 때 쓰인다. 마크다운을 이용해 작성된 문서는 쉽게 HTML 등 다른 문서 형태로 변환이 가능하다.

존 그루버는 2004년 에런 스워츠와 협업을 통해 마크다운 언어를 만들었으며, 사람들이 읽기 쉽고 쓰기 쉬운 플레인 텍스트 포맷을 사용하여 HTML로 변환이 가능하도록 노력했습니다. HTML(Hyper Text Mark-up Language)은 웹 페이지를 작성하기 위한 언어인데 일반인이 사용하기에는 복잡한 구조를 갖고 있습니다. 마크다운을 이용해 작성한 문서는 복잡한 HTML로 변환이 가능하게 해 줍니다.

마크다운은 깃헙(Github)과 워드프레스(Wordpress)등 에서 많이 쓰이며 최근에는 티스토리 블로그에서 마크다운을 지원하기 시작하며 주목받고 있습니다. 마크다운을 소개하는 이유도 티스토리 블로그에서 지원하기 시작했기 때문입니다.

사실 우리가 자주 사용하는 에버노트에서도 약간의 마크다운 문법을 지원합니다. 글머리 기호(*)를 만들거나 수평 괘선 (--- 혹은 ***) 삽입 등이 있습니다.

마크다운 에디터 작성화면

결과물

---

마크다운 문법

마크다운은 개발자가 아닌 우리와 같은 일반인에게는 어려울 수도 있습니다. 하지만 몇 가지 문법만 알아도 편리하게 사용할 수 있으니 몇 가지만 알아보겠습니다.

헤더

'# '을 입력하면 헤더(제목과 소제목 등)로 서식을 지정할 수 있습니다. 반드시 #을 입력하고 띄어쓰기를 해야 합니다. 최대 6단계까지 가능합니다.

# 1단계 헤더

1단계 헤더

## 2단계 헤더

2단계 헤더

###### 6단계 헤더

6단계 헤더

인용문

'> '를 입력하면 인용문을 작성할 수 있습니다.

>인용문입니다.

인용문입니다.

번호 매기기

'1. '을 입력하면 번호를 매길 수 있습니다.

1. 첫번째
2. 두번째
3. 세번째

수평 괘선

'---' 혹은 '***'을 입력하면 수평선이 삽입됩니다.

---

강조

'*'와 '_'를 사용하여 '굵게'와 '기울여 쓰기'가 가능합니다.

*기울이기*' / '**굵게**' / '***굵게와 기울이기***

기울이기 / 굵게 / 굵게와 기울이기

링크

링크를 만들 수도 있습니다. 티스토리 블로그에 적용하는 경우 현재 창에서 링크를 열어줍니다. 새창으로 링크를 열 경우 HTML이 필요합니다.

'[표시할 글](주소)'

[티스토리로 바로가기](https://tistory.com) 이렇게 입력하면, 아래와 같이 결과가 나옵니다.

티스토리로 바로가기

이미지 삽입하기

이미지를 삽입할 수 있습니다. 이미지는 좌측 정렬 밖에 안되며 크기나 캡션을 넣을 수 없습니다. 정렬이나 크기, 캡션을 넣고자 하는 경우 HTML을 이용해야 합니다. 주소는 이미지 확장자인 png나 jpg 등으로 끝나야 합니다.

''

 이렇게 입력하면, 아래와 같이 결과가 나옵니다.

주석을 사용하여 링크와 이미지를 간단하게 삽입하기

매번 주소를 입력하기 귀찮고 같은 주소를 여러 번 사용한다면 '( )'대신 '[ ]'를 이용하여 간단하게 링크와 이미지를 삽입할 수 있습니다. '[ ]'의 위치는 상관없습니다. 단 오타가 나면 안 됩니다.

링크

'[표시할 글][텍스트]'
'[텍스트]: https://tistory.com'

이미지도 동일합니다.

'![마크다운][마크다운 로고]'
'[마크다운 로고]: https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Markdown-mark.svg/220px-Markdown-mark.svg.png

마크다운을 티스토리 블로그에 사용하기

티스토리 블로그 글쓰기의 자체 에디터에서 마크다운을 선택하여 글을 써도 됩니다. 혹은 별도의 마크다운 에디터를 원하시는 분들께는 Typora, Atom, Haroopad 등을 추천합니다. 별도의 마크다운 에디터를 사용하는 경우, html로 변환(혹은 복사)하여 html로 붙여 넣으면 됩니다.

티스토리 블로그에서 마크다운을 선택하여 글을 쓸 수 있습니다.

마치며

맥 사용자들에게는 마크다운은 익숙한 언어입니다. 맥 유저에게 인기 있는 글쓰기 앱인 베어(Bear)나 율리시스(Ulysses)에서 마크다운을 기본적으로 지원하고 있기 때문입니다. 필자는 아톰(ATOM)을 이용하여 마크다운과 간단한 hthml을 섞어 이 글을 썼습니다. 여러분도 한번 마크다운으로 블로그 글을 써보는 것은 어떨까요?