권장표준스타일가이드

OpenID 적용 사이트 (RP, Relying Party, Consumer) 의 사용자 인터페이스 권장 표준 스타일입니다.

OpenID 적용 사이트 권장/표준 스타일 가이드

오픈아이디의 강점은, 표준을 통해 사용자 중심 원칙을 확보하는 데 있습니다. 하지만, 결국, 표준을 업체들이 얼마나 준수해 주느냐에 따라 실제 사용자 경험상의 일관성이 구현된다고 생각합니다.
현재 스펙상의 프로토콜 표준은  따르지 않을 경우, 작동이 안되기 때문에 거의 지켜진다고 봅니다. 하지만, 지원서비스나 제공업체가 같이 지키면 좋을 Best Practice 같은 것은 그 가치를 알고 신경써서 지키지 않으면 쉽게 문제점이 드러나지 않는 것들, 결국, 사용자의 불편이나 불이익으로만 드러나는 것들이 있을 수 있습니다.
오픈마루에서는 내부서비스들의 인증 기반이 모두 오픈아이디이기때문에 이부분에 대해서 간단하지만 내부적으로 정리된 것이 좀 있어서 공유드리고, 함께 발전시켰으면 합니다.
여기 소개드리는 BP 는 거의 스펙 http://openid.net/specs.bml 에서 발췌된 것들입니다.

• OpenID ID 입력폼 / 인증창

  • 스펙상 강제 사항은 아니지만, 사용자 경험상 매우 중요한 부분입니다.

  • 표준 스타일을 지킬 경우, 자동화된 툴의 혜택을 입을 수 있습니다.

  • 권장 UI: http://wiki.openid.net/OpenID_Login_Box

    1. <input type="text" name="openid_identifier" class="openid_login" />
       
       input.openid_login {
          background: url(http://openid.net/login-bg.gif) no-repeat;
          background-color: #fff;
          background-position: 0 50%;
          color: #000;
          padding-left: 18px;
       }

    • 특히 입력란의 오픈아이디 로고는 필수입니다.

      • small OpenID logo (http://www.myopenid.com/static/openid-icon-small.gif)
      • 로고 이미지 소스: http://openid.net/logos/

  • OpenID ID 입력콘트롤 표준 이름 (input name)

    • 'openid_identifier' (1.1 에서는 'openid_url' 이지만 현재 대부분 2.0 이름이 표준처럼 사용됩니다.)
    • 브라우저 자동 완성 등 automation 지원을 받을 수 있습니다.
    • myID.net jointsignup 이나, myopenid.com affiliate program 등을 활용하려면 필수입니다.

  • ID Canonicalization - 입력된 아이디의 정규화

    • 'http://' 등 문맥에 따라서 생략가능한 부분을 완성시켜 주어야 합니다.
    • 마지막으로 모든 서버쪽 redirection 을 따라간 최종 URL 을 claimed ID (제시 ID, 대표 ID) 로 사용합니다.

  • (보안) 전통적인 ID 와 password 를 함께 쓰는 폼을 지양합니다.

    • 특히, 기존 인증기반이 있는 서비스의 경우에, 로칼아이디와 오픈아이디를 한 입력란에 받는 UI 는 위험한 패턴입니다.
    • 오픈아이디 본질상, ID 입력과 인증(password 입력등) 이 분리되는 것을 사용자에게 학습시켜야 합니다.
    • 이러한 UI 는 피싱사이트로 오해받을 수 있습니다.

    • 서비스는 기존 서비스전용 ID 로그인과 OpenID 로그인을 함께 지원할 수 있으며, 이경우 아래와 같이 분리된 폼을 제공합니다.

      • (참고: OpenID 로그인 대화창 예제들 )
    • 

  • (보안) 인증제공자의 페이지는 반드시 URL 이 확인되도록 해야 합니다.

    • IDP 인증폼의 URL 은 반드시 사용자에게 보여지도록 해야 합니다.
    • iframe, 약식-새창, layer 등으로 인증 URL 이 감추어 지면 안됩니다.
    • 이러한 UI 녁시 피싱사이트로 오해받을 수 있습니다.

     

  • 블로그 댓글 등에 표시할 때

    • 오픈아이디 로그인 폼과, 익명 폼을 분리합니다. 특히, 아이디/비번의 아이디를 혼용하지 않습니다.

      • 

    • 글쓴이 아이덴티티 표시할 때, 인증된 오픈아이디와 익명 글쓴이를 명확히 구분합니다.

      • 특히, 오픈아이디 로고는 반드시 인증된 오픈아이디 앞에만 달도록 합니다. (if and only if)
      •