UI&사용성 이야기/불편함,사용성

다음 파워에디터 불만

MIRiyA☆ 2009. 2. 11. 16:48

다음 파워에디터가 진짜 개떡같아서 매번 불을 뿜곤 하는데,

이 띵한 녀석은 이미지를 올리기만 하면 지 멋대로 태그를 수정해버린다.



[img src="https://t1.daumcdn.net/cfile/cafe/1432261A4992679297" usemap="#linker" /]


이런 소스를 집어넣으면



[img src="https://t1.daumcdn.net/cfile/cafe/1432261A4992679297" border="0" hspace="1" vspace="1" class="tx-daum-image" actualwidth="700" width="700" usemap="#linker" /]


이렇게 지 맘대로 vspace="1" hspace="1"를 쑤셔넣어버린다. 멀쩡한 이미지에 가로세로로 1px씩 공간을 줘버리니, 연속된 이미지를 슬라이스로 올릴 경우 그 가운데게 합쳐 2px의 흰 가로선이 그어지게 되고, 세로로 붙였을 경우 2px의 흰 세로선이 그어지게된다.



일단 이렇게 보여지는 이미지가...




실상은 이런식으로 레이아웃이 어긋나있다. 그나마도 저건 비슷한 색으로 bgcolor 사용해서 감춰놓은거다.

전부 다 다음 파워에디터가 vspace랑 hspace라는 불순물을 첨가해서 일어난 일이다.


저거 뿐인가? 별게 다 나타난다.



이렇게 소스를 넣으면,



이렇게 바꿔버린다.




이렇게 나와야 하는것을..



이따위로 만들어버리니 속이 안뒤집히나. 역시나 가로세로로 한칸씩 어긋난다.

그리고 오지랖도 넓다. 동영상 사이즈까지 막 바꾼다.


수정 눌러서 다시 에디터 HTML모드에서 vspace랑 hspace를 지워버리거나, 0으로 수정하고 저장하면 다시 지 멋대로 1로 지정해버린다. 이게 대체 뭐하는 짓이야! 정말 에디터 맘에 안든다.



[ㅁㅁㅁ]

    [ㅂㅂㅂ]

        [b]

        ㅇㅇㅇㅇ

        [/b]

    [/ㅂㅂㅂ]

[/ㅁㅁㅁ]


드림위버 같은데서 이런식으로 탭으로 깔끔하게 줄 맞춰놓은 소스 집어넣으면, 전부 다 공백 제거해서 빽빽히 소스를 붙여버린다.



[ㅁㅁㅁ][ㅂㅂㅂ][b]ㅇㅇㅇㅇ[/b][/ㅂㅂㅂ][/ㅁㅁㅁ]


이게 한줄 두줄이지 여러줄 길게 넣어놓으면 어쩌라고 정말..

다음 파워에디터로 HTML을 열어보면 정말 무슨 복마전 팬더모니엄에 들어온 느낌이다. 얘가 내 소스를 얼마나 꼬아놓을지, 얼마나 일을 훼방놓을지 눈앞이 깜깜.. 왜 텍스트큐브 쓰는 개발자들이 위지위그 에디터 놔두고 일반 HTML 에디터를 선호하는지 알만하다.


자, 내가 사용한 해결방안이다. 이런식으로 썼다.



[img src="https://t1.daumcdn.net/cfile/cafe/1516171B49926D94DC" /]

[img src="https://t1.daumcdn.net/cfile/cafe/1116171B49926D94DD" /]


이 소스를 제대로 보여주기 위해


[DIV style="BACKGROUND-IMAGE: url(https://t1.daumcdn.net/cfile/cafe/1516171B49926D94DC); MARGIN: 0px; OVERFLOW: hidden; WIDTH: 700px; HEIGHT: 850px; float:left"][/DIV]

[DIV style="BACKGROUND-IMAGE: url(https://t1.daumcdn.net/cfile/cafe/1116171B49926D94DD); MARGIN: 0px; OVERFLOW: hidden; WIDTH: 700px; HEIGHT: 850px; float:left"][/DIV]


이런식으로 DIV에 백그라운드로 넣어버렸다. 이러면 이 무시무시한 파워에디터가 참견하지 않겠지!




그리고 글상자 기능 추가하고 테스트나 좀 해보는지.. 뭐 맨날 쓸때마다 위나 아래에 이상한 한줄 공백 생기고, 지우지도 못하고.. 나같은 사이코나 이런거 짜증내면서 이야기해주지 일반 유저들은 엄청 불편해하며 계속 쓴다구. 글상자 기능은 전반적인 튜닝이 필요하다. 한 문단 블럭 지정해서 글상자 지정하면, 위아래로 한줄씩 공백 생기고, 이 상태에서 Ctrl+Z를 누르면 오만 이상한 꼴이 다 벌어진다. 아주 이 글상자 뿐만 아니라 앞에 만들었던 글상자 위에도 공백 생기고, Ctrl+Z 누르기 무섭다. 누르면.. 실행취소가 아니라 상황악화를 시키니 말이다.



