웹 페이지를 만들기 전에

인터랙티브UI/UX

UI(user interface)

사용자가 특정 콘텐츠를 이용할때 만다는 접점, 즉 사용자 환경을 의미

 

 

예를 들면 네이버에서 보여지는것처럼 모든것이 UI라고 생각하면된다.

 

 

UX(user experience)

사람들이 특정 콘텐츠를 사용 할떄 UI에서 느낄수 있는 사용자 경험을 의미

  예를 들면 게시판에 접근할때 A 웹 페이지에서는 메뉴를 3회를 클릭해야 하는데
  B 웹 페이지에서는 1회만 클릭해도 접근이 가능하다면

  B 웹페이지가 사용성(usability)이 더 좋다고 할수있다.

  이처럼 특정 UI를 이용하여 콘텐츠를 사용할 때 느끼는 모든 사용자 경험을 UX라고 한다.

 

 

인터랙티브(interactive) UI/UX

사용자와 상호 작용하는 여러 모션과 동적인 콘텐츠를 사용하는 환경을 의미

 간단히 생각하면 인스타나 페이스북 같이 SNS을 사용할때 페이지 형식으로 되어있는게

 스크롤을 계속 내리면 자동으로 다음 내용이 보이는 것을 생각하면 된다. 

 

HTML, CSS , 자바스크립트의 역활

간단한 예시 사진

HTML (Hyper Text Markup Language)

 - 웹 문서를 만들기 위하여 사용하는 기본적인 웹 언어의 한 종류

 - 웹 페이지에서 제목, 이미지. 동영상, 문단, 표 등을 정의하고 그 구조와 의미를 부여하는 정적 언어

 - 웹의 뼈대라고 생각

 

CSS (Cascading Style Sheets)

 - 마크업 언어 (HTML, XML , XHML등)가 실제 표시되는 방법(색상,레이아웃,크기등)을 지정하여 

   콘텐츠 구조를 꾸며주는 정적 언어

 - 웹의 시각적인 부분을 담당  (웹에 옷을 입혀준다고 생각)

 

JS(JavaScript)

 - 브라우저 자체에서 내장된 해석기능을 이용한 클라이언트 기반의 일종의 스크립트 언어

 - 콘텐츠를 바꾸고 움직이는등 페이지를 동적으로 꾸며주는 역활

 - 웹의 동적 처리를 담당 (웹에 근육등의 역활을 한다고 생각)