9. UI 구현

https://www.njobler.net/product/lecture/show/prod/10810

1억뷰 N잡

본 강의를 듣고 내용을 정리하며 적은 게시글 입니다. 

 

 

 

• 화면 레이아웃 구성
  • 레이아웃 개념
    • 특정 공간에 여러 구성 요소를 보기 좋게 효과적으로 배치하는 작업
  • HTML5
    • 월드와이드웹을 통해 제공되는 정보를 나타낼 목적으로 사용되는 마크업 언어
    • HTML 버전 5
    • 특징
      • 플러그인의 설치 없이 동영상이나 음악을 웹 브라우저상에서 재생
    • 시맨틱 요소
    • INPUT 요소
  • CSS
    • HTML과 함께 웹을 구성하는 기본 프로그래밍 요소
    • 웹 문서의 디자인 요소를 담당
  • JavaScript
    • 모질라 재단의 프로토타입 기반의 프로그래밍 언어로, 스크립트 언어에 해당된다.
    • 웹을 구성하는 요소 중 하나
    • 클라이언트 단에서 웹 페이지가 동작하는 것을 담당
    • 프로토타입 기반 객체 지향 언어, 객체 지향 언어이지만 상속은 지원하지 않는다.
    • 값에 따라 변수의 형변환이 자동으로 이루어지는 동적 형변환
    • 프레임 워크
      • React
        • 페이스북에서 개발
      • Vue.js
        • Evan You에 의해 개발
      • Angular JS
        • 구글에서 개발
      • Ajax(Asynchronous JavaScript and XML)
        • 비동기적인 웹 어플리케이션의 제작을 위한 웹 개발 기법
• UI 관련 용어
  • 웹 표준
    • 월드 와이드 웹의 측면을 서술하고 정의하는 공식 표준이나 다른 기술 규격을 말한다.
  • 웹 호환성
    • 이용자의 단말기 등의 하드웨어 및 소프트웨어 환경이 다른 경우에도 동등한 서비스를 제공할 수 있는 것을 말한다.
  • 웹 접근성
    • 장애인과 비장애인 모두가 동등하게 웹 사이트에 접근하여 이용할 수 있도록 보장하는 방식을 말한다.
  • 반응형 웹
    • PC, 모바일 등 다양한 디바이스 화면 크기에 맞춰 하나의 사이트를 보여준다
  • 인포그래픽
    • 정보와 그래픽의 합성어로 복잡한 정보를 쉽고 빠르게 전달하기 위해 정보를 분석, 정리하여 차트 ,그래프, 아이콘, 그래픽스, 이미지등을 활용하여 시각화 한 것을 말한다.
  • 브랜드 아이덴티티
    • 사용자에게 전달하고자 하는 특정 브랜드의 가치와 의미를 반영한 심적 표상을 말한다.
  • 내비게이션
    • 하이퍼링크를 따라 웹 공간의 정보를 요청하고 받아오는 웹 브라우징을 의미하며, 웹 사이트를 탐색하기 위한 도구를 뜻하기도 한다.
  • 아코디언
    • 사용자가 원하는 정보만 선택적으로 볼 수 있게 접을 수 있는 내용 패널을 말한다.
  • 플레이스 홀더
    • 사용자가 값을 입력하는데 참고할 수 있도록, 입력 필드에 제공되는 간략한 텍스트 도움말을 말한다.
  • 필터링
    • 원하지 않는 데이터를 차단하거나, 원하는 데이터만 볼 수 있도록 해주는 기능
  • 입력 폼
    • 다양한 입력 필드로 구성되어, 사용자가 웹 서버로 전송할 정보를 입력할 슀는 웹 문서의 일부를 말한다.
  • 입력 필드
    • 사용자가 정보를 입력하거나 선택하는 데 이용되는 사용자 인터페이스 요소를 말한다.
  • 썸네일
    • 커다란 이미지를 축소하여 제공한 이미지를 말한다.
  • 레이블
    • 입력폼을 구성하는 다양한 입력 필드를 식별하기 위해 사용하는 명칭
  • 대체 텍스트
    • 콘텐츠를 대신하기 위해 제공되는 텍스트를 의미
  • 초점
    • 웹 페이지에서 사용자가 선택한 해당 요소에 있을 때, 해당 요소에 포커스가 있다고 한다.