접근 가능한 인터페이스 디자인에서 우아한 열화의 중요성 – Smashing Magazine

우아한 열화는 특정 개별 부분이 작동을 중단하더라도 웹 사이트의 기본 사항이 여전히 작동하는 디자인 접근법입니다. 접근 방식이 제거됩니다 실패의 단일 지점: 한 가지 일이 작동을 중단한다고해서 시스템 전체가 실패한 것은 아닙니다. 이 원칙을 따르는 사이트는 한 번에 한 번 대신 조각으로 실패하므로 일부 구성 요소가 오류가 발생할 때 가장 중요한 기능은 사용할 수 있습니다.

단일 실패 지점의 아이디어 또는 개념은 제조 부문에서 잘 알려져 있습니다. 제조 및 공급망 운영에서 가장 일반적인 탄력성 전략 중 하나입니다. 여러 재료 공급원이있는 공장은 하나의 공급 업체를 사용할 수 없게 되더라도 계속 작동 할 수 있습니다. 그러나 가용성 및 기능에 대한 사용자의 기대가 증가함에 따라 웹 개발에 점점 중요 해지고 있습니다.

데이터 센터 중복성 웹 개발에서 우아한 황폐화의 일반적인 예입니다. 여러 서버 구성 요소를 사용하면 웹 사이트는 하나 이상의 서버가 실패하면 계속 유지됩니다. 설계 컨텍스트에서는 사용자의 브라우저 나 장치에서 주어진 기능에 대한 지원이 부족하다는 것을 보장하면 앱을 사용할 수 없게됩니다.

에스컬레이터는 동일한 개념의 친숙한 실제 예입니다. 그들이 일을 멈추면 계단 역할을함으로써 사람들을 한 층에서 다음 층으로 데려 갈 수 있습니다. 그들은 평소만큼 기능적이지는 않지만 완전히 쓸모가 없습니다.

BBC 뉴스 웹 페이지는 웹 디자인의 우아한 열화의 좋은 예입니다. 이 스크린 샷에서 알 수 있듯이 사이트는 이미지에 대한 뉴스 스토리 내에서 내비게이션 및 텍스트를 우선 순위로 삼습니다. 결과적으로 속도가 느리거나 양립 할 수없는 오래된 브라우저 플러그인은 사진을 사용할 수 없게 만들 수 있지만 사이트의 핵심 기능 (뉴스 공유)은 여전히 ​​액세스 할 수 있습니다.

대조적으로, Adobe Express 웹 사이트는 우아한 열화없이 일어나는 일의 예입니다. 일부 기능을 사용할 수 없거나로드 시간을 떨어 뜨리는 대신 일부 브라우저에서 전체 사이트가 액세스 할 수 없습니다. 결과적으로 사용자는 웹 앱을 사용하기 위해 소프트웨어를 업데이트하거나 전환해야합니다. 이는 액세스 가능성에 적합하지 않습니다.

우아한 열화 대 진보적 인 향상

우아한 열화 접근법은 반대의 역할을합니다 진보적 인 향상 – 디자이너가 웹 사이트의 기본 사항을 구축하고 브라우저가 실행할 수있는 경우에만 켜지는 기능을 점차적으로 추가하는 접근 방식. 각 기능 계층은 기본적으로 꺼져있어 모든 사람이 작동하도록 설계된 하나의 완벽한 사용자 경험이 가능합니다.

우아한 열화 또는 진보적 인 향상이 사이트 기능을 구축하는 가장 좋은 방법인지에 대한 설계자간에 많은 논쟁이 있습니다. 그러나 실제로는 둘 다 중요합니다. 각 방법에는 고유합니다 장단점따라서 두 사람은 서로를 보완하여 가장 탄력성을 제공 할 수 있습니다.

진보적 인 향상은 a 새로운 처음부터 모든 사람에게 기능적 경험을 보장하기 때문에 사이트 또는 앱. 그러나 미래에 새로운 표준과 문제가 발생할 수 있는데, 이는 우아한 열화가 발생하는 곳입니다.이 접근법은 당신을 도와줍니다. 조정하다 새로운 접근성 표준을 준수하거나 이전에 눈치 채지 못한 호환성 문제를 해결하기위한 기존 웹 사이트.

하나의 디자인 원칙에만 초점을 맞추거나 다른 디자인 원칙에만 집중하면 접근성이 제한됩니다. 진보적 인 향상만으로도 출시 후 기능 문제를 설명하기 위해 고군분투하는 반면, 우아한 열화만으로는 가장 특징이 풍부한 기준선 경험을 제공하지 못할 수 있습니다. 둘 다 결합하면 최상의 결과가 발생합니다.

