HTML5에서 요소(Element)들은 집으로 생각하면 집, 집을 구성하는 벽, 기둥, 식탁, 의자, TV, 컴퓨터와 같이 하나의 독립적으로 존재하는 객체(object)라고 할 수 있습니다. 하지만 지금 설명하는 속성(Attribute)은 요소(Element)처럼 독립적으로 움직이는 형태가 아닌 요소(Element)와 함께 사용되는 것으로 요소(Element)에 종속적입니다. 예를 들어 컴퓨터(Element)를 생각해보면 컴퓨터를 분류할 때 노트북 형태, 데스크탑 형태, 검은색 노트북, 흰색 노트북, … 등 컴퓨터의 형태, 색상 등과 같이 컴퓨터라는 요소(Element)를 구분하는데 도움을 주는 역할을 하는 것이 바로 속성(Attribute)입니다. 속성은 시작 태그 내에 다음과 같은 형식으로 하나 이상..
1.3.1 HTML5의 요소(Element) 작성 방법 HTML5에서 요소(Element)는 일반적으로 다음과 같은 형식으로 HTML5 문서에 나타냅니다. 내용(텍스트, ...) 위에서 보는 것처럼 앞의 을 시작 태그(start tag), 맨 뒤의 을 마침 태그(end tag)라고 하며 웹 브라우저에 의해서 요소이름을 확인하고 해당 요소에 대한 적용은 내용(텍스트, …) 부분에 적용되게 됩니다. 예를 들어 문장의 절이나 단락을 나타내는데 사용되는 p 요소를 이용하여 “혼자 여행가도 안전한 나라” 라는 텍스트를 웹 브라우저를 통해 나타내려면 다음과 같이 하면 됩니다. 혼자 여행가도 안전한 나라 그러면 웹 브라우저에서는 내부적으로 시작 태그인 와 마침 태그인 를 제거하고 웹 브라우저에 다음과 같이 나타냅니다..
rsync 에는 ssh 를 이용하여 원격서버에 접속하여 동기화를 하는 기능이 있습니다. 대략의 내용은 아래와 같습니다. rsync -azrtv --delete --stats -e "ssh -i /root/.ssh/개인키" 원본서버계정@원본서버주소:원본경로/ /백업경로/ 일단 접속하기 위한 원격주소의 계정 정보가 필요합니다. 즉 ssh 로 원격서버로 로그인을 하는것입니다. 하지만 crontab을 이용하여 자동으로 스케쥴링을 하려면은 암호를 입력하는 단계가 걸림돌이죠 바로 자동로그인을 해야된다는 의미입니다. 그러기위해서는 ssh 키를 이용하는데 먼저 키를 생성합니다. 주의 할점은 개인키를 가진쪽이 공개키를 가진쪽으로 접속한다는 것입니다. 즉... 접속대상서버가 아니라 접속을 시도하는 백업서버에서 키를 만든다..
1.3 HTML5의 구조(structure) 개인적으로 HTML 문서의 구조를 이해하는 가장 쉬운 방법은 먼저 HTML을 이용하여 만들어진 결과물을 통해 역으로 접근해보는 것이 이론적인 설명보다 빠르다고 생각합니다. 먼저 현재 HTML4.01 버전으로 잘 짜여진 웹 페이지를 보기 위해서 여러분들이 좋아하는 다음, 네이버, 네이트 등의 사이트를 IE, Firefox, Chrome 같은 웹 브라우저로 열어보는 것으로 시작하는데 여기서는 IE를 이용하여 다음(Daum) 사이트에 접속하여 설명합니다. 위 화면엣 F12키를 누르면 아래와 같은 개발자도구가 나타납니다. 주요 부분 코드를 나타내면 다음과 같습니다. 다른 사이트를 보다보면 아직까지 로 시작하는 사이트가 있을것입니다. 이것은 XHTML1.0 표준을 따라..
1.2 웹 브라우저(Browser)의 기능과 한계익스플로러(Internet Explorer), 파이어폭스(Firefox), 크롬(Chrome), 사파리(Safari), 오페라(Opera) 같은 웹 브라우저들은 HTML 문서들 속에 포함된 다양한 태그(tag)를 읽어서 시각적 혹은 청각적으로 웹 페이지를 여러분들이 보고 들을 수 있도록 나타내는 역할을 합니다.구체적으로 말하자면 각 웹 브라우저 별로 독자적인 웹 브라우저 엔진 혹은 “layout engine” 혹은 “rendering engine” 이라 불리는 컴포넌트가 포함되어 있는데 이 웹 브라우저 엔진이 HTML, XML, Image 등과 같은 내용(content)를 포함하는 마크업 데이터나 이 책에서 다루는 CSS나 XML 기반의 스타일 형식인 XS..
1. HTML5 구조/기본지식 알아보기 HTML5를 학습하는데 있어 기본적인 내용을 설명하기에 앞서 먼저 HTML5의 특징을 간략하게 요약하면 다음과 같습니다. 첫째, 멀티미디어 기능 지원이 강화되었습니다.HTML5 이전에는 이미지, 오디오, 비디오 등과 같은 멀티미디어 기능과 벡터 이미지를 웹 페이지에 나타내기 위해서 어도비(Adobe)사의 플래시(Flash)나 마이크로소프트(Microsoft)사의 Silverlight가 필요했었지만 HTML5에서는 canvas, audio, video, svg 요소 등을 이용하여 해당 기능들을 구현할 수 있습니다. 둘째, Web Storage 기능이 새롭게 등장하였습니다.상대적으로 크기가 작은 파일에 사용자의 아이디, 쇼핑 정보 등을 저장할 수 있는 Web Stora..
웹 사이트 개발 시, 주요한 이슈중의 하나를 꼽자면 크로스 도메인(Cross Domain)이 있습니다. 최근 대부분의 웹 브라우저는 Javascript(JQuery)를 이용하여 AJAX 등을 통해서 다른 도메인의 서버의 URL 을 호출하여 데이터를 가져오는 경우, 보안 문제를 발생시킵니다. 만약 우리 웹 서비스에서만 사용하기 위해 다른 서브 도메인을 가진 API 함수를 제공하는 API 서버를 구축하였는데, 다른 웹 서비스에서 이 API 서버에 접근하여 마음대로 API를 호출하여 사용한다면 문제가 되겠죠. 그래서 Javascript 는 동일 출처 정책(Same Origin Policy) 라는 정책을 두어 다른 도메인의 서버에 요청하는 것을 보안 문제로 간주하고 이를 차단합니다. 즉, Javascript는 ..