WebDevelopment

Front-End

HTML(Hyper Text Markup Language) : Web page의 구조 담당하는 정적인 언어
CSS(Cascading Style Sheets) : 실제 표시되는 방법(색상, 크기, 폰트, layout등) 지정, 컨텐츠 구조를 꾸며주는 정적 언어로 웹의 시각적인 표현 담당함.
JS(JavaScript) : 컨텐츠를 바구고 움직임 등 페이지를 동적으로 꾸며주는 역할

정상적인 web contents 사용이 가능한 일반사용자부터, 고령자, 장애인 등 신체, 환경적 조건에 제ㅇ한이 있는 사용자를 포함해 모든 사용자들이 동등하게 접근할 수 있는 웹 컨텐츠 제작 방법

Bitmap & Vector Image
- Bitmap : 정교하고 다양한 색상을 자연스럽게 표현, 확대, 축소시 품질 저하
- Vector: 확대/축소시 자유로옴, 용량 번화 없음, 정교한 이미지 표현 어려움.
JPEG(Joint Photographic coding Experts Group)
- 손실 압축
- 24Bit, 1600만 색상, 고해상도 표시에 적합
- 이미지의 품질과 용량을 쉽게 조절 가능
- 범용
PNG(Portable Network Graphics)
- 비손실 압축
- 8bit / 24 bit color image 처리
- Alpha Channer 지원
- W3C 권장 포멧
GIF(Graphics Interchange Format)
- 비손실 압축
- 애니메이션
- 8bit color
WEBP
- 구글에서 개발(JPG, PNG, GIF 모두 대체 가능)
- 완벽한 손실/비손실 압축 지원
- 애니메이션 지원
- alpha channel 지원
- 단점 : 지원 브라우저가 제한적 / 지원 브라우저 참고
SVG(Scalable Vector Graphics)
- 해상도의 영향에서 자유로움
- CSS로 style 가능
- JavaScript로 Event Handling 가능
- code or file로 사용 가능