W3CºÎ·Ï B: ¼º´É, Àû¿ë, ¼³°è¿¡ ´ëÇÑ ÁÖ¼®Trio ȨÆäÀÌÁö
¸ñÂ÷
  1. À¯È¿ ¹®¼­¿¡ ´ëÇÑ ÁÖ¼®
  2. URI ¾ÖÆ®¸®ºäÆ® °ª¿¡¼­ Ư¼ö ±ÛÀÚ
    1. URI ¾ÖÆ®¸®ºäÆ® °ª¿¡¼­ ºñ¾Æ½ºÅ°(Non-ASCII) ±ÛÀÚ
    2. URI ¾ÖÆ®¸®ºäÆ®(attribute) °ª¿¡¼­ "&"(ampersand)
  3. SGML Àû¿ë¿¡ ´ëÇÑ ÁÖ¼®
    1. ¿­¹Ù²Þ(Line break)
    2. ºñ HTML(non-HTML) µ¥ÀÌÅÍÀÇ Á¤ÀÇ
    3. SGML ±â´ÉÀÇ Á¦ÇÑ µÈ Áö¿ø
    4. ºÒ¸°(boolean) ¾ÖÆ®¸®ºäÆ®
    5. Ç¥½Ã µÈ Ç׸ñµé
    6. ó¸® Áö½Ã
    7. ¾à½Ä ÀÛ¼º(markup)
  4. Web ½ÎÀÌÆ® °Ë»ö ¿£Áø µµ¿ò »öÀο¡ ´ëÇÑ ÁÖ¼®
    1. °Ë»ö ·Îº¿(robot)
  5. Ç¥(table)¿¡ ´ë ÇÑ ÁÖ¼®
    1. ¼³°è ÇÕ¸®È­
    2. ÃßõµÇ´Â ¹èÄ¡(layout) ±â´É
  6. Æû¿¡ ´ë ÇÑ ÁÖ¼®
    1. Á¡ÁøÀû µð½ºÇ÷¹ÀÌ
    2. ÇâÈÄ ÇÁ·ÎÁ§Æ®
  7. ½ºÅ©¸³Æ®(scripting)¿¡ ´ëÇÑ ÁÖ¼®
    1. ÇâÈÄ ½ºÅ©¸³Å© ¸¶Å©·Î(macro)¸¦ À§ÇÑ ¿¹¾à µÈ ¹®¹ý
  8. ÇÁ·¹ÀÓ¿¡ ´ëÇÑ ÁÖ¼®
  9. Á¢¼Ó¼º¿¡ ´ëÇÑ ÁÖ¼®
  10. º¸¾È¿¡ ´ëÇÑ ÁÖ¼®
    1. ÆûÀÇ º¸¾È ¹®Á¦

´ÙÀ½ ÁÖ¼®µéÀº ±Ô°ÝÀÇ ³»¿ëÀÌ ¾Æ´Ï¶ó, Á¤º¸¸¦ ÁÖ±â À§ÇÑ °ÍÀÌ´Ù. '...ÇÏ¿©¾ß ÇÑ´Ù', 'ÇʼöÀûÀÌ´Ù' µîÀÌ ³ªÅ¸³ªÁö¸¸, ÀÌ Ç׸ñÀÇ ¸ðµç ÇÊ¿ä »çÇ×µéÀº ÀÌ ±Ô°ÝÀÇ ÇØ´ç ºÎºÐ¿¡ ¼³¸íÇÏ¿´´Ù.

B.1 À¯È¿ ¹®¼­¿¡ ´ëÇÑ ÁÖ¼®

ÀÌ ±Ô°Ý¿¡´Â ±Ô°Ý¿¡ ¸Â´Â »ç¿ëµµ±¸°¡, ÀÌ ¹®¼­¿¡ Á¤ÀÇ µÇÁö ¾ÊÀº ¿¤·¹¸àÆ®(element), ¾ÖÆ®¸®ºäÆ®(attribute), ¾ÖÆ®¸®ºäÆ® °ª, ¶Ç´Â ¿£Æ¼Æ¼(entity)À» ¸¸³µÀ» ¶§³ª, ÀϹÝÀûÀÎ ¿À·ù(error) »óȲ¿¡¼­ ¾î¶»°Ô ó¸® ÇÒ °ÍÀΰ¡´Â Á¤ÀÇÇÏÁö ¾Ê¾Ò´Ù.

±×·¯³ª, ½ÇÇèÀº µ½°í, HTMLÀÇ ´Ù¾çÇÑ ¹öÀüµé¿¡¼­ÀÇ »óÈ£ Àû¿ë¼ºµîÀ» °í·ÁÇÏ¿©, ´ÙÀ½°ú °°Àº 󸮸¦ ÃßõÇÑ´Ù. ¸¸ÀÏ »ç¿ëµµ±¸°¡

¶ÇÇÑ »ç¿ëµµ±¸°¡ »ç¿ëÀÚ¿¡°Ô ÀÌ ¿À·ùµéÀ» ¾Ë·Á ÁÖ´Â ±â´ÉÀ» Á¦°ø ÇÒ °ÍÀ» ÃßõÇÑ´Ù.

»ç¿ëµµ±¸µéÀÇ ¿À·ù ó¸® ¹æ¹ýÀÌ ¼­·Î ´Ù¸¦ ¼ö ÀÖÀ¸¹Ç·Î, Á¦ÀÛÀÚ¿Í »ç¿ëÀڴ ƯÁ¤ ¿À·ù ¼öÁ¤ ó¸® ¹æ¹ý¿¡ ÀÇÁ¸ÇÏÁö ¸»¾Æ¾ßÇÑ´Ù.

HTML 2.0 ±Ô°Ý[RFC1866]¿¡¼­ ¸¹Àº HTML 2.0 »ç¿ëµµ±¸´Â, 'ÂüÁ¶ ¹®¼­ ŸÀÔ ¼±¾ðÀ¸·Î ½ÃÀÛÇÏÁö ¾Ê´Â ¹®¼­µéÀº HTML 2.0 ±Ô°ÝÀ» ÂüÁ¶ÇÑ´Ù'°í °¡Á¤ÇÏ¿´¾ú´Ù. ÀÌ°ÍÀº ºó¾àÇÑ °¡Á¤ÀÌ°í, ÇöÀç ±Ô°Ý¿¡¼­´Â ±×·¸°Ô ÇÏ´Â °ÍÀ» ÃßõÇÏÁö ¾Ê´Â´Ù.

¿¹¸¦ µé¾î, »õ·Î¿î ¿£Æ¼Æ¼ Á¤ÀÇ·Î DTD¸¦ È®ÀåÇÏ´Â µî, °øÅëÀûÀÎ »ç¿ë ¹®Á¦µé ¶§¹®¿¡, Á¦ÀÛÀÚ´Â HTML¿¡¼­ »ç¿ë ÇÒ ¼ö ÀÖ´Â SGML ±â´ÉÀ» ÅëÇÏ¿© È®ÀåÇÏÁö ¸»¾Æ¾ßÇÑ´Ù.

B.2 URI ¾ÖÆ®¸®ºäÆ® °ª¿¡¼­ Ư¼ö ±ÛÀÚ

B.2.1 URI ¾ÖÆ®¸®ºäÆ® °ª¿¡¼­ ºñ¾Æ½ºÅ°(Non-ASCII) ±ÛÀÚ

URIµéÀº ºñ¾Æ½ºÅ°(non-ASCII) °ªÀ» °®Áö´Â ¾ÊÀ¸³ª[URIÀÇ Ç׸ñ 2.1], ¶§·Î Á¦ÀÛÀÚ´Â URI(DTD¿¡¼­ %URI;·Î Á¤ÀÇ)¸¦ À§ÇÏ¿© ¾ÖÆ®¸®ºäÆ® °ª¿¡ ºñ¾Æ½ºÅ° °ªÀ» ÁöÁ¤ÇÑ´Ù. ¿¹¸¦ µé¾î, ´ÙÀ½ hrefÀÇ °ªÀº Ʋ¸° °ÍÀÌ´Ù.

<A href="http://foo.org/Håkon">...</A>

»ç¿ëµµ±¸´Â ´ÙÀ½ ºñ¾Æ½ºÅ°(non-ASCII) ±ÛÀÚ Ã³¸® ¹æ¹ýÀ» ä¿ë ÇÒ °ÍÀ» ÃßõÇÑ´Ù.

  1. °¢ ±ÛÀÚ¸¦ ÇÑ°³ ȤÀº ±× ÀÌ»óÀÇ ÀÌÁø¼ö(byte)ÀÎ UTF-8[RFC2044 ÂüÁ¶]·Î Ç¥Çö.
  2. URI º¯È¯(escape) ±â´ÉÀ¸·Î °¢ ÀÌÁø¼ö¸¦ 16Áø¼öÀÎ %HH·Î º¯È¯.

ÀÌ °úÁ¤Àº, URI°¡ HTML ¹®¼­·Î Àç°íµù(transcode) µÉ ¶§, ±ÛÀÚ ¿£ÄÚµù¿¡ ¿µÇâÀ» ¹ÞÁö ¾ÊÀ¸¸ç, ¹®¹ýÀûÀ¸·Î À¯È¿ÇÑ URI[RFC1738 Ç׸ñ 2.2 ¶Ç´Â RFC2141 Ç׸ñ 2¿¡ Á¤ÀÇ]¸¦ ¸¸µé¾î ÁØ´Ù.

ÁÖ±â: ÀϺΠÀÌÀüÀÇ »ç¿ëµµ±¸µéÀº, ¹ÞÀº ¹®¼­ ¾ÈÀÇ ±ÛÀÚ ¿£ÄÚµù ÀÌÁø¼ö(byte)µé¸¦ »ç¿ëÇÏ¿©, ÇÏÂú°Ô HTMLÀÇ URIµéÀ» ó¸®ÇÏ¿´´Ù. ÀϺΠÀÌÀü »ç¿ëµµ±¸µéÀº ÀÌ ¹æ¹ý¿¡ ÀÇÁ¸ÇÏ¿© Æ®·£½ºÄÚµå µÉ ¶§ ±úÁ³¾ú´Ù. ¿¾³¯ ¹®¼­µéÀ» ó¸®Çϱ⸦ ¿øÇÏ´Â »ç¿ëµµ±¸µéÀº, À¯È¿ÇÏÁö ¾ÊÀº ±ÛÀÚ¸¦ Æ÷ÇÔ ÇÑ URI¸¦ ¹ÞÀ¸¸é, ¿ì¼± UTF-8¿¡ ±âÃÊÇÏ¿© º¯È¯ÇÏ¿©¾ß ÇÑ´Ù. °á°ú URIÀÌ ¹®Á¦¸¦ ÇØ°áÇÏÁö ¸øÇÏ´Â °æ¿ì¿¡ ¸¸, ¹ÞÀº ¹®¼­ÀÇ ±ÛÀÚ ¿£ÄÚµù ÀÌÁø¼ö(byte)µé¿¡ µû¶ó URI ±¸¼ºÀ» ½ÃµµÇÏ¿©¾ß ÇÑ´Ù.

ÁÖ±â: A ¿¤·¹¸àÆ®ÀÇ name ¾ÖÆ®¸®ºäÆ® °ª¿¡µµ UTF-8¿¡ µû¸¥ °°Àº º¯È¯ÀÌ Àû¿ëµÈ´Ù.

B.2.2 URI ¾ÖÆ®¸®ºäÆ®(attribute) °ª¿¡¼­ "&"(ampersand)

ÆûÀÌ ¼Û½ÅµÇ¾î ±¸¼º µÇ´Â URI´Â ¾ØÄ¿(anchor) ¿¬°á(¿¹: A ¿¤·¹¸àÆ®ÀÇ href ¾ÖÆ®¸®ºäÆ®)·Î »ç¿ë µÉ ¼ö ÀÖ´Ù. ºÒÇàÇÏ°Ôµµ, Æû Çʵå(form field)¸¦ ºÐ¸®Çϱâ À§ÇÑ "&" ±ÛÀÚÀÇ »ç¿ëÀº ±ÛÀÚ ¿£Æ¼Æ¼ ÂüÁ¶ ¹üÀ§¿¡¼­ SGML ¾ÖÆ®¸®ºäÆ® °ª¿¡ »ç¿ëµÇ´Â °Í°ú È¥µ¿µÈ´Ù. ¿¹¸¦ µé¾î, URI "http://host/?x=1&y=2"¸¦ ¿¬°á·Î »ç¿ëÇÏ´Â URI·Î Çϱâ À§Çؼ­´Â, <A href="http://host/?x=1&#38;y=2"> ¶Ç´Â <A href="http://host/?x=1&amp;y=2">·Î ½á¾ßÇÑ´Ù.

Á¦ÀÛÀÚ°¡ ÀÌ ¹æ½ÄÀ¸·Î "&" ±ÛÀÚ¸¦ º¯È¯(escape)Çϴµ¥ ¹®Á¦ÀÇ ¹ß»ýÀ» ÇÇÇϱâ À§ÇÏ¿©, HTTP ¼­¹ö Àû¿ëÀÚ(implementor)µé, ±¸Ã¼ÀûÀ¸·Î, CGI Àû¿ëÀÚµéÀº "&" ´ë½Å ";"ÀÇ »ç¿ëÀ» Áö¿ø ÇÒ °ÍÀ» ÃßõÇÑ´Ù.

SGML Àû¿ë¿¡ ´ëÇÑ ÁÖ¼®

B.3.1 ¿­¹Ù²Þ(Line break)

SGML[ISO8879, Ç׸ñ 7.6.1]¿¡¼­ ½ÃÀÛű×(tag) ¹Ù·Î ´ÙÀ½°ú Á¾·áÅÂ±× ¹Ù·Î ¾ÕÀÇ ¿­¹Ù²Þ(line break)Àº ¹«½ÃµÇ¾î¾ß ÇÑ´Ù°í Á¤ÀÇÇÑ´Ù. ÀÌ´Â ¿¹¿Ü ¾øÀÌ ¸ðµç HTML ¿¤·¹¸àÆ®(element)¿¡ Àû¿ëµÈ´Ù.

´ÙÀ½ µÎ HTML ¿¹Á¦µéÀº °°Àº Ç¥ÇöÀ» ÇؾßÇÑ´Ù.

<P>Å丶½º´Â TV¸¦ º¸°í ÀÖ´Ù.</P>
<P>
Å丶½º´Â TV¸¦ º¸°í ÀÖ´Ù.
</P>

´ÙÀ½ µÎ ¿¹Á¦µéµµ ¸¶Âù°¡ÁöÀÌ´Ù.

<A>³»°¡ ÁÁ¾ÆÇÏ´Â À¥½ÎÀÌÆ®</A>
<A>
³»°¡ ÁÁ¾ÆÇÏ´Â À¥½ÎÀÌÆ®
</A>

B.3.2 ºñ HTML(non-HTML) µ¥ÀÌÅÍÀÇ Á¤ÀÇ

