렌더링
Rendering이란 브라우저의 뷰포트에 웹 사이트를 출력하는(그림 그려내는) 행위를 말합니다.
뷰포트
Viewport란 웹페이지가 출력되는 범위입니다.
웹 이미지 비트맵과 벡터
비트맵(Bitmap)
- 픽셀이 모여 만들어진 정보의 집합, 레스터(Raster) 이미지라고도 부름.
- .jpeg .gif .png
- 정교하고 다양한 색상을 자연스럽게 표현.
- 확대/축소 시 계단 현상, 품질 저하.
벡터(Vector)
- 점, 선, 면의 위치(좌표), 색상 등 수학적 정보의 형태(Shape)로 이루어진 이미지.
- .svg
- 확대/축소에서 자유로움, 용량 변화가 없음.
- 정교한 이미지(인물, 풍경 사진 같은)를 표현하기 어려움.
Material Design(머터리얼 디자인)
- 고품질 디지털 경험을 구축할 수 있도록 Google에서 만든 디자인 시스템(방식)입니다.
- 벡터이미지로 만들기 용이하고 관리하기 좋습니다.
JPG(Joint Photographic coding Experts Group)
JPG는 Full-color와 Gray-scale의 압축을 위해 만들어졌으며, 압축률이 훌륭해 사진이나 예술 분야에서 많이 사용.
- 손실 압축
- 표현 색상도(24비트, 약 1600만 색상)가 뛰어남
- 이미지의 품질과 용량을 쉽게 조절 가능
- 가장 널리 쓰이는 이미지 포맷
- 이미지를 반복적으로 새롭게 저장하는 것은 가급적 지양(손실 압축을 사용하기 때문)
PNG(Portable Network Graphics)
Gif의 대체 포맷으로 개발됨.
- 비손실 압축
- 8비트(256색상) / 24비트(약 1600만 색상) 컬러 이미지 처리
- Alpha Channel 지원(투명도)
- W3C 권장 포맷
GIF(Graphics Interchange Format)
이미지 파일 내에 이미지 및 문자열 같은 정보들을 저장.
- 비손실 압축
- 여러 장의 이미지를 한 개의 파일에 담을 수 있음(움짤, 애니메이션)
- 8비트 색상만 지원(다양한 색상 표현에는 적합하지 않음)
WEBP
JPG, PNG, GIF를 모두 대체할 수 있는 구글이 개발한 이미지 포맷.
- 완벽한 손실/비손실 압축 지원
- GIF 같은 애니메이션 지원
- Alpha Channel 지원(손실, 비손실 모두)
SVG
SVG(Scalable Vector Graphics)는 마크업 언어(HTML/XML) 기반의 벡터 그래픽을 표현하는 포맷.
- 해상도의 영향에서 자유로움
- CSS와 JS로 제어 가능
- 파일 및 코드 삽입 가능
- 코드로 되어 있어, CSS, JS로 제어 가능
특수 기호
Backtick, Grave
백틱, 그레이브
`Tilde
틸드, 물결 표시
~Exclamation mark
엑스클러메이션, 느낌표
!At sign
엣, 골뱅이
@Sharp, Number sign
샵, 넘버, 우물 정
#Dollar sign
달러
$Percent sign
퍼센트
%Caret
캐럿
^Ampersand
엠퍼센드
%Asterisk
에스터리스크, 별표
*Hyphen, Dash
하이픈, 대시, 마이너스
-Underscore, Low dash
언더스코어, 로대시, 밑줄
_Equals sign
이퀄, 동등
=Quotation mark
쿼테이션, 큰 따옴표
"Apostrophe
아포스트로피, 작은 따옴표
'Colon
콜론
:Semicolon
세미콜론
;Comma
콤마, 쉼표
,Period, Dot
피리어드, 닷, 점, 마침표
.Question mark
퀘스천, 물음표
?Slash
슬래시
/Vertical bar
버티컬 바
|Backslash
백슬래시, 역 슬래시
\Parenthesis
퍼렌서시스, 소괄호, 괄호
()Brace
브레이스, 중괄호
{}Bracket
브래킷, 대괄호
[]Angle Bracket
앵글 브래킷, 꺽쇠괄호
<>오픈 소스 라이선스
오픈소스란 어떤 제품을 개발하는 과정에 필요한 소스 코드나 설계도를 누구나 접근해서 열람할 수 있도록 공개하는 것.
무료 라이선스
Apache License
아파치 소프트웨어 재단에서 자체 소프트웨어에 적용하기 위해 만든 라이선스, 개인적/상업적 이용, 배포, 수정, 특허 신청이 가능.
MIT License
매사추세츠공과대학(MIT)에서 소프트웨어 학생들을 위해 개발한 라이선스, 개인 소스에 이 라이선스를 사용하고 있다는 표시만 지켜주면 되며, 나머지 사용에 대한 제약은 없음.
BSD License
BSD(Berkeley Software Distribution)는 버클리 캘리포니아대학에서 개발한 라이선스, MIT와 동일 조건.
Beerware
오픈소스 개발자에게 맥주를 사줘야 하는 라이선스.
물론 만날 수 있는 경우..
