티스토리 블로그 운영 중 사이트맵을 등록하려고 하면 '사이트맵을 읽을 수 있지만 오류가 있습니다. 사이트맵이 HTML입니다.'라는 팝업창이 뜨면서 사이트맵이 등록되지 않는 경우가 있습니다. 이는 오류라기보다는 사이트맵 제출의 요건을 충족하지 못했기 때문에 발생하는 오류입니다. 사이트맵은 보통 제출 가능한 확장자가 정해져 있습니다. 구글에서 지원하는 확장자는 다음과 같습니다. 구글은 사이트맵의 확장자로 XML, RSS, mRSS, Atom 1.0, 텍스트(txt) 등을 지원하는 데, 위의 오류가 발생한 사례는 일반 웹 문서 확장자 형식인 HTML 또는 HTM으로 제출하였기 때문에 규정에 맞지 않아 발생하는 오류입니다. 티스토리 블로그에서 사이트맵을 구글에 등록하고자 할 경우에 먼저 구글 서치 콘솔 사이트로..
Media 태그란 동영상을 링크하는 Video 태그, 사운드를 링크하는 Audio 태그, 이미지를 링크하는 Img 태그를 말합니다. 다시 말해, Video 태그는 비디오 동영상을 문서 내에 삽입할 때, Audio 태그는 오디오를 문서 내에 삽입할 때, Img 태그는 이미지나 사진 등을 문서 내에 삽입할 때 사용합니다. 태그는 페이지에 이미지를 삽입해야 할 경우에 사용하는 태그입니다. 태그는 'src'라는 필수 속성이 있어야 합니다. 티스토리의 경우에 신에디터를 쓰고는 있지만 유일한 불만이 구에디터에서 처럼 img 태그가 자동으로 들어가지 않는 다는 점입니다. 이미지 검색을 신경 쓰지 않을 수 없는 것이 추세인데 신에디터의 경우에는 img 태그를 이미지에 넣으려면 수동으로 직접 삽입해야 합니다. html ..
태그는 레이아웃을 나눌 때 사용하는 태그로 콘텐츠의 형태를 변형시키지는 않지만 하위에 있는 여러 요소를 묶어 스타일을 변경시킬 수 있습니다. Division Maker의 줄임말로 영역을 구분 짓는 태그 엘리먼트로 작동하게 됩니다. 는 블럭 레벨 항목(Block Level Element : 해당 항목의 앞뒤 항목들이 가로로 이어지지 않고 엔터 입력의 경우처럼 줄 바꿈이 이루어지는 요소)으로 앞과 뒤에 있는 항목들을 줄 바꿈 시킵니다. 다은 기본 요소들과 비교해 볼 때 , , , 는 모두 기본적으로는 와 같은 역할을 합니다. 차이점이 있다면 div 태그에 의미를 부여한 것입니다. 예를 들어 내용이 하나의 독립된 콘텐츠라면 대신에 을 사용합니다. 바꿔 말해 , , , 모두가 로 대신 사용할 수 있으나 보다 적..
, , 태그들이 목록을 단순 열거 또는 정의할 때 쓰였다는 것은 이미 배웠습니다. , , 태그들 역시 목록을 정의할 때 쓰이지만, 다른 점이 있다면 이 경우에는 사전이 특정 단어의 뜻을 풀어쓰는 것처럼 단어에 대한 그 의미를 정의할 경우에 쓰이는 목록이라는 점입니다. - : Definition List의 약자이며 정의 목록을 말합니다. 주로 정의 목록의 시작점과 끝점에 쓰입니다. - : Definition Term의 약자이며 정의할 용어를 말합니다. 그 의미를 알아야 할 단어 또는 용어 등을 의미합니다. - : Definition Description의 약자이며 용어의 설명 또는 그 의미 해석을 말합니다. 위의 내용을 예제화한 내용의 코드는 아래와 같습니다. dl : Definition List의 약자이..
태그는 Ordered List의 줄임말로 순서가 있는 목록을 표현할 경우에 사용한다고 이전 포스팅에서 배웠습니다. - 이전 포스팅 참조 : itfix.tistory.com/647 그렇다면, ol 태그는 미리 정해진 방식으로만 순서가 표시되어야 하는 걸까요? 아닙니다. ol 태그는 type을 이용하여 처럼 표기하여 리스트의 표현 방식을 직접 지정할 수 있습니다. 사용할 수 있는 속성값은 아래와 같습니다. - 속성값 1 : 10진수 숫자로 순서를 표현하게 됩니다. ex) 1, 2, 3 - 속성값 a : 소문자 알파벳 순서로 순서를 표현하게 됩니다. ex) a, b, c - 속성값 A : 대문자 알파벳 순서로 순서를 표현하게 됩니다. ex) A, B, C - 속성값 i : 로마 숫자 소문자로 순서를 표현하게 ..
아래의 ol, ul, li 세 가지 태그는 모두 목록을 정의할 때 주로 메뉴에서 쓰입니다. 태그는 Ordered List의 약자로 순서가 있는 목록을 말합니다. 태그는 Unordered List의 약자로 순서가 없는 목록을 말합니다. 태그는 List Item의 약자로 각각의 항목들을 나열할 때 쓰는 태그입니다. 아래는 예제 태그 입니다. 1억 5억 10억 벤츠 아우디 재규어 위 코드 블록 내용 중 body 부분을 발췌하여 넣으면 아래와 같습니다. 1억 5억 10억 벤츠 아우디 재규어 위의 예제에서 보다시피 태그는 순서가 있는 목록인 태그와 순서가 없는 목록인 태그 모두에서 아이템 내용 역할을 하는 태그로 작동합니다.
1. 와 태그 태그는 굵은 글꼴을 표현하고 싶을 때 사용하며, 태그는 굵은 글꼴을 표현하는 것 외에도 해당 글의 중요성을 강조하고자 하는 용도로 사용됩니다. W3C에서는 강조하기 위해 이나 을 사용할 것을 권장하고 있습니다. 따라서, 결론적으로 HTML5 표준을 따른 다고 하면 태그보다는 태그를, 태그보다는 태그를 사용하는 것이 부합합니다. b 태그와 strong 태그의 사용례는 아래와 같습니다. - b 태그의 사용례 입니다. - strong 태그의 사용례 입니다. 위의 내용에서 body 부분만을 발췌한 모습은 아래와 같습니다. - b 태그의 사용례 입니다. - strong 태그의 사용례입니다. 위의 외관에서 보면 두 태그 사이에 차이점이 없어 보이지만 브라우저는 b태그나 i태그는 단순 색상의 변경 또는..
태그는 텍스트의 내용 중 하이라이트 표시를 하여 특정 문장이나 단어를 강조하고 싶은 경우에 사용할 수 있습니다. 티스토리의 경우에 에디터 자체에 글자의 배경색 기능이 있으므로 티스토리를 이용하시는 분들에게는 큰 의미는 없습니다. 마크 태그가 이런 의미를 가지고 있다 정도로만 이해하시면 될 것 같습니다. 다만, 마크 태그는 노란색을 기본 색상으로 하므로 이러한 점에서 모든 색상을 선택할 수 있는 티스토리 에디터와는 다르다고 할 수도 있습니다. 마크 태그의 소스 코드 예제의 모습은 아래와 같습니다. mark 태그는 단어를 강조하고 싶은 경우에 배경에 하이라이트 색상을 주는 역할을 합니다. 위의 코드에서 body 태그 내용에 들어간 부분을 나타내면 아래와 같이 보이게 됩니다. mark 태그는 단어를 강조하고 ..
태그는 윗 첨자에 사용하며, 태그는 아랫 첨자를 나타낼 때 사용합니다. 작은 글자를 표현하는 용도로는 사용하지 않으며 화학기호나 수학공식 또는 수학기호 등의 첨자 문자를 표현해야 할 경우에 주로 사용하게 됩니다. 즉, sup는 Superscript(윗첨자)를 나타내며, sub는 Subscript(아랫 첨자)를 나타냅니다. 예제에서 태그를 사용하는 모습은 아래와 같습니다. x = log28 2x = 8 x = 3 body 부분에 들어간 모습을 분리해 내면 아래와 같이 보여지게 됩니다. x = log28 2x = 8 x = 3
abbr 태그는 abbreviation(약자, 약어)의 약자로 마우스 오버 액션에 반응하여 해당 태그 부분에 마우스 커서가 이동하면 윈도우즈 도움말 형식처럼 입력해둔 문장이 나타나게 됩니다. 만약 아래와 같은 코드를 입력하였다고 가정해 보겠습니다. abbr 태그는 마우스에 반응하여 나타나는 글자를 만들 경우에 주로 사용하며 약자의 해설 등에 쓰입니다. 아래의 내용은 위의 코드를 그대로 소스 코드로 옮겨 넣은 내용입니다. abbr 부분에 마우스 커서를 대면 약자의 내용을 보여주게 됩니다. abbr 태그는 마우스에 반응하여 나타나는 글자를 만들 경우에 주로 사용하며 약자의 해설 등에 쓰입니다. abbr 태그에서는 주의해야 할 점이 있는데 abbr title="내용"에서 내용에 들어가는 텍스트는 공백이나 탭,..