점점 p 태그가 대세가 되어 가던데..

 

특히 문단 바꿈 기능을 적극 활용해서 엔터를 누르면 문단이 바뀌고 쉬프트+엔터를 눌러야 줄바꿈이 되도록 하는 에디터를 채용 중인 웹사이트도 종종 보이던데요

 

근데 문제가..

 

일단 스케치북의 textarea는(댓글 등) 줄바꿀때 br 태그를 쓰더군요

 

그리고 일반적으로 모바일 게시판들도 (스케치북의 텍스트모드나 기본 모바일 게시판 등, 위지윅 에디터를 사용하지 않는 모바일 게시판 스킨) 줄 바꿀 때 br 태그가 걸리는데

 

어떤건 p 태그고 어떤건 br 태그라서 통일이 안 되고

 

이렇게 br 태그가 걸린걸 에디터로 복사해 보면 그 부분만 br 태그가 걸려 있어서 결과물이 이상해지기도 하고

 

반대로 p 태그 걸린걸 textarea로 복사하면 p 태그가 엄청난 갯수의 br 태그로 변해버리는 참사가 일어나네요

 

그리고 결정적으로... p 태그를 문단 바꿈으로 사용할 경우, 모바일에서 똑바로 안 보이는 경우가 매우 많네요

 

xe 공홈을 봐도 엔터를 한번만 치면 pc에서는 문단 바꿈으로 보이는데 모바일에서는 줄바꿈으로 보여서 글씨가 다닥다닥 붙어서 가독성이 확 나빠집니다

 

반대로 모바일을 고려해서 엔터를 두번씩 쳐 주면 PC로 봤을 때 줄간격이 엄청나게 길어져서 또 가독성이 나빠집니다.

 

물론 문단바꿈으로 안 쓰면 되지만(xe ckeditor의 경우 "권장 서식"은 문단바꿈이 되고 "기본 서식"은 줄바꿈처럼 되더군요) 그럼 br이랑 차이가 없기도 하고

 

암튼 그래서 에디터에 p 태그가 걸리는걸 br 태그로 바꿔주려고 하는데...

 

p 태그가 대세이고 여기저기서 다들 p 태그를 쓰는 걸 보니 함부로 바꾸기가 불안하네요

  • profile

    읽다 보니 어느 태그가 어디에서 어떻게 표시된다는 건지 완전 헷갈리네요 ㅠㅠ

    개인적으로는 p 태그로 문단을 구분하고 br 태그로 문단 내의 줄바꿈을 처리하는 유행에 동의하지만, 이걸 제대로 지원하기 위해서는 당장 XE만 해도 PC와 모바일 양쪽의 지원이 많이 부족합니다. p 태그에 양쪽 모두 동일한 여백을 주는 게 가장 급선무고요... 이건 코어에서 지원해 주지 않더라도 CSS로 직접 수정할 수 있긴 하겠네요.

    기존 글, 다른 곳에서 복사해 온 글, 그냥 textarea로 쓴 글 등을 표시할 때 br 태그가 2개 이상 연속으로 등장하는 경우 p 태그로 바꿔주는 장치 또한 필요하다고 봅니다. 중간에 공백이 들어가거나 nbsp처럼 공백과 같은 역할을 하는 특수문자만 달랑 하나 들어있는 경우도 똑같이 취급해줘야 하고요. 정규식 좀 써야겠네요 ㅎㅎ

    뭘 하든 일관성있게 한다면 문제는 없을 것 같습니다. 여기저기 다 다르니까 문제죠.

  • profile profile
    일단 코어에서는 ck에디터 권장양식? 을 사용하면 P와 BR의 구분이 됩니다....!
  • profile
    이래서 마크다운을 써야 하는데... (딴소리)

    @기진곰 님 말씀처럼, 통일만 된다면 방식이 문제겠습니까. 저는 어떠한 방식이든 일단 통일만 해놓고 나서 스타일을 고치는 것이 낫다고 봐요.