네이버 웹마스터도구중 Open Graph (오픈그래프)에 대해 알고자합니다. 사이트주소를 복사해서 게시판등에 붙여넣기 하면, 아래와 같이 Open Graph 정보를 활용하여 나타내기도 합니다. 그럼, Open Graph가 뭘까요? Open Graph(이하 OG)는 웹페이지의 제목, 내용, 대표이미지를 만든 사람이 직접지정하게 하여, 우리 사이트 정보가 잘 보일 수 있도록 돕는 약속입니다. 소스사이에 아래의 메타소스를 입력하면 됩니다.

http://1boon.kakao.com/share/ppttip?dmp_channel=grow#slide/image_1448600367459

1. 반응형페이지의 필요성 현재 사이트를 운영할때에 PC, 스마트폰, 태플릿 등 다양한 기기를 활용하여 접속하는 관계로 인하여, 하나의 페이지로 다양한 접속기기 환경에서의 대응하는 기술이 필요하게 되었다. 그것을 충족하게 한 기술은 반응형홈페이지(RWD, Responsive Web Design) 이다. 즉, 모든 크기의 화면에 대응이 된다. 2. 반응형홈페이지 구현방법 3가지 1) Flexible Image(가변이미지) : 이미지의 크기가 화면크기에 따라 줄어들고 늘어난다. max-width:100% 출처 : http://tobyyun.tumblr.com/ 2) Fluid Grid(가변그리드) : 컬럼의 너비가 창크기에 따라 간격이 자동적으로 조정된다. 그리드는 문서의 서식을 잡아주기 위해 사용되는 규칙..

다양한 유닉스명령어 중 나에게 필요한 것만 고른다.. 1. 선택폴더의 하위폴더 및 파일삭제 : rm -rf 폴더명 2. 압축풀기 : tar -xvf 파일명.tgz

웹표준 사이트 구축을 위해서는 용어설명 1. 태그(tag 1. 명령어의 형태가 '' 되어 있는 것을 태그(tag)라고 합니다. ex) , , , 등 2. 태그 시작과 끝을 하나의 요소(element)라고 합니다. ex) 웹강자, 웹표준 스터디 3. 위의 요소들을 이용하여 웹문서를 작성하는 것을 마크업(markup) 이라고 합니다.

인라인 엘리먼트, 블록 엘리먼트, dl,dt,dd,ul,ol 등 프로그래밍 한 내용을 살펴보면은 이상한 소리들이 많이 나온다. 소스를 수정하려면 가장 중요한 것은 정의를 마음속 깊이 받아 들이는 것부터 시작한다. 1. 인라인 엘리먼트 VS 블록 엘리먼트 비교하기 구분 인라인 엘리먼트 블록 엘리먼트 정의 특징 줄바꿈X 줄바꿈O 관계 인라인은 블록에 포함된다. 속하는 것들 div, dl, dt, dd, ul, ol 등 2. 블록 엘리먼트 구성요소 이해하기 1. 정의 목록 DL, DT, DD 1) DL : 정의목록의 시작을 알린다 2) DT : 정의목록 제목 3) dd : 정의목록 내용 2. 순서가 있는 목록 : ol - Ordered List 의 약자 - 선택한 유형(숫자, 알파벳,로마자)에 따라 순서가 있..