우아한 황폐화가 접근성에 얼마나 영향을 미치는지

사이트 나 앱을 계속 기능하는 것은 접근성에 중요합니다. 핵심 기능을 사용할 수 없게되면 플랫폼은 더 이상 누구에게나 액세스 할 수 없습니다. 더 작은 규모로 텍스트 음성 독자 또는 비디오 폐쇄 형 캡션 작업 중지와 같은 기능이 작동하지 않는 경우, 시력 어려움이있는 사용자는 사이트를 즐길 수 없을 수 있습니다.

다양한 장치 기능을 고려할 때 우아한 열화의 접근성에 미치는 영향이 더 큽니다. 평범한 사람이 매일 3.6 시간을 전화로 보내면서 사이트가 덜 강력한 모바일 브라우저를 지원하지 않으면 상당한 청중을 소외시킬 것입니다. 일부 복잡한 기능이 모바일에서 작동하지 않더라도 전화로 웹 사이트의 대부분을 사용할 수 있도록하는 사람들을 희생하면 더 넓은 접근성이 보장됩니다.

구식 브라우저는 우아한 열화로 해결할 수있는 또 다른 일반적인 접근성 문제입니다. Fairleigh Dickinson University 의이 예를 고려하십시오. 대부분의 현대식 브라우저는 더 이상 지원하지 않는 Adobe Flash에 대해 생각하십시오.

Flash를 사용하는 소프트웨어는 문제의 다중 인증 인증 기능을 사용할 수 없습니다. 결과적으로, 이전 프로그램을 가진 사용자는 로그인 할 수 없습니다. 우아한 열화는 플래시 지원 브라우저와 일부 기능을 사용할 수 없게하면서 일반 액세스를 허용함으로써 타협 할 수 있습니다. 그렇게하면 사람들은 서비스를 사용하기 위해 업그레이드 할 필요가 없습니다.

사이트에 우아한 악화를 통합하는 방법

우아한 악화는 접근성에 대한 기술적 장벽을 제거합니다. 더 넓은 의미에서, 그것은 또한 예상치 못한 기술적 어려움으로 인해 사이트 나 앱을 항상 실행합니다. 이를 달성 할 수있는 방법에는 여러 가지가 있지만 다음은 따라야 할 일반적인 모범 사례가 있습니다.

미션 크리티컬 기능을 식별합니다

우아한 열화를 보장하는 첫 번째 단계는 핵심 기능 이다. 필수 요소와 그렇지 않은 것을 알면 미션 크리티컬 기능의 가용성 만 보장 할 수 있습니다.

사용자 데이터를 검토하여 잠재 고객이 대부분의 상호 작용하는 내용을 확인하십시오. 일반적으로 우선 순위를 정할 가치가있는 요소입니다. 사이트 보안, 거래 및 가독성과 관련된 모든 것도 중요합니다. 비디오 플레이어 및 대화 형지도와 같은 드물게 사용되는 기능이나 요소는 미션 크리티컬 구성 요소를 사용할 수 있도록해야한다면 희생해도 괜찮습니다.

중복성을 구축하십시오

사이트 기능을 중요하게 분류 한 후에는 가장 중요한 것의 중복성을 보장 할 수 있습니다. 그것은 의미 할 수 있습니다 몇 가지 형태로 요소를 복제합니다 다양한 브라우저 또는 장치에서 작업합니다. 또는 대체 결제 방법을 지원하거나 비디오 및 텍스트 버전의 콘텐츠를 제공하는 등 여러 서비스를 제공하여 중요한 기능을 수행 할 수 있습니다.

중복성은 플랫폼이 실행되는 하드웨어에도 적용됩니다. Upime Institute는 데이터 센터를 계층으로 분류하여 필요한 중복 시스템을 결정하는 데 사용할 수 있습니다. 마찬가지로, 여러 서버에서 사이트를 실행하여 충돌이 중단되지 않도록하십시오.

모든 브라우저를 수용합니다

우아한 열화는 다양한 기능의 소프트웨어 및 하드웨어 지원에 관한 것임을 기억하십시오. 웹 디자인에 대한 우산 아래에서 가장 중요한 고려 사항 중 하나는 오래된 브라우저를 수용하십시오.

모바일 장치는 Flash를 지원하지 않지만 일부 이전 버전의 데스크탑 브라우저는 여전히 사용합니다. 플래시를 피함으로써 둘 다 작업 할 수 있습니다. 대신 HTML5를 사용할 수는 있지만 사용자에게 플래시 지원 브라우저가 필요하지는 않습니다. 마찬가지로, 오래된 시스템에서 액세스 할 수 있도록 상당한 처리 전력을 차지하는 모든 기능에 대한 대역폭의 간단한 대안을 제공 할 수 있습니다.

기억하십시오 최신 소프트웨어의 보안 설정에주의하십시오도. 이와 같은 오류 메시지는 사이트가 일부 브라우저의 업데이트 된 보안 프로토콜을 지원하지 않으면 Microsoft 사용자가 게시 할 수 있습니다. Chrome 및 Safari와 같은 인기있는 플랫폼의 업데이트를 항상 수행하여 이러한 표준을 충족시키고 이러한 액세스 문제를 피하십시오.

로드 밸런싱 및 캐싱을 사용하십시오

로드 밸런싱은 우아한 열화의 또 다른 중요한 단계입니다. 많은 클라우드 서비스는 과부하를 방지하기 위해 서버 리소스 간의 트래픽을 자동으로 배포합니다. 이를 활성화하면 다른 사람이 실패하면 시스템의 다른 부분에서 요청을 처리 할 수 ​​있습니다.

캐싱은 비슷합니다. 중요한 데이터를 저장하면 외부 서비스 또는 응용 프로그램 인터페이스 (API)가 작동하지 않는 경우 폴백 계획을 구축합니다. API가 응답하지 않으면 대신 캐시 된 데이터를로드 할 수 있습니다. 결과적으로 캐시는 많은 경우 대기 시간을 크게 줄이지 만 모든 것을 캐시 할 수는 없다는 것을 알고 있어야합니다. 가장 중요한 기능에 중점을 둡니다.

게시하기 전에 테스트하십시오

마지막으로, 웹 사이트에서 접근성 문제를 해결하기 전에 웹 사이트를 테스트하십시오. 다양한 브라우저 버전을 포함하여 여러 장치에서 액세스하십시오. 단일 서버에서 실행하여로드의 균형을 맞추는 기능을 테스트 할 수 있는지 확인하십시오.

테스트에서 가능한 모든 오류를 발견하지는 못할 수도 있지만, 아무 것도없는 것보다 더 낫습니다. 업데이트 또는 재 설계 전에 사이트의 기능을 테스트해야합니다.

우아한 타락으로 시작합니다

크고 작은 디자이너는 웹 호스팅 서비스로 일부 설정을 조정하여 우아한 황폐화 여행을 시작할 수 있습니다. AWS는 사이트 아키텍처에 저하를 구축하는 데 사용할 수있는 실패 관리에 대한 지침을 제공합니다. 호스팅 제공 업체를 사용하면 스토리지 계획을 업그레이드하고 서버 설정을 구성하여 중복 및 잔액 부하를 제공 할 수 있어야합니다.

자체 데이터 센터를 실행하기에 충분한 비즈니스는 중복 서버 용량과 무정전 전원 공급 장치를 설치하여 상황을 유지해야합니다. 소규모 조직은 Semantic HTML을 사용하여 여러 브라우저에 충분히 간단하게 유지하여 코드에 의존 할 수 있습니다. 대역폭이 낮을 때 중지하기 위해 이미지 및 비디오와 같은 비 필수 사항을 프로그래밍하는 것도 도움이됩니다.

Kubernetes와 같은 가상화 시스템은 또한 사이트 용량을 확장하고 접근성을 유지하기 위해 서로 별도로로드하는 데 도움이되는 방법으로 유용합니다. Browserstack, Wave 및 CSS HTML 유효성 검사기와 같은 테스트 도구는 일부 브라우저 또는 특정 사용자에 대한 기능적 문제가 있는지 확인하여 도움을 줄 수 있습니다.

핵심적으로 웹 접근성은 거의 없습니다 플랫폼이 모든 사람들에게 의도 된대로 작동하는지 확인합니다. 디자인 기능 이이 목표의 가장 명백한 부분 일 수 있지만 기술 방어도 역할을합니다. 사이트는 작동 할 때만 액세스 할 수 있으므로 기능적으로 유지하십시오예상치 못한 딸꾹질이 발생하더라도.

우아한 열화는 완벽한 솔루션은 아니지만 작은 문제가 더 큰 문제가되는 것을 방지합니다. 웹 사이트 나 앱에서이를 구현하기 위해이 다섯 단계를 따라 접근 가능한 디자인을 만드는 작업이 낭비되지 않도록합니다.

(YK)