novelic
novelic

에디터의 중요성이란

다년 간 소설 관련 홈페이지를 하면서 에디터에 대하여 느꼈던 생각, 그리고 현재 진행형으로 끌어안고 있는 문제점을 라이믹스(XE) 최종 사용자 입장에서 간단히 적어보겠습니다.


통일되지 않는 디자인

컴퓨터로 소설을 쓸 때에 가장 중요한 건 무엇일까요? 사람마다 그 답은 각자 다르겠지만, 백업의 중요성을 낮추어 보는 사람은 아무도 없을 것입니다.

그렇기 때문에 소설 관련 웹사이트를 운영할 때에는 두 가지를 모두 고려해야 합니다. 하나는 바로 이 글을 적는 것처럼 웹 상에서 글을 작성하는 경우, 다른 하나는 워드프로세서에서 초고를 작성하고 에디터에 붙여 넣은 후 약간의 퇴고를 하는 경우입니다. 백업을 최우선으로 여기는 분들은 거의 100이면 100이라고 해도 좋을 만큼 先워드 後복붙을 합니다.

사이트 관리자에게 위가 따가운 스트레스를 주는 건, 후자의 경우입니다.

워드프로세서에서 작성한 글을 그대로 복사해서 붙여 넣을 시에는 눈에 보이지 않는 스타일 속성이 졸졸 따라옵니다. 그렇기 때문에 한 게시판 안에서도 여러 글의 속성이 통일되지 않습니다. 폰트 종류가 다른 건 예삿일이고 줄 간격, 문단 여백, 글자 크기 등등이 제각기 다릅니다. 사이트에서 의도하고 있는 최소한의 글자 크기를 무시하고 제멋대로 깨알 만한 크기로 올라오기도 하고, '혹시 독자들에게 무슨 원한 관계로 있는 걸까?' 싶을 만큼 빽빽한 줄간격으로 읽는 사람에게 피로감을 안겨주는 스타일로 올라오기도 합니다.

단순히 textarea만 사용하면 해결된다고 하지만, 또는 거기에 html을 허용해서 각자 알아서 넣고 싶은 속성을 넣으면 될 일이라고 하지만, 이 세상 어느 누구가 멀쩡한 위지윅에디터를 두고 글을 쓸 때에 일일이 <strong>, <i>, <font-family: nanumgothic>을 넣는 걸 선호하겠습니까.


캡션 기능

(미디엄처럼 이미지 아래에 바로 캡션을 넣을 수 있는 기능이 있으면 좋겠네요)


이 문제를 해결하기 위해서 처음에는 관련 속성을 없애주는 js를 사용하다가, 현재는 '본문 내용 스타일 제거 애드온'을 사용하고 있습니다. 다만 이 애드온은 겉으로 보이는 문제만 해결해주지 원천적인 문제 해결은 되지 않습니다. 여전히 소스에는 번잡한 속성이 다 남아있기 때문이죠.

가장 깔끔한 해결법은 medium과 같이 글을 붙여 넣을 때 일괄적으로 모든 스타일을 날려버리고 plain한 텍스트만 붙여넣기를 하는 것이죠. 

다만 이 방법은 조금 다른 논의점을 불러오게 됩니다.

글을 꾸미는 권력

medium에서는 아주 제한된 스타일과 위지윅에디터 기능을 제공합니다.

(Froala editor에서 지원하지 않는 설정이면 어쩔 수 없겠습니다만, [이미지를 좌측 정렬로 할 시 우측 공간에 텍스트를 쓸 수 있는 아이콘]이 있으면 편하겠습니다. 지금은 이미지 주변으로 글을 쓰는 게 조금 번잡하네요.)

글씨 색상을 바꿀 수도 없고, 줄간격을 조정할 수도 없으며, 모든 폰트는 사이트에서 지정한 속성에 종속됩니다. medium이 이렇게 스타일을 제한시킨 이유는 명백합니다. 모든 글이 구조적으로 쓰여야 하고 동일한 스타일로 작성되어야, 글을 읽는 다양한 사람들에게 동일한 경험을 제공한다는 것입니다.

하지만 글을 쓰는 사람의 의도에 따라서는 이런 스타일 제한이 답답하게 여겨집니다. medium과 같이 정갈한 칼럼 분위기를 사이트 콘셉트로 잡고 있을 때에는 스타일을 극도로 제한할 수 있습니다만, 실상 '내 글을 꾸미고 싶다'는 여러 사용자의 의견을 묵살하기는 어렵습니다. 하지만 그렇다고 해서 위지윅에디터 기능을 모두 풀어버리게 되면 이 글 처음에 제기한 문제점이 발생합니다. 

어느 지점에서는 타협을 해야 합니다.

'내'가 선택하기

Froala Editor는 medium의 정갈한 에디터 기능을 제공하면서도, 붙여넣기를 할 시에는 오른쪽과 같은 선택창이 뜹니다.

에디터 설정 파일에서 'paste를 할 시 물어보지 말고 항상 Clean으로 붙여 넣기'로 설정하는 것이 가능할지는 잘 모르겠습니다. 그래도 최소한 워드프로세서에서 붙여 넣기를 할 때에 이런 식의 선택창이 뜨는 건 사이트 운영자 입장에서 매우 감사한 일입니다. Clean으로 선택하라고 회원 분들에게 부탁을 드리면 되니까요.

