โครงสร้างพื้นฐานของ HTML
โครงสร้างของ HTML จะประกอบไปด้วยส่วนของคำสั่ง 2 ส่วน คือ ส่วนที่เป็น ส่วนหัว (Head) และส่วนที่เป็นเนื้อหา (Body) โดยมีรูปแบบคำสั่ง ดังนี้
การจัดโครงสร้างแฟ้มเอกสาร ในความง่ายของภาษา HTML นั้นเพราะภาษานี้ไม่มีโครงสร้างใด ๆ มากำหนดนอกจากโครงสร้างพื้นฐานเท่านั้น หรือแม้แต่จะไม่มีโครงสร้างพื้นฐานอยู่โปรแกรมที่เขียนขึ้นมานั้นก็สามารถทำงานได้เสมือนมีโครงสร้างทั่งนี้เป็นเพราะว่าตัวโปรแกรมเว็บเบราเซอร์จะมองเห็นทุกสิ่งทุกอย่างในโปรแกรม HTML เป็นส่วนเนื้อหาทั้งสิ้น
ยกเว้นใน ส่วนหัว ที่ต้องมีการกำหนดแยกออกไปให้เห็นชัดเท่านั้น จะเขียนคำสั่งหรือข้อความที่ ต้องการให้แสดงอย่างไรก็ได้เป็นเสมือนพิมพ์งานเอกสารทั่ว ๆ ไปเพียงแต่ทำตำแหน่งใดมีการทำตำแหน่งพิเศษขึ้นมา เว็บเบราเซอร์ถึงจะแสดงผลออกมาตามที่ถูกกำหนดโดยใช้คำสั่งให้ตรงกับรหัสที่กำหนดเท่านั้น
การแสดงผลที่เว็บเบราเซอร์ หลังจากมีการพิมพ์โปรแกรมนี้เสร็จเรียบร้อยแล้ว ให้บันทึกเป็น ไฟล์ที่มีนามสกุล .htm หรือ .html จากนั้นให้เรียกโปรแกรมเว็บเบราเซอร์ขึ้นมาทำการทดสอบ ข้อมูลที่เราสร้างจะถูกนำมาที่ออกมาแสดงที่จอภาพถ้าไม่เขียนอะไรผิดบนจอภาพก็จะแสดงผลตามนั้น ถ้าเรามีการปรับปรุงแก้ไขข้อมูลในโปรแกรมเดิมให้อยู่ในรูปของโปรแกรมใหม่ก็จำเป็นต้องโหลดโปรแกรมขึ้นมาใหม่เพียงแต่เลื่อนเมาส์ไปคลิกที่ปุ่ม Refresh โปรแกรมก็จะทำการประมวลผลและแสดงผลออกมาใหม่ในคำสั่ง HTML ส่วนใหญ่ใช้ตัวเปิดเป็นเครื่องหมายน้อยกว่า < ตามด้วยคำสั่ง และปิดท้ายด้วยเครื่องหมายมากกว่า > และมีตัวปิดที่มีรูปแบบเหมือนตัวเปิดเสมอ เพียงแต่จะมีเครื่อง หมาย / อยู่หน้าคำสั่งนั้นๆ เช่น คำสั่ง <BODY> จะมี </BODY> เป็นคำสั่งปิด เมื่อใดที่ผู้เขียนลืมหรือพิมพ์คำสั่งผิดจะส่งผลให้การทำงานของโปรแกรมผิดพลาดทันที
คำสั่งเริ่มต้นสำหรับ HTML
คำสั่งหรือ Tag ที่ใช้ในภาษา HTML ประกอบไปด้วยเครื่องหมายน้อยกว่า <ตามด้วย ชื่อคำสั่งและปิดท้ายด้วยเครื่องหมายมากกว่า> เป็นส่วนที่ทำหน้าที่ตกแต่งข้อความ เพื่อ การแสดงผลข้อมูล โดยทั่วไปคำสั่งของ HTML ส่วนใหญ่จะอยู่เป็นคู่ มีเพียงบาง คำสั่งเท่านั้น ที่มีรูปแบบคำสั่งอยู่เพียงตัวเดียวในแต่ละคำสั่งจะมีคำสั่งเปิดและปิดคำสั่งปิดของแต่ละคำสั่งจะมีรูปแบบเหมือนคำสั่งเปิด เพียงแต่จะเพิ่ม /(Slash) นำหน้าคำสั่งปิดให้ดูแตกต่างเท่านั้นและในคำสั่งเปิดบางคำสั่งอาจมีส่วนขยายอื่นผสมอยู่ด้วยในการเขียนด้วยตัวอักษรเล็กหรือใหญ่ ทั้งหมดหรือเขียนปนกันก็ได้ไม่มีผลอะไร
คำสั่งหรือ Tag ที่ใช้ในภาษา HTML ประกอบไปด้วยเครื่องหมายน้อยกว่า <ตามด้วย ชื่อคำสั่งและปิดท้ายด้วยเครื่องหมายมากกว่า> เป็นส่วนที่ทำหน้าที่ตกแต่งข้อความ เพื่อ การแสดงผลข้อมูล โดยทั่วไปคำสั่งของ HTML ส่วนใหญ่จะอยู่เป็นคู่ มีเพียงบาง คำสั่งเท่านั้น ที่มีรูปแบบคำสั่งอยู่เพียงตัวเดียวในแต่ละคำสั่งจะมีคำสั่งเปิดและปิดคำสั่งปิดของแต่ละคำสั่งจะมีรูปแบบเหมือนคำสั่งเปิด เพียงแต่จะเพิ่ม /(Slash) นำหน้าคำสั่งปิดให้ดูแตกต่างเท่านั้นและในคำสั่งเปิดบางคำสั่งอาจมีส่วนขยายอื่นผสมอยู่ด้วยในการเขียนด้วยตัวอักษรเล็กหรือใหญ่ ทั้งหมดหรือเขียนปนกันก็ได้ไม่มีผลอะไร
คำสั่งเริ่มต้นรูปแบบ <HTML>.....</HTML>
คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรม และ </HTML>เป็นคำสั่งจุดสิ้นสุดโปรแกรมเหมือนคำสั่ง Beign และ End ใน Pascal
คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรม และ </HTML>เป็นคำสั่งจุดสิ้นสุดโปรแกรมเหมือนคำสั่ง Beign และ End ใน Pascal
คำสั่งการทำหมายเหตุรูปแบบ <!-- ..... -->
ตัวอย่าง <!-- END WEBSTAT CODE --> ข้อความที่อยู่ในคำสั่งจะปรากฎอยู่ในโปรแกรมแต่ไม่ถูกแสดงบนจอภาพ
ตัวอย่าง <!-- END WEBSTAT CODE --> ข้อความที่อยู่ในคำสั่งจะปรากฎอยู่ในโปรแกรมแต่ไม่ถูกแสดงบนจอภาพ
ส่วนหัว รูปแบบ <HEAD>.....</HEAD>
ใช้กำหนดข้อความในส่วนที่เป็น ชื่อเรื่อง ภายในคำสั่งนี้ จะมีคำสั่งย่อยอีกหนึ่งคำสั่ง คือ <TITLE>
ใช้กำหนดข้อความในส่วนที่เป็น ชื่อเรื่อง ภายในคำสั่งนี้ จะมีคำสั่งย่อยอีกหนึ่งคำสั่ง คือ <TITLE>
กำหนดข้อความในไตเติลบาร์
รูปแบบ <TITLE>.....</TITLE>
ตัวอย่าง <TITLE> บทเรียน HTML </TITLE>
เป็นส่วนแสดงชื่อของเอกสาร จะปรากฎ ขณะที่ไฟล์ HTML ทำงานอยู่ ข้อความ ที่กำหนดในส่วนนี้จะไม่ถูกนำไปแสดงผลของเว็บเบราเซอร์แต่จะปรากฎในส่วนของไตเติบาร์ (Title bar) ที่เป็นชื่อของวินโดว์ข้างบนไม่ควรให้ยาวเกินไป เพียงให้รู้ว่าเว็บเพจที่กำลังใช้งานอยู่เกี่ยวข้องกับอะไร
รูปแบบ <TITLE>.....</TITLE>
ตัวอย่าง <TITLE> บทเรียน HTML </TITLE>
เป็นส่วนแสดงชื่อของเอกสาร จะปรากฎ ขณะที่ไฟล์ HTML ทำงานอยู่ ข้อความ ที่กำหนดในส่วนนี้จะไม่ถูกนำไปแสดงผลของเว็บเบราเซอร์แต่จะปรากฎในส่วนของไตเติบาร์ (Title bar) ที่เป็นชื่อของวินโดว์ข้างบนไม่ควรให้ยาวเกินไป เพียงให้รู้ว่าเว็บเพจที่กำลังใช้งานอยู่เกี่ยวข้องกับอะไร
ส่วนของเนื้อหา
รูปแบบ <BODY>.....</BODY>
ส่วนเนื้อหาของโปรแกรมจะเริ่มต้นด้วย คำสั่ง <BODY> และจบลงด้วย </BODY> ภายในคำสั่งนี้ คือ ส่วนที่จะแสดงทางจอภาพ
รูปแบบ <BODY>.....</BODY>
ส่วนเนื้อหาของโปรแกรมจะเริ่มต้นด้วย คำสั่ง <BODY> และจบลงด้วย </BODY> ภายในคำสั่งนี้ คือ ส่วนที่จะแสดงทางจอภาพ
การเติมสีสันให้เอกสาร
ผลการแสดงที่เกิดขึ้นบนเว็บเพจเราจะพบว่าเอกสารทั่วไปแล้วตัวอักษรที่ปรากฎบนจอภาพ จะเป็นตัวอักษรสีดำบนพื้นสีเทา ถ้าเราต้องการที่จะเปลี่ยนสีของตัวอักษร หรือ สีของจอภาพเราสามารถทำได้โดยการกำหนด แอตทริบิวต์ (Attribute) ของตัวอักษร สิ่งที่ต้องการนี้จะเป็นกลุ่มตัวเลขฐาน 16 จำนวน 3 ชุด โดยชุดที่หนึ่ง ทำหน้าที่ แทนค่าสีแดง ชุดที่สอง ทำหน้าที่ แทนสีเขียว และชุดที่สาม ทำหน้าที่แทนสีน้ำเงิน ข้อมูลในตารางต่อไปนี้จะแสดงสีพื้นฐานและรหัสสีที่สามารถแสดงได้ทุกเว็บเพจ
ในบางครั้งถ้าเราไม่ต้องการใส่รหัสสีเป็นเลขฐานเราก็สามารถใส่ชื่อสีลงไปได้เลย
สี
|
รหัสสี
|
ขาว
|
#FFFFFF
|
ดำ
|
#000000
|
เทา
|
#BBBBBB
|
แดง
|
#FF0000
|
เขียว
|
#00FF00
|
น้ำเงิน
|
#0000FF
|
รูปแบบของตัวอักษร
หัวเรื่อง
รูปแบบ <Hx>ข้อความ</Hx>
ตัวอย่าง <H1>หัวข้อใหญ่สุด</H1>ในการกำหนดขนาดให้หัวเรื่องนั้นมีการกำหนด ไว้ 6 ระดับตั้งแต่ 1 - 6 โดย x แทนตัวเลขแต่ละลำดับโดย H1 มีขนาดใหญ่ที่สุด H6 เล็กที่สุดเมื่อต้องการใช้หัวเรื่องที่มีขนาดตัวอักษรเท่าใดเขียนอยู่ระหว่าง <Hx>....</Hx>
ขนาดตัวอักษร
รูปแบบ <FONT SIZE=x>ข้อความ</FONT>
ตัวอย่าง <FONT SIZE=2>bcoms.net</FONT>เราสามารถกำหนดขนาดของตัวอักษรให้แตกต่างกันได้ ภายในบรรทัดเดียวกัน โดยเราใช้ <FONT SIZE=value> มากำหนด โดยที่ value เป็นตัวเลขแสดงขนาด ตัวอักษร 7 ขนาด ตัวเลขยิ่งมาก ยิ่งมีขนาด ใหญ่ ตั้งแต่ -7 ไปจนถึง +7
ตัวหนา (Bold)
รูปแบบ <B>ข้อความ</B>
ตัวอย่าง <B>bcoms.net</B>จะทำให้ข้อความที่อยู่ใน <B>....</B> มีความหนาเกิดขึ้น เช่น bcoms.net
ตัวเอน (Itatic)รูปแบบ <I>ข้อความ</I>ตัวอย่าง <I>bcoms.net</I>ทำให้ข้อความที่อยู่ใน<I>....</I> เกิดเป็นตัวเอนขึ้น เช่น bcoms.net
ตัวขีดเส้นใต้ (Underline) รูปแบบ <U>ข้อความ</U>ตัวอย่าง <U>bcoms.net</U>ทำให้ข้อความที่อยู่ใน <U>.....<U> มีเส้นขีดอยู่ใต้ตัวอักษรเกิดขึ้น เช่น bcoms.net
ตัวอักษรมีขนาดคงที่ (Typewriter text)
รูปแบบ <TT>ข้อมความ</TT>
ตัวอย่าง <TT>bcoms.net</TT>ทำให้ ข้อความ ที่อยู่ใน<TT>.....</TT> มีลักษณะเป็น fixed space เกิดขึ้น เช่น bcoms.net
แบบของตัวอักษร
รูปแบบ <FONT FACE="font name>ข้อความ</FONT>
c <FONT FACE="AngsanaUPC">bcoms.net</FONT>Font name เป็นชื่อของ Font ที่เราต้องการให้เป็น เช่น <FONT FACE="AngsanaUPC"> bcoms.net</FONT> และเราสามารถใส่ชื่อ Font หลาย ๆ ตัวได้เพื่อบางครั้ง Browser ไม่มี Font ตามต้องการโดยให้คั้นด้วยตัว (,)
ขนาด Font ทั้งเอกสาร
รูปแบบ Basefont size="X">
ตัวอย่าง <Basefont size=3>
เป็นการกำหนดขนาดของตัวอักษรในโฮมเพจให้มีขนาด เท่ากันทั้งเอกสาร เพื่อสะดวกเราจะได้ไม่ต้องกำหนดบ่อย ๆ ปกติแล้วจะกำหนดขนาดเป็น 3 โดยไม่ต้องมีตัวปิดเหมือนคำสั่งอื่น ๆ (X แทนตัวเลข)
ตัวอักษรแบบพิเศษ
รูปแบบ
< แทนด้วย <
> แทนด้วย >
& แทนด้วย &
" แทนด้วย "
รูปแบบ <Hx>ข้อความ</Hx>
ตัวอย่าง <H1>หัวข้อใหญ่สุด</H1>ในการกำหนดขนาดให้หัวเรื่องนั้นมีการกำหนด ไว้ 6 ระดับตั้งแต่ 1 - 6 โดย x แทนตัวเลขแต่ละลำดับโดย H1 มีขนาดใหญ่ที่สุด H6 เล็กที่สุดเมื่อต้องการใช้หัวเรื่องที่มีขนาดตัวอักษรเท่าใดเขียนอยู่ระหว่าง <Hx>....</Hx>
ขนาดตัวอักษร
รูปแบบ <FONT SIZE=x>ข้อความ</FONT>
ตัวอย่าง <FONT SIZE=2>bcoms.net</FONT>เราสามารถกำหนดขนาดของตัวอักษรให้แตกต่างกันได้ ภายในบรรทัดเดียวกัน โดยเราใช้ <FONT SIZE=value> มากำหนด โดยที่ value เป็นตัวเลขแสดงขนาด ตัวอักษร 7 ขนาด ตัวเลขยิ่งมาก ยิ่งมีขนาด ใหญ่ ตั้งแต่ -7 ไปจนถึง +7
ตัวหนา (Bold)
รูปแบบ <B>ข้อความ</B>
ตัวอย่าง <B>bcoms.net</B>จะทำให้ข้อความที่อยู่ใน <B>....</B> มีความหนาเกิดขึ้น เช่น bcoms.net
ตัวเอน (Itatic)รูปแบบ <I>ข้อความ</I>ตัวอย่าง <I>bcoms.net</I>ทำให้ข้อความที่อยู่ใน<I>....</I> เกิดเป็นตัวเอนขึ้น เช่น bcoms.net
ตัวขีดเส้นใต้ (Underline) รูปแบบ <U>ข้อความ</U>ตัวอย่าง <U>bcoms.net</U>ทำให้ข้อความที่อยู่ใน <U>.....<U> มีเส้นขีดอยู่ใต้ตัวอักษรเกิดขึ้น เช่น bcoms.net
ตัวอักษรมีขนาดคงที่ (Typewriter text)
รูปแบบ <TT>ข้อมความ</TT>
ตัวอย่าง <TT>bcoms.net</TT>ทำให้ ข้อความ ที่อยู่ใน<TT>.....</TT> มีลักษณะเป็น fixed space เกิดขึ้น เช่น bcoms.net
แบบของตัวอักษร
รูปแบบ <FONT FACE="font name>ข้อความ</FONT>
c <FONT FACE="AngsanaUPC">bcoms.net</FONT>Font name เป็นชื่อของ Font ที่เราต้องการให้เป็น เช่น <FONT FACE="AngsanaUPC"> bcoms.net</FONT> และเราสามารถใส่ชื่อ Font หลาย ๆ ตัวได้เพื่อบางครั้ง Browser ไม่มี Font ตามต้องการโดยให้คั้นด้วยตัว (,)
ขนาด Font ทั้งเอกสาร
รูปแบบ Basefont size="X">
ตัวอย่าง <Basefont size=3>
เป็นการกำหนดขนาดของตัวอักษรในโฮมเพจให้มีขนาด เท่ากันทั้งเอกสาร เพื่อสะดวกเราจะได้ไม่ต้องกำหนดบ่อย ๆ ปกติแล้วจะกำหนดขนาดเป็น 3 โดยไม่ต้องมีตัวปิดเหมือนคำสั่งอื่น ๆ (X แทนตัวเลข)
ตัวอักษรแบบพิเศษ
รูปแบบ
< แทนด้วย <
> แทนด้วย >
& แทนด้วย &
" แทนด้วย "
เว้นวรรค แทนด้วย ตัวอย่างเช่น "bcoms.net" จะเป็น "bcoms.net"
การจัดรูปแบบโฮมเพจ
รูปแบบ <BR>
เป็นคำสั่งสำหรับการสั่งให้แสดงผลในบรรทัดใหม่ให้ใส่คำสั่งนี้ ในตำแหน่งที่เราต้องการ ให้การแสดงผลข้อมูลนั้นขึ้นบรรทัดใหม่
ย่อหน้าใหม่
รูปแบบ <P ALIGN=align type>ข้อความ</P>
เราจะใช้คำสั่งนี้เมื่อต้องการ ขึ้นบรรทัดใหม่เหมือน<BR> แต่จะทำการ เว้นบรรทัดใหม่ให้อีกหนึ่งบรรทัด จะใช้คำสั่ง<P>อย่างเดียว ก็ได้ โดยไม่ต้อง มีคำสั่ง ปิด จะไว้หน้าหรือ หลังข้อความที่ต้องการขึ้นก็ได้ แต่ถ้าใช้คำสั่ง <P ALIGN=align type>ต้องมีคำสั่ง ปิด</P> ด้วย โดย align type สามารถ ใช้ CENTER,LEFT หรือ RIGHT ก็ได้ เช่น <P ALIGN=CENTER> ข้อความนี้ ก็จะอยู่ตรงกลาง</P>
เส้นคั้น
รูปแบบ <HR ALIGN=xx COLOR=xx SIZE=xx WIDTH=xx NOSHADE>
เราสามารถกำหนดตำแหน่ง , สี , ขนาดของความหนา , ความยาว หรือกำหนดแบบเส้นทึบ ก็ได้ โดย
โดย X = ค่าต่าง ๆ เหล่านี้
<ALIGN> = CENTER , LEFT , RIGHT
COLOR = ตามสีที่เราต้องการ เป็นรหัสสี R-G-B
SIZE = เป็นตัวเลข บอกขนาด 1 ถึง 7 และ -1 ถึง -7
WIDTH = กำหนด ความหนา ของเส้นเป็น เปอร์เซนต์
NOSHADE = กำหนด ให้เส้น เป็น เส้นทึบ
การใส่รูปภาพลงในเว็บเพจ
เมื่อเริ่มเข้าไปยังโฮมเพจของเว็บไซต์แต่ละแห่งบนอินเตอร์เนตสิ่งแรกที่มักเป็นที่ติดตาของผู้ใช้ บริการก็คือ การที่แต่ละโฮมเพจจะมีรูปภาพสวยๆแสดงออกมามีการจัดรูปภาพและข้อความที่เป็นระเบียบทำให้อ่านง่ายเข้าใจเนื้อหาที่ต้องการได้อย่างรวดเร็ว
ก่อนที่เราจะมารู้ถึงคำสั่งในการใส่รูปภาพลงในเว็บเพจนั้นเราต้องมารู้จักเกี่ยวกับรูปภาพที่เรา
จะนำมาใส่ในเว็บเพจเสียก่อนรูปภาพที่จะนำมาใช้ใส่ลงในเว็บเพจนั้น ส่วนมากมีนามสกุลเป็น GIF และ JPG ไฟล์
รูปภาพแบบ GIF ย่อมาจาก Graphics Interchange Format เป็นไฟล์ชนิดบิตแมป (Bitmap) เป็นเทคนิคการเก็บภาพโดยให้จุดสี(pixet) ต่าง ๆเรียงต่อกันจนเกิดเป็นภาพไฟล์ GIF นี้ส่วนใหญ่จะนิยมใช้กับภาพถ่ายและภาพการ์ตูน แสดงผลเป็นภาพนิ่งแต่ในปัจจุบันมีโปรแกรมสำหรับทำหน้าที่รวบรวมภาพ GIF หลาย ๆ ภาพเข้าเป็นไฟล์เดียวกันเมื่อนำภาพมาแสดงทำให้เกิดเป็นภาพเคลื่อนไหวขึ้น
ไฟล์รูปแบบ JPG ย่อมาจาก Joint Photographic Expers Group เป็นไฟล์ในรูปแบบที่ผ่าน กระบวนการบีบย่อยข้อมูลมาก่อน มีการนำเอาข้อมูลส่วนที่ไม่สำคัญออกไปแล้วทำการบีบอัด ข้อมูลในอัตราส่วน 10:1 โดยขนาดของไฟล์ที่เรานำม ใช้งานนั้น อาจมีขนาดเหลือเพียง 10 - 30 % ของขนาดไฟล์ ก่อนจะมีการ บีบ ย่อ ข้อมูล ขนาดของ การบีบ ข้อมูล มีได้ 3 ระดับ (Hight,Middle,Low Compression) ไฟล์ที่มีการบีบย่อข้อมูลมากที่สุดจะได้ไฟล์ที่มีขนาดเล็กที่สุด แต่คุณภาพก็ลดลงตาม ไปด้วยหากต้องการภาพที่มีคุณภาพดีที่สุดขนาดของไฟล์ก็จะใหญ่ที่สุดเช่นกัน
ก่อนที่เราจะมารู้ถึงคำสั่งในการใส่รูปภาพลงในเว็บเพจนั้นเราต้องมารู้จักเกี่ยวกับรูปภาพที่เรา
จะนำมาใส่ในเว็บเพจเสียก่อนรูปภาพที่จะนำมาใช้ใส่ลงในเว็บเพจนั้น ส่วนมากมีนามสกุลเป็น GIF และ JPG ไฟล์
รูปภาพแบบ GIF ย่อมาจาก Graphics Interchange Format เป็นไฟล์ชนิดบิตแมป (Bitmap) เป็นเทคนิคการเก็บภาพโดยให้จุดสี(pixet) ต่าง ๆเรียงต่อกันจนเกิดเป็นภาพไฟล์ GIF นี้ส่วนใหญ่จะนิยมใช้กับภาพถ่ายและภาพการ์ตูน แสดงผลเป็นภาพนิ่งแต่ในปัจจุบันมีโปรแกรมสำหรับทำหน้าที่รวบรวมภาพ GIF หลาย ๆ ภาพเข้าเป็นไฟล์เดียวกันเมื่อนำภาพมาแสดงทำให้เกิดเป็นภาพเคลื่อนไหวขึ้น
ไฟล์รูปแบบ JPG ย่อมาจาก Joint Photographic Expers Group เป็นไฟล์ในรูปแบบที่ผ่าน กระบวนการบีบย่อยข้อมูลมาก่อน มีการนำเอาข้อมูลส่วนที่ไม่สำคัญออกไปแล้วทำการบีบอัด ข้อมูลในอัตราส่วน 10:1 โดยขนาดของไฟล์ที่เรานำม ใช้งานนั้น อาจมีขนาดเหลือเพียง 10 - 30 % ของขนาดไฟล์ ก่อนจะมีการ บีบ ย่อ ข้อมูล ขนาดของ การบีบ ข้อมูล มีได้ 3 ระดับ (Hight,Middle,Low Compression) ไฟล์ที่มีการบีบย่อข้อมูลมากที่สุดจะได้ไฟล์ที่มีขนาดเล็กที่สุด แต่คุณภาพก็ลดลงตาม ไปด้วยหากต้องการภาพที่มีคุณภาพดีที่สุดขนาดของไฟล์ก็จะใหญ่ที่สุดเช่นกัน
การใส่รูปภาพลงในเว็บเพจ
รูปแบบ <IMG ALIGN=align-type BORDER=n HEIGHT=n WIDTH=n HSPACE=n VSPACE=n SRC=address ALT=text>ALIGN = align-type(ตำแหน่ง) เป็นการกำหนดตำแหน่งรูปภาพถ้าภาพไม่ใหญ่ข้อความนั้นจะ อยู่ ที่ตำแหน่ง ส่วนล่างของภาพทางขวามือเสมอ เราสามารถกำหนดได้โดยใช้คำต่าง ๆ เหล่านี้
LEFT = วางภาพที่ตำแหน่งทางซ้าย
RIGHT = วางภาพที่ตำหน่งทางขวา
TOP = วางภาพที่ตำแหน่งด้านบน
MIDDLE = วางภาพที่ตำหน่งกึ่งกลาง
BOTTOM = วางภาพที่ตำแหน่งด้านล่าง
BORDER = n เป็นการกำหนดกรอบให้ รูปภาพ n มีค่ามาก กรอบจะ มีความหนา มากขึ้น
HEIGHT = n เป็นการกำหนดความสูงของภาพ
WIDTH = n เป็นการกำหนดความกว้างของภาพถ้าต้องกาให้ภาพได้สัดส่วให้กำหนดเป็น เปอร์เซนต์โดยไม่จำกัดความสูง
VSPACE = n กำหนด ระยะห่างบน-ล่างของภาพ
HSPACE = n กำหนด ระยะห่าง ซ้าย - ขวา ของภาพ
SRC = ใส่รูปภาพที่ต้องการลงไป
ALT = text ใส่ข้อความเพื่อเป็นคำอธิบายรูปภาพที่นำมาวางสำหรับผู้ใช้อินเตอร์เน็ตแบบ เท็กซ์
ข้อสังเกต ALIGN ไม่สามารถ กำหนดให้ รูปภาพ ไปปรากฎยังกึ่งกลาง ของจอภาพ ได้ ถ้าต้อง การให้ อยู่ตำแหน่งดังกล่าว ให้ใช้คำสั่ง <CENTER>...<CENTER>
รูปแบบ <IMG ALIGN=align-type BORDER=n HEIGHT=n WIDTH=n HSPACE=n VSPACE=n SRC=address ALT=text>ALIGN = align-type(ตำแหน่ง) เป็นการกำหนดตำแหน่งรูปภาพถ้าภาพไม่ใหญ่ข้อความนั้นจะ อยู่ ที่ตำแหน่ง ส่วนล่างของภาพทางขวามือเสมอ เราสามารถกำหนดได้โดยใช้คำต่าง ๆ เหล่านี้
LEFT = วางภาพที่ตำแหน่งทางซ้าย
RIGHT = วางภาพที่ตำหน่งทางขวา
TOP = วางภาพที่ตำแหน่งด้านบน
MIDDLE = วางภาพที่ตำหน่งกึ่งกลาง
BOTTOM = วางภาพที่ตำแหน่งด้านล่าง
BORDER = n เป็นการกำหนดกรอบให้ รูปภาพ n มีค่ามาก กรอบจะ มีความหนา มากขึ้น
HEIGHT = n เป็นการกำหนดความสูงของภาพ
WIDTH = n เป็นการกำหนดความกว้างของภาพถ้าต้องกาให้ภาพได้สัดส่วให้กำหนดเป็น เปอร์เซนต์โดยไม่จำกัดความสูง
VSPACE = n กำหนด ระยะห่างบน-ล่างของภาพ
HSPACE = n กำหนด ระยะห่าง ซ้าย - ขวา ของภาพ
SRC = ใส่รูปภาพที่ต้องการลงไป
ALT = text ใส่ข้อความเพื่อเป็นคำอธิบายรูปภาพที่นำมาวางสำหรับผู้ใช้อินเตอร์เน็ตแบบ เท็กซ์
ข้อสังเกต ALIGN ไม่สามารถ กำหนดให้ รูปภาพ ไปปรากฎยังกึ่งกลาง ของจอภาพ ได้ ถ้าต้อง การให้ อยู่ตำแหน่งดังกล่าว ให้ใช้คำสั่ง <CENTER>...<CENTER>
การเชื่อมโยงข้อมูล (Link)
การเชื่อมโยงภายในเว็บไซต์
รูปแบบ <A HREF="ที่อยู่ไฟล์">ข้อความ</A>
ตัวอย่าง <A HREF="tipcomputer.asp">ทิปคอมพิวเตอร์</A>*** หมายเหตุ ถ้าลิงค์อยุ่คนละโฟลเดอร์ <A HREF="../tipcomputer.asp">ทิปคอมพิวเตอร์</A>
การเชื่อมโยงข้อมูลนอกเว็บไซต์
รูปแบบ <A HREF="้http://www..........">ข้อความ</A>
ตัวอย่าง <A HREF="้http://www.bcoms.net">บีคอม</A>*** หมายเหตุ คุณสามารถสั่งให้เบราเซอร์เปิดหน้าใหม่ได้โดยกำหนด target="_blank"
ตัวอย่าง <a href="http://www.driverzone.com" target="_blank"> Driver Zone </a>
การเชื่อมโยงข้อมูล FTP
รูปแบบ <FTP://HOSTNAME/FOLDER>ข้อความ</A>HOSTNAME คือ ชื่อของศูนย์บริการ FTP Server
FOLDER คือ ชื่อไฟล์และไดเรกทอรี่ที่ผู้เข้ารับบริการสามารถเข้าไปใช้งานได้
ตัวอย่าง <A HREF=FTP://bcoms.net/download> Download </a>
การเชื่อมโยงข้อมูล E-Mail
รูปแบบ <A HREF="MAILTO:USERNAME@DOMAINNAME">ข้อความ</A>
ตัวอย่าง <a href="mailto: bcoms_net@hotmail.com">bcoms_net@hotmail.com</a>
รูปแบบ <A HREF="ที่อยู่ไฟล์">ข้อความ</A>
ตัวอย่าง <A HREF="tipcomputer.asp">ทิปคอมพิวเตอร์</A>*** หมายเหตุ ถ้าลิงค์อยุ่คนละโฟลเดอร์ <A HREF="../tipcomputer.asp">ทิปคอมพิวเตอร์</A>
การเชื่อมโยงข้อมูลนอกเว็บไซต์
รูปแบบ <A HREF="้http://www..........">ข้อความ</A>
ตัวอย่าง <A HREF="้http://www.bcoms.net">บีคอม</A>*** หมายเหตุ คุณสามารถสั่งให้เบราเซอร์เปิดหน้าใหม่ได้โดยกำหนด target="_blank"
ตัวอย่าง <a href="http://www.driverzone.com" target="_blank"> Driver Zone </a>
การเชื่อมโยงข้อมูล FTP
รูปแบบ <FTP://HOSTNAME/FOLDER>ข้อความ</A>HOSTNAME คือ ชื่อของศูนย์บริการ FTP Server
FOLDER คือ ชื่อไฟล์และไดเรกทอรี่ที่ผู้เข้ารับบริการสามารถเข้าไปใช้งานได้
ตัวอย่าง <A HREF=FTP://bcoms.net/download> Download </a>
การเชื่อมโยงข้อมูล E-Mail
รูปแบบ <A HREF="MAILTO:USERNAME@DOMAINNAME">ข้อความ</A>
ตัวอย่าง <a href="mailto: bcoms_net@hotmail.com">bcoms_net@hotmail.com</a>
ไม่มีความคิดเห็น:
แสดงความคิดเห็น