웹사이트에서 한글입력모드 변경 안되게 하기

November 15, 2011 07:17 PM

CSS에 ime-mode라는 속성이 있다. 사용자의 입력방식(input method editor) 모드를 CSS로 제어하는 속성이다. 쉽게 말해서 사용자가 키보드를 눌러서 한글을 입력할지 영문을 입력할지를 CSS로 제어할 수 있다는 말이다. MS가 IE5에서 처음으로 구현하였고 파이어폭스에서도 구현이 되어 있다. IE8에서는 -ms-ime-mode라는 속성으로 지원하고 있다. 다른 브라우저들은 지원 안한다. 지금 CSS Basic User Interface Module Level 3로 표준화 중에 있다.

몇 년 전에 한국어 웹사이트에서는 사용자 입력의 기본값으로 한국어가 지정되어야 한다고 주장하는 단체가 있었다. 사용자의 입력 모드 설정이 영문이든 한글이든 상관없이 한글로 입력이 되게 '변경'되어야 한다고 하는 주장이다. 나는 사용자의 환경을 임의로 바꾸는 것은 사용자에게 혼란을 줄 수 있기 때문에 옳지 않다고 주장했었다. 하지만 네이버나 파란과 같이 영문으로 설정된 입력모드를 한글로 바꾸는 사이트는 아직도 있다. 뭐, 실제로 영타로 한글입력하는 쿼리가 줄었다든가 하는 데이터가 있으니 유지하는 것이리라고 생각된다. 일부 사용자는 혜택을 볼 수도 있다. 하지만 지금 표준화 중인 스펙에서도 주의하라고 한 것 처럼 불특정 다수를 대상으로 하는 사이트에서 입력모드를 제어하는 것은 사용자를 위하는 기능은 아니다.

Note: In general, it's not appropriate for a public web site to manipulate the IME mode setting. This property should be used for web applications and the like. Authors should not rely on disabling IME to prevent extended characters from passing through a form. Even with IME disabled, users can still paste extended characters into a form's fields.

나 역시도 이 기능때문에 정말 불편하다. 창을 이동하거나 새로 고침 할 때 마다 영문으로 설정되어 있는 입력모드가 자꾸 한글로 바뀌어서 터미널이나 에디터에서 입력을 할 때 자꾸 한글이 입력된다. 맥 오에스의 경우는 플랫폼 전반적으로 통일된 입력모드를 사용할지 어플리케이션 별로 분리된 입력모드를 사용할지를 선택하는 옵션을 제공하고 있다. 어플리케이션 별로 분리를 시키면 일단 터미널에서 'ㅣㄴ -미'같은 명령어를 치는 일은 확실히 줄일 수 있다. Input source options: Use the same one in all documents'과 'Allow a different one for each document'를 선택할 수 있다.

파이어폭스나 오페라같은 브라우저의 경우는 사용자 스타일이라는 기능을 이용해서 사용하는 사이트의 기능을 변경시킬 수 있다. 오페라의 경우는 지난번에 사용자 자바스크립트 기능을 얘기한 적이 있으니 파이어폭스에서 사용자 스타일을 사용하는 방법을 살펴보자.

파이어폭스의 사용자 스타일 파일은 두종류이다. userChrome.css라는 파일이 있고 userContent.css라는 파일이 있다. 유저 크롬 파일은 파이어폭스 브라우저의 외형을 제어하는 파일이고 유저 콘텐츠 파일은 사용자가 사용하는 웹사이트를 제어하는 파일이다. 입력모드 변경은 사이트의 기능을 변경하는 것이기 때문에 유저 콘텐츠 파일을 사용해서 변경할 수 있다.

이 두 파일은 사용자 프로필 폴더에 존재한다. 프로필 폴더의 chrome 디렉토리에 위치한다고 하는데 실제로 프로필 폴더를 열어보면 그 폴더가 없다. 이 파일들의 이름이나 위치에 대해서 다양한 글들을 찾아볼 수 있는데 파이어폭스가 버전이 바뀌면서 조금씩 변경되는 부분인 것 같다. 고민하지 말고 chrome 폴더를 만들고 userContent.css 파일을 만든다. 유저 콘텐츠 파일의 내용은 아래와 같이 넣는다.

input[type=text] {
	ime-mode: auto !important;
}

파이어폭스를 껐다 켜면 더이상 입력모드가 변경되는 짜증나는 일이 발생하지 않는다는 것을 확인 할 수 있다.

Comments

  • donlet 2012-04-09 23:04

    혹시 IE8에서 설정할 수 있는 방법은 없을까요?

  • donlet 2012-04-10 11:04

    찾았습니다.

    userContent.css

    input, textarea {
    ime-mode: auto !important;
    }

    도구 -> 옵션 -> 사용자서식 -> 사용자스타일 시트에 적용해 주면 됩니다^^

  • 신현석 2012-04-10 11:04

    블로그 글로 올렸는데 제가 너무 늦었네요. :)

  • orch 2012-05-05 11:05

    아, 이거 정말 짜증의 극치였습니다.
    왜 '사용자가 원할 것이다' 라고 지레짐작해서 이렇게 만드는지...
    저렇게 만든 사람은 두뇌가 흔적기관인 사람이라고 생각합니다. (말이 좀 심한가요)
    아무튼, 유용한 정보 정말 감사합니다!

  • danny 2014-02-12 01:02

    안녕하세요
    컴퓨터 초보인데요 이거 자세하게 하는법좀 알수 있을까요?

  • 신현석 2014-02-12 15:02

    IE8에서 설정하는 방법은 http://hyeonseok.com/soojung/usability/2012/04/10/696.html 을 참고하세요.

  • lovelyhouse 2014-02-14 01:02

    크롬에서는 어떻게 설정하나요?ㅜ

  • 신현석 2014-02-15 09:02

    크롬의 사용자 스타일 시트 사용 방법을 참고하시면 될 것 같습니다.

    https://productforums.google.com/forum/#!topic/chrome/mGKEiaxvwlo

Post a comment

:

: 공개 되지 않습니다. Gravatar를 표시 합니다.

:

: HTML 태그를 사용할 수 없습니다.