'나'의 글이 사이트 스타일을 따라가도록 강제로 제한되는 게 아니라 따라가게 하도록 선택을 할 수 있다는 건, 비슷하면서도 차이가 큽니다. 소설 작성 사이트는 특히 사용자들 머릿수 만큼이나 다양한 스타일 서식을 한 무더기로 끌어안고 오기 때문에(...) [글 디자인을 통일시켜야 한다]와 [각자 쓰고 싶은 디자인은 존중해야 한다]를 양립 시켜야 합니다. Froala Editor와 같이 스타일 제거 선택지를 제공하고, 그 이후에 위지윅에디터 특유의 클릭질로 스타일을 쉽게 수정할 수 있다면, 다량의 텍스트를 작성하고 또 그것을 편집해야 하는 여러 소설 작성자들에게 대단한 만족감을 제공하리라 생각합니다.


이 글을 쓰면서 에디터의 불편한 점은 거의 느끼지 못했습니다. 제가 미디엄을 사용하다 보니 이미지 캡션이나 정렬 부분에 아쉬운 부분이 생기는 것이지, 일반적인 사용자 입장에서는 굉장히 직관적인 이미지 삽입이라고 생각합니다. 

CK editor의 단점 중 하나라면 에디터 상의 아이콘 관리가 좀 복잡하다는 건데요 (사실 XE에서도 에디터 문제는 완전히 손을 놓았죠), Froala Editor를 사용할 때에는 이런 부분은 사용자가 알아서 입맛대로 고칠 수 있는 매뉴얼이 필요할 것 같습니다. 에디터 모드와 인라인 모드가 별도로 돌아가니 주먹구구 식으로 접근했다가는 미로를 헤맬 예감이 드네요.

사족으로 궁금한 점이 있다면, 글 작성 화면의 좌측 하단에 있는 실시간 글자수가 표시되는 게 개인적으로 참 좋네요. 글자수를 작성 화면에서 바로 확인할 수 있는 만큼, 작성 완료된 글에서도 최종 글자수가 표시될 수 있으면 좋겠습니다. 뭐어 이건 에디터가 아니라 게시판 스킨 쪽 부분이니까 제가 감히 부탁을 드릴 부분은 아니겠네요...! 

댓글
현재 댓글이 3 개 달려있습니다.
라르게덴
라르게덴

원하시는 기능이 모두 들어있습니다. 제가 매뉴얼을 아직 준비하지 못했기 때문에 사용법을 모르실 뿐입니다.

우선 figure는 정의되어 있지만 현재 기능상으로는 뺐습니다. 로드맵에서 설명하겠습니다.

이 에디터의 이미지 정렬은 인라인형식, 단락 텍스트 형식과 정렬을 조합하는 방법으로 되어있어서 6가지의 정렬 구현을 가능하도록 합니다. 모두 입맛대로 가능합니다.

워드팝업 없앨 수 있습니다. 이럴경우 클린을 강제합니다. 선택권을사용자에게 넘긴다면 유지하는게 좋습니다.

  • 1
  • 닉네임을 적어주세요.

    두자 이상 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

  • 비밀번호를 적어주세요.

    안전을 위해 가급적 패스워드는
    8자이상으로 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

novelic
novelic

모바일(안드로이드 크롬 브라우저)로 들어와서 보니 이미지가 가로폭은 화면 크기에 맞춰지지만, 세로높이가 폭 따라서 줄어들지 않아서 상대적으로 길쭉하게 되네요. 이미지 삽입할 때에 마우스 드래그로 크기 조정한 것 외에 특별한 설정은 하지 않았습니다. 

이미 리포트가 된 것인지 아닌지 모르겠으니 일단 댓글 남깁니다.

  • 0
라르게덴
라르게덴

크기를 조정하면 height에 값이 들어가게 되기에 max-width 조정만으로는 비율을 정할 수 없어서 그렇습니다.

하지만 원래 그런건 아니고 예전에 이미지 조절시에 height를 지우도록 했었는데 어느순간 froala 개발자분이 다시 height를 정하도록 했나봅니다.

비율 조정 되는 방향으로 수정하겠습니다.

  • 0
  • 닉네임을 적어주세요.

    두자 이상 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

  • 비밀번호를 적어주세요.

    안전을 위해 가급적 패스워드는
    8자이상으로 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

댓글 남기기
  • 닉네임을 적어주세요.

    두자 이상 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

  • 비밀번호를 적어주세요.

    안전을 위해 가급적 패스워드는
    8자이상으로 적어주세요.

    필수 입력 항목 입니다.

    실패했습니다.

당신의 글쓰기를 스마트하게.
글을 써보시겠습니까?

글쓰기

현재 55 개의 글이 작성 되어 있습니다.

Find Account
  • 이메일 주소로 계정 찾기

    아이디/비밀번호는 가입시 등록한 메일 주소로 알려드립니다. 가입할 때 등록한 메일 주소를 입력하고 "ID/PW 찾기" 버튼을 클릭해주세요.

  • 이메일 주소

    이메일 주소 형식이 올바르지 않습니다.

  • 인증메일 재발송

    인증 메일을 받지 못한 경우 다시 받을 수 있습니다.

  • 이메일 주소

    이메일 주소 형식이 올바르지 않습니다.