วันศุกร์ที่ 20 กรกฎาคม พ.ศ. 2555


HTML Tag พื้นฐาน


HTML


- ย่อมาจากคำว่า Hyper Text Markup Language 


- ใช้โปรแกรม Notepad สร้าง









- เปิดด้วยโปรแกรม Web Browser เช่น Google Chrome /

Internet Explorer / Mozilla Firefox



                                                   

                                                






Text Editor


            คือ โปรแกรมที่ใช้สำหรับสร้างและแก้ไขข้อความในการสร้างเว็บเพจด้วยภาษา HTML นั้นต้องมีเครื่องมือที่ใช้ในการเขียน และแก้ไขตัวอักษรซึ่งเป็นคำสั่งต่าง ๆ ปัจจุบันมี โปรแกรม Text Editor หลายโปรแกรม เช่น NotePad, EditPlus หรือโปรแกรม Dreamweaver ซึ่งมีคุณสมบัติเป็นทั้งโปรแกรมสำเร็จรูปในการสร้างเว็บเพจด้วย ในบทเรียนชุดนี้ จะใช้โปรแกรม Notepad ในการสร้างเว็บเพจด้วยภาษา HTML

 




                       








ข้อควรจำ

โปรแกรม Text Editor ใช้สำหรับสร้างเว็บเพจ แต่โปรแกรม Web Browser ใช้สำหรับแสดงผลการทำงานของคำสั่งต่าง ๆ ที่สร้างจากโปรแกรม Text Editor นั่นหมายความว่าการจะสร้างเว็บเพจ ต้องมีเครื่องมือหรือโปรแกรมทั้ง 2 ประเภท คือ Text Editor และ Web Browser









องค์ประกอบของเอกสาร HTML

ประกอบด้วย 2 ส่วนใหญ่ๆ คือ

- ข้อความที่ต้องการให้แสดงบนจอภาพ

- ข้อความที่เป็นคำสั่ง

 

 
HTML พื้นฐาน

คำสั่งเริ่มต้น


รูปแบบคำสั่ง <HTML>........</HTML> คำสั่ง <HTML> ซี่งจะถือเป็นคำสั่งเริ่มต้นของการเขียน HTML และคำสั่ง </HTML> จะเป็นส่วนของการจบ



การเขียน HTML

รูปแบบคำสั่ง <HEAD>..........</HEAD> คำสั่ง <HEAD> เป็นคำสั่งที่ใช้ในการกำหนดข้อความส่วนที่เป็นชื่อเรื่องซึ่งภายใต้ของคำสั่งนี้จะมีคำสั่งย่อย อีกคำสั่งหนึ่งคือ คำสั่ง <TITLE>........</TITLE>



รูปแบบคำสั่ง

<TITLE>.........</TITLE> คำสั่ง <TITLE>.....</TITLE> จะเป็นส่วนของการแสดงชื่อของเอกสาร จะปรากฎในขณะที่ไฟล์ HTML ทำงานการแสดงผลจะแสดงในส่วนของไตเติลบาร์ ( Title Bar )

<body>...</body> คำสั่ง <BODY> คือคำสั่งบอกส่วนเนื้อเรื่อง ที่จะถูกแสดงผลในเวปบราวเซอร์ ประกอบด้วยรูปภาพ ตัวอักษร ตาราง เป็นต้น





<BR> มาจากคำว่า BREAK ซึ่งหมายถึง การขึ้นบรรทัดใหม่


<P> มาจากคำว่า Paragraph ซึ่งหมายถึง การขึ้นย่อหน้าใหม่

 


แหล่งที่มา








01/07/55

 

 

 

 

 



 

 

คำศัพท์พื้นฐานเกี่ยวกับการสร้างเว็บ



"Internet"
          หมายถึง เครือข่ายคอมพิวเตอร์ขนาดใหญ่ ที่มีการเชื่อมต่อระหว่างเครือข่ายหลายๆ เครือข่ายทั่วโลก โดยใช้ภาษาที่ใช้สื่อสารกันระหว่างคอมพิวเตอร์ที่เรียกว่า โพรโทคอล (Protocol) ผู้ใช้เครือข่ายนี้สามารถสื่อสารถึงกันได้ในหลายๆ ทาง อาทิเช่น อีเมล เว็บบอร์ด และสามารถสืบค้นข้อมูลและข่าวสารต่างๆ รวมทั้งคัดลอกแฟ้มข้อมูลและโปรแกรมมาใช้ได้