½ºÅ©¸³Æ®(script)¿Í ½ºÅ¸ÀÏ(style) µ¥ÀÌÅÍ°¡ ¿¤·¹¸àÆ®(element)ÀÇ ³»¿ëÀ¸·Î ¶Ç´Â ¾ÖÆ®¸®ºäÆ®(attribute) °ªÀ¸·Î ³ªÅ¸³¯ ¼ö ÀÖ´Ù. ÀÌ Ç׸ñµéÀº HTML ÀÛ¼º(markup)°ú ´Ù¸¥ µ¥ÀÌÅÍ¿ÍÀÇ ±¸º°À» ¼³¸íÇÑ´Ù.

ÁÖ±â: DTD´Â ½ºÅ©¸³Æ®¿Í ½ºÅ¸ÀÏ µ¥ÀÌÅ͸¦ ¿¤·¹¸àÆ® ³»¿ë°ú ¾ÖÆ®¸®ºäÆ® °ªÀÇ CDATA·Î Á¤ÀÇÇÑ´Ù. SGML ±ÔÄ¢Àº CDATA¿¡¼­ ±ÛÀÚ ÂüÁ¶°¡ ¿¤·¹¸àÆ® ³»¿ë¿¡¼­´Â Çã¿ëµÇÁö ¾Ê°í, ¾ÖÆ®¸®ºäÆ® °ª¿¡¼­´Â Çã¿ëµÈ´Ù. Á¦ÀÛÀÚµéÀº ½ºÅ©¸³Æ®¿Í ½ºÅ¸ÀÏ µ¥ÀÌÅÍ »çÀÌ¿¡¼­ ¿¤·¹¸àÆ® ³»¿ë°ú ¾ÖÆ®¸®ºäÆ® °ªÀ» À߶ó ºÎÄ¥ ¶§ ƯÈ÷ ÁÖÀÇÇÏ¿©¾ß ÇÑ´Ù.

dzºÎÇÑ ¼­·ù¿¡¼­ ºó¾àÇÑ ±ÛÀÚ ¿£ÄÚµùÀ¸·Î ÄÚµå º¯°æ(transcoding) ÇÒ ¶§, ÄÚµå º¯°æÀÚ(transcoder)´Â ½ºÅ©¸³Æ®³ª ½ºÅ¸ÀÏ µ¥ÀÌÅÍ¿¡ ÀÖ´Â º¯È¯ ÇÒ ¼ö ¾ø´Â ±ÛÀÚ¸¦ ÇØ´ç ¼ýÀÚ ÂüÁ¶·Î Á¦°ø ÇÒ ¼ö ¾ø´Ù´Â Àǹ̵µ µÈ´Ù. µ¥ÀÌÅ͸¦ ¿Ã¹Ù¸£°Ô ó¸®Çϱâ À§Çؼ­´Â, ÄÚµå º¯°æÀÚÀº HTML ¹®¼­¸¦ º¯È¯(parse)ÇÏ°í, °¢ ½ºÅ©¸³Æ®¿Í ½ºÅ¸ÀÏ ¾ð¾îÀǹ®¹ý¸¦ ¾Ë¾Æ¾ßÇÑ´Ù.

¿¤·¹¸àÆ® ³»¿ë

½ºÅ©¸³Æ®(script)³ª ½ºÅ¸ÀÏ(style) µ¥ÀÌÅÍ°¡ ¿¤·¹¸àÆ®(element)ÀÇ ³»¿ëÀ̸é(SCRIPT¿Í STYLE), µ¥ÀÌÅÍ´Â ¿¤·¹¸àÆ® ½ÃÀÛű×(tag) ¹Ù·Î µÚ¿¡¼­ ½ÃÀÛÇÏ°í, ù¹ø° Á¾°áÀÚ(delimiter) ETAGO ("</")¿¡¼­ ³¡³ª¸ç, ±× ´ÙÀ½¿¡´Â À̸§ ±ÛÀÚ[a-zA-Z]°¡ ³ª¿Â´Ù. ÀÌ </´Â ¿¤·¹¸àÆ®ÀÇ Á¾·áűװ¡ ¾Æ´Ò ¼ö ÀÖ½¿¿¡ ÁÖÀÇÇ϶ó. À̶§´Â Á¦ÀÛÀÚ°¡ ³»¿ë ¾È¿¡¼­ "</"·Î º¯È¯(escape)ÇÏ¿©¾ß ÇÑ´Ù. ¿¡½ºÄÉÀÔ(escape) ±â´ÉµéÀº °¢ ½ºÅ©¸³Æ®³ª ½ºÅ¸ÀϽ¬Æ® ¾ð¾î¿¡ ¼³¸íµÇ¾îÀÖ´Ù.

Ʋ¸° ¿¹Á¦:
´ÙÀ½ ½ºÅ©¸³Æ® µ¥ÀÌÅÍ´Â SCRIPT Á¾·áÅÂ±× ÀÌÀü¿¡ "</EM>"ÀÇ ºÎºÐÀ¸·Î Ʋ¸° "</"¸¦ Æ÷ÇÔÇÏ°í ÀÖ´Ù.

<SCRIPT type="text/Javascript">
 document.write ("<EM>ÀÌ°ÍÀº ÀÛ¿ë ¸ø ÇÔ.</EM>")
</SCRIPT>

ÀÚ¹Ù½ºÅ©¸³Æ®(Javascript) ¾È¿¡¼­, ÀÌ ÄÚµå´Â SGML À̸§ ½ÃÀÛ Àü¿¡ Á¾°áÀÚ(delimiter) ETAGO(</)¸¦ °¨Ã߸鼭 À¯È¿ÇÏ°Ô(legally) Ç¥Çö µÉ ¼ö ÀÖ´Ù.

<SCRIPT type="text/Javascript">
 document.write ("<EM>ÀÌ°ÍÀº ÀÛ¿ë ÇÔ.<\/EM>")
</SCRIPT>

Tcl(tool command language)¿¡¼­´Â, ÀÌ ´ÙÀ½°ú °°ÀÌÇÏ¸é µÈ´Ù.

<SCRIPT type="text/tcl">
 document write "<EM>ÀÌ°ÍÀº ÀÛ¿ë ÇÔ.<\/EM>"
</SCRIPT>

ºñÁÖ¾óº£ÀÌ½Ä ½ºÅ©¸³Æ®(VBScript)¿¡¼­´Â, Chr() ±â´ÉÀ» »ç¿ë ÇÒ ¼ö ÀÖ´Ù.

 "<EM>ÀÌ°ÍÀº ÀÛ¿ë ÇÔ.<" & Chr(47) & "EM>"

¾ÖÆ®¸®ºäÆ®(attribute) °ª

½ºÅ©¸³Æ®(script)³ª ½ºÅ¸ÀÏ(style) µ¥ÀÌÅÍ°¡ style ¶Ç´Â º»ÁúÀû À̺¥Æ®(intrinsic event) µî ¾ÖÆ®¸®ºäÆ®ÀÇ °ªÀ̸é, Á¦ÀÛÀÚ´Â ½ºÅ©¸³Æ® ¶Ç´Â ½ºÅ¸ÀÏ ¾ð¾î¿¡ µû¶ó, ±× °ª ¾È¿¡¼­ ´ÜÀÏ È¤Àº ÀÌÁß µû¿ÈÇ¥¸¦ ´Ýµµ·Ï º¯È¯(escape)ÇÏ¿©¾ß ÇÑ´Ù.

Á¦ÀÛÀÚ´Â ¶ÇÇÑ "&"°¡ ±ÛÀÚ ÂüÁ¶ÀÇ ½ÃÀÛÀÌ ¾Æ´Ï¸é, "&"À¸·Î Çؼ®(escape)ÇÏ¿©¾ß ÇÑ´Ù.

¿¹¸¦ µé¸é:

<INPUT name="num" value="0"
	onchange="if (compare(this.value, &quot;help&quot;))
	{gethelp()}">

B.3.3 SGML ±â´ÉÀÇ Á¦ÇÑ µÈ Áö¿ø

[ISO8879]¿¡ ºÎÇÕÇÏ´Â SGML ½Ã½ºÅÛµéÀº HTML »ç¿ëµµ±¸µé¿¡ ÀÇÇÏ¿© ³Î¸® Áö¿øµÇÁö ¾Ê´Â ¿©·¯ ±â´ÉÀ» ÀνÄÇϹǷÎ, Á¦ÀÛÀÚ´Â ÀÌ ±â´ÉµéÀ» »ç¿ëÇÏÁö ¾ÊÀ» °ÍÀ» ÃßõÇÏ´Ù.

B.3.4 ºÒ¸°(boolean) ¾ÖÆ®¸®ºäÆ®

¸¹Àº »ç¿ëµµ±¸µéÀº ¿ÏÀüÇÑ °ÍÀÌ ¾Æ´Ñ, Ãà¼Ò Çü½ÄÀÇ ºÒ¸° ¾ÖÆ®¸®ºäÆ®(attribute) ¸¸À» ÀνÄÇÑ´Ù´Â Á¡À» Á¦ÀÛÀÚ´Â ¾Ë¾Æ¾ßÇÑ´Ù.

¿¹¸¦ µé¾î:

<SELECT selected="selected">

´ë½Å

<SELECT selected>

»ç¿ëÀÌ °¡´ÉÇÏ´Ù.

B.3.5 Ç¥½Ã µÈ Ç׸ñµé

Ç¥½Ã µÈ Ç׸ñµéÀº C »çÀüó¸®ÀÚ(preprocessor)¿¡¼­ #ifdef·Î ÀνĵǴ ±¸Á¶¿Í À¯»çÇÑ ±â´ÉÀ» ÇÑ´Ù.

<![INCLUDE[  <!-- ÀÌ°ÍÀº Æ÷ÇԵȴÙ. -->
]]>

<![IGNORE[  <!-- ÀÌ°ÍÀº ¹«½ÃµÈ´Ù. -->
]]>

SGMLÀº, ½ÃÀÛűװ¡ ¾Æ´Ñ "<" ¾È¿¡¼­, CDATA ³»¿ë¿¡¼­ Ç¥½Ã µÈ Ç׸ñµéÀÇ »ç¿ëµµ Á¤ÀÇÇÑ´Ù. ¿¹¸¦ µé¾î:

<![CDATA[
 ¾î·´Áö ¾Ê°Ô <¸¦ »ç¿ëÇÏ¿© ÀÛ¼º ÇÒ ¼ö ÀÖ´Â <SGML>ÀÇ <¿¹Á¦>
]]>

»ç¿ëµµ±¸°¡ Ç¥½Ã µÈ(marked) Ç׸ñÀ» ÀνÄÇÏÁö ¸øÇϸç, ¼û±â·Á Çصµ ÀúÀý·Î µå·¯³»´Â(telltale) ±âÈ£´Â "]]>"·Î³ªÅ¸³ª´Âµ¥, ÀÌ °ÍÀº "<!["·Î ½ÃÀÛÇÏ´Â ÇÑ °Í¿¡ ´ëÇÑ Ã¹¹ø° ">"·Î Á¾·áÇÏ´Â °ÍÀ¸·Î, »ç¿ëµµ±¸°¡ ½Ç¼öÇÑ °ÍÀ¸·Î º¸ÀδÙ.

B.3.6 ó¸® Áö½Ã

ó¸® Áö½Ã(processing instruction)µéÀº ÇÁ·¹Æ®È¨¿¡ µû¸¥(platform-specific) ¹®±¸(idiom)¸¦ Àâ¾Æ³»´Â ±â´ÉÀÌ´Ù. ó¸® Áö½Ã´Â <?·Î ½ÃÀÛÇÏ°í>·Î ³¡³­´Ù.

<?instruction>

¿¹¸¦ µé¾î:

<?>
<?style tt = font courier>
<?page break>
<?experiment> ... <?/experiment>

Á¦ÀÛÀÚ´Â »ç¿ëµµ±¸ÀÇ ¸¹Àº Ç¥Çö ó¸® Áö½ÃµéÀ» ¹®¼­ ÅؽºÆ®ÀÇ ÀÏ ºÎºÐÀ¸·Î ¾Ë¾Æ¾ßÇÑ´Ù.

B.3.7 ¾à½Ä ÀÛ¼º(markup)

ÀϺΠSGML SHORTTAGÀ» ŸÀÌÇÎÀ» ÁÙÀ̱â À§ÇÏ¿© ±¸¼ºÇÏÁö¸¸, SGML Àû¿ë(application)¿¡ Ư±â ÇÒ ´É·ÂÀ» Ãß°¡ÇÏÁö´Â ¾Ê´Â´Ù. ±â¼úÀûÀ¸·Î ¸ðÈ£ ÇÔÀÌ ¾øÀÌ ±¸¼ºµÇÁö¸¸, ¹®¼­ÀÇ °ß°í¼ºÀ» °¨¼Ò ½ÃŲ´Ù. ƯÈ÷ ±× ¾ð¾î°¡ »õ·Î¿î ¿¤·¹¸àÆ®(element)¸¦ Æ÷ÇÔÇϵµ·Ï º¸¿Ï µÇ¾úÀ¸¸é ´õ¿í ±×·¸´Ù. ±×·¡¼­ SGML SHORTTAG ±¸¼ºÀº ¾ÖÆ®¸®ºäÆ®(attribute)¿Í °ü·ÃÇÏ¿© ³Î¸® »ç¿ëµÇ°í ÀÖÀ¸³ª, ¿¤·¹¸àÆ®¿Í °ü·ÃÇؼ­´Â ±×·¸Áö ¾Ê´Ù. ÀÌ°ÍÀ» »ç¿ëÇÏ´Â ¹®¼­µéÀº SGML ±Ô°Ý¿¡ ¸Â´Â ¹®¼­À̳ª, ¸¹Àº ÇöÀçÀÇ HTML µµ±¸µé¿¡¼­´Â ±×·¸Áö ¾ÊÀ» °¡´É¼ºÀÌ ³ô´Ù.

SHORTTAG ±¸¼ºÀº ´ÙÀ½°ú °°´Ù.

B.4 Web ½ÎÀÌÆ® °Ë»ö ¿£Áø µµ¿ò »öÀο¡ ´ëÇÑ ÁÖ¼®

ÀÌ Ç׸ñÀº °Ë»ö ¿£ÁøµéÀÌ ´õ ½±°Ô ¹®¼­¿¡ Á¢±ÙÇϱâ À§ÇÑ °£´ÜÇÑ ¾Ï½Ãµé¸¦ Á¦°øÇÑ´Ù.

¹®¼­ ¾ð¾î Á¤ÀÇ
À¥ÀÇ °øÅë(global) ³»¿ë¿¡¼­ ÀÌ°ÍÀº ¾î´À Àΰ£(human) ¾ð¾î·Î ÆäÀÌÁö°¡ ÀÛ¼ºµÇ¾î Àִ°¡¸¦ ¾Ë±â À§ÇØ Áß¿äÇÏ´Ù. ¾ð¾î Á¤º¸¿¡¼­ ¼³¸íÇÏ¿´´Ù.
ÀÌ ¹®¼­ÀÇ ¾ð¾î º¯°æ ÁöÁ¤