또.. 글상자 쓰다보면 이런식으로 왜 밑줄 버튼이 활성화되어있는지 알수가 없다. 대체 저게 뭐야..-_-;


그것 뿐인가? 들여쓰기 기능 이건 정말 끔찍하다. 글 쓰다가 실수로, 혹은 메모장에서 쓰던 버릇대로 Tab 키를 누르거나 하면 공포의 들여쓰기 출현. 지금에서야 내가 Shift+Tab을 누르면 들여쓰기를 해제하는걸 알았지, 들여쓰기 지우는 방법을 몰라서 백스페이스 연타하면 윗문단까지 들여쓰기가 올라가는데, 이때 기분 정말 가관. 뭔가 내 글에 치사율 100%의 바이러스가 번져나가는 느낌이다.

백스페이스 몇번 누르면 들여쓰기가 지워지도록 만들어주길.


그리고, 워드나 한글을 비롯한 대부분의 모던한 에디터들은 양쪽정렬이 디폴트인데, 이놈의 다음 에디터는 맨날 왼쪽 정렬이 디폴트다. 그래서 문단이 길 경우, 오른쪽 끝이 쥐뜯어먹은것처럼 흉하기 일쑤. 그리고 나는 항상 양쪽정렬 눌러놓는데, 이미지를 첨부하거나 해서 뭔가 글에 변동사항이 있으면 다시 왼쪽정렬로 회귀해서 사람 열받게 만든다. 에디터 기본 정렬 디폴트 설정을 양쪽정렬로!



- 함량 미달 다음 블로그 내부 검색

- 10월 16일자 다음블로그 개선 요청사항 정리

- 센스있는 버튼 배치 vs 센스없는 버튼 배치


그리고 예전부터 골백번 세번이나 이야기해왔던 에디터 버튼의 클릭 영역은 언제까지 저렇게 놔둘건지!




버튼 클릭 롤오버 영역이 이렇게 지정되어있다.

픽셀 계산해보니까, 가로 52px, 세로 30px의 버튼에 텍스트 부분 코딱지만한 링크를 쎄워놔서 가로 39px, 세로 15px만 걸어놨다. 면적을 재어보니 원래 1,560px의 버튼을 만들 수 있는데 585px만 클릭할 수 있게 해둔거다. 그러니까, 본래 면적의 37.5%만 클릭 가능하게 열어놨다는 말. 후아... 제발. 다음은 포탈이다. 무수히 많은 유저들이 사용하니 일단 버튼 사이즈는 좀 실버에 맞게 크게 만들어주면 안될까.. 맨날 클릭하는데 불안불안하고 거슬린다. 사진/동영상 구분은 필요하니 서로 4px 정도 떨어뜨려 놓더라도.. 정말 위아래 양옆으로 2px만 영역을 넓혀도 훨씬 편리할것이다.



이 글 안봤으면 좀 보고! 다음블로그 가로스크롤 & 이미지 첨부



그리고, 이 글 보면서 또 한번 폭발하는데, 아니 정말 기본적으로, HTML소스를 HTML모드에서 넣어야 HTML소스고, 에디터 상태에서 집어넣으면 그냥 문자열로 인식해야할거 아냐? 위 예제에 쓴 소스를 모두 HTML 소스로 인식해버린다. 그래서 어쩔수 없이 '<', '>' 표를 모두 '[', ']' 로 바꿔버렸다. 옆동네 네이버 블로그 가서 스마트 에디터로 실험해보니 걔들은 다 잘나오더만!! [http://blog.naver.com/cruxsoft/140062858256]


나는 오늘도 다음 블로그 사용하면서 황무지에 곡괭이질을 한다.



위에 쓴 글 요약!

1. HTML소스를 에디터에서 입력하면 문자열 그대로 인식하게 가만 놔둘것! (문자열 처리는 완전 기본아냐)

2. 이미지 첨부시 소스 멋대로 꼬아놓지 말것! 특히 vspace, hspace 이거 완전 혐오함.

3. Ctrl+Z 누를때 오작동하는거 다 잡아줄것

4. 글상자 사용시 밑줄 버튼 활성화 문제, 글상자 위아래 여백 문제 다 잡아줄것

5. 첨부 버튼 영역 클릭 면적 확대해줄것

6. 양쪽정렬 디폴트 지정해줄것

7. 들여쓰기 백스페이스로 취소할 수 있게 해줄것

8. http://blog.daum.net/miriya/15600684 이것도 추가!