워드프레스의 새로운 구텐베르크 편집기를 사용해 보다.

Updated on 2018-08-14 by

구텐베르크에 대한 궁금증에 설치해 보다

조금 오래전에 해커님과 워드님이 워드프레스 5.0에 구텐베르크라는 새로운 편집기가 들어간다는 글을 포스팅했길래 어떤 것일까 궁금했다. 해커님은 이 편집기를 뮬런버그가 독재적으로 적용을 밀어부치고 있어서 워드프레스가 분열 위기에 처해있다고까지 해서 궁금증은 더욱 커졌다..

그러다가 워드프레스 4.9.8에 워드프레스 편집기로 구텐베르그를 설치해 사용해 볼 수 있다고 공지가 떴길래 며칠 후 설치를 하고 몇개의 글을 작성해 보았다.

 

워드프레스의 새로운 구텐베르크 편집기를 사용해 보다. 1

워드프레스 사용자 경험에 대한 고민

그동안 워드프레스 사이트의 사용자 경험에 대한 고민을 많이 하고 있었다.

워드프레스를 통해서 관련 글들을 포스팅하고 있는데 이게 최선의 포맷인지? 아니면 다른 대안이 있을 것인지? 정말 워드프레스를 떠나서 다른 CMS로 정착하는 것은 정말  쉽지 않은 일이다.

뭔가를 새롭게 시작한다는 것은 생각외로 어마 어마한 에너지와 시간을 필요로 한다. 이제 어느 정도 안정이되고나니 움직이는게 쉽지는 않다. 그래서 가능하면 워드프레스내에서 가능성을 찾고 싶다.

보다 감각적인 콘텐츠를 원하는 아이들

갈수록 사람들은 텍스트을 읽지않고 보다 감각적인 이미지와 동영상에 경도되어 가고 있다. 요즘 애들을 글 자체를 읽지 않는다고 한다.

어떤 페친의 글을 보면 요즘 아이들은 영상 중심으로 맥락을 이해하기 때문에 글을 읽어도 독해가 쉽지 않다고 한다.  글에서 주장하는 맥락을 제대로 이해하지 못하고 캐치하지 못하는 것이다.  

아래 사진은 동네 이마트 서점에서 아이들은 담을 사진이다.  서점에 온 아이들은 너나 할 것 없이 스마트폰으로 게임과 동영상을 보기에 여념이 없다.  서점인데도 말이다. 서점에서 책을 보는 이들은 몇명되지 않은 어른 몇명뿐.. 그것도 아이들에게 무슨 참고서를 사줘야하나 고민하면서 참고서 종류를 보고 있다.

이마트 서점에서 스마트폰에 몰두해 있는 아이들, 이미지 - happist
이마트 서점에서 스마트폰에 몰두해 있는 아이들, 이미지 – happist

어떤 사용 경험을 주어야 할까?

이런 트렌드에서 블로그가 살아 남는 길은 무엇일까?  같은 글이라도 좀 더 매력적으로 보일 수 있도록, 더 나은 사용자 경험을 줄 수 있는 방법은 무엇일까?

당분간 광고를 유지해야 한다면 광고와 콘텐츠를 조화시킬 수 있는 방법은 무엇일까?   오래동안 글을 쓸 수 있도록 안정적인 수익원을 만들 수는 없을까?

이런 저런 고민에 대한 솔류션을 어디에서 찾아야 할까? 근본적인 솔류션을 주지는 못하지만 보다 나은 사용자 경험을 줄 수 있는 방법이 있지 않을까?

워드프레스의 새로운 구텐베르크 편집기를 사용해 보다. 2

이제는 예전보다는 콘텐츠를 작성해 놓고 그것을 보다 읽기 쉽게 편집해주는 작업에 신경을 써야한다는 결론에 이른다. 당장 텍스트가 동영상과 같은 경험을 주기는 어렵지만 블로그가 가진 다양한 포맷을 담아내는 장점을 십분 발휘한다면 그리 나쁜 선택은 아닐 것이라는 생각이 든다.

당장 내가 워하는 기능이 무엇일까?  솔직히 당장 구현하고 싶은 것은 뉴욕타임즈와 같은 포맷이다.  이는 미디엄에서 제공하고 잇는 포맷과도 같지만 뉴욕타임즈는 그런 포맷을 광고와 많이 매칭을 시켰다는 느낌이므로 시범적으로는 뉴욕타임즈와 같은 방식으로 구현하는 방법을 찾아 보려고 한다.

테마에서 답을 찾아 보려고 시도하다

그래서 여러가지 테마를 살펴보고 있다. 특히 Divi 테마는 내가 원하는 조건을 일부 충족할 수 있을 것 같아 관심이 갔다.

특히 이렇게 생각한 이유는 Divi 테마를 이용해서 미디엄 스타일 블로그를 만들 수 있다는  포스팅을 보고나서 였다.

워드님의 도움을 받아 몇번 시간을 투입해 이 기능을 적용해보려고 했는데 결국 포기하고 말았다.
Divi 편집기 사용에 익숙하지 않아서이겠지만 글을 작성하기가 쉽지는 않았다.

우선, 그냥 일반 편집기에 이 가는데 생각보다 복잡하고, 많은 단계를 거쳐야 했다.  일반 편집기에서 글을 쓰는 것은 보다 글쓰는 것에 집중하도록 되어 있는 데 Dici 편집기는 형식에 신경을 쓰면서 부차적으로 글을 쓴ㄴ 것 같다는 생각이 들었다.

그리고 제안하는 미디엄 스타일에 내가 원하는 요소들과 결합하다보니 제대로 구현이 안되었다. 그 결과도 마음에 들지 않았고.

마지막으로 이 결과물들이 HTML과 호환이 될까라는 질문에 확신이 없었다. Divi 테마를 천년 만년 쓸 수 없을 것이니 Divi 테마없는 상태에서도 제대로 작동하는 그런 편집기를 원했다.

사람들은 거의 1년에 한번 정도는 테마를 바꾸는 것 같다.  그럴때마다 내용들을 전부 뜯어 바꿀 수는 없지 않을까?

예븐 조약돌
예쁜 조개돌, Image – annie spratt

구텐베르크 편집기는 Divi 편집기나 컨셉은 비슷한 듯

Divi 편집기 사용을 포기하고 구텐베르크 편집기를 설치해 사용해 보고 있는데, 문득 이 구텐베르크 편집기나 Divi 편집기나 컨셉은 비슷하다는 생각이 들었다.

구텐베르크 편집기가 블럭이라는 개념을 도입하고 이 블럭을 이리 저리 편집해 콘텐츠의 경험을 개선시키듯이 Divi 편집기도 Section가 Rows 그리고 Modules 개념을 사용하 있다. 이러한 요소들을 Drag&Drop해서 문서를 만든다.

Divi가 오랬동안 발전해와서인지 굉장히 복잡하고 다양한 기능을 지원해 준다. 그 반작용으로 나같은 초보자가 쉽게 적응하기가 녹녹치는 않았다.  아마 체계적으로 배웠으며 문제는 달라졌으리라.

구텐베르크 편집기에서 제공하는 Sample 글을 보면 여기서는 divi에서 구현하려는 것들을 대부분 구현할 수 있을 것 같다. 특히 이미지는 넓게하고 텍스트부분은 좁게 구성하는 방법이 가능한듯한데 최종에서는 구현이 안된다. 

구글을 잠간 검색해보니 지금 완성하고 있는 구텐베그크 편집기를 오랬동안 사용한 사람이 경험담을 올려 장단점을 이야기한 글이 있다.  같은 고민을 한다면 참고해볼만하다.

Diving Into the New Gutenberg WordPress Editor (Pros and Cons)

워드프레스에서 어떻게해야 이미지는 넓게 배치하고 텍스트는 좁게 화면을 구성할 수 있는지  아시는 분은 알려주면 좋겠다.

마크다운 편집기의 한계

그동안 하나패드라고는 마크다운 편집기를 사용해 글을 작성하고 이를 워드프레스에 한꺼번에 복사해 입력하는 방식을 사용했다,  마크다운에서 간편하게 HTML 요소들을 적용할 수 있어서 상대적으로 빠르게 문서를 작성할 수 있었다.

더우기 하나패드는 작성하는 내용 그대로 웹에서 어떻게 보여질지 바로 보여주므로 상대적으로 편집하기가 쉬웠다.

그러나 시간이 가면서 다양한 포맷을 입력하다보니 하나패드를 비롯한 마그다운 편집기 한계가  계속 드러나고 있다. 

예를 들어 이미지에 캡션을 넣고 하루패드 문서를 작성 후  HTML로 변환하면 캡션부가 사라저 버린다.  그리고 PDF와 같은 문서를 삽입 시 embeded 명령을 사용하는데 마찬지로 하루패드에서 HTML 변환 時 코드 앞에 <p>등을 자동 생성해버린다.  그러면 워드프레스에서는 이를 PDF 문서로 인식하지 못한다.

이런 문제가 있기 때문에 마크다운 편집기로 작성해 HTML로 변환해 붙여넣고, 다시 제대로 반영이 안되는 부분은 찾아서 다시 수정하는 작업을 하다보니 오히려 작업 시간이 많이 걸렸다.  원래 글쓰기에 집중해 작업 속도를 높이겠다는 것이 마크다운 편집기의 목표였는데 이제는 환경 변화를 따라가지 못하는 형국이다.

이제는 마크다운 편집기를 보내줄 시간이 되었지 않나 싶다.

워드프레스의 새로운 구텐베르크 편집기를 사용해 보다. 3

마치며, 구텐베르크 편집기의 가능성은 있다

구텐베르크 편집기가 가는 방향을 올바른 길일까?  이에 대한 판단은 이미 시장에는 보다 더나은 경험을 만들기위한 수많은 편집기들이 경쟁하고 있다는 점이다. 현재의 편집기에 만족하지 못한다는 것이다.

그동안 교과서가 시원찮았기 때문에 많은 참고서들이 난립했다면, 이제 교과서 조금 경쟁력있는 방향으로 보완되고 있다는 생각하면 너무 너간 생각일까?

구텐베르크 편집기를 아직 많이 사용해보지 않았다. 그렇기에 뭐라 평가하기는 어렵다. 하지만 아직 기능면서 완전하지는 않지만 접근 방법이 글쓰기에 집중하면서도 풍부한 편집기능을 편리하게 적용할 수 있는 가능성을 있다는 생각이다.

그러나 기존 편집기가 가진고 있던 풍부하고 직관적인 문단과 글자 데코 방법들이 여기선 쉽게 적용할 수 없다  아마 그런 기능이 어디엔가 숨겨져 있지 않을까 싶기도 한데… 아직 몰라서 몰라서 그럴지도 모르겠다.

그리고 상요 가능한 블록도 오른쪽 부분에 배치해 놓아 쉽게 적요할 수 있으면 좋겠다.

그동안 마크다운 편집기로 이용해 글에 들어가는 요소들을 단순화해 작성해온 나에게 구텐베르크 편집기는 크게 부족하지는 않다. 며칠 여기에 익숙해져 보련다. 그러면 답이 나오겠지.

그리고 이 구텐베르크를 적용하면 편집기로 진입 시 시간이 조금 걸린다.  그래서 사람들이 느려졌다고 표현하난 보다. 빠릿빠릿한것보다는 나쁘지만 못 참을 정도는 아니긴하다. 적어도 나에겐… 설마 워드프레스 속도 자체가 늦어지는 것은 아니겠지.

향후 더 사용해 보고나서 최종 결론을 내려보려고 한다.

새롭게 뉴스레터를 시작했습니다.

1️⃣ 주식 등 투자 정보 : 기업 분석, IB 투자의견 등 투자 관련 내용
..... 테슬라 실적 및 IB들의의 테슬라 투자의견
2️⃣ 사례 및 트렌드 : 사례연구와 트렌드 관련 괜찮은 내용
.....유튜브와 경쟁대신 구독 전환한 비디오 플래폼 비메오 사례

서울에 생긴 Vultr 서버 100$ 프로모션

안녕하세요?
새로운 사이트 구축을 위한 신규 서버를 고민하신다면 , 서울 리젼이 생겨 더욱 빨라진 Vultr 서버를 Vultr 100$ 프로모션으로 이용해 보세요.

아래 프로모션 코드 링크를 통해 Vultr에서 서버 구축 후 1달 이상 사용 및 $25이상 결제 時 추가 100$을 주는 프로모션입니다.

Vultr는 서울에도 리젼이 있어 매우 빠르고, 아마존 웹 서비스(AWS)보다 성능이 높으며 가장 가성비가 뛰어납니다.

거기다 사용자 UI도 좋고, 15개까지 스냅샷을 무료로 제공하기 때문에 관리하기 좋습니다. 그리고 지금 100$ 프로모션처럼 가격적인 메리트도 있습니다.

우분투 20.04와 PHP 8 기반 워드프레스 설치 방법

가상 서버를 운영하고픈 勇者에게 전하는 가상 서버 운영 입문 노하우 – Vultr 가상서버호스팅(VPS)를 중심으로

워드프레스 최적화를 위한 18개월간의 고민, 그 노하우를 담다.

도쿄 리젼과 비교해 본 Vultr 서울 리젼 사용기

가성비가 뛰어난 Vultr 가상서버호스팅(클라우드호스팅,VPS) 사용기

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments