Summary - HTML DOM(Document Object Model) 구조도, 사용성 테스트(Usability Test) 단계

CODEDRAGON Development/UI&UX

반응형


 

 

HTML DOM(Document Object Model) 구조도

https://codedragon.tistory.com/5383

 

 

 

 

 

 

사용성 테스트(Usability Test) 단계

https://codedragon.tistory.com/5378

 

 

 

 

 

 

 

HTML5 문서구조 도식도

https://codedragon.tistory.com/3344

 

 

 

 

 

 

UI구현을 위한 환경 구축의 단계

단계

설명

1

웹서버의 역할을 정확히 이해하고 웹서버의 종류를 조사하여 특징을 정리한다.

2

다양한 클라이언트의 종류와 웹브라우저의 호환성을 확인한다.

3

웹서버를 구축하는 프로그램이나 방법을 조사한다.

4

편집도구의 종류를 조사하고 작성한다.

5

작성한 HTML문서를 실행한다.

 

 

 

 

 

 

 

웹사이트에 접속하기 위한 로그인 과정의 처리 절차(Process Diagram 예시)


 

 

 

 

 

 

호환성 테스트 예시

다양한 브라우저 환경에서 호환성을 체크할 있는 테스트 케이스입니다.

구분

테스트 내용

1

최근의 브라우저와 구형 브라우저에서 작동하는가?

2

이미지를 끄거나 지원하지 않아도 내용에 접근이 가능한가?

3

텍스트 브라우저에서도 동작하는가?

4

상세한 메타데이터를 포함하고 있는가?

5

브라우저 크기의 범위 안에서 사이트가 작동하는가?

6

CSS 끄거나 지원하지 않아도 내용에 접근이 가능한가?

 

 

반응형

'Development > UI&UX' 카테고리의 다른 글

프로토타이핑 방법(종류)  (0) 2019.10.26
UI(User Interface) 구현 - CUI vs GUI  (0) 2019.10.21
1.Summary - 1. UI 설계 확인하기  (0) 2019.10.20
uimovement (UI무브먼트)  (0) 2019.10.15
Naver logo image  (0) 2019.10.10