"www=World Wide Web"
คือองค์กรระหว่างประเทศทำหน้าที่จัดระบบมาตรฐานที่ใช้งานบนเวิลด์ไวด์เว็บ (ย่อว่า WWW หรือW3) โดยมีจุดมุ่งหมาย ที่จะเป็นแกนนำทางด้านพัฒนาโพรโทคอล และวิธีการใช้งานสำหรับเวิลด์ไวด์เว็บทั้งหมด นอกจากนี้ทาง W3C มีการบริการทางการศึกษา การพัฒนาซอฟต์แวร์ และเปิดให้ใช้ฟอรัมในการปรึกษาเกี่ยวกับเรื่องเว็บ








    "Website"
                      หมายถึง หน้าเว็บเพจหลายหน้า ซึ่งเชื่อมโยงกันผ่านทางไฮเปอร์ลิงก์ ส่วนใหญ่จัดทำขึ้นเพื่อนำเสนอข้อมูลผ่านคอมพิวเตอร์ โดยถูกจัดเก็บไว้ในเวิลด์ไวด์เว็บ หน้าแรกของเว็บไซต์ที่เก็บไว้ที่ชื่อหลักจะเรียกว่า โฮมเพจ เว็บไซต์โดยทั่วไปจะให้บริการต่อผู้ใช้ฟรี แต่ในขณะเดียวกันบางเว็บไซต์จำเป็นต้องมีการสมัครสมาชิกและเสียค่าบริการเพื่อที่จะดูข้อมูล ในเว็บไซต์นั้น ซึ่งได้แก่ข้อมูลทางวิชาการ ข้อมูลตลาดหลักทรัพย์ หรือข้อมูลสื่อต่างๆ ผู้ทำเว็บไซต์มีหลากหลายระดับ ตั้งแต่สร้างเว็บไซต์ส่วนตัว จนถึงระดับเว็บไซต์สำหรับธุรกิจหรือองค์กรต่างๆ การเรียกดูเว็บไซต์โดยทั่วไปนิยมเรียกดูผ่านซอฟต์แวร์ในลักษณะของ เว็บเบราว์เซอร์









" webpage"
หรือ หน้าเว็บ หมายถึง หน้าหนึ่ง ๆ ของเว็บไซต์ ที่เราเปิดขึ้นมาใช้งานโดยทั่วไป เว็บเพจส่วนใหญ่จะอยู่ในรูปของเอกสาร HTML (ซึ่งมักมีนามสกุลไฟล์เป็น htm หรือ html) มีลิงก์สำหรับเชื่อมโยงไปยังเว็บเพจหน้าอื่น ๆ สามารถใส่รูปภาพและรูปภาพยังสามารถเป็นลิงก์ กล่าวคือสามารถคลิกบนรูปเพื่อกระโดดไปหน้าอื่นได้ นอกจากนี้ยังสามารถใส่แอปเพล็ต (applet) ซึ่งเป็นโปรแกรมขนาดเล็กแสดงภาพเคลื่อนไหว มีปฏิสัมพันธ์กับผู้ใช้ หรือสร้างเสียง ได้อีกด้วย







