개발자취업부트캠프(30)
-
오픈 그래프
오픈 그래프 (The Open Graph protocol) 웹페이지가 소셜 미디어(카카오톡, 페이스북 등)로 공유될 때 우선적으로 활용되는 정보를 지정할 수 있다. ... og:type: 페이지의 유형(E.g, website, video.movie) og:site_name: 속한 사이트의 이름 og:title: 페이지의 이름(제목) og:description: 페이지의 간단한 설명 og:image: 페이지의 대표 이미지 주소(URL) og:url: 페이지 주소(URL) 참고: https://ogp.me/ Open Graph protocol The Open Graph protocol enables any web page to become a rich object in a social graph. ogp.m..
2022.09.17 -
표기법
dash-case (kebab-case) the-quick-brown-fox-jumps-over-the-lazy-dog - 주로 사용 : html, css - 단어들을 하이픈(-) 으로 이어서 한 단어로 인식한다. snake_case the_quick_brown_fox_jumps_over_the_lazy_dog - 주로 사용 : html, css - 단어들을 언더바(_) 로 이어서 한 단어로 인식한다. camelCase theQuickBrownFoxJumpsOverTheLazyDog - 주로 사용 : javaScript - 첫 단어의 첫 번째 글자는 소문자, 이어지는 단어들의 첫 번째 글자는 대문자로 작성한다. PascalCase TheQuickBrownFoxJumpsOverTheLazyDog - 주로 ..
2022.09.17 -
전역 속성
HTML 에서 속성이란 열리는 태그에 작성하는 href, target, src 같은 HTML 의 기능을 확장해주는 개념이다. 기본적으로 요소들은 자신이 사용할 수 있는 속성이 정해져 있다. (img태그: src, a태그: href 등) 하지만 전역 속성은 body 에서 사용하는 태그들의 전체 영역에서 언제든지 사용할 수 있다. 1.title NAVER 요소의 정보나 설명을 지정한다. 해당 요소에 마우스를 올리면 일종의 tooltip 처럼 title 속성이 출력된다. 2. style 요소에 적용할 스타일을 지정한다. 3. class 요소를 지칭하는 중복 가능한 이름이다. css, js 에서 해당 요소를 제어하기 위해서 사용한다. 4. id 요소를 지칭하는 중복이 불가능한 고유한 이름이다. 자주 사용하지는 ..
2022.09.15 -
웹 이미지
웹에서 사용할 수 있는 이미지라는 개념은 크게 비트맵과 벡터로 나뉘게 된다. 1. 비트맵 (Bitmap) 각각의 픽셀이 모여 만들어진 정보의 집합 레스터(Raster) 이미지 라고도 부름 일반적인 사진, 그림은 비트맵이 훨씬 더 사용하기에 효과적임 장점: 정교하고 다양한 색상을 자연스럽게 표현할 수 있음 단점: 확대/축소 시 계단 현상이 나타나고 품질이 저하됨 .jpg .gif .png (1). JPG (JPEG) Full-Color 와 Gray-scale 의 압축을 위해 만들어졌으며, 압축률이 훌륭해 사진이나 예술 분야에서 많이 사용함 손실 압축: 이미지의 픽셀이 손실되면서 압축되기 때문에 용량이 획기적으로 줄어들 수 있음 표현 색상도(24비트, 약 1600만 색상)가 뛰어남 이미지의 품질과 용량을 쉽..
2022.09.15 -
웹 표준과 크로스 브라우징
웹 표준 (Web Standard) 웹 표준이란 웹에서 사용되는 표준 기술이나 규칙을 의미한다. W3C 의 표준화 제정 단계의 권고안(REC) 에 해당하는 기술이다. W3C 의 표준화 제정 단계는 크게 다음과 같이 4가지 단계를 가진다. 초안 (Working Draft, WD) 후보권고안 (Candidate Recommendation, CR) 제안권고안 (Proposed Recommendation, PR) 권고안 (W3C Recommendation, REC) 구글, 마이크로소프트, 애플 같은 브라우저 공급업체 (Browser Vendors) 에서는 제정된 웹표준을 근거로 해서 브라우저를 만든다. 브라우저 공급업체가 각각 다르기 때문에, 브라우저에서 동작하는 내용들도 일부가 다를 수 있다. 크로스 브라우징..
2022.09.15 -
웹 애플리케이션의 동작 원리
브라우저를 통해서 접속할 수 있는 사이트들은 기본적으로 아래의 구조로 동작한다. 1. 최초 요청 (Request) 사용자가 브라우저의 주소창에 프로토콜과 사이트 주소를 입력함으로써 해당 사이트 주소와 일치하는 서버로 최초로 요청을 한다. 예) https://autumnly1007.tistory.com * 프로토콜 : 컴퓨터 또는 원거리 통신 장비 간에 메시지를 주고 받는 규칙의 체계 (HTTP, HTTPS, FTP, SSL 등) 2. 최초 응답 (Response) 요청을 받은 서버에서는 요청이 들어온 사용자의 브라우저로 최초로 응답을 한다. 기본적인 웹 사이트의 구조를 담고 있는 HTML 파일을 사용자에게 보낸다. 3. 추가 요청 전달받은 HTML 파일을 통해 화면에 보여질 기본적인 구조들을 확인할 수 ..
2022.09.15