친절한효자손 취미생활

구글 블로거 플랫폼! 현재로서는 좀 엉망입니다. 특히 이미지 업로드가 너무나 불편하기 그지없습니다. 구글 얘들은 왜 블로거에 신경을 쓰지 않는 것일까요? 조금만 신경써주면 너무 멋진 플랫폼이 될 것인데 참 아쉽습니다. 그럼에도 불구하고 틈나는대로 꾸역꾸역 글을 작성하고 있습니다. 뭐든 시작할때가 어려워서 그렇지 인간이란 생명체는 금세 적응을 합니다. 블로거(Blogger)도 지금 거의 생태계를 파악해 나가고 있습니다. 오늘은 블로거 글쓰기에 대한 내용입니다.

 

보통과 단락형식

구글 블로거의 글쓰기 화면입니다. 지금은 상당히 심플하다는걸 알 수 있는데 처음 글을 쓸 때는 뭐가 이리 복잡하고 햇갈렸는지... 참~ 뭐든 첫 걸음이 어려운 법입니다.

 

자! 텍스트를 작성하기 위해서 커서를 활성화 합니다. 클릭 한 번이면 되죠? 그러면 커서가 깜박이게 될 겁니다.

 

여기서 놀라운 사실! 구글 블로거 글쓰기의 기본 옵션은 들여쓰기가 되어있다는 것입니다. 무슨 뜻이냐면 들여쓰기 효과를 연출하기 위해서 첫 텍스트의 앞 부분에는 스페이스바를 한 번 먹인 효과가 적용되어 있다는 것입니다. 문제는 이게 첫 텍스트에만 적용되고 이후에는 들여쓰기 효과는 없습니다. 사용자가 임의로 만들지 않는 한 말입니다. 개인적으로 저는 통일된걸 좋아합니다. 첫 문장만 들여쓰기가 되어있고 이후에 줄줄히 이어지는 문장은 그렇지 않다는것을 용서할 수 없는 것입니다. HTML 모드로 바꿔보시면 위의 스크린샷 이미지처럼 P태그 안에   의 요소가 적용되어 있습니다.

 

따라서 이것을 백스페이스를 눌러 지워버리면 단락 형식이 아닌 보통으로 바뀝니다. 이렇게 바뀌면 어떻게 될까요?

 

보통 상태에서 텍스트를 입력해 보았습니다. 이제 HTML 모드로 바꿔서 살펴보겠습니다.

 

보시는 것처럼 텍스트를 감싸는게 P태그가 아닌 div 태그가 적용되어 있습니다. 물론 div 태그 안에도 텍스트가 들어갈 수 있습니다. 하지만 일반적으로는 그렇지 않습니다. 모든 태그는 쓰임새가 있기 마련이고 보편적으로 div는 레이아웃 구성 때, p는 텍스트를 입력할 때 사용합니다. 따라서 위의 속성은 개인적으로 그냥 넘어갈 수 없는 중대한 문제입니다.

 

처음에는 이 현상에 대한 개념이 전혀 없어서 당연히 모르고 글을 작성했었습니다. 티스토리에서 글 쓰던 습관대로 그대로 작성했습니다.

 

태그 상태를 보면 진짜 엉망입니다. 이렇게 div가 난무한 본문이 되어버리니... HTML 텍스트 문서에서는 이런 엉망 태그는 거의 없습니다. 그러므로 SEO에도 영향을 끼칠 것으로 생각합니다.

 

따라서 반드시 텍스트를 입력할때는 단락 형식으로 되어있는지 확인하시고 텍스트를 입력하시기 바랍니다. 나름 중요한 부분이라고 생각합니다. 초반에 이 증상을 인지하지 못했기에 초창기 글들의 본문을 전면 수정했습니다. 여러분들께서는 처음부터 이런 증상을 인지하시고 한 방에 깔끔하게 작성하시기 바랍니다.

 

이미지는 무조건 보통으로 적용됨

다음은 텍스트 다음으로 활용을 많이 하는 이미지 삽입입니다. 이것도 중요합니다.

 

구글 블로거 글쓰기 모드에서 이미지를 넣은 모습입니다. 일반적으로 이미지들은 「작게」 사이즈로 「중앙정렬」이 되어 본문에 삽입될 것입니다. 이미지 사이는 텍스트가 들어갈 공간은 유지됩니다. 자! 그럼 이미지 사이 공간에 커서를 활성화 해 봅시다.

 

그러면 십중팔구 해당 부분은 보통 상태로 적용되어 있을겁니다. 아까 말씀 드렸죠? 보통은 div로 적용되는 옵션입니다. 이미지들은 기본적으로 보통 상태로 모두 적용됩니다. 만약 이미지 10개를 본문에 넣었다면 처음부터 끝나는 이미지까지 모두 보통으로 적용된 상태로 삽입되기에 이미지 사이 사이도 보통 상태로 적용되는게 아닐까 싶습니다.

 

따라서 이미지 사이에서 텍스트를 사용하려면 반드시 단락 형식으로 변경 후 입력하시는걸 추천합니다.

 

단락 형식으로 변경 후 텍스트를 입력한 모습입니다. 이 상태에서 HTML 태그 상태를 살펴보겠습니다.

 

이미지들은 모두 div로 적용되어 있고 텍스트는 딱 원하던대로 p태그로 감싸여 있음을 알 수 있습니다. 바라던대로 잘 적용되었습니다. 끝.

공유하기

facebook twitter kakaoTalk kakaostory naver band