"home page"
หมายถึง เว็บเพจหน้าแรกที่ปรากฏของแต่ละเว็บไซต์
§ เว็บเพจหน้าแรกที่ปรากฏของแต่ละเว็บไซต์
§ ชื่อURL ของเว็บไซต์ (เช่น http://...)
§ หน้าแรกที่ปรากฏขึ้นเมื่อเปิดโปรแกรมเว็บเบราว์เซอร์















"web browser"
         คือโปรแกรมคอมพิวเตอร์ ที่ผู้ใช้สามารถดูข้อมูลและโต้ตอบกับข้อมูลสารสนเทศที่จัดเก็บในหน้าเวบที่สร้างด้วยภาษาเฉพาะ เช่น ภาษาเอชทีเอ็มแอล ที่จัดเก็บไว้ที่ระบบบริการเว็บหรือเว็บเซิร์ฟเวอร์หรือระบบคลังข้อมูลอื่น ๆ โดยโปรแกรมค้นดูเว็บเปรียบเสมือนเครื่องมือในการติดต่อกับเครือข่ายคอมพิวเตอร์ขนาดใหญ่ที่เรียกว่าเวิลด์ไวด์เว็บ








"HTML = Hypertext Markup Language"
                 เป็นภาษามาร์กอัปหลักในปัจจุบันที่ใช้ในการสร้างเว็บเพจ หรือข้อมูลอื่นที่เรียกดูผ่านทางเว็บเบราว์เซอร์ ซึ่งตัวโค้ดจะแสดงโครงสร้างของข้อมูล ในการแสดง หัวข้อ ลิงก์ ย่อหน้า รายการ รวมถึงการสร้างแบบฟอร์ม เชื่อมโยงภาพหรือวิดีโอด้วย โครงสร้างของโค้ดเอชทีเอ็มแอลจะอยู่ในลักษณะภายในวงเล็บสามเหลี่ยม














"URL"
              คือตัวระบุแหล่งทรัพยากรสากล (URI)ประเภทหนึ่ง ซึ่งใช้สำหรับระบุแหล่งที่อยู่ของทรัพยากรที่ต้องการ และมีกลไกบางอย่างสำหรับดึงข้อมูลทรัพยากรนั้นมา ในการใช้ในเอกสารทางเทคนิคและการอภิปรายทั่วไป มักจะใช้ยูอาร์แอลแทนความหมายที่คล้ายกับยูอาร์ไอ [2] ซึ่งไม่ใช่ความหมายที่ถูกต้องและอาจทำให้เกิดความสับสน ในภาษาพูดทั่วไป ยูอาร์แอลอาจหมายถึง ที่อยู่บนเว็บ หรือ ที่อยู่อินเทอร์เน็ต ก็ได้ ซึ่งปกติแล้วเรามักพิมพ์ยูอาร์แอลในแถบที่อยู่ของเว็บเบราว์เซอร์เพื่อเรียกข้อมูลจากเว็บไซต์





แหล่งที่มา







12/06/55



วันพุธที่ 11 กรกฎาคม พ.ศ. 2555

การแต่งตัวอักษร

การแต่งตัวอักษร




การกำหนดแบบอักษร





   การเปลี่ยนรูปแบบตัวอักษร
       <font FACE="Angsana Upc">...ข้อความ...>/font>




   การเปลี่ยนสีตัวอักษร
       <font color="ฺBlue">...ข้อความ...</font>



   
   การเปลี่่ยนขนาดตัวอักษร
       <font size="7">...ข้อความ...</font>



  


การกำหนดลักษณะตัวอักษรแบบ Physical



   การทำตัวอักษรเอียง
       <i>...ข้อความ...</i>




   การทำตัวอักษรหนา
       <B>...ข้อความ...</B>




   การทำตัวอักษรขีดเส้นใต้
       <U>...ข้อความ...</U>




   การทำตัวอักษรยก
       <SUP>...ข้อความ...</SUP>




   การทำตัวอักษรขีดฆ่า
       <S>...ข้อความ...</S>






   การทำตัวอักษรห้อย
       <SUB>...ข้อความ...</SUB>





   การทำตัวอักษรวิ่ง
       <MARQUEE>...ข้อความ ...</MARQUEE>





   การทำตัวอักษรกระพริบ
       <BLINK>...ข้อความ ...</BLINK> 








การจัดวางตำแหน่งข้อความ



   การจัดย่อหน้าแบบชิดซ้าย
       <P Align=LEFT>...ข้อความ ...</P>


   การจัดย่อหน้าแบบกึ่งกลาง
       <P Align=CENTER>...ข้อความ ...</p>


   การจัดย่อหน้าแบบชิดขวา
       <P Align=RIGHT>...ข้อความ ... </P>







   ตัวอย่าง







   ผลที่ได้










แหล่งที่มา :




สมุด อาจารย์ ชัยราวี  ลาผม


วันที่ 13/07/55 22.50