프론트엔드 개발할 때 고려사항

웹 개발을 할 때 불확실성의 주요 원인은 각 사용자가 웹 사이트를 보기 위해 어떤 기술 조합을 사용할지 모른다는 사실에서 비롯된다.

* 사용자 1은 작고 좁은 화면의 iPhone에서 이를 보고 있을 수 있다.
* 사용자 2는 와이드스크린 모니터가 부착된 Windows 노트북에서 이를 보고 있을 수 있다.
* 사용자 3은 시각 장애인일 수 있으며 화면 판독기를 사용하여 웹 페이지를 읽어줄 수 있다.
* 사용자 4는 최신 브라우저를 실행할 수 없는 매우 오래된 데스크톱 시스템을 사용하고 있을 수 있다.

사용자가 무엇을 사용할지 정확히 모르기 때문에 “방어적”으로 디자인해야 한다. 웹 사이트를 최대한 유연하게 만들어 위의 모든 사용자가 모두 동일한 경험을 얻지 못하더라도 사용할 수 있도록 해야 한다.

즉, 우리는 가능한 한 모든 사람이 웹을 사용할 수 있도록 노력하고 있다.

고려사항

1️⃣ 브라우저 간 호환성

브라우저 간 호환성은 웹페이지가 가능한 한 많은 장치에서 작동하는지 확인하는 것이다. 여기에는 모든 브라우저가 지원하는 기술 사용, 이를 처리할 수 있는 브라우저에 더 나은 환경 제공(점진적 향상) 또는 이전 브라우저에서 더 단순하지만 여전히 사용 가능한 환경으로 돌아가도록 코드 작성(점진적 성능 저하)이 포함된다.

또한 특정 브라우저에서 오류가 발생하는지 확인하기 위해 많은 테스트를 수행한 다음 이러한 오류를 해결하기 위해 더 많은 작업을 수행한다.

2️⃣ 반응형 웹 디자인

반응형 웹 디자인은 기능과 레이아웃을 유연하게 만들어 다양한 브라우저에 자동으로 적응할 수 있도록 하는 방법이다. 확실한 예는 데스크탑의 와이드스크린 브라우저에서는 한 방향으로 배치되지만 휴대폰 브라우저에서는 더 컴팩트한 단일 열 레이아웃으로 표시되는 웹 사이트이다.

3️⃣ 성능

성능이란 웹 사이트를 가능한 한 빨리 로드하는 동시에 사용자가 실망하여 다른 곳으로 이동하지 않도록 직관적이고 사용하기 쉽게 만드는 것을 의미한다.

4️⃣ 접근성

접근성이란 가능한 한 많은 사람들이 웹사이트를 사용할 수 있도록 만드는 것을 의미한다.(관련 개념으로는 다양성과 포용성, 포용적인 디자인이 있다). 여기에는 시각 장애, 청각 장애, 인지 장애 또는 신체 장애가 있는 사람이 포함된다. 또한 장애가 있는 사람을 넘어서서 젊은 사람이나 노인, 다른 문화권의 사람, 모바일 장치를 사용하는 사람, 네트워크 연결이 불안정하거나 느린 사람도 포함된다.

5️⃣ 국제화

국제화란 서로 다른 언어를 사용하는 다양한 문화권의 사람들이 웹사이트를 사용할 수 있도록 만드는 것을 의미한다. 여기에는 기술적인 고려 사항(예: 오른쪽에서 왼쪽으로 또는 수직 언어에서도 제대로 작동하도록 레이아웃 변경)과 인간적인 고려 사항(예: 제 2언어 또는 제 3 어로 사용하는 사람들이 텍스트를 더 잘 이해할 수 있도록 단순하고 속어가 아닌 언어를 사용하는 것)이다.

6️⃣ 개인 정보 보호 및 보안

이 두 개념은 서로 관련되어 있지만 다르다. 개인정보 보호란 사람들이 개인적으로 비즈니스를 수행할 수 있도록 허용하고, 이를 염탐하거나 필요한 데이터 이외의 데이터를 수집하지 않는 것을 의미한다. 보안이란 악의적인 사용자가 귀하 또는 귀하의 사용자로부터 웹사이트에 포함된 정보를 훔칠 수 없도록 안전한 방식으로 웹사이트를 구축하는 것을 의미한다.

🔗 ref :

• The web and web standards