seye2님의 이글루

seye2.egloos.com
포토로그 마이가든

오해의 소지가 있는것 같아서 이 얘기는 꼭 해야될거 같아요. 기타

제가 영어를 절대 잘하지 못하고요.
공부하면서 하는거라 굉장히 어색하거나 끊기는 식의 해석이 된 경우가 많습니다.
요즘 갑자기 방문자가 너무 늘어서 잘못된 정보가 전달될까 걱정이 되네요.
국내에 HTML5관련된 자료가 너무 없어서 외국분들이 쓰신 내용을 옮겨 놓은 것이구요.
제가 영어에 관련된 전문가가 아니라서 굉장히 어색한 내용들이 많이 있을겁니다.
그냥 참고만 해주십시사 하고 글을 올립니다. ^^
원래 블로그 방문자가 많지 않아서 그렇게 부담되지 않았는데...

꼭 참고해주시기 바랍니다~.

트랙백(0)덧글(0)

HTML5 기본태그의 설명 (4. Friends & (Link) Relations) html5

일반적인 링크(a href)는 다른 페이지를 연결하는 간단한 방법이다. Link relations은 다른 페이지를 왜 연결했는지에
대해 설명하는 방법이다.
1. stylesheet는 브라우져에서 보여지는 문서에 대한 CSS규칙을 포함하고 있다.
2. feed는 현재 페이지에서 같은 내용, 표준 구독 포맷을 포함하고 있다.
3. 다른 언어에서 현재 페이지를 번역 할 수 있다.
4. PDF 포맷도 지원한다.

links의 두가지 종류는 links element를 이용하여 만들 수 있다.
1. Links to external resources는 현재 페이지를 확장하는 것을 사용하여 resources를 links 한다.
2. hyperlink links는 외부 문서를 links한다.

external resources에서 links의 정확한 동작은 정확한 관계(관련된 link type의 정의)에 의존한다.

종종, link relations은 페이지의 <head>내에서 <link> element로 볼 수 있다.
몇 link relations들은 <a> elements일 수 있지만, 일반적이지는 않는다. HTML5는 <area>element에서
몇몇 relations을 사용 할 수 있지만, 이것도 덜 일반적이다.(HTML4는 <area>element에서 rel 속성을 허용하지 않는다.)
다음의 링크에서 rel 값을 올바르게 사용하는 것에 대해 볼 수 있다.
the full hcart of link relations(http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#linkTypes)

원서 : http://diveintohtml5.org/detect.html



이어지는 내용
태그 :
트랙백(0)덧글(0)

HTML5 기본태그의 설명 (3. head Element) html5

root element의 첫번째 자식은 일반적으로 <head> element이다. <head>엘레멘트는 medata(페이지의 정보)를 포함하고 있다.
<head> element는 HTML5에서도 변한것은 없다. 하지만 <head> element내의 내용들을 주목할 필요 가 있다.

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>My Weblog</title>
  <link rel="stylesheet" type="text/css" href="style-original.css" />
  <link rel="alternate" type="application/atom+xml" title="My Weblog feed" href="/feed/" />
  <link rel="search" type="application/opensearchdescription+xml" title="My Weblog search" href="opensearch.xml"  />
  <link rel="shortcut icon" href="/favicon.ico" />
</head>

- Character Encoding

컴퓨터는 문자를 인식하지 못하고 bits와 bytes를 문자로 표현한다. 컴퓨터는 스크린에 표현하기 위해 저장된
특별한 Character Encoding을 이용하여 표현한다. 다양한 character encodings하고, 몇몇 언어
(Russian, Chinese, English, Others)과 같은 특별한 언어들을 효과적으로 표현한다.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
위와 같이 사용하는 것에 대해 간단하게 말하면, 이렇게 정의하게 되면 웹 저자는 UTF-8 character encoding을
사용하여 HTML문서를 작성하는것으로 생각한다.
HTML5에서는 character set의 <meta>태그 설정이 더 쉬워졌다.

<meta charset="utf-8">

원서 : http://diveintohtml5.org/detect.html

태그 :
트랙백(0)덧글(0)

The Perfect Multi-Column Stacked Liquid Layout html/css

No CSS hacks. SEO friendly. No Images. No JavaScript.
Cross-browser & iPhone compatible.

layout 구성에 대해서 정리해놓은 내용인데요.

CSS hack을 사용하지 않고, SEO에 적합하고, iphone에서의 호환성이라는 제목으로 올라온 글이고, px, em, %단위로 분류를 해놓았어요.


(http://matthewjamestaylor.com/blog/perfect-stacked-columns.htm)

트랙백(0)덧글(0)

HTML5 기본태그의 설명 (2. Root Element) html5

저자 : Mark Pilgrim

 - The Root Element

 HTML페이지는 중첩 엘레멘트의 연속이다. 페이지의 구조는 tree와 같다. 몇몇 엘레멘트는 같은 트리에서 확장된
 두개의 가지처럼 묶음이다.
 또 다른 엘레멘트들은 다른 엘레멘트의 자식일 수 있고, 이것은 큰 가지로 부터 확장된 작은 가지와 같다.
 자식이 없는 엘레멘트들을 "leaf"(나뭇잎)노드라고 부른다. 가장 상위에 위치한 노드(페이지의 다른 엘레멘트들의 최상위 노드)를
 "root element"라고 부른다. html의 root element는 <html>이다.

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
위의 markup은 잘못되지 않았다. 이러한 방식은 HTML5에서 유효하다. 하지만 너무 길기 때문에 bytes수를 아끼기 위해
쓸모 없는 것들을 지우는 것이 좋다.
http://www.w3.org/1999/xhtml은 xhtml namespace를 말하고 있다. 하지만 HTML5는 항상 namespace를 가지고 있기
때문에, 재정의 하는것은 필요하지 않다. HTML5페이지는 모든 브라우져에서 똑같이 적용된다.
xmlns는 더이상 필요하지 않다.
<html lang="en" xml:lang="en">

또, 위의 코드중 lang과 xml:lang 두개의 속성은 이 페이지의 언어를 설정한다. 왜 이 두가지 속성을 쓰는 것일까?
다시 말하면, 이것은  xhtml의 흔적이다. HTML5에는 한가지 속성만을 사용한다. 만약, xml:lang속성을 쓰고 싶다면 써도 괜찮다.
<html lang="en">

원서 : http://diveintohtml5.org/detect.html
트랙백(0)덧글(2)
1 2 3 4 5 6 7 8 9 10 다음
seye2.egloos.com is powered by Egloos. Subscribe to RSS Skin design by egloos.