Form Follows Energy

건물 에너지, IT와 여러 가지 글들

홈페이지의 메타 태그를 입력하다.

May 18th, 2007

이 홈페이지의 정보가 실린 외국 사이트에 들어가 봤더니, meta description이 필요하다는 글귀가 있어서, 메타 태그를 입력하였다.
아래는 입력한 내용이다.

홈페이지 관리는 끝이 없는 듯 하다.

서치엔진에서 상위리스트 올리는 방법

May 18th, 2007

 서치엔진은 검색결과에 따른 순위 부여에 있어서 나름대로의 방식으로 가중치를 부여하고 있기 때문에 동일한 키워드 조합으로 홈페이지를 등록하더라도 검색순위에 있어 서로 다른 순위가 나타난다.

그러나 이러한 점을 염두에 두더라도 다양한 검색 우선순위에 있어서 공통적으로 중요시 여기는 항목을 채크함으로서 인터넷 마케팅과 홍보에 있어 탁월한 효과를 이루어 낼 수 있다.

이제 Search Engine에서 상위리스트에 올리는 방법을 알아보기로 하자.
요즘엔 아래 방법대로 하더라도 실제 상위에 올라간다는 보장은 없다.
실제 탁월한 상위 리스트 올리는 방법은 인제 돈이다..ㅡㅡ;

▶’Description tag’ 의 내용선택

<META NAME=”description” CONTENT=”키워드 나열방법보다는 웹페이지의 내용을 요약설명하되 핵심내용을 먼저 쓰고 부가설명은 나중에 위치시킨다.”>

Search Engine은 검색 결과를 출력할 때 해당 web page에 대한 설명을 하기 위해 page 내용이 요약되어 있는
description tag의 내용을 참고하기 때문에 이 부분은 인터넷 사용자들이 해당 web page 방문여부를 결정하는데
결정적인 영향을 주고 있다. 키워드가 되는 단어들을 의미 없이 나열하지 말고 해당 web page의 내용을 요약 하는 방식이
좋다.

▶’Description tag’의 길이 제한

문법 : <META NAME=”description” CONTENT=”공백포함 150자 이내”>

각 Search Engine별로 길이 제한이 다르기 때문에 모든 Search Engine에서 서술한 내용이 모두 보여기지기를 원한다면 공백을 포함하여 150자 이내로 하는 것이 좋다.

그 이상의 내용을 쓰고자 한다면 먼저 150자 이내에 가장 핵심적인 내용을 쓰고 그 후에 부가적인 설명을 하도록 하는 것이 좋다.

▶’Keywords tag’ 키워드의 선택

문법 : <META NAME=”keywords” CONTENT=”키워드, 쉼표, 띄어쓰기”>

어떤 Search Engine 들은 index 저장을 위해 할당된 디스크 공간을 절약하고 검색속도를 빠르게 하기 위해
“internet” 이나 “web”등과 같이 흔히 사용되는 몇몇 단어들(Stop Words)에 대해서는 index 시 이를
포함시키지 않거나 또는 검색자가 검색을 실시할 때 해당 단어에 대한 검색은 생략하고 있다.

이와 같은 stop word를 keyword로 설정하였을 경우 index에 포함되지 않기 때문에 page 순위 향상에 아무런
도움이 되지 않기 때문에 이에 대한 해결책으로 “web design” 과 같은 형식으로 단어를 ” ” 로 묶어서 처리하여야 한다.

즉 “internet”, “web” 과 같은 너무 흔한 키워드는 robot이 인식하지 않기 때문에 효과가 없으며, 문서의 성격과 관련이 높은 키워드를 선택함으로서 표적고객을 확보할 수 있다.

그러나 역발상으로 ‘amazon’, ‘yahoo’, ‘sex’ 와 같이 많은 사람들이 즐겨 검색에 사용하는 유인키워드를
입력함으로서 다양한 사람들의 방문을 유도하는 방법들이 활용되기도 하는데, 이러한 경,우에도 글자색을 배경색과 일치시키는 Font
Matching 방법이 자주 적용되어진다.

▶’Keywords tag’ 단어의 개수 제한

키워드는 200개 이하의 숫자가 적합한데 그 이상의 키워드를 입력하였을 경우 penalty를 받게 되므로 이에 주의하여야 한다.

▶조합형 Keyword 활용

홈페이지를 명확하게 설명할 수 있는 키워드를 선택한 후에는 이를 그대로 키워드로 기입하지 말고 조합형 키워드로 새롭게 구성하여 추가하는 것이 좋다.
예를 들자면 keyword로 “우표”, “수집”과 같이 단일형 키워드만으로 구성하는 것 보다는 “우표 수집”과 같이 조합형 키워드를 추가로 활용하는 것이 필요하다.

▶조합형 키워드의 배열

조합형 키워드의 배열은 “우표수집”, “우표”, “수집”의 순서로 배열하는 것이 좋으며 조합형 키워드의 반복에 있어서도 단어별 반복보다는 교차반복을 하는 것이 좋다.
즉 “우표수집”, “우표”, “수집”, “우표수집”, “우표”, “수집”, “우표수집”, “우표”, “수집”과 같은 방식으로
교차하여 반복하는 것이 좋으며’ “우표수집”, “우표수집”, “우표수집”, “우표”, “우표”, “우표”, “수집”, “수집”,
“수집” 과 같은 방식의 반복은 penalty를 받게 될 가능성이 있다.

▶’Keyword’ 내에 동일 단어 반복 횟수

일반적으로 keyword내에 동일 단어가 7개 이상 반복되면 panelty가 적용되는데 Search Engine마다 그 기준이
다르기 때문에 모든 Search Engine에 등록되기를 원한다면 3번 이상 반복하지 않는 것이 좋다.

▶’Title’ 내의 키워드 위치 – <title> 키워드 </title>

모든 search engine은 web page의 title 에 keyword가 나타날 경우 높은 가중치를 부여하고 있다.
따라서 홈페이지의 타이틀 부분 즉 <title>과 </title> 사이에 반드시 키워드를 입력하여야 하며
해당 page의 가장 처음 부분 가까이에 keyword를 위치시킴으로써 높은 우선 순위를 보장받을 수 있다.

▶문서내의 키워드의 빈도 – <body> 키워드 </body>

모든 Search Engine은 페이지내에 keyword가 기타 다른 단어와 비교하여 얼마나 높은 빈도를 보이는 가를 분석하기
때문에 문서부분 즉 <body>와 </body> 사이에 Keyword 빈도를 높임으로써 해당 page를
높은 우선 순위에 올릴 수 있다.

▶주의 : Keyword Spamming

그러나 이러한 점을 악용하여 keyword의 빈도를 높이기 위해 page내에 배경색상과 동일한 keyword(Font
Matching)를 수백개 이상씩 입력하게 됨에 따라 Search Engine들은 web page내 일정한 횟수 이상의
keyword가 나타날 경우 spam으로 간주하고 패널티를 적용하여 순위를 깍거나 robot이 index 대상에서 제외시키도록
하고 있다.

▶Link Popularity

WebCrawler와 같은 몇몇 Search Engine들은 해당 web page가 얼마나 많은 다른 외부의 web page에 의해 링크되어 있는가를 판별하여 우선순위를 결정하기도 하는데 이를 Link Popularity라 한다.

이와 더불어 새롭게 나타나는 경향 중 하나는 홈페이지의 엘리트 그룹화다. 위와 같은 방법 등을 써서 검색엔진에서 1∼10등을
차치한 사이트들이 소위 동맹을 맺는 방식이다. 이 사이트들은 서로 자기들끼리 링크하기 때문에 1등부터 10등 중 어느 사이트로
들어와도 링크만 따라간다면 방문자는 이들 사이트 모두를 방문하게 되는 것이다. 이들 10개 사이트 중 마음에 드는 것이 있으면
자기 홈페이지에 링크시키게 된다.

이런 일이 반복되면 탑 텐 사이트들은 그 키워드의 중심 축이 된다. 한번 중심 축으로 자리 잡으면 검색엔진의 랭킹에서도 유리하다. 알타비스타와 같은 검색엔진은 다른 홈페이지에 링크가 많이 되면 될수록 랭킹을 올려주기 때문이다.

다른 사이트에 링크가 많이 되어 있으면 그만큼 인기있는 사이트로 여기는 탓이다. 참고로 자기 홈페이지가 인터넷에서 얼마나
링크되어 있는지 알려면 알타비스타에서 ‘링크'(link) 명령어를 쓴다. 키워드 난에 다음과 같이 적고 ‘서치’ 버튼을 누른다.

link:자기 홈페이지 주소나 도메인 예) link:altavista.com link:altavista.com/inchul/sin,
link:altavista.com/inchul/sin/epgi.html

▶페이지의 갱신정도

일부 서치엔진은 page가 갱신되는 정도에 따라 robot의 방문률이 높아지도록 설정하였기 때문에 가급적이면 페이지를 자주 갱신하는 것이 변경된 페이지 정보에 대한 명확한 전달이 가능하다.

▶복수형 키워드 (영어키워드의 경우)

영어로 작성된 키워드의 경우 단수형 단어 보다는 복수형의 단어를 활용하는 것이 좋다.
예를 들어 “stamp”를 키워드 보다는 “stamps”와 같이 복수형태의 키워드를 이용하는 것이 좋다.
이와 같은 이유는 stamps를 키워드로 사용하면 stamp 및 stamps에 대한 검색 모두에 리스트 될 수 있지만 stamp를 사용하면 stamps를 검색어로 사용했을 때 제외될 수 있기 때문이다.

▶다양한 키워드 사용

자신의 페이지에 적합한 키워드를 집중적으로 기록함으로서 해당 키워드 검색시 높은 순위에 올려질 가능성이 많다. 하지만 순위는
다소 떨어질지라도 다양한 키워드를 입력함으로서 다양한 항목의 검색리스트에 올려질 가능성이 높아진다고 할 수 있다.

▶Headline Tag의 이용 <H1>

키워드를 <H1>과 같은 Headline tag를 활용함으로서 검색리스트 에 있어 높은 순위를 설정받을 수 있다.

▶KeyWord GateWay

이외에도 무료홈페이지서비스를 이용하여 유인페이지를 작성한후 유인페이지내에 메타태그 정보 와 키워드를 구성한후 다음과 같이

<META HTTP-EQUIV=”Refresh” CONTENT=”5;URL=자신의 홈페이지 URL”>

메타태그를 구성하면 검색로봇이 유인페이지를 인식하여 검색결과를 보여주면 자동으로 5초후에 자신의 메인페이지로 이동하는 KeyWord GateWay도 메타태그를 활용한 프로모션방법으로 많이 활용되고있다.

대부분의 유명 웹프로모션회사들은 이러한 KeyWord Gateway를 자사의 서버에 만든후 검색순위관리와 페이지구성을 매주 새롭게 갱신시켜주고있다.

이러한 KeyWord Gateway는 성인사이트에서 서치엔진, 뉴스그룹, 배너익스체인지를 통하여 사이트를 홍보한후 방문자들을 유인하는 방법으로 많이 쓰이고있다.

Meta Tag는 검색결과에 직접적으로 영향을 미치는 중요한 요소이기 때문에 자신의 사이트 내용과 연관된 키워드로 서치엔진을
검색한 후 상위에 나오는 Meta Tag의 코드를 그대로 따와서(Meta Jacking)자신의 홈페이지에 삽입하면 상위에 랭킹된
사이트의 키워드와 내용을 검색로봇이 동일하게 인식하기 때문에 높은 검색결과를 얻을 수 있다

내용출처 : [기타] 인터넷 : http://cafe.daum.net/halfbuy
참고자료 : 인터넷 : http://searchenginewatch.com/showPage.html?page=2167931

HTML Standard Attributes

August 31st, 2006

HTML tags can have attributes. The special attributes for each tag are listed under each tag description. The attributes listed here are the core and language attributes that are standard for all tags (with a few exceptions).


Core Attributes

Not valid in base, head, html, meta, param, script, style, and title elements.

Attribute Value Description
class class_rule or style_rule The class of the element
id id_name A unique id for the element
style style_definition An inline style definition
title tooltip_text A text to display in a tool tip


Language Attributes

Not valid in base, br, frame, frameset, hr, iframe, param, and script elements.

Attribute Value Description
dir ltr | rtl Sets the text direction
lang language_code Sets the language code


Keyboard Attributes

Attribute Value Description
accesskey character Sets a keyboard shortcut to access an element
tabindex number Sets the tab order of an element

Strict HTML 4.01로 가기 위한 지침서

August 31st, 2006

Strict HTML 4.01로 가기 위한 지침서

  • 항상 모든 웹페이지는 DOCTYPE로 시작되어야 함
  • 바로 다음에 오는 <html> 엘리먼트는 웹 페이지의 최상위 혹은 루트 엘리먼트가 되어야 함
  • DOCTYPE다음에 오는 <html>태그로 페이지를 시작해서 </html>태그로 페이지를 끝내야 하며, <head>와 <body>만이 <html>엘리먼트 안에 들어갈 수 있음
  • <head>엘리먼트에는 <title>엘리먼트가 항상 있어야 함
  • <head>엘리먼트에 <title>, <meta>, <style>엘리먼트만 올 수 있음
  • <body>에는 블록 엘리먼트(block element)만 포함할 수 있음
  • 모든 인라인 엘리먼트(inline element)와 텍스트sms <body>엘리먼트 안에 들어가기 전에 다른 블록 엘리먼트 안으로 들어가야 함
  • 인라인 엘리먼트 안에는 텍스트와 다른 인라인 엘리먼트만 들어갈 수 있음
  • 인라인 엘리먼트 안에 블록 엘리먼트를 포함할 수 없음
  • <p>엘리먼트 안에 블록엘리먼트를 두면 안 됨
  • 리스트인 <ul>과 <ol> 엘리먼트 안에는 오직 <li>엘리먼트만 들어올 수 있음
  • <li>엘리먼트 안에는 무엇이든지 포함될 수 있음
  • <blockquote>는 오직 블록 엘리먼트만 포함될 수 있음

HTML 4.01 / XHTML 1.0 Reference

August 31st, 2006

Ordered by Function

  • NN: indicates the earliest version of Netscape that supports the tag
  • IE: indicates the earliest version of Internet Explorer that supports the tag
  • DTD: indicates in which XHTML 1.0 DTD the tag is allowed. S=Strict, T=Transitional, and F=Frameset 
Start tag Purpose NN IE DTD
Basic Tags
<!DOCTYPE> Defines the document type STF
<html> Defines an html document 3.0 3.0 STF
<body> Defines the body element 3.0 3.0 STF
<h1> to <h6> Defines header 1 to header 6 3.0 3.0 STF
<p> Defines a paragraph 3.0 3.0 STF
<br> Inserts a single line break 3.0 3.0 STF
<hr> Defines a horizontal rule 3.0 3.0 STF
<!–…–> Defines a comment 3.0 3.0 STF
Char Format
<b> Defines bold text 3.0 3.0 STF
<font> Deprecated. Defines text font, size, and color 3.0 3.0 TF
<i> Defines italic text 3.0 3.0 STF
<em> Defines emphasized text 3.0 3.0 STF
<big> Defines big text 3.0 3.0 STF
<strong> Defines strong text 3.0 3.0 STF
<small> Defines small text 3.0 3.0 STF
<sup> Defines superscripted text 3.0 3.0 STF
<sub> Defines subscripted text 3.0 3.0 STF
<bdo> Defines the direction of text display 6.2 5.0 STF
<u> Deprecated. Defines underlined text 3.0 3.0 TF
Output
<pre> Defines preformatted text 3.0 3.0 STF
<code> Defines computer code text 3.0 3.0 STF
<tt> Defines teletype text 3.0 3.0 STF
<kbd> Defines keyboard text 3.0 3.0 STF
<var> Defines a variable 3.0 3.0 STF
<dfn> Defines a definition term 3.0 STF
<samp> Defines sample computer code 3.0 3.0 STF
<xmp> Deprecated. Defines preformatted text 3.0 3.0
Blocks
<acronym> Defines an acronym 6.2 4.0 STF
<abbr> Defines an abbreviation 6.2 STF
<address> Defines an address element 4.0 4.0 STF
<blockquote> Defines a long quotation 3.0 3.0 STF
<center> Deprecated. Defines centered text 3.0 3.0 TF
<q> Defines a short quotation 6.2 4.0 STF
<cite> Defines a citation 3.0 3.0 STF
<ins> Defines inserted text 6.2 4.0 STF
<del> Defines deleted text 6.2 4.0 STF
<s> Deprecated. Defines strikethrough text 3.0 3.0 TF
<strike> Deprecated. Defines strikethrough text 3.0 3.0 TF
Links
<a> Defines an anchor 3.0 3.0 STF
<link> Defines a resource reference 4.0 3.0 STF
Frames
<frame> Defines a sub window (a frame) 3.0 3.0 F
<frameset> Defines a set of frames 3.0 3.0 F
<noframes> Defines a noframe section 3.0 3.0 TF
<iframe> Defines an inline sub window (frame) 6.0 4.0 TF
Input
<form> Defines a form 3.0 3.0 STF
<input> Defines an input field 3.0 3.0 STF
<textarea> Defines a text area 3.0 3.0 STF
<button> Defines a push button 6.2 4.0 STF
<select> Defines a selectable list 3.0 3.0 STF
<optgroup> Defines an option group 6.0 6.0 STF
<option> Defines an item in a list box 3.0 3.0 STF
<label> Defines a label for a form control 6.2 4.0 STF
<fieldset> Defines a fieldset 6.2 4.0 STF
<legend> Defines a title in a fieldset 6.2 4.0 STF
<isindex> Deprecated. Defines a single-line input field 3.0 3.0 TF
Lists
<ul> Defines an unordered list 3.0 3.0 STF
<ol> Defines an ordered list 3.0 3.0 STF
<li> Defines a list item 3.0 3.0 STF
<dir> Deprecated. Defines a directory list 3.0 3.0 TF
<dl> Defines a definition list 3.0 3.0 STF
<dt> Defines a definition term 3.0 3.0 STF
<dd> Defines a definition description 3.0 3.0 STF
<menu> Deprecated. Defines a menu list 3.0 3.0 TF
Images
<img> Defines an image 3.0 3.0 STF
<map> Defines an image map 3.0 3.0 STF
<area> Defines an area inside an image map 3.0 3.0 STF
Tables
<table> Defines a table 3.0 3.0 STF
<caption> Defines a table caption 3.0 3.0 STF
<th> Defines a table header 3.0 3.0 STF
<tr> Defines a table row 3.0 3.0 STF
<td> Defines a table cell 3.0 3.0 STF
<thead> Defines a table header 4.0 STF
<tbody> Defines a table body 4.0 STF
<tfoot> Defines a table footer 4.0 STF
<col> Defines attributes for table columns 3.0 STF
<colgroup> Defines groups of table columns 3.0 STF
Styles
<style> Defines a style definition 4.0 3.0 STF
<div> Defines a section in a document 3.0 3.0 STF
<span> Defines a section in a document 4.0 3.0 STF
Meta Info
<head> Defines information about the document 3.0 3.0 STF
<title> Defines the document title 3.0 3.0 STF
<meta> Defines meta information 3.0 3.0 STF
<base> Defines a base URL for all the links in a page 3.0 3.0 STF
<basefont> Deprecated. Defines a base font 3.0 3.0 TF
Programming
<script> Defines a script 3.0 3.0 STF
<noscript> Defines a noscript section 3.0 3.0 STF
<applet> Deprecated. Defines an applet 2.0 3.0 TF
<object> Defines an embedded object 3.0 STF
<param> Defines a parameter for an object 3.0 3.0 STF

홈페이지 자동 이동

June 5th, 2002

주소가 바뀐 홈페이지들을 보면 몇초후..자동이동합니다 라는
자동이동 하는 것을 많이 봤을 것이다.
일반 웹 에디터에선 스크립트 마법사를 써서 할 수도 있고,
그냥 간단하게 <head></head>사이 아래 값만 넣어주면 된다.
<meta http-equiv="refresh" content="3;url=http://solarview.kunsan.ac.kr/lab">

3은 이동지연 되는 시간이다.
3초후에 이 홈페이지로 이동한다는 말이다

[사용팁]
– 홈페이지를 새 폴더로 업그레이드를 할 경우, 그 폴더로 이동시킬 수 있음