¸¸ÀÏ ÀÌ ¹®¼­¸¦ ´Ù¸¥ ¾ð¾îµé·Î ¹ø¿ªÇϵµ·Ï Áغñ°¡ µÇ¾úÀ¸¸é, ÀÌ °ÍµéÀ» ÂüÁ¶Çϱâ À§ÇÏ¿© LINK ¿¤·¹¸àÆ®¸¦ »ç¿ëÇÏ¿©¾ß ÇÑ´Ù. ÀÌ´Â ¾î¶»°Ô ±× ¿äû(query)¿¡ ¾²¿©Á³´Â°¡¿¡ °ü°è ¾øÀÌ, »ç¿ëÀÚ°¡ °Ë»ö °á°ú¸¦ »ç¿ëÀÚ°¡ ¼±È£ÇÏ´Â ¾ð¾î·Î Á¦°øÇϱâ À§ÇÏ¿© »öÀÎ ¿£Áø(indexing engine)¿¡°Ô ¾Ë·ÁÁØ´Ù. ¿¹¸¦ µé¾î ´ÙÀ½ ¿¬°áµéÀº °Ë»ö ¿£Áø(search engine)¿¡ ºÒ¾î¿Í µ¶ÀϾ ¼±ÅÃÀûÀ¸·Î Çã¿ëÇÑ´Ù.

<LINK rel="alternate" type="text/html" href="mydoc-fr.html"
 hreflang="fr" lang="fr" title="La vie souterraine">
<LINK rel="alternate" type="text/html" href="mydoc-de.html"
 hreflang="de" lang="de" title="Das Leben im Untergrund">

Å°¿öµå¿Í ¼³¸íÀÇ Á¦°ø

ÀϺΠ»öÀÎ ¿£Áø(indexing engine)µéÀº Äĸ¶·Î ºÐ¸® µÈ Å°¿öµå/¹®±¸, ¶Ç´Â ªÀº ¼³¸íµéÀÇ ¸ñ·ÏÀ» Á¤ÀÇ ÇÑ META ¿¤·¹¸àÆ®¸¦ ã´Â´Ù. °Ë»ö ¿£ÁøÀº ÀÌ Å°¿öµåµéÀ» °Ë»ö °á°ú·Î Ç¥½Ã ÇÒ ¼ö ÀÖ´Ù. °Ë»ö ¾ÖÆ®¸®ºäÆ®¿¡ ÀÇÇÑ name ¾ÖÆ®¸®ºäÆ®ÀÇ ÀÓ¹«´Â ÀÌ ±Ô°Ý¿¡ Á¤ÀǵÇÁö ¾Ê¾Ò´Ù.

¿¹Á¦¸¦ º¸¶ó.

<META name="keywords" content="vacation,Greece,sunshine">
<META name="description" content="Idyllic European vacations">

¸ðµëÀÇ ½ÃÀÛÀ» ÁöÁ¤

´Ü¾î ÆíÁý ¹®¼­µé ¶Ç´Â Ç¥ÇöµéÀÇ ¸ðµëÀº ÀÚÁÖ HTMLÀÇ ¹®¼­ÀÇ ¸ðµëÀ¸·Î ¹ø¿ªµÈ´Ù. ÀÌ´Â °Ë»ö¿¡¼­ ¸Â´Â °á°úÀÇ ÆäÀÌÁö¿¡, Ãß°¡ÀûÀ¸·Î °Ë»ö °á°úµéÀ» À§ÇÑ ¸ðµëÀÇ ½ÃÀÛ À§Ä¡¸¦ ÂüÁ¶Çϴµ¥ µµ¿òÀ» ÁØ´Ù. LINK ¿¤·¹¸àÆ®¿¡¼­ rel="start"¸¦ title ¾ÖÆ®¸®ºäÆ®¿Í ÇÔ²² »ç¿ëÇϹǷμ­ °Ë»ö ¿£Áø¿¡ µµ¿òÀ» ÁÙ ¼ö ÀÖ´Ù.

 <LINK rel="begin" type="text/html" href="page1.html"
	title="General Theory of Relativity">

»öÀÎ(indexing) Áö½Ã(instruction)µéÀ» °®´Â ·Îº¿(robot)À» Á¦°ø
»ç¶÷µéÀº ±×µéÀÇ ½ÎÀÌÆ®°¡ »öÀÎ ·Îº¿µé¿¡ ÀÇÇØ »öÀÎ µÇ¾ú´Ù´Â °Í°ú, ±× ·Îº¿µéÀº ½ÎÀÌÆ®ÀÇ ¿¹¹ÎÇÑ ºÎºÐÀº ¹æ¹®À» Çã¿ëÇϱ⠾ʴ´ٴ °ÍÀ» ¹ß°ßÇÏ°í ¾Æ¸¶ ³î¶ö °ÍÀÌ´Ù. ¸¹Àº À¥ ·Îº¿µéÀº À¥ ½ÎÀÌÆ® °ü¸®ÀÚ(administrator)µé¿¡°Ô ¼ö´ÜÀ» Á¦°øÇÏ°í, ÄÁÅÙÆ® Á¦°øÀÚµé´Â ·Îº¿ÀÇ ±×·± ÀÛµ¿ ºÎºÐÀ» Á¦ÇÑÇÑ´Ù. ÀÌ´Â "robots.txt" È­ÀÏ°ú HTML ¹®¼­ÀÇ META ¿¤·¹¸àÆ®¿¡ ÀÇÇÏ¿© ¾Æ·¡¿Í °°ÀÌ ´Þ¼º µÉ ¼ö ÀÖ´Ù.

B.4.1 °Ë»ö ·Îº¿(search robot)

robots.txt È­ÀÏ

·Îº¿ÀÌ, http://www.foobar.com/¿Í °°Àº, À¥ ½ÎÀÌÆ®¸¦ ¹æ¹®Çϸé, ÀÌ´Â ¸ÕÀú http://www.foobar.com/robots.txt È­ÀÏÀ» Á¡°ËÇÑ´Ù. ÀÌ È­ÀÏÀÌ ¹ß°ßµÇ¸é, ¹®¼­ÀÇ ÀÐ¾î µå¸²ÀÌ Çã¿ëµÇ´Â°¡¸¦ ¾Ë±â À§ÇØ ±× ³»¿ëÀ» ºÐ¼® ÇÒ °ÍÀÌ´Ù. robots.txt È­ÀÏÀ» ƯÁ¤ ·Îº¿µé¿¡ ¸¸ Àû¿ëÇÏ°í, ƯÁ¤ µð·ºÅ丮µîÀ̳ª È­Àϵ鿡 Á¢±ÙÇÏÁö ¸øÇÏ°Ô À§ÇÏ¿© ÇÊ¿ä¿¡ ¸Â°Ô ¸¸µé ¼ö ÀÖ´Ù.

¾Æ·¡ ¿¹Á¦ robots.txt È­ÀÏÀº ¸ðµç ·Îº¿µéÀÌ Àü ½ÎÀÌÆ®¸¦ ÅëÇÏ¿© ¹æ¹®ÇÏ´Â °ÍÀ» ±ÝÁöÇÏ°í ÀÖ´Ù.

 User-agent: *    # ¸ðµç ·Îº¿(robot)µé¿¡ Àû¿ë
 Disallow: /      # ¸ðµç ÆäÀÌÁöµéÀÇ »öÀÎ(indexing) ±ÝÁö

½ÎÀÌÆ®°¡ ƯÁ¤ È£½ºÆ®(host)¿Í Æ÷Æ®(port) ¹øÈ£¿¡¼­ HTTP ¼­¹ö·Î ¿î¿µµÇ´Â °ÍÀ¸·Î Á¤ÀÇ µÇ¾úÀ¸¸é, ·Îº¿Àº ´Ü¼øÈ÷ ½ÎÀÌÆ® URI¿¡¼­ "/robots.txt"¸¦ ãÀ» °ÍÀÌ´Ù. robots.txtÀÇ À§Ä¡ ¿¹Á¦¸¦ º¸¶ó.

http://www.w3.org:80/robots.txthttp://www.w3.org:1234/robots.txt
½ÎÀÌÆ® URIrobots.txtÀÇ URI
http://www.w3.org/ ¿µ¾î http://www.w3.org/robots.txt
http://www.w3.org:80/ ¿µ¾î
http://www.w3.org:1234/ ¿µ¾î
http://w3.org/ ¿µ¾î http://w3.org/robots.txt

½ÎÀÌÆ®¿¡´Â ÇϳªÀÇ "/robots.txt" ¸¸À» °¡Áú ¼ö ÀÖ´Ù. ±¸Ã¼ÀûÀ¸·Î, "robots.txt" È­ÀϵéÀº ·Îº¿Àº, ±×°ÍÀ» »ç¿ëÀÚ µð·ºÅ丮¿¡¼­ ãÁö ¾Ê±â ¶§¹®¿¡, »ç¿ëÀÚ µð·ºÅ丮¿¡ À§Ä¡½ÃÄѼ­´Â ¾ÊµÈ´Ù. »ç¿ëÀÚ°¡ ÀÚ½ÅÀÇ "robots.txt"¸¦ ¸¸µé±â¸¦ ¿øÇϸé, ´ÜÀÏ "/robots.txt" ¾È¿¡ ¸ðµÎ ÅëÇÕ(merge)ÇÒ ÇÊ¿ä°¡ ÀÖ´Ù. ¸¸ÀÏ ±×·¸°Ô Çϱ⸦ ¿øÇÏÁö ¾ÊÀ¸¸é, »ç¿ëÀÚ´Â ±× ´ë½Å ·Îº¿ META ű׸¦ »ç¿ë ÇÒ ¼öµµ ÀÖ´Ù.

URI´Â ´ë¼Ò¹®ÀÚ ±¸º°Çϸç, "/robots.txt" ¹®ÀÚ¿­Àº ¸ðµÎ ¼Ò¹®ÀÚÀ̾î¾ß Çϸç, °ø¹éÀº Çã¿ë µÇÁö ¾Ê´Â´Ù.

°¢ ·¹ÄÚµå(record) ¸¶´Ù ²À ÇÑ°³ÀÇ »ç¿ëµµ±¸ÀÇ Çʵå(field)¸¦ °¡Á®¾ÆÇÑ´Ù. ·Îº¿Àº ÀÌ ÇʵåÀÇ Çؼ®¿¡¼­ ÀÚÀ¯½º·¯¿ö¾ß ÇÑ´Ù. ´ë¼Ò¹®ÀÚ ±¸º° ¾ø´Â ºÎºÐ ¹®ÀÚ¿­¿¡ ¸Â´Â À̸§¿¡ ¹öÀü Á¤º¸ ¾øÀÌ »ç¿ëÇÏ´Â °ÍÀÌ ÃßõµÈ´Ù.

¸¸ÀÏ ±× °ªÀÌ "*" À̸é, ±× ·¹ÄÚµå´Â ´Ù¸¥ ·¹ÄÚµåµé°ú Çϳªµµ ¸ÂÁö ¾Ê´Â ¾î¶² ·Îº¿¿¡¼­³ª °¡´ÉÇÑ µðÆúÆ® Á¢¼Ó(access) Á¤Ã¥(policy)À» ³ªÅ¸³½´Ù. "/robots.txt" ¾È¿¡¼­ ¿©·¯°³ÀÇ ±×·¸ÇÑ ·¹Äڵ带À» °®´Â °ÍÀº Çã¿ëµÇÁö ¾Ê´Â´Ù.

"Disallow"(Çã¿ë ¾ÈÇÔ) Çʵå´Â ¹æ¹® ÇÒ ¼ö ¾ø´Â ºÎºÐ URI¸¦ ÁöÁ¤ÇÑ´Ù. ÀÌ´Â ¿ÏÀü °æ·Î(full path) ¶Ç´Â ºÎºÐ °æ·Î°¡ µÉ ¼ö ÀÖ´Ù. ÀÌ °ªÀ¸·Î ½ÃÀÛ µÇ´Â URI´Â ÀÐÇôÁöÁö ¾ÊÀ» °ÍÀÌ´Ù.

 Disallow: /help - /help.html°ú /help/index.html µÑ ´Ù Çã¿ë ¾ÈÇÔ,
 Disallow: /help/ - /help/index.html´Â Çã¿ë ¾ÈÇϳª, /help.htmlÀº Çã¿ë µÊ.

"Disallow"¿¡¼­ ºó °ªÀº, ¸ðµç URIµéÀÌ ÀÐÇô Áú ¼ö ÀÖ½¿À» °¡¸®Å²´Ù. robots.txt È­ÀÏ¿¡´Â ÃÖ¼ÒÇÑ ÇÑ°³ÀÇ "Disallow" Çʵ尡 ÀÖ¾î¾ß ÇÑ´Ù.

·Îº¿(robot)°ú META ¿¤·¹¸àÆ®(element)

HTML Á¦ÀÛÀÚ°¡ ¹æ¹®ÇÏ´Â ·Îº¿µé¿¡°Ô ¹®¼­°¡ »öÀÎ µÉ¼ö Àִ°¡, ¶Ç´Â ´Ù¸¥ ¿¬°áµéÀ» À§ÇØ »ç¿ë µÇ¾ú´Â°¡¸¦ ¾Ë·Á ÁÙ ¼ö ÀÖµµ·Ï, META ¿¤·¹¸àÆ®´Â Çã¿ëÇÑ´Ù. ¼­¹ö °ü¸®ÀÚ(administrator)ÀÇ ¾î¶² È°µ¿À» ÇÊ¿ä·Î ÇÏÁö ¾Ê´Â´Ù.

´ÙÀ½ ¿¹Á¦¿¡¼­´Â ·Îº¿ÀÌ ¹®¼­¸¦ »öÀÎ(index)Çϰųª ¿¬°áÀ» ºÐ¼®ÇÏÁö ¾Ê´Â´Ù.

<META name="ROBOTS" content="NOINDEX, NOFOLLOW">

³»¿ë¿¡¼­ »ç¿ëµÇ´Â ¿ë¾îµéÀº ALL, INDEX, NOFOLLOW, NOINDEXÀÌ´Ù. ±× À̸§°ú ³»¿ë ¾ÖÆ®¸®ºäÆ®ÀÇ °ªÀº ´ë¼Ò¹®ÀÚ ±¸º° ¾øÀÌ »ç¿ëµÈ´Ù.

ÁÖ±â: 1997³â Ãʹݿ¡´Â ÀÌ°ÍÀÌ Àû¿ëµÇ´Â ·Îº¿µéÀÌ ¸î°³ ¾ø¾úÀ¸³ª, À̰͵éÀÌ ·Îº¿ »öÀÎ(indexing) Á¦¾î¸¦ À§ÇÏ¿© ´õ ÀϹÝÀûÀÎ ÁÖ¸ñÀ» ¹ÞÀ» °ÍÀ¸·Î ±â´ëµÈ´Ù.

B.5 Ç¥(table)¿¡ ´ëÇÑ ÁÖ¼®

B.5.1 ¼³°èÀÇ ÇÕ¸®¼º

HTML Ç¥ ¸ðµ¨Àº, SGML Ç¥ ¸ðµ¨, ÀÏ¹Ý ¹®¼­ ÆíÁý±â¿¡¼­ Ç¥ÀÇ Ã³¸®, ÀâÁö, µµ¼­¿Í ´Ù¸¦ ÆäÀÌÁö¸¦ °®´Â ¹®¼­µéÀÇ Ç¥µéÀÇ ¾ç½Ä¿¡ ´ëÇÑ ¿¬±¸µé¿¡ ÀÇÇÏ¿© ¹ßÀüµÇ¾ú´Ù. ´ÜÀÏ Ç¥°¡ ´Ü¼øÇÏ°Ô Ç¥Çö µÉ ¼ö ÀÖµµ·Ï ¸ðµ¨ÀÌ ¼±ÅõǾú°í, ÇÊ¿äÇÏ¸é ¾µ ¼ö ÀÖ´Â º¹À⼺À» Ãß°¡ÇÏ¿© »ç¿ë ÇÒ ¼ö ÀÖ°Ô Çß´Ù. ÀÌ´Â ½ÇÁ¦ÀûÀ¸·Î ÀÏ»ó ÅؽºÆ® ¿¡µðÅÍ(editor)µé·Î HTML Ç¥ÀÇ ÀÚµ¿ÀûÀ¸·Î ÀÛ¼ºÀ» ÇÒ ¼ö ÀÖ°Ô ÇÏ°í, °øºÎ¸¦ ½ÃÀÛÇÏ´Â »ç¶÷µéÀÇ ¹è¿ì´Â ½Ã°£À» ´ÜÃàÇÏ°Ô ÇÒ °ÍÀÌ´Ù. ÀÌ ±â´ÉÀº ¿À´Ã³¯ ¼º°øÀûÀÎ HTML¿¡ ´ë´ÜÈ÷ Áß¿äÇÑ °ÍÀ¸·Î µÇ¾ú´Ù.

»ç¶÷µéÀº ´Ù¸¥ ¹®¼­ ¾ç½ÄµéÀ¸·Î ºÎÅÍ º¯È¯(convert)Çϰųª, Á÷Á¢ WYSIWYG ÆíÁý±â·Î Ç¥¸¦ ¸¸µå´Â °æ¿ì°¡ ´Ã¾î³ª°í ÀÖ´Ù. À̵é ÆíÁý±âµé¿¡¼­ HTML Ç¥ ¸ðµ¨¿¡ Àß ¸Â¾Æ¾ß ÇÑ´Ù´Â °ÍÀº Áß¿äÇÏ´Ù. ÀÌ´Â º¹¼öÀÇ ¿­(row)µéÀ̳ª Ä÷³(column)µé¿¡ È®Àå µÈ(span) Ä­(cell)µéÀÇ Ç¥Çö ¹æ¹ý, Á¤·Ä ¹æ¹ý, Ä­µéÀÇ ±¸·ìµé°ú ¿¬°á µÈ ±âŸ Ç¥Çö Ư¼ºµé¿¡ ¿µÇâÀ» ÁØ´Ù.

ź·ÂÀû Àç ¾ç½ÄÈ­(dynamic reformatting)

HTML Ç¥(table) ¸ðµ¨¿¡¼­ ÇϳªÀÇ Áß¿äÇÑ °í·Á »çÇ×À¸·Î, Á¦ÀÛÀÚ´Â »ç¿ëÀÚ°¡ Ç¥ÀÇ Å©±â¸¦ ÁöÁ¤ÇÏÁö ¾Ê°í, »ç¿ëÇÏ´Â ÆùÆ® µîÀ» Á¦¾îÇÏÁö ¾Ê´Â´Ù´Â °Íµî ÀÌ´Ù. Ä÷³(column) ³Êºñ¸¦ Àý´ëÀûÀÎ ´ÜÀ§ÀÎ Çȼ¿(pixel)¿¡ ÀÇÁ¸ÇÏ´Â °ÍÀº À§ÇèÇÏ´Ù. ±× ´ë½Å Ç¥´Â ÇöÀçÀÇ Ã¢(window) Å©±â¿Í ÆùÆ®¿¡ ¸ÂÃß¾î ź·ÂÀûÀ¸·Î º¯°æµÇ¾î¾ß ÇÒ ÇÊ¿ä°¡ ÀÖ´Ù. Á¦ÀÛÀÚ´Â »ó´ëÀûÀÎ Ä÷³ÀÇ ³Êºñ·Î À±°ûÀ» Á¦°ø ÇÒ ¼ö ÀÖÀ¸³ª, »ç¿ëµµ±¸´Â Ä­ÀÇ ³»¿ëµé Áß¿¡¼­ ±âÀå Å« °ÍÀÌ Ç¥ÇöµÇ±â¿¡ ÃæºÐÇϵµ·Ï Ä÷³µéÀÌ ³ÐÀ» °ÍÀ» È®ÀÎÇÏ¿©¾ß ÇÑ´Ù. ¸¸ÀÏ Á¦ÀÛÀÚÀÇ ±Ô°ÝÀÌ µ¤¾î ¾º¿ö(overridden)Á®¾ß ÇÏ´õ¶óµµ, »ó´ëÀûÀÎ °³º° Ä÷³ÀÇ ³ÊºñµéÀº ½ÉÇÏ°Ô º¯°æµÇÁö´Â ¾Ê´Â´Ù.

Á¡ÁøÀû µð½ºÇ÷¹ÀÌ(incremental display)

Å« Ç¥(table) ¶Ç´Â ¼Óµµ°¡ ´À¸° ³×Æ®¿ö±× ¿¬°á¿¡¼­, Ç¥ÀÇ Á¡ÁøÀû µð½ºÇ÷¹ÀÌ´Â »ç¿ëÀÚ ¸¸Á·À» À§ÇÏ¿© Áß¿äÇÏ´Ù. »ç¿ëµµ±¸´Â ¸ðµç µ¥ÀÌÅ͵éÀ» ´Ù ¹Þ±â Àü¿¡, Ç¥¸¦ µð½ºÇ÷¹ÀÌ Çϱ⠽ÃÀÛ ÇÒ ¼ö ÀÖ¾î¾ß ÇÑ´Ù. ´ëºÎºÐÀÇ »ç¿ëµµ±¸¿¡¼­ µðÆúÆ® â(window)ÀÇ ³Êºñ´Â ¾à 80 ±ÛÀÚÀÌ°í, ¸¹Àº HTML ÆäÀÌÁöµéÀÇ ±×·¡ÇȵéÀº ÀÌ µðÆúÆ®¸¦ °í·ÁÇÏ¿© µðÀÚÀÎ µÇ¾ú´Ù. Ä÷³(column) °¹¼ö¸¦ ÁöÁ¤ÇϹǷμ­, ¶Ç Ç¥ ³ÊºñÀÇ Á¦¾î(control)¿Í ´Ù¸¥ Ä÷³µéÀÇ ³Êºñ¸¦ À§ ÇÑ Ç׸ñÀ» Æ÷ÇÔ ÇÔÀ¸·Î¼­, Á¦ÀÛÀڴ ǥ ³»¿ëÀÇ Á¡ÁøÀûÀÎ µð½ºÇ÷¹À̸¦ Çã¿ëÇϵµ·Ï »ç¿ëµµ±¸¿¡°Ô ÈùÆ®¸¦ ÁÙ ¼ö ÀÖ´Ù.

Á¡ÁøÀû µð½ºÇ÷¹À̸¦ À§Çؼ­, ºê¶ó¿ìÀú´Â Ä÷³µéÀÇ °¹¼ö¿Í ±× ³ÊºñµéÀÌ ÇÊ¿äÇÏ´Ù. Ç¥ÀÇ µðÆúÆ® ³Êºñ´Â ÇöÀç â Å©±â(width="100%")ÀÌ´Ù. ÀÌ´Â TABLE ¿¤·¹¸àÆ®ÀÇ width ¾ÖÆ®¸®ºäÆ®¸¦ ¼³Á¤ÇÔÀ¸·Î¼­ º¯°æ µÉ ¼ö ÀÖ´Ù. µðÆúÆ®·Î ¸ðµç Ä÷³µéÀº °°Àº ³ÊºñµéÀ» °®Áö¸¸, µ¥ÀÌÅÍ°¡ ½ÃÀÛ µÇ±â Àü¿¡, ÇÑ°³ ¶Ç´Â ¿©·¯°³ÀÇ COL ¿¤·¹¸àÆ®·Î Ä÷³ ³ÊºñµéÀ» ÁöÁ¤ÇÒ ¼ö ÀÖ´Ù.

³ª¸ÓÁö ¹®Á¦´Â Ä÷³µéÀÇ °¹¼öÀÌ´Ù. ÀϺΠ»ç¶÷µéÀº ù¹ø° ¿­(row)ÀÌ ¹Þ¾ÆÁú ¶§±îÁö ±â´Ù¸± °ÍÀ» Á¦¾ÈÇÏ¿´À¸³ª, Ä­µéÀÌ ±ä ³»¿ëµéÀ» °¡Áö°í ÀÖÀ¸¸é ¿À·£ ½Ã°£ÀÌ °É¸°´Ù. Á¡ÁøÀû µð½ºÇ÷¹ÀÌ°¡ ÇÊ¿äÇϸé, Á¦ÀÛÀÚ°¡ TABLE ¿¤·¹¸àÆ® ¾È¿¡ Ä÷³ÀÇ °¹¼ö¸¦ Á¤È®ÇÏ°Ô ÁöÁ¤ÇÏ´Â °ÍÀÌ ÀüüÀûÀ¸·Î ´õ È¿°úÀûÀÏ °ÍÀÌ´Ù.

Á¦ÀÛÀÚ´Â ¿©ÀüÈ÷ »ç¿ëµµ±¸¿¡°Ô Á¡ÁøÀû µð½ºÇ÷¹À̸¦ »ç¿ëÇϴ°¡ ¶Ç´Â ³»¿ë¿¡ ¸Â°Ô ÀÚµ¿ÀûÀ¸·Î Ç¥ÀÇ Å©±â¸¦ Á¶Á¤ °ÍÀΰ¡¸¦ ¾Ë·Á ÁÙ ÇÊ¿ä°¡ ÀÖ´Ù. µÎ ´Ü°èÀÇ ÀÚµ¿ Å©±â ¸ðµå Áß, Ä÷³ÀÇ °¹¼ö´Â ù¹ø° °úÁ¤¿¡¼­ °áÁ¤µÈ´Ù. Á¡ÁøÀû ¸ðµå¿¡¼­, Ä÷³µéÀÇ °¹¼ö°¡ COL³ª COLGROUP ¿¤·¹¸àÆ®·Î ¸ÕÀú ³ª¿Í¾ßÇÑ´Ù.

±¸Á¶¿Í Ç¥Çö

HTML¿¡¼­ ¹®´Ü(paragraph)À̳ª µû¿È(quotation)°ú °°Àº ±¸Á¶Àû ÀÛ¼º°ú, ¸¶Áø(margin), ÆùÆ®(font), »ö»ó(color), µîÀÇ Ç¥ÇöÀû ¹®±¸¸¦ ±¸º°ÇÑ´Ù. À̰͵éÀÌ Ç¥(table)¿¡ ±¸º° µÈ ¿µÇâÀ» ¹ÌÄ¡´Â°¡? Ç¥ÀÇ Ä­µé ¾È¿¡¼­ ÅؽºÆ®ÀÇ Á¤·Ä°ú Ä­µé »çÀÌÀÇ Å׵θ®(border)´Â Ç¥ÇöÀÇ ¹®Á¦ÀÌ°í, ±¸Á¶ ¹®Á¦°¡ ¾Æ´Ï´Ù. ±×·¯³ª ½ÇÁ¦ÀûÀ¸·Î, ÀÌ ±â´ÉµéÀº ÇÑ Àû¿ë¿¡¼­ ´ÙÀ½ Àû¿ëÀ¸·Î ´ë´ÜÈ÷ ½±°Ô À¯µ¿ ÇÒ ¼ö Àֱ⠶§¹®¿¡, À̰͵éÀº ±¸Á¶Àû Á¤º¸·Î ±¸·ì Áö¿ì´Â °Í È¿°úÀû ÀÏ °ÍÀÌ´Ù. HTML Ç¥ ¸ðµ¨¿¡¼­ ´ëºÎºÐÀÇ Ç¥Çö Á¤º¸´Â ¿¬°ü µÈ ½ºÅ¸ÀϽ¬Æ®(style sheet)·Î ³Ñ±â´Â °ÍÀÌ ÁÁ´Ù. ÀÌ ±Ô°ÝÀÇ ±× ¸ðµ¨Àº ±×·± ½ºÅ¸ÀϽ¬Æ®ÀÇ ÀåÁ¡À» °®µµ·Ï ¼³°è µÇ¾úÀ¸³ª, Çʼö»çÇ×Àº ¾Æ´Ï´Ù.

¿À´Ã³¯ÀÇ ÆíÁý µµ±¸µéÀº Ç¥ÀÇ Ç¥Çö¿¡ ´ëÇÑ ´ë´ÜÈ÷ dzºÎÇÑ Á¦¾î(control)¸¦ Á¦°øÇÑ´Ù. ±×¸®°í, RTF³ª MIF¿Í °°Àº ÅؽºÆ®°¡ dzºÎÇÏ°í ¹æ´ëÇÑ ¾ç½ÄÀ¸·Î HTMLÀ» ¸¸µéÁö ¾Ê°í´Â, HTML ¾È¿¡¼­ Àç»ý»ê ÇÏ´Â °ÍÀº ¾î·Á¿ï °ÍÀÌ´Ù. ±×·¯³ª, ÀÌ ±Ô°ÝÀº Á¦ÀÛÀÚ°¡ Å׵θ® ½ºÅ¸ÀϵéÀÇ ÀϹÝÀûÀ¸·Î »ç¿ëµÇ´Â Ŭ¶ó½º(class)µéÀÇ ¼¼Æ®·Î ºÎÅÍ ¼±ÅÃÇϵµ·Ï Á¦°øÇÏÁö´Â ¾Ê´Â´Ù. frame ¾ÖÆ®¸®ºäÆ®´Â Ç¥ ÁÖÀ§ÀÇ Å׵θ®(border)ÀÇ ¸ð¾çÀ» Á¦¾îÇÏ°í, rules ¾ÖÆ®¸®ºäÆ®´Â Ç¥¾È¿¡¼­ ÁÙ(rule)µéÀÇ ¼±ÅÃÀ» °áÁ¤ÇÑ´Ù, ´õ ¼¼¹ÐÇÑ Ç¥ÇöÀº ¾Ö´Ï¸ÞÀ̼Ç(annotation)À» ÅëÇÑ Ç¥ÇöÀ¸·Î Áö¿øµÈ´Ù. style ¾ÖÆ®¸®ºäÆ®´Â °³º° ¿¤·¹¸àÆ®ÀÇ Ç¥Çö Á¤º¸¸¦ ÁöÁ¤Çϴµ¥ »ç¿ë µÉ ¼ö ÀÖ´Ù. ¹®¼­ÀÇ Çìµå(head) ¾È¿¡¼­ ȤÀº ¿¬°á µÈ ½ºÅ¸ÀϽ¬Æ®¸¦ ÅëÇÏ¿©, STYLE ¿¤·¹¸àÆ®·Î Ãß°¡ÀûÀΠǥÇö Á¤º¸¸¦ ÁÙ ¼ö ÀÖ´Ù.

ÀÌ ±Ô°ÝÀÌ ¹ßÀüÇÏ´Â µ¿¾È, ¿©·¯¹ø Ç¥ÀÇ ÁÙ(rule) ÆäÅÏÀ» ÁöÁ¤Çϱâ À§ÇÑ ¿¬±¸°¡ ÀÖ¾ú´Ù. ÇÑ °¡Áö ¹®Á¦´Â ÇÒ ¼ö ÀÖ´Â ¼±¾ðÀÇ Á¾·ù¿¡ °üÇÑ °ÍÀ̾ú´Ù. º¯µÎ¸® Á¦°Å Áö¿øÀ» Æ÷ÇÔ½ÃÅ°´Â °ÍÀ̳ª º¯µÎ¸® Ãß°¡´Â »ó´ëÀûÀ¸·Î º¹ÀâÇÑ ±â´ÉÀ» À¯¹ß ½ÃÄ×´Ù. ¿¹¸¦ µé¾î, Ç¥ ¿¤·¹¸àÆ®µé¿¡ frame°ú rules ¾ÖÆ®¸®ºäÆ®¸¦ Æ÷ÇÔÇÏ¿© ¿ÏÀü ¼¼Æ®¸¦ ¸¸µå´Â ÀÛ¾÷Àº, Ä­ÀÇ Æ¯Á¤ º¯µÎ¸®(edge)¿¡ ÁÙ(rule)À» ±ß´Â°¡ ¾Æ´Ñ°¡¸¦ °áÁ¤Çϴµ¥, ÇÑ ±â´ÉÀÌ 24 ´Ü°è¸¦ °ÅÄ¡°Ô µÈ´Ù. ÀÌ Ãß°¡ÀûÀÎ º¹À⼺¿¡µµ ºÒ±¸ÇÏ°í, Ç¥¿¡ ÇÊ¿äÇÑ ¿ÏÀüÇÑ ¹üÀ§ÀÇ Ç¥Çö Á¦¾î¿¡ ÃæºÐÇÏÁö ¸øÇß´Ù. ÇöÀç ±Ô°ÝÀº ´ëºÎºÐÀÇ ¸ñÀû¿¡ ÃæºÐÇÑ ´Ü¼øÇÑ ¸ðµ¨·Î µÇ¾îÀÖ´Ù. ´õ º¹ÀâÇÑ Á¢±ÙÀÌ Ç¥ÁØÈ­ µÇ±â À§Çؼ­´Â Ãß°¡ÀûÀÎ ½ÇÇèµéÀÌ ÇÊ¿äÇÏ´Ù.

¿­(row)°ú Ä÷³(column) ±¸·ì

ÀÌ ±Ô°ÝÀº HTML+ÀÇ Ãʱâ ÀÛ¾÷¿¡¼­ Á¦½ÃµÈ °£´ÜÇÑ ¸ðµ¨ÀÇ ¼­ºê¼¼Æ®¸¦ Á¦°øÇÑ´Ù. Ç¥(table)µéÀº ÇϳªÀÇ ¼±ÅÃÀû Á¦¸ñ(caption)°ú ÇÔ²² ¿©·¯°³ÀÇ ¿­µé, ÀÌ ¿­Àº ´Ù½Ã ¿©·¯°³ÀÇ Ç¥ÀÇ Ä­µé·Î ±¸¼ºµÇ¾î, Çü¼ºµÇ´Â °ÍÀ¸·Î °í·ÁµÇ¾ú´Ù. ÀÌ ¸ðµ¨Àº Çì´õ¿Í µ¥ÀÌÅÍ Ä­µé·Î ´õ Â÷º°È­ µÇ°í, ¿©·¯°³ÀÇ ÁÙ°ú Ä÷³ÀÌ È®Àå(span) µÉ ¼ö ÀÖ°Ô ÇÏ¿´´Ù.

CALS Ç¥ ¸ðµ¨¿¡ µû¶ó, ÀÌ ±Ô°ÝÀº Ç¥ÀÇ ¿­µéÀÌ ¸Ó¸®±Û, º»Ã¼¿Í ¹Ù´Ú±Û Ç׸ñµé·Î ±¸·ìÁö¿ö Áú ¼ö ÀÖ°Ô ÇÏ¿´´Ù. ÀÌ´Â Á¤º¸ÀÇ Ç¥ÇöÀ» °£´ÜÈ÷ ÇÑ´Ù. Ç¥ÀÇ ¸Ó¸®±Û°ú ¹Ù´Ú±Û ¿­À», Ç¥°¡ ÆäÀÌÁö °æ°è¿¡¼­ ²÷¾î Áú ¶§, ¶Ç´Â ±¼¸®(scroll)´Â º»Ã¼ â »óºÎ¿¡ °íÁ¤µÈ Çì´õ(header)°¡ Á¦°ø µÉ ¶§, ¹Ýº¹ÇÏ¿© »ç¿ë µÉ ¼ö ÀÖ´Ù. ÀÛ¼º(markup)¿¡¼­´Â ¹Ù´Ú±Û(foot) Ç׸ñÀº º»Ã¼(body) Ç׸ñµé º¸´Ù ¸ÕÀú À§Ä¡ÇÑ´Ù. ÀÌ°ÍÀº ´ë´ÜÈ÷ ±ä Ç¥¸¦ ó¸®Çϱâ À§ÇÏ¿© ÃÖÀûÈ­¸¦ CALSÀÇ °Í°ú °°ÀÌ ¹æ¹ýÀ» ¾´´Ù. ¸ðµç Ç¥ÀÇ Ã³¸®¸¦ ±â´Ù¸± ÇÊ¿ä ¾øÀÌ ¹Ù´Ú±ÛÀÇ Ç¥ÇöÀ» Çã¿ëÇÑ´Ù.

Á¢¼Ó¼º

¼Õ»óµÈ °ÍÀ» À§ÇÏ¿©, HTMLÀº ±×·¡ÇÈ »ç¿ëÀÚ ÀÎÅÍÆäÀ̽º¿¡ ±âÃÊÇÏ¿©, À©µµ¿ìÀÇ Ã¤¿ëÀ¸·Î À¯¹ßµÇ´Â ÇÇÇظ¦ °íÄ¡µµ·Ï Èñ¸ÁÇÏ¿´´Ù. À½¼ºÀ¸·Î º¯È¯ÇÏ´Â °í Ç°Áú ÅؽºÆ®¸¦ Áö¿øÇϱâ À§ÇÏ¿©, HTML Ç¥ ¸ðµ¨Àº °¢ Ä­ÀÇ ¶óº§¸µÀ» À§ÇÑ ¾ÖÆ®¸®ºäÆ®¸¦ Æ÷ÇÔÇß´Ù. µ¥ÀÌÅͺ£À̽º(database)³ª ½ºÇÁ·¹µå½¬Æ®(spreadsheet)·ÎºÎÅÍ Ç¥ µ¥ÀÌÅÍÀÇ ÀÚµ¿ÀûÀÎ ¼öÀÔ(import)°ú ¼öÃâ(export)À» Áö¿øÇϱâ À§ÇÏ¿© °°Àº ¾ÖÆ®¸®ºäÆ®µéÀÌ ¶ÇÇÑ »ç¿ëµÈ´Ù.

B.5.2 ÃßõµÇ´Â ¹èÄ¡ ±â´É(layout algorithm)

¸¸ÀÏ COL ¶Ç´Â COLGROUP ¿¤·¹¸àÆ®(element)°¡ ÀÖ´Ù¸é, À̰͵éÀº Ä÷³µéÀÇ °¹¼ö¸¦ ÁöÁ¤ÇÏ°í, ±× Ç¥´Â °íÁ¤ µÈ ¹èÄ¡(fixed layout)¸¦ »ç¿ëÇÏ¿© Ç¥Çö µÉ °ÍÀÌ´Ù. ±×·¸Áö ¾ÊÀ¸¸é, ¾Æ·¡ ¼³¸í µÈ ÀÚµ¿ ¹èÄ¡ ±â´É(autolayout algorithm)ÀÌ »ç¿ë µÉ °ÍÀÌ´Ù.

¸¸ÀÏ width ¾ÖÆ®¸®ºäÆ® °¡ ¼³Á¤µÇÁö ¾Ê¾ÒÀ¸¸é, º¸´Â(visual) »ç¿ëµµ±¸´Â ¾ç½ÄÈ­¿¡ µðÆúÆ® °ªÀÎ 100%·Î °£ÁÖÇؾßÇÑ´Ù.

Ä­(cell)ÀÇ ³»¿ëµéÀº, ±×·¸Áö ¾ÊÀ¸¸é ³ÑÄ¡´Â °æ¿ì, »ç¿ëµµ±¸°¡ Ç¥ÀÇ ³Êºñ¸¦ width¿¡ ÀÇÇÏ¿© ÁöÁ¤ µÈ °ª ÀÌ»óÀ¸·Î Áõ°¡½Ãų °ÍÀÌ ÃßõµÈ´Ù. ÁöÁ¤ µÈ ³Êºñ¸¦ µ¤¾î ¾º¿ì´Â »ç¿ëµµ±¸´Â ÀÌÀ¯ÀÖ´Â ¹üÀ§ ¾È¿¡¼­ ±×·¸°ÔÇÏ¿©¾ß ÇÑ´Ù. »ç¿ëµµ±¸´Â °úµµ ÇÑ ¼öÆò ±¼¸®±â(scroll)¸¦ ÇÇÇϱâ À§ÇÏ¿©, ¶Ç´Â ±×·± ±¼¸®°¡ Àû´çÇÏÁö ¾Ê°Å³ª ¹Ù¶÷Á÷ ÇÏÁö ¾ÊÀ» ¶§, ´Ü¾îµéÀ» ¿­µé·Î ÀÚ¸¦ ¼ö ÀÖ´Ù.

¹èÄ¡(layout)ÀÇ ¸ñÀûÀ» À§ÇÏ¿©, »ç¿ëµµ±¸´Â Ä­µé°ú °°ÀÌ ÀÛ¿ëÇÏ´Â CAPTION ¿¤·¹¸àÆ®¿¡ ÀÇÇÏ¿© ÁöÁ¤µÇ´Â Ç¥ÀÇ Á¦¸ñµéÀ» °í·ÁÇÏ¿©¾ß ÇÑ´Ù. °¢ Á¦¸ñÀº È®Àå(span) µÈ ÇÑ°³ÀÇ Ä­À̸ç, ¸¸ÀÏ Ç¥ÀÇ À§ÂÊÀ̳ª ¾Æ·¡ÂÊÀ̸é Ç¥ÀÇ Ä÷³µéÀÌ°í, Ç¥ÀÇ ¿ÞÂÊÀ̳ª ¿À¸¥ÂÊÀÌ¸é ¿­µé ÀÌ´Ù.

°íÁ¤ ¹èÄ¡ ±â´É(layout algorithm)

ÀÌ ±â´É¿¡¼­´Â, Ä÷³(column)ÀÇ °¹¼ö°¡ ¾Ë·ÁÁø °ÍÀ¸·Î °¡Á¤ÇÏ°í, Ä÷³ ³ÊºñµéÀº µðÆúÆ®·Î °°Àº Å©±â·Î ¼³Á¤µÈ´Ù. Á¦ÀÛÀÚ´Â COLGROUP ¶Ç´Â COL ¿¤·¹¸àÆ®(element)¸¦ »ç¿ëÇÏ¿© »ó´ë ¶Ç´Â Àý´ë Ä÷³ ³Êºñ¸¦ ÁöÁ¤ÇÏ¿© µ¤¾î ¾º¿ï(override) ¼ö ÀÖ´Ù. Ç¥(table)ÀÇ µðÆúÆ® ³Êºñ´Â ÇöÀçÀÇ ¿ÞÂÊ°ú ¿À¸¥ÂÊ ¸¶Áø(margin)µé »çÀÌÀÇ °ø°£ÀÌ´Ù. À̸¦ TABLE ¿¤·¹¸àÆ®ÀÇ width ¾ÖÆ®¸®ºäÆ®(attribute)·Î, ¶Ç´Â ÁöÁ¤ µÈ Àý´ë Ä÷³ ³Êºñ·Î µ¤¾î ¾º¿ï(override) ¼ö ÀÖ´Ù. Àý´ë¿Í »ó´ë Ä÷³ÀÇ È¥ÇÕ ³ÊºñµéÀ» ´Ù·ç±â À§ÇØ, ù¹ø° ´Ü°è·Î, Ç¥ ³Êºñ¸¦ Àý´ë ³Êºñ¸¦ °¡Áø Ä÷³µéÀÇ ³Êºñ¿¡ °ø°£À» ÇÒ´çÇÏ´Â °ÍÀÌ´Ù. ±× ÈÄ, ³ª¸ÓÁö °ø°£À» »ó´ë ³Êºñ¸¦ °¡Áø Ä÷³µé »çÀÌÀÇ ³Êºñ¸¦ ºÐ¹èÇÑ´Ù.

Ç¥ ¹®¹ý ´Üµ¶À¸·Î´Â ¾ÖÆ®¸®ºäÆ® °ªÀÇ ÀÏ°ü¼ºÀ» º¸ÁõÇϱ⿡´Â ºÒÃæºÐÇÏ´Ù. ¿¹¸¦ µé¾î COL°ú COLGROUP ¿¤·¹¸àÆ®ÀÇ °¹¼ö´Â Ç¥ÀÇ Ä­µé¿¡ ÀÇÇØ ÀǹÌÇÏ´Â Ä÷³ÀÇ °¹¼ö¿Í ¸ÂÁö ¾ÊÀ» ¼ö ÀÖ´Ù. °É·³µéÀÇ ³Êºñ°¡ Ä­(cell)ÀÇ ³»¿ëÀÇ ³Ñó È帧(overflow)À» ÇÇÇϱ⿡ ³Ê¹« Á¼À» ¶§ ¹ß»ýÇÏ´Â ¹®Á¦°¡ ÀÖ´Ù. TABLE ¶Ç´Â COL ¿¤·¹¸àÆ®¿¡ ÀÇÇÏ¿© ÁöÁ¤ µÈ Ç¥ÀÇ ³Êºñ´Â Ä­ ³»¿ëÀÇ ³Ñó È帧À» ÃÊ·¡ ÇÒ ¼ö ÀÖ´Ù. »ç¿ëµµ±¸µéÀº ÀÌ¿Í °°Àº »óȲ¿¡¼­, ¿ì¾ÆÇÏ°Ô È¸º¹Çϵµ·Ï ½Ãµµ ÇÒ °ÍÀ» ÃßõÇÑ´Ù. ¿¹¸¦ µé¾î, ´Ü¾î¿¡ ÇÏÀÌÇ ³Ö±â(hyphenating)¿¡ ÀÇÇÑ °Í°ú ÇÏÀÌÇ ³ÖÀº À§Ä¡¸¦ ¸ð¸¦ ¶§ ºÐ¸®µÈ ´Ü¾îµéÀ» Àç¹èÄ¡ ½ÃÅ´ µîÀÌ ÀÖ´Ù.

°³º° ¿¤·¹¸àÆ®°¡ Ä­ÀÇ ³Ñó È帧À» À¯¹ß ½Ãų °æ¿ì, »ç¿ëµµ±¸´Â Ä÷³ ³ÊºñÀÇ Á¶Á¤ÇÏ°í, Ç¥¸¦ ´Ù½Ã Ç¥½ÃÇÏ´Â °ÍÀ» °í·Á ÇÒ ¼ö ÀÖ´Ù. ¸¸ÀÏ Ä÷³ ³Êºñ Á¶Á¤°ú/À̳ª ±¼¸®´Â(scrollable) Ä­ ³»¿ëÀÌ °¡´ÉÇÏÁö ¾ÊÀ» ¶§, ÃÖ¾ÇÀÇ °æ¿ì, À߶ó³¿ÀÌ °í·Á µÉ ¼ö ÀÖ´Ù. ¾î´À °æ¿ì³ª, Ä­ÀÇ ³»¿ëÀÌ ºÐ¸®(split)µÇ°Å³ª À߶ó(clip)Áö¸é, ÀÌ°ÍÀ» »ç¿ëÀÚ¿¡°Ô Àû´çÇÑ ¹æ¹ýÀ¸·Î ¾Ë·Á¾ßÇÑ´Ù.

ÀÚµ¿ ¹èÄ¡ ±â´É(autolayout algorithm)

¸¸ÀÏ COL°ú COLGROUP ¿¤·¹¸àÆ®(element)¿¡ ÀÇÇÏ¿© Ä÷³(column)µéÀÇ °¹¼ö°¡ ÁöÁ¤µÇ¾î ÀÖÁö ¾ÊÀ¸¸é, »ç¿ëµµ±¸µéÀº ´ÙÀ½ ÀÚµ¿ ¹èÄ¡ ±â´ÉÀ» »ç¿ëÇÏ¿©¾ß ÇÑ´Ù. À̴ ǥÀÇ µ¥ÀÌÅ͸¦ ÅëÇØ µÎ ´Ü°è¸¦ »ç¿ëÇÏ°í Ç¥ÀÇ Å©±â¸¦ ±æÀÌ·Î °è»êÇÑ´Ù.

ù¹ø° ´Ü°è, ÀÚµ¿ ÁٹٲÞ(line wrap)ÀÌ ¾ÊÀº »óÅ¿¡¼­, »ç¿ëµµ±¸´Â °¢ Ä­(cell)ÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³Êºñ¸¦ ã¾Æ³½´Ù. ÃÖ´ë ³Êºñ´Â °¡Àå ±ä ÁÙ¿¡ ÀÇÇÏ¿© ÁÖ¾îÁø´Ù. ÀÚµ¿ ÁٹٲÞÀÌ ÁßÁö µÇ¾úÀ¸¹Ç·Î, ¹®´ÜµéÀº BR¿¡ ÀÇÇÏ¿© °­Á¦ ÁٹٲÞÀÌ µÇÁö ¾Ê´Â ÇÑ ±ä ÁٷΠ󸮵ȴÙ. ÃÖ¼Ò ³Êºñ´Â ¾Õ¿¡ ³ª¿À´Â ¸ñ·ÏÀÇ µé¿©¾²±â¿Í ºÒ·¿(bullet) µîÀ» Æ÷ÇÔÇÏ¿© °¡Àå ±ä ¿¤·¹¸àÆ®(´Ü¾î, À̹ÌÁö, µî)¿¡ ÀÇÇÏ¿© ÁÖ¾î Áø´Ù. ÀÚ½ÅÀÇ Ã¢ ¾È¿¡¼­ Ä­ÀÇ ³Ñó È帧(overflow)ÀÌ ½ÃÀ۵DZâ Àü¿¡ ¿ä±¸µÇ´Â ÃÖ¼Ò ³Êºñ¸¦ °áÁ¤ÇÏ´Â °ÍÀ» ¸»ÇÑ´Ù. »ç¿ëµµ±¸¿¡ ´Ü¾î ºÐ¸®(split)¸¦ Çã¿ëÇÏ´Â °ÍÀº ¼öÆò ½ºÄÉÀ̸µÀÇ Çʿ並 ÃÖ¼ÒÈ­ÇÏ°í, ¶Ç´Â ÃÖ¾ÇÀÇ °æ¿ì Ä­ ³»¿ëÀÇ ÀÚ¸£±â(clip)¸¦ ÇÑ´Ù.

ÀÌ °úÁ¤Àº Ä­ÀÇ ³»¿ë¿¡¼­ ³×½ºÆ®(nest) µÈ Ç¥¿¡µµ Àû¿ëµÈ´Ù. ³×½ºÆ® µÈ Ç¥¿¡¼­ Ä­µéÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³ÊºñµéÀº Ç¥µéÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³Êºñµé°ú ¸ðü(parent) Ç¥ÀÇ Ä­ ÀÚü ³Êºñ¸¦ °áÁ¤Çϴµ¥ »ç¿ëµÈ´Ù. ÀÌ ±â´ÉÀº Ä­ ³»¿ëÀÇ ¼±Àû(linear) ÁýÇÕ(aggregate)À̸ç, ³Ð°Ô ¸»Çؼ­ ³×½ºÆÃÀÇ ±íÀÌ(´Ü°è)¿¡´Â °ü°è°¡ ¾ø´Ù.

Ä­ ³»¿ëÀÇ ±ÛÀÚ Á¤·Ä(alignment)À» ´Þ¼ºÇϱâ À§ÇÏ¿©, ÀÌ ±â´ÉÀº °¢ Ä÷³¿¡ ÀÛµ¿ÇÏ´Â ¼¼°¡Áö ÃÖ¼Ò/ÃÖ´ë ÇÕ°èµéÀ» º¸À¯ÇÑ´Ù. ÀÌ ¼¼°¡ÁöµéÀº ±ÛÀÚ ¿ÞÂÊ Á¤·Ä, ±ÛÀÚ ¿À¸¥ÂÊ Á¤·Ä°ú Á¤·Ä ¾ÈµÊÀÌ´Ù. Ä÷³ÀÇ ÃÖ¼Ò ³Êºñ´Â max(min_left + min_right, min_non-aligned)(Àǹ̴ ÃÖ¼Ò ¿ÞÂÊ Á¤·Ä + ÃÖ¼Ò ¿À¸¥ÂÊ Á¤·Ä°ú Á¤·Ä ¾ÊµÈ °Í Áß Å« ¼öÄ¡)ÀÌ´Ù.

Ä­µéÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³ÊºñµéÀº »óÀÀÇÏ´Â Ä÷³µéÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³Êºñµé °áÁ¤Çϱâ À§ÇÏ¿© »ç¿ëµÈ´Ù. À̵éÀº ´Ù½Ã Ç¥ÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³Êºñ¸¦ °áÁ¤Çϴµ¥ »ç¿ëµÈ´Ù. Ä­µéÀº ³×½ºÆ®(neste) µÈ Ç¥¸¦ °¡Áú ¼ö Àִµ¥, Äڵ带 ÇöÀúÈ÷ º¹ÀâÇÏ°Ô ÇÏÁö ¾Ê´Â´Ù. ´ÙÀ½ ´Ü°è´Â ÇöÀç ¿ÞÂÊ°ú ¿À¸¥ÂÊ ¸¶Áøµé »çÀÌÀÇ °¡¿ë °ø°£¿¡ µû¶ó Ä÷³ ³ÊºñµéÀ» ÁöÁ¤ÇÏ´Â °ÍÀÌ´Ù.

¿©·¯ Ä÷´µé¿¡ È®Àå(span) µÈ Ä­À» À§ÇÏ¿©, °£´ÜÇÑ Á¢±ÙÀº ÃÖ¼Ò/ÃÖ´ë ³ÊºñµéÀ» °¢ ±¸¼º Ä÷³µé¿¡ ±ÕÀÏÇÏ°Ô ¹èºÐÇÏ´Â °ÍÀÌ´Ù. ¾à°£ ´õ º¹ÀâÇÑ Á¢±ÙÀº È®Àå(span) µÈ ³ÊºñµéÀÌ ¾î¶»°Ô ¹èºÐ µÇ¾ú´Â°¡ÇÏ´Â ºñÁß¿¡ µû¶ó, È®ÀåµÇÁö ¾ÊÀº Ä­µé¿¡ ÃÖ¼Ò/ÃÖ´ë ³ÊºñµéÀ» »ç¿ëÇÏ´Â °ÍÀÌ´Ù. ½ÇÇèµéÀº ÀÌ µÎ°¡Áö Á¢±ÙÀÇ È¥ÇÕÀ¸·Î Æø ³ÐÀº Ç¥µé¿¡¼­ ÁÁÀº °á°ú¸¦ ¾òÀ» °ÍÀ̶ó´Â °ÍÀ» ¸»ÇØ ÁØ´Ù.

Ç¥ Å׵θ®(border)¿Í Ä­»çÀÌ ¸¶Áø(margin)µéÀÌ Ä÷³ ³Êºñ ÁöÁ¤¿¡ Æ÷ÇÔ µÉ ÇÊ¿ä°¡ ÀÖ´Ù.

¼¼°¡Áö °æ¿ì°¡ ÀÖ´Àµ¥:
  1. ÃÖ¼Ò Ç¥ÀÇ ³Êºñ°¡ °¡¿ë °ø°£°ú °°°Å³ª ´õ ³ÐÀ» ¶§. ÀÌ·± °æ¿ì, ±× ÃÖ¼Ò ³ÊºñÀ» ÁöÁ¤ÇÏ°í »ç¿ëÀÚ°¡ ¼öÆò ±¼¸®±â(scroll)¸¦ ÇÒ ¼ö ÀÖ°Ô ÇÑ´Ù. Á¡ÀÚÀÇ °æ¿ì, Ä­µéÀ» ±× Àüü ³»¿ëÀ» Æ÷ÇÔÇÏ´Â ÁÖ¼®ÀÇ ÂüÁ¶·Î ´ëüÇÏ´Â °ÍÀÌ ÇÊ¿ä ÇÒ °ÍÀÌ´Ù. ÀÌ °æ¿ì Ç¥ ÀÌÀü¿¡ ³ª¿Â´Ù.
  2. ÃÖ´ë Ç¥ÀÇ ³Êºñ°¡ °¡¿ë °ø°£ ¾È¿¡ ¸ÂÀ» ¶§. ÀÌ·± °æ¿ì, Ä÷³µéÀÀ ±× ÃÖ´ë ³Êºñµé·Î ¼³Á¤ÇÑ´Ù.
  3. ÃÖ´ë Ç¥ÀÇ ³Êºñ°¡ °¡¿ë °ø°£ º¸´Ù Å©°Å³ª, ÃÖ¼Ò Ç¥ÀÇ ³Êºñ°¡ ÀÌ º¸´Ù ÀÛÀ» ¶§. ÀÌ·± °æ¿ì, âÀÇ °¡¿ë °ø°£°ú ÃÖ¼Ò Ç¥ ³ÊºñÀÇ Â÷À̸¦ ã´Â´Ù. ÀÌ Â÷À̸¦ W¶ó°í ÇÏÀÚ. ¶Ç Ç¥ÀÇ ÃÖ´ë¿Í ÃÖ¼Ò ³ÊºñÀÇ Â÷À̸¦ D¶ó°í ÇÏÀÚ.

    °¢ Ä÷³¿¡¼­, Ä÷³ÀÇ ÃÖ´ë¿Í ÃÖ¼Ò ³ÊºñÀÇ Â÷À̸¦ d¶ó°í ÇÏÀÚ. ÀÌÁ¦ Ä÷³ÀÇ ³Êºñ¸¦
    Ä÷³ÀÇ ³Êºñ = 'Ä÷³ÀÇ ÃÖ¼Ò ³Êºñ + d * W / D'·Î ¼³Á¤ÇÑ´Ù.
    ÀÌ´Â ÃÖ¼Ò¿Í ÃÖ´ë ³ÊºñÀÇ Å« Â÷ÀÌ°¡ ÀÖ´Â Ä÷³µéÀ» ÀÛÀº Â÷ÀÌ°¡ ÀÖ´Â Ä÷´µé º¸´Ù ³Ð°Ô ¸¸µç´Ù.

ÀÌ ÇÒ´ç °úÁ¤ÀÌ ³×½ºÆ®(nest) µÈ Ç¥¿¡, ù¹ø° °úÁ¤¿¡¼­ ³ª´µ¾îÁø ¸ðµç Ç¥ÀÇ ÃÖ¼Ò¿Í ÃÖ´ë ³ÊºñµéÀ» »ç¿ëÇÏ¿©, ¹Ýº¹µÈ´Ù. ÀÌ·± °æ¿ì, ¸ðü(parent) Ç¥ Ä­ÀÇ ³Êºñ°¡ À§¿¡ ±â¼ú µÈ â(window) Å©±âÀÇ ±â´ÉÀ» ÇÑ´Ù. ÀÌ °úÁ¤ÀÌ ¸ðµç ³×½ºÆ® µÈ Ç¥¿¡¼­ ¹Ýº¹ÀûÀ¸·Î µÇÇ®ÀÌ µÈ´Ù. ±×·± ÈÄ °¡Àå »óÀ§ÀÇ Ç¥°¡ ÁÖ¾îÁø ³Êºñ¸¦ »ç¿ëÇÏ¿© Ç¥ÇöµÈ´Ù. ³×½ºÆ® µÈ Ç¥°¡ ¸ðü Ç¥ÀÇ Ä­ ³»¿ëÀ¸·Î ÈÄ¼Ó Ç¥ÇöµÈ´Ù.

¸¸ÀÏ Ç¥ÀÇ ³Êºñ°¡ width ¾ÖÆ®¸®ºäÆ®·Î ÁöÁ¤µÇ¾úÀ¸¸é, »ç¿ëµµ±¸´Â ÀÌ Ä÷³ ³Êºñ¸¦ ¼³Á¤Çϱ⸦ ½ÃµµÇÑ´Ù. Ä÷³µéÀÇ ³Êºñ°¡ °³º° Ä÷³ÀÇ ÃÖ¼Ò ³Êºñº¸´Ù ÀÛÀ¸¸é width ¾ÖÆ®¸®ºäÆ®´Â ¹«½ÃµÈ´Ù.

¸¸ÀÏ COL ¿¤·¹¸àÆ®·Î »ó´ë ³ÊºñµéÀÌ ÁöÁ¤ µÇ¾úÀ¸¸é, ÀÌ ±â´ÉÀº Ä÷³ ³ÊºñµéÀ» »ó´ë ³Êºñ ³»¿ë¿¡ ¸ÂÃß±â À§ÇÏ¿©, ÃÖ¼Ò ³Êºñ ÀÌ»óÀ¸·Î Áõ°¡Çϵµ·Ï ¼öÁ¤µÈ´Ù. COL ¿¤·¹¸àÆ®´Â ¾Ï½Ã·Î¸¸ ¹Þ¾Æ Á®¾ß ÇÔÀ¸·Î, Ä÷³µéÀº ±×µéÀÇ ÃÖ¼Ò ³Êºñ º¸´Ù ÀÛ°Ô ¼³Á¤µÇÁö ¸øÇÑ´Ù. ¸¶Âù°¡Áö·Î, Ç¥°¡ âÀÇ ¹üÀ§¸¦ ³Ñµµ·Ï ³Ð°Ô Ä÷³µéÀº ¸¸µé¾î Áú ¼ö ¾ø´Ù. ¸¸ÀÏ COL ¿¤·¹¸àÆ®°¡ »ó´ë ³Êºñ¸¦ 0À¸·Î ¼³Á¤Çϸé, ±× Ä÷³Àº Ç×»ó ±× ÃÖ¼Ò ³Êºñ¸¦ ¼³Á¤ÇÏ¿©¾ß ÇÑ´Ù.

ÀÌ µÎ °úÁ¤ÀÇ ¹èÄ¡ ±â´ÉÀ» »ç¿ë ÇÒ ¶§, ¸í½ÃÀû ¶Ç´Â Àü´ÞµÈ(inherited) charoff ¾ÖÆ®¸®ºäÆ®°¡ ¾øÀ¸¸é, µðÆúÆ® Á¤·Ä À§Ä¡´Â align="char"¸¦ °®´Â Ä÷³ ¾È¿¡¼­ ¾î´À ÁÙ¿¡¼­³ª Á¤·Ä(alignment) ±ÛÀÚ ¾Õ°ú µÚ¿¡ ¿À´Â ±× ³ÊºñµéÀÌ ÃÖ´ë °ªµéÀ» °®°í ÁÙµéÀ» Áß¾Ó¿¡ ¿À°ÔÇÏ´Â À§Ä¡¸¦ ¼±ÅÃÇÒ ¼ö ÀÖ´Ù. Á¡ÁøÀû Ç¥ ¹èÄ¡ÀÇ µðÆúÆ®´Â charoff="50%"·Î Á¦¾È µÇ¾ú´Ù. °°Àº Ä÷³ÀÇ ´Ù¸¥ ¿©·¯ ¿­(row)µéÀÌ ±ÛÀÚ Á¤·ÄÀ» »ç¿ëÇϸé, ¾î´À ±ÛÀÚ°¡ Á¤·Ä¿¡ »ç¿ëµÇ¾ú´Â°¡¿¡ °ü°è ¾øÀÌ, µðÆúÆ®·Î, ¸ðµç ±×·¸ÇÑ Ä­µéÀº ÁÙÀ» ¸ÂÃß¾î¾ßÇÑ´Ù. ¸í½ÃÀû ¶Ç´Â ¾Ï½ÃÀû Á¤·ÄÀÌ µ¥ÀÌÅÍ°¡ Ä÷³¿¡ ÁöÁ¤ µÈ ³Êºñ¸¦ ÃÊ°úÇÏ´Â »óȲÀÌ ¹ß»ýµÇ¸é, ´Ù·ç´Â ¿ÀºêÁ§Æ®µéÀÌ Ä÷³¿¡ ³Ê¹« Ŭ ¶§ÀÇ ±ÔÄ¢ÀÌ Àû¿ëµÈ´Ù.

¾ÖÆ®¸®ºäÆ® À̸§ÀÇ ¼±ÅÃ. frame ¾ÖÆ®¸®ºäÆ®ÀÇ °ªÀ» ¼±ÅÃÇϸé rules ¾ÖÆ®¸®ºäÆ®¿¡ Á¤·Ä(alignment)¿¡ »ç¿ëµÇ´Â °ª, ¿¹¸¦ µé¾î none, top, bottom, topbot, left, right, leftright, allµî À» ±¸¼ºÇÏ´Â °ÍÀÌ ¼±È£µÈ´Ù. ºÒÇàÇÏ°Ôµµ, SGMLÀº °¢ ¿¤·¹¸àÆ®¿¡ À¯ÀÏÇÏ°í, ±× ¾ÖÆ®¸®ºäÆ® À̸§¿¡ ¿µÇâÀ» ¹ÞÁö ¾Ê´Â, ¼ýÀÚ°¡ ÁÖ¾îÁø ¾ÖÆ®¸®ºäÆ® °ªÀ» ÇÊ¿ä·ÎÇÑ´Ù. ÀÌ ´Â "none", "left", "right" and "all"¿¡¼­ Áï½Ã ¹®Á¦¸¦ ÀÏÀ¸Å²´Ù. frame ¾ÖÆ®¸®ºäÆ®ÀÇ °ªµéÀº rules, align, valign ¾ÖÆ®¸®ºäÆ®¿Í Ãæµ¹À» ÇÇÇϱâ À§ÇÏ¿© ¼±ÅÃµÇ¾î ¿Ô´Ù. ÀÌ ±Ô°ÝÀÇ ÇâÈÄ ¹öÀü¿¡¼­ frame¿Í rules ¾ÖÆ®¸®ºäÆ®°¡ ´Ù¸¥ table ¿¤·¹¸àÆ®µé¿¡ Ãß°¡ µÉ ¿¹Á¤À̹ǷÎ, ÀÌ´Â ÇâÈÄ¿¡ ´ë ÇÑ ¾ÈÀü¼ºÀ» Á¦°øÇÒ °ÍÀÌ´Ù. ÇϳªÀÇ ´ëü ¹æ¹ýÀº frameÀ» ¸¸µå´Â CDATAÀÌ´Ù. W3C HTML ¿öÅ·±¸·ì(Working Group)Àº ¹øÈ£ ¸Þ°ÜÁø °ª¿¡ ±âÃÊÇÏ¿© ¾ÖÆ®¸®ºäÆ®¸¦ Á¡°ËÇÏ´Â SGML Á¡°Ë µµ±¸(validation tool)¸¦ »ç¿ëÇÒ ¼ö ÀÖ´Â ÀÕÁ¡µéÀ» À§ÇÑ È®½ÇÇÑ À̸§ÀÇ Çʿ伺ÀÌ ºñÁßÀ» ÀÒ¾ú´Ù´Â °ÍÀ» °ø°¨Çß´Ù.

B.6 Æû(form)¿¡ ´ëÇÑ ÁÖ¼®

B.6.1 Á¡ÁøÀû µð½ºÇ÷¹ÀÌ(incremental display)

³×Æ®¿ö±×(network)·Î ºÎÅÍ ¹Þ¾ÆÁö´Â ¹®¼­ÀÇ Á¡ÁøÀû µð½ºÇ÷¹ÀÌ´Â ÆûÀÇ °ßÁö¿¡¼­ ¾î¶² ¹®Á¦¸¦ ÀÏÀ¸Å²´Ù. ¼Û½Å(submit)µÇ´Â ÆûÀÌ Æû ¿¤·¹¸àÆ®µé¸¦ ¸ðµÎ ¹ÞÀ» ¶§ ±îÁö »ç¿ëµµ±¸´Â ¹®Á¦¸¦ ¹æÁöÇÏ¿©¾ß ÇÑ´Ù.

¹®¼­ÀÇ Á¡ÁøÀû µð½ºÇ÷¹ÀÌ´Â ÅÇ¿¡ ÀÇÇÑ(tabbing) Ç×ÇØ¿¡¼­ ¸î °¡Áö ¹®Á¦¸¦ ÀÏÀ¸Å²´Ù. ¹®¼­ÀÇ tabindex¿¡¼­ °¡Àå ³·Àº °ªÀ¸·Î ÃÊÁ¡(focus)ÀÌ ÁÖ¾îÁø °èÅë(heuristic)Àº óÀ½¿¡´Â ÇÕ¸®ÀûÀ¸·Î º¸ÀδÙ. ±×·¯³ª ÀÌ´Â ¹®¼­ÀÇ ÅؽºÆ®¸¦ ¸ðµÎ ¹ÞÀ» ¶§ ±îÁö ±â´Ù·Á¾ß ÇÑ´Â Àǹ̸¦ ³»Æ÷Çϴµ¥, ÀÌ´Â ±× ¶§±îÁö´Â °¡Àå ³·Àº °ªÀÇ tabindex´Â °è¼Ó º¯°æ µÉ ¼ö Àֱ⠶§¹®ÀÌ´Ù. ¸¸ÀÏ »ç¿ëÀÚ°¡ ±× Àü¿¡ ÅÇ Å°¸¦ ´©¸£¸é, »ç¿ëµµ±¸°¡ ÇöÀç °¡´ÉÇÑ °¡Àå ³·Àº tabindex °ª¿¡ ÃÊÁ¡À» ÁÖ´Â °ÍÀº ´ç¿¬ ÇÒ °ÍÀÌ´Ù.

¸¸ÀÏ ÆûÀÌ »ç¿ëÀÚ(client-side) ½ºÅ©¸³Æ®¿Í ¿¬°üµÇ¾î ÀÖÀ¸¸é, ´Ù¸¥ ¹®°Ô°¡ ¹ß»ý µÉ ¼ö ÀÖ´Ù. ¿¹¸¦ µé¾î ½ºÅ©¸³Æ® ó¸®ÀÚ(script handler)´Â ÁÖ¾îÁø Çʵå(field)¸¦ Á¶È¸Çϴµ¥, Á¸ÀçÇÏÁö ¾Ê´Â Çʵ带 Á¶È¸ ÇÒ ¼ö ÀÖ´Ù.

B.6.2 ÇâÈÄ ÇÁ·ÎÁ§Æ®

ÀÌ ±Ô°ÝÀº ÀϹÝÀûÀÎ Æû(form)ÀÇ Á¦ÀÛÀ» ¼öÇàÇϴµ¥ ÃæºÐÈ÷ °­·ÂÇÑ ¿¤·¹¸àÆ®(element)¿Í ¾ÖÆ®¸®ºäÆ®(attribute)ÀÇ ¼¼Æ®¸¦ Á¤ÀÇÇÑ´Ù. ±×·¯³ª ¾ÆÁ÷ °³¼±ÀÇ ¿©Áö´Â ¸¹ÀÌ ³²¾Æ ÀÖ´Ù. ´ÙÀ½Àº ÇâÈÄ °ËÅä µÉ ¹®Á¦µéÀÌ´Ù.

ÇϳªÀÇ °¡´ÉÇÑ È®ÀåÀº "type=image" ÀÏ ¶§ »ç¿ëÀÚ(client-side) À̹ÌÁö¸ÊÀ¸·Î »ç¿ëÇϱâ À§ÇÏ¿© INPUT¿¡ usemap ¾ÖÆ®¸®ºäÆ® ÀÇ Ãß°¡ µÉ °ÍÀÌ´Ù. AREA ¿¤·¹¸àÆ®´Â Ŭ¸¯ µÈ ÇØ´ç Áö¿ªÀÇ °ªÀ» ¼­¹ö¿¡ Àü´ÞÇϴµ¥ »ç¿ëµÈ´Ù. ¼­¹ö ½ºÅ©¸³Æ®ÀÇ º¯°æÀ» ÇÇÇϱâ À§Çؼ­, INPUT ¿¤·¹¸àÆ®¿Í ÇÔ²² »ç¿ë ÇÒ ¼ö ÀÖµµ·Ï, AREA¿¡ x ¿Í y °ªÀ» Á¦°øÇÏ¿© È®ÀåÇÏ´Â °ÍÀÌ ÇÕ´ç ÇÒ °ÍÀÌ´Ù.

B.7 ½ºÅ©¸³Æ®¿¡ ´ëÇÑ ÁÖ¼®

B.7.1 ÇâÈÄ ½ºÅ©¸³Å© ¸¶Å©·Î(macro)¸¦ À§ÇÑ ¿¹¾à µÈ ¹®¹ý

ÀÌ ±Ô°ÝÀº ÇâÈÄ ½ºÅ©¸³Æ® ¸¶Å©·Î¸¦ HTML CDATA ¾ÖÆ®¸®ºäÆ® ¾È¿¡¼­ Áö¿øÇϱâ À§ÇÑ ¹®¹ýÀ» ¿¹¾àÇÏ°í ÀÖ´Ù. ±× Àǵµ´Â ÆäÀÌÁö¿¡¼­ ¾Õ¿¡ ³ª¿Â ¿ÀºêÁ§Æ®ÀÇ Æ¯¼º¿¡ µû¶ó ¾ÖÆ®¸®ºäÆ®¸¦ ¼³Á¤ µÇµµ·Ï Çã¿ëÇÏ´Â °ÍÀÌ´Ù. ±× ¹®¹ýÀº:

  attribute = "... &{ macro body }; ... "

½ºÅ©¸³Å© ¸¶Å©·Î(macro)ÀÇ ÇöÀç »ç¿ë

¸¶Å©·Î(macro) º»Ã¼´Â º»ÁúÀû À̺¥Æ® ¾ÖÆ®¸®ºäÆ®¿¡ µû¶ó, µðÆúÆ® ½ºÅ©¸³Æ® ¾ð¾î·Î µÈ ÇÑ°³ ÀÌ»óÀÇ ¹®ÀåÀ¸·Î ¸¸µé¾î Áø´Ù. ½ê¹ÌÄÝ·Ð(;) ´ÙÀ½ÀÇ "{"´Â Ç×»ó ÇÊ¿äÇϸç, ¿À¸¥ÂÊ "}" ±îÁö ¸¶Å©·ÎÀÇ º»Ã¼·Î 󸮵ȴÙ. µû¿È Ç¥½Ãµµ ½ºÅ©¸³Æ® ¸¶Å©·Î¸¦ Æ÷ÇÔÇÏ´Â ¾ÖÆ®¸®ºäÆ®¿¡ Ç×»ó ÇÊ¿äÇÏ´Ù.

CDATA ¾ÖÆ®¸®ºäÆ®ÀÇ Ã³¸® °úÁ¤Àº ´ÙÀ½°ú °°´Ù.

  1. SGML Çؼ®(parser)Àº SGML ¿£Æ¼Æ¼¸¦ Æò°¡ÇÑ´Ù.(¿¹¸¦ µé¾î, "&gt;").
  2. ´ÙÀ½ ½ºÅ©¸³Æ® ¸¶Å©·ÎµéÀÌ ½ºÅ©¸³Æ® ¿£Áø(script engine)¿¡ ÀÇÇÏ¿© Æò°¡µÈ´Ù.
  3. ¸¶Áö¸·À¸·Î ±× °á°ú ±ÛÀÚ ¹®ÀÚ¿­ÀÌ ±× ÈÄ Ã³¸® °úÁ¤¿¡ Àü´ÞµÈ´Ù.

¹®¼­°¡ ·Îµå(load) µÇ°í, ¹®¼­ÀÇ ´Ù½Ã Å©±â ÁöÁ¤, ´Ù½Ã »öÄ¥Çϱ⠵îÀÌ ÀϾ±â Àü¿¡, ¸¶Å©·Î 󸮰¡ ÀϾ´Ù.

ºÒ·®ÇÑ ¿¹Á¦:
Javascript¸¦ »ç¿ëÇÑ ¿¹Á¦. ù¹ø° °ÍÀº ¹®¼­ÀÇ ¹è°æ»öÀ» ¹«ÀÛÀ§ ¼ö·Î ÇÏ´Â °ÍÀÌ´Ù.

<BODY bgcolor='&{randomrbg};'>

Àú³á¿¡ º¸±â À§ÇÏ¿© ¹è°æ»öÀ» ¾îµÓ°ÔÇϱ⸦ ¿øÇÏ¿©,

<BODY bgcolor='&{if(Date.getHours> 18)...};'>

´ÙÀ½ ¿¹Á¦´Â »ç¿ëÀÚ(client-side) À̹ÌÁö¸ÊÀÇ ÁÂÇ¥(coordinate)¸¦ ¼³Á¤ÇÏ·Á°í,

<MAP NAME=foo>
  <AREA shape="rect" coords="&{myrect(imageuri)};"
	href="&{myuri};" alt="">
</MAP>

´ÙÀ½ ¿¹Á¦´Â ¹®¼­ Ư¼º¿¡ µû¶ó À̹ÌÁö Å©±â¸¦ ÁöÁ¤ÇÑ´Ù.

<IMG src="bar.gif" width='&{document.banner.width/2};'
	height='50%' alt="banner">

¿¬°áÀ» À§ ÇÑ URI ÁöÁ¤ ¶Ç´Â ½ºÆ®¸³Æ®¿¡ ÀÇÇÑ À̹ÌÁö ÁöÁ¤ÀÌ °¡´ÉÇÏ´Ù.

<SCRIPT type="text/Javascript">
  function manufacturer(widget) {
      ...
  }
  function location(manufacturer) {
      ...
  }
  function logo(manufacturer) {
      ...
  }
</SCRIPT>
 <A href='&{location(manufacturer("widget"))};'>widget</A>
 <IMG src='&{logo(manufacturer("widget"))};' alt="logo">

¸¶Áö¸· ¿¹Á¦´Â SGML CDATA ¾ÖÆ®¸®ºäÆ®°¡ ´ÜÀÏ ¶Ç´Â ÀÌÁß µû¿ÈÇ¥¸¦ »ç¿ëÇÏ¿© ¾î¶»°Ô ÀÎ¿ë µÉ ¼ö Àִ°¡¸¦ º¸¿© ÁØ´Ù. ¸¸ÀÏ ¾ÖÆ®¸®ºäÆ® ¹®ÀÚ¿­ ÁÖÀ§¿¡ ´ÜÀÏ µû¿ÈÇ¥¸¦ »ç¿ëÇϸé, ¾ÖÆ®¸®ºäÆ® ¹®ÀÚ¿­ ºÎºÐ¿¡´Â ÀÌÁß µû¿ÈÇ¥¸¦ Æ÷ÇÔ ½Ãų ¼ö ÀÖ´Ù. ´Ù¸¥ ¹æ¹ýÀº ÀÌÁß µû¿ÈÇ¥¸¦ À§ÇÏ¿© &quot;¸¦ »ç¿ëÇÏ´Â °ÍÀÌ´Ù.

<IMG src="&{logo(manufacturer(&quot;widget&quot;))};" alt="logo">

B.8 ÇÁ·¹ÀÓ¿¡ ´ëÇÑ ÁÖ¼®

ÇÁ·¹ÀÓ(frame) ¸ñÇ¥(target) À̸§ÀÌ À¯ÀÏ(unique)ÇÏ´Ù´Â º¸ÀåÀÌ ¾øÀ¸¹Ç·Î, ÇÁ·¹ÀÓ¿¡¼­ ÁÖ¾îÁø ¸ñÇ¥ À̸§ ã±âÀÇ ÇöÀçÀÇ »ç¿ë ¹æ½ÄÀ» ¼³¸íÇÏ´Â °ÍÀÌ ÁÁÀ» °ÍÀÌ´Ù.

  1. ¸¸ÀÏ ¸ñÇ¥ À̸§ÀÌ ÁöÁ¤ÇÏ´Â ÅؽºÆ®¿¡ ¼³¸í µÈ ¿¹¾à¾îÀ̸é, ÁöÁ¤µÈ ´ë·Î ¼öÇàÇÑ´Ù.
  2. ¾Æ´Ï¸é, ±× ¿¬°áÀ» °®´Â À©µµ¿ì ÇÁ·¹ÀÓ °èÅë(hierarchy)ÀÇ ÀÏÂ÷ ±íÀÌ °Ë»öÀ» ¼öÇàÇÑ´Ù. À̸§ÀÌ ²À ¸Â´Â ù¹ø° ÇÁ·¹ÀÓÀ» »ç¿ëÇÑ´Ù.
  3. ¸¸ÀÏ À§ 2¹ø¿¡¼­, °°Àº ÇÁ·¹ÀÓÀ» ¹ß°ß ÇÒ ¼ö ¾øÀ¸¸é, 2¹ø °úÁ¤À» ¾Õ¿¡¼­ µÚ·ÎÀÇ ¼ø¼­·Î °¢ â(window)¿¡ Àû¿ëÇÑ´Ù. ²À °°Àº ÇÁ·¹ÀÓ À̸§À» ¸¸³ª¸é ÁßÁöÇÑ´Ù.
  4. ¸¸ÀÏ À§ 3¹ø¿¡¼­ ¹ß°ßÇÏÁö ¸øÇÏ¿´¸é, »õ·Î¿î âÀ» ¸¸µé°í ±× ¸ñÇ¥ À̸§À» ºÎ¿©ÇÑ´Ù.

B.9 Á¢¼Ó¼º¿¡ ´ëÇÑ ÁÖ¼®

ÁÖ±â: W3C Á¢¼Ó¼º °³¼± ±¸·ì(Web Accessibility Initiative Group)ÀÇ Á¦¾È¿¡ ÀÇÇÏ¿©, ´ëü(alternate) ÅؽºÆ®¸¦ ¸¸µé±â À§ÇÑ ´ÙÀ½ ±â´ÉÀº Á¦°Å µÉ °ÍÀÌ´Ù. ÀÚ¼¼ÇÑ Á¤º¸´Â [WAIGUIDE]¸¦ ÂüÁ¶Ç϶ó.

Á¦ÀÛÀÚ°¡ IMG ¶Ç´Â APPLET ¿¤·¹¸àÆ®¿¡ alt ¾ÖÆ®¸®ºäÆ®¸¦ ¼³Á¤ÇÏÁö ¾ÊÀ¸¸é, »ç¿ëµµ±¸´Â ´ÙÀ½°ú °°Àº ¼ø¼­·Î ´ëü ÅؽºÆ®¸¦ Á¦°øÇÏ¿©¾ß ÇÏ´Ù.

  1. ¸¸ÀÏ titleÀÌ ÁöÁ¤µÇ¾úÀ¸¸é, ±× °ªÀ» ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.
  2. ¾Æ´Ï¸é, ¸¸ÀÏ HTTP Çì´õ(header)°¡ title Á¤º¸¸¦ Á¦°øÇÏ°í ±× Æ÷ÇÔ ¿ÀºêÁ§Æ®°¡ ÀÐÇô Á³À¸¸é, ±× Á¤º¸¸¦ ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.
  3. ¾Æ´Ï¸é, ¸¸ÀÏ Æ÷ÇÔ µÈ ¿ÀºêÁ§Æ®°¡ ÅؽºÆ® Çʵ带 °¡Áö°í ÀÖÀ¸¸é(¿¹: GIF À̹ÌÁö°¡ ÅؽºÆ® Çʵ带 °¡Áö¸é), ÅؽºÆ® Çʵå·Î ºÎÅÍ ¹ßÃéµÈ Á¤º¸¸¦ ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù. »ç¿ëµµ±¸´Â ÅؽºÆ® Á¤º¸¸¦ ¹ßÃéÇϱâ À§ÇÏ¿© Àü ¿ÀºêÁ§Æ®¸¦ ¸ÕÀú Àоî¾ß ¸¸ µÉ ¼ö ÀÖÀ¸¹Ç·Î, »ç¿ëµµ±¸´Â ´õ °æÁ¦ÀûÀÎ Á¢±Ù(¿¹: ³»¿ë ŸÇù)À» ä¿ë ÇÒ ¼ö ÀÖ´Ù.
  4. ¾Æ´Ï¸é, ´Ù¸¥ Á¤º¸°¡ ¾øÀ¸¸é, »ç¿ëµµ±¸´Â È®Àå(extension)À» Á¦¿Ü ÇÑ È­ÀϸíÀ» ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.

Á¦ÀÛÀÚ°¡ INPUT ¿¤·¹¸àÆ®¿¡ alt ¾ÖÆ®¸®ºäÆ®¸¦ ¼³Á¤ÇÏÁö ¾ÊÀ¸¸é, »ç¿ëµµ±¸´Â ´ÙÀ½ ¼ø¼­¿¡ ÀÇÇÏ¿© ´ëü ÅؽºÆ®¸¦ Á¦°øÇÏ¿©¾ß ÇÑ´Ù.

  1. ¸¸ÀÏ titleÀÌ ÁöÁ¤µÇ¾úÀ¸¸é, ±× °ªÀ» ´ëü(alternate) ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.
  2. ¾Æ´Ï¸é, ¸¸ÀÏ nameÀÌ ÁöÁ¤ µÇ¾úÀ¸¸é, ±× °ªÀ» ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.
  3. ¾Æ´Ï¸é, ¼Û½Å(submit)°ú Àç¼³Á¤(reset) ´ÜÃß¿¡¼­, type ¾ÖÆ®¸®ºäÆ®ÀÇ °ªÀ» ´ëü ÅؽºÆ®·Î »ç¿ëÇÏ¿©¾ß ÇÑ´Ù.

B.10 º¸¾È¿¡ ´ëÇÑ ÁÖ¼®

URI¸¦ ÆĶó¸ÞÅÍ(parameter)·Î °®´Â ¾ØÄ¿(anchor), ±ò¸°(embedded) À̹ÌÁö¿Í ¸ðµç ´Ù¸¥ ¿¤·¹¸àÆ®µéÀº »ç¿ëÀÚÀÇ ÀԷ¿¡ ¹ÝÀÀÇÏ¿© URIÀÇ ÂüÁ¶ öȸ(dereference)¸¦ ¹ß»ý½Ãų ¼ö ÀÖ´Â, [RFC1738, Ç׸ñ 6]ÀÇ º¸¾È ¹®Á¦¸¦ °í·ÁÇÏ¿©¾ß ÇÑ´Ù. ³Î¸® »ç¿ëµÇ´Â ÆûÀÇ ¼Û½Å(submi) ¿äûÇÏ´Â HTTP¿Í SMTP ¹æ¹ýÀº ºñ¹Ð À¯Áö¸¦ Á¶±Ý ¹Û¿¡ Á¦°øÇÏÁö ¸øÇÑ´Ù. ÆûÀ» ÅëÇØ ¿¹¹ÎÇÑ Á¤º¸¸¦ ¿äûÇÏ´Â Á¤º¸ Á¦°øÀÚµéÀº ƯÈ÷ INPUT ¿¤·¹¸àÆ®ÀÇ type="password"·Î´Â ºñ¹Ð À¯Áö¿¡ ºÒÃæºÐÇÏ´Ù´Â °ÍÀ» ¾Ë°í ±×µéÀÇ »ç¿ëÀÚµµ ¾Ë°ÔÇÏ¿©¾ß ÇÑ´Ù.

B.10.1 ÆûÀÇ º¸¾È ¹®Á¦

»ç¿ëµµ±¸´Â »ç¿ëÀÚ°¡ È®½ÇÈ÷ º¸³»±â¸¦ ¿äûÇÑ °ÍÀÌ ¾Æ´Ï¸é È­ÀÏ·Î º¸³»Áö ¸»¾Æ¾ßÇÑ´Ù. ±×·¡¼­ HTML »ç¿ëµµ±¸µéÀº INPUT ¿¤·¹¸àÆ®ÀÇ value ¾ÖÆ®¸®ºäÆ®·Î Á¦¾ÈµÇ´Â µðÆúÆ® È­ÀÏ À̸§À» È®ÀÎ ÇÒ °ÍÀ» ±â´ëÇÑ´Ù. °¨Ãß¾îÁø(hidden) Á¦¾î¿¡´Â È­ÀÏÀ» ÁöÁ¤ÇÏÁö ¸»¾Æ¾ßÇÑ´Ù.

ÀÌ ±Ô°Ý¿¡´Â µ¥ÀÌÅÍÀÇ ¾Ïȣȭ(encryption) ±â´ÉÀÌ Æ÷ÇԵǾî ÀÖÁö ¾Ê´Ù. ÀÌ´Â µ¥ÀÌÅÍÀÇ ¾ÈÀüÇÑ ¼Û¼ö½ÅÀ» À§ÇÏ¿© ´Ù¸¥ ¾î¶² ±â´ÉÀ¸·Îµµ ó¸® µÉ ¼ö ÀÖ´Ù.

ó¸® ´ë¸®ÀÚ´Â È­ÀÏÀÌ ÀÐÇôÁö¸é, ÀûÀýÇÏ°Ô Ã³¸®ÇÏ°í ÀúÀåÇÏ¿©¾ß ÇÑ´Ù.


ÀÌ Trio ȨÆäÀÌÁö ¹®¼­(http://trio.co.kr/webrefer/html40/attendix/notes.html)´Â ÀÚÀ¯·ÎÀÌ ¿¬°á »ç¿ëÀÌ °¡´ÉÇÔ.