찜 : 에디터 사용법
이름 : 어복민
블로그 포스팅 주소 : http://fishabm.tistory.com/177
역할 : 필진

Blogger's Survival  
- 블로거들이 모여 하루만에 블로그 입문서 쓰기 출판2.0 프로젝트


1. 에디터 소개
2.
네이버 블로그가 제공하는 Smart Editor 활용해보기
3. 다양한 에디터 활용해보기


----------------------------------------------------------------------


1. 에디터 소개

안녕하세요 에디터 사용법 Part를 집필하게 된 어복민 입니다.
양정훈 님의 블로그에 첫 번째 글을 써보자를 모두 읽으셨죠? 글을 무엇을, 어떻게 써야 할지를 배우셨으니 이제 실제로 블로그 글을 올려야 할 순서입니다^^ 블로그나 웹 기반의 문서의 장점이 무엇인가요? 단순히 글로만 표현하는 것이 아니라 이미지, 동영상 등의 멀티미디어로 표현할 수 있다는 것~ 그리고 나아가서는 링크 트랙백 등으로 연결될 수 있다는 것^^ 글은 잘 쓸 자신이 있는데 이런 표현들을 어떻게 쉽게 하냐고요? 걱정하지 마세요. 바로 편집기를 활용하면 되니까요.

 에디터가 무엇일까요? 영어로하면 editor 로 편집하다 라는 edit 에 or 을 붙여 편집기라는 뜻입니다. 잘 이해가 안되신다구요^^; 그럼 영어 공부를 조금 더 하시기 바랍니다.(농담입니다. 쿨럭..)  블로그에서 글을 쓸 때에도 글자의 크기를 키우거나, 밑줄을 긋거나 또는 중간으로 정렬을 하거나 사진을 첨부하거나~ 이런 모든 것들을 손쉽게 해주는 프로그램이 에디터 입니다. 에디터에는 텍스트 기반의 텍스트형 에디터와 브라우져에서 그대로 출력되는 위지윅(WYSIWYG) 방식의 에디터가 있습니다. 우리가 블로그에서 글을 쓸 때에는 위지윅 방식의 에디터를 사용하게 됩니다.

 위지윅이란 What you see is what you get 의 약자로 본 것대로 얻는다라는 뜻입니다. 즉 우리가 편집기를 사용해서 글에 밑줄을 긋거나, 다른 웹사이트에서 이미지를 복사해와서 붙일 때 또는 동영상을 삽입시키고 글을 포스팅하면 우리가 눈에 보여지는 대로 편집한 것이 그대로 볼 수 있게 해주는 것입니다. 홈페이지를 만들어보시지 않고 그냥 블로그를 시작하신 분들에게는 당연한 것 아니냐고 느껴질 수 있겠지만 원리를 이해하는 것이 중요합니다.
HTML 파트에서 더 자세히 다루겠지만 우리가 웹브라우져를 통해서 보는 모든 화면은 HTML로 이루어져 있습니다. 텍스트형 에디터는 이 HTML을 직접적으로 편집하는 편집기 입니다. 쉽게 이해해서 메모장을 생각하면 되는데요, 메모장을 통해서 간단한 HTML 소스를 만들 수는 있지만, 메모장에 비쥬얼하게 사진을 붙여 넣을 수는 없겠죠?

 이 책을 읽으시는 분 중에 설마 이메일을 한 번도 사용해보시지 않은 분은 없으시겠죠? 이메일 쓰기 버튼을 눌러서 이메일을 쓰다보면 텍스트 사이즈와 색상을 조절할 수 있는데 이것도 위지윅 에디터 입니다^^ 그럼 지금부터는 실제로 에디터 사용을 익혀보도록 하겠습니다.

2. 네이버 블로그가 제공하는 Smart Editor 활용해보기

 아마도 네이버와 티스토리 블로그를 가장 많이 활용하실 터인데요, 편집기 사용은 네이버 에디터로 설명하고 HTML에 대한 설명은 티스토리 에디터 사진을 활용하겠습니다.

 먼저 네이버 블로그에서 포스트쓰기 버튼을 눌러서 편집 화면으로 들어옵니다.  그러면 아래 사진과 같이 위지윅 에디터를 보실 수 있으며 맨 위에 Smart Editor 라는 글이 보이네요~  아! 네이버에서는 Smart Editor 라는 위지윅 에디터를 제공하는구나! 하고 모두 이해하셨죠?
 

그럼 네이버의 Smart Editor 가 어떤 에디터인지 한 번 ?를 눌러서 살펴보겠습니다.


 앞으로 블로그를 꾸준히 활용할 분이라면 꼭~ 이 에디터에 대한 내용을 자세히 읽어보시길 권장드립니다. 블로그별로 제공하는 에디터의 특성이 틀리기 때문에 자신이 표현하고자 하는 컨텐츠를 원하는 데로 포스팅하기 위해서는 이 편집기를 정확히 이해하시는 것이 꼭 필요합니다^^


고화질 동영상 업로드 기능도 있고 정말 다양한 기능들이 있네요~ 서비스 업체 별로 이런 기능들이 꾸준히 업데이트해주고 있습니다

 자 그럼 smart editor를 실제로 사용해서 편집한 사진을 볼까요?


 "불로고수의 위키방식의 새로운 시도! 정말 좋습니다"를 궁서체로 바꾸고 크기를 18로 적용했습니다.
  "함께 하게 되어서 정말로 기쁘네요~" 를 진하게 적용하고 크기를 18로 적용했습니다.
  밑에 사진은~ 사진탭을 눌러서 사이즈를 작게 조절해 보았습니다.

여기까지 모두 이해 하셨죠? 이해 안되신다구요?
이해 안되시는 분은 저에게 개인적으로 연락주세요 ㅋ


3. 다양한 에디터 활용해보기

여기서는 다양한 에디터를 활용하는 팁에 대해서 설명드리겠습니다. 블로그를 운영하거나 메일을 사용 하거나 다양한 서비스를 이용하신 분은 이런 생각을 해보셨을 것입니다. 혹시 네이버 편집기에서 편하게 사용했던 기능을 티스토리에서도 사용할 수 있을까? 방법이 있습니다^^
HTML 챕터를 보시면 더 자세히 이해하실 수 있게 되시겠지만 에디터를 활용하는 차원에서 설명을 드리겠습니다.
에디터가 HTML 소스로 되어있기 때문에 네이버 편집기의 HTML 소스를 티스토리 편집기로 가지고 오기만 하면 됩니다.

예를 한가지  들어보겠습니다. 네이버 스마트 에디터에서는 표 삽입 이라는 기능이 있습니다. 티스토리에도 있지만^^ 그래도 우리는 공부를 하기 위한 것이니까... 네이버에서 표 삽입기능을 활용해서 표를 만들고 그대로 마우스를 드래그해서 복사를 합니다. 그런 후에~ 티스토리 에디터에 붙여넣기를 해보겠습니다.

네이버 에디터에서 표 삽입 기능을 사용해서 표를 삽입 그리고 그대로 복사^^ (마우스로~)
 or 전체선택(ctrl + a) 후 복사 (ctrl + c)
그 다음에 티스토리 편집기에서 붙여넣기를 해보자~~ 그럼 아래 그림과 같이 그대로 표가 복사되는걸 볼 수 있다.

자 모두 성공 하셨죠?

단지 네이버와 티스토리의 예만 들었지만 ~ 이 방법은 모든 블로그와 이메일 등 웹페이지에서 활용이 가능합니다. 예를들어 인터넷사엥 너무 좋은 내용이나 예쁜 그림들이 있으면 드래그해서 복사를 한 뒤에 블로그 편집기에 붙여보시기 바랍니다 그러면 좀 더 다양한 글쓰기를 할 수 있을 것입니다^^ 거꾸로 생각하면 블로그 에디터에서 내용을 예쁘게 꾸며서 이메일로 보내는 것도 가능하겠죠? 상상력을 키워보시구요~~

 앞으로 미래에는...
what you see is what you get 이 아니라 ...

what you imagine is what you get
와 같은 더 좋은 에디터들이 등장하지 않을까요? ^^



Writer profile
author image  백성들에게 복을 나누어주라는 이름의 어복민[魚福民] 입니다.
  제 소원은 복을 유통하며 사는 것입니다.
  유통이란 좋은 것을 널리 전하는 것인데요, 제가 유통하고자 하는 복이
  우연히 일어나다란 뜻의 happen이 어원인 행복(happiness)이 아니라
  피흘리다라는 뜻의 bleed가 어원인 축복(blessing)이 되길 기도합니다.
  http://shareblessing.com
                       IT분야에 관심이 많으며 현재 KT 미디어본부에서 근무하고 있습니다^^
2009/04/18 13:50 2009/04/18 13:50
Posted by 어복민

댓글을 달아 주세요

  1. Favicon of http://e-nter.tistory.com 김거전 2009.05.09 04:19  댓글주소  수정/삭제  댓글쓰기

    이렇게 알려드리면 될까요? ^^;