ใบงานที่ 10 เรื่อง รูปแบบของคำสั่ง HTML

รูปแบบคำสั่งพื้นฐาน

โครงสร้างพื้นฐานของภาษา HTML จะมีรูปแบบ ดังนี้

<HTML>

<HEAD>

ชุดคำสั่งต่างๆ

</HEAD>

<BODY>

ชุดคำสั่งต่างๆ

</BODY>

</HTML>

1. จะเห็นว่าทุกคำสั่งจะมีคำสั่งเปิด <…> และคำสั่งปิด </…> เสมอ นี่เป็นสิ่งสำคัญที่ผู้เขียนเว็บนั้นจะลืมไม่ได้คือ เมื่อเปิดคำสั่งแล้วต้องมีคำสั่งปิดเสมอ

2. การใช้อักษรภาษา HTML นั้นจะสามารถใช้ได้ทั้งตัวใหญ่หรือตัวเล็กก็ได้ เช่น <HTML> หรือ <html> เป็นต้น

3. การใส่รายละเอียดหรือข้อมูลต่อท้ายคำสั่งย่อยนั้นต้องมีเครื่องหมาย “....” เสมอ เช่น <body background= “green”> เป็นต้น

4. คำสั่งย่อยๆ นั้นจะอยู่ภายใน <…> ของคำสั่งหลักเสมอ เช่น <FONT size= “2”>

ต่อไปเป็นการอธิบายความหมายและการใช้คำสั่งต่างๆของภาษา HTML ในที่นี้ผมจะอธิบายแต่คำสั่งที่สำคัญๆ ที่ส่วนใหญ่ต้องใช้ประโยชน์จริงๆนะครับ และในส่วนที่เป็นสีแดงในรายละเอียดด้านล่างนั้นเป็นตัวอย่างที่ผู้เขียนสามารถเปลี่ยนได้ครับ และคำสั่งของภาษา HTML นั้น ในที่นี้ผมจะเรียกว่า “แท็ก” นะครับ มีรายละเอียดดังนี้ครับ

<HTML>

สำหรับ <HTML> นั้นเป็นคำสั่งหรือแท็กแรกในภาษา HTML ซึ่งเป็นคำสั่งที่แสดงให้รู้ว่า ไฟล์นี้เป็นไฟล์ HTML ซึ่งจะใช้ <HTML> ที่บรรทัดบนสุดและ </HTML> เป็นการปิดคำสั่ง HTML ซึ่งจะไว้ที่บรรทัดสุดท้าย เพื่อแสดงว่าจบไฟล์

<HEAD>

สำหรับแท็ก <HEAD> เป็นส่วนหัวของไฟล์ที่ใช้ใส่แท็กต่างๆ เช่น <TITLE>, <META>, <!DOCTYPE> เป็นต้น ส่วนนี้จะเป็นส่วนที่ถูกเรียกมาก่อนส่วนอื่นๆ และจะไม่แสดงผลออกทาง Browser

<BODY>

สำหรับแท็กนี้เป็นส่วนที่เริ่มต้นส่วนที่เป็นคำสั่งต่างๆ ที่จะแสดงยัง Browser ซึ่งข้อมูลทุกอย่างของเราที่จะนำมาแสดงต้องใส่ไว้ภายใต้คำสั่งนี้เท่านั้น แท็กนี้มีคำสั่งย่อยที่สำคัญ ดังนี้

1. BACKGROUND คือการกำหนดให้ Browser แสดงพื้นหลังด้วยรูปภาพ เช่น <BODY BACKGROUND= “bg.gif”> เป็นต้น

2. BGCOLOR คือการกำหนดให้ Browser แสดงพื้นหลังสีที่กำหนด เช่น <BODY BGCOLOR= “green” > เป็นต้น

3. TEXT คือการกำหนดให้ Browser แสดงอักษรเป็นสีที่กำหนด เช่น <BODY TEXT= “rad”> เป็นต้น

<META>

สำหรับแท็กนี้เป็นแท็กที่มีประโยชน์มากเลยทีเดียวในสมัยนี้ ไม่ว่าจะไว้สำหรับกำหนดภาษาที่จะแสดงผล ใช้เป็นเครื่องมือในการค้นหาเว็บ ของ Search Engine ต่างๆ ใส่ข้อความ คำอธิบายต่างๆ

1. NAME= “GENERATOR” ใช้บอกชื่อของผู้เขียนหรือชื่อโปรแกรมที่ใช้เขียน เช่น <META NAME=“GENERATOR” CONTENT= “ชื่อผู้เขียนหรือชื่อโปรแกรม”>

2. NAME= “DESCRIPTION” ใช้ใส่คำอธิบายของโฮมเพจเรา ซึ่งเป็นแท็กหนึ่งที่ Search Engine ใช้ในการค้นหาเว็บเรา เช่น

<META NAME= “DESCRIPTION” CONTENT= “ใส่คำอธิบาย”>

3. NAME= “KEYWORDS” ใช้ใส่คำสำคัญ หรือคำต่างๆที่เกี่ยวข้องกับเว็บเรา ซึ่งเป็นแท็กหนึ่งที่ Search Engine ใช้ในการค้นหาเว็บเรา เช่น

<META NAME= “KEYWORDS” CONTENT= “ใส่คำสำคัญ”>

<FONT>

สำหรับแท็กนี้ ก็จะเกี่ยวกับการแสดงผลของตัวอักษร เช่น ขนาด, สี, Font ของตัวอักษร เป็นต้น

1. SIZE ใช้กำหนดขนาดของ Font ให้มีขนาดต่างๆกัน โดยจะมีขนาดตั้งแต่ 1-7 ซึ่งขนาด

ที่ 1 จะมีขนาดเล็กที่สุดหรือเท่ากับ 8 pt และ ขนาด 7 จะมีขนาดใหญ่ที่สุดหรือเท่ากับ 36 pt

2. COLOR ใช้กำหนดสีของ Font ให้มีสีสันต่างๆ กัน โดยที่คุณสามารถใส่เป็นรหัสสีหรือชื่อก็ได้ เช่น <FONT COLOR= “#000000” > หรือ <FONT COLOR= “Black” > เป็นต้น

3. FACE ใช้กำหนด Font ที่จะให้ Browser แสดงผลด้วย Font ที่กำหนด เช่น <FONT FACE= “Angsana UPC” > เป็นต้น

ใบงานที่ 9 เรื่อง ความหมายของ HTML

HTML (Hyper Text Markup Language) 

     

เป็นภาษามาตรฐานสากลที่ใช้นำเสนอข้อมูลแบบผสมผสานในการสื่อสารแบบ World-Wide-Web :WWW ( Web) ซึ่งเป็นการเชื่อมต่อเครือข่ายของเครื่องคอมพิวเตอร์ทั่วโลก (Internet) รูปแบบหนึ่ง ข้อมูลในรูปแบบต่างๆ ไม่ ว่าจะเป็นข้อความ รูปภาพ เสียง ภาพเคลื่อนไหว หรือ อื่นๆ จะถูกเชื่อมโยงเข้าหากัน ด้วยชุดคำสั่งต่างๆ เพื่อให้แสดงผลออกมาคล้ายกับ สิ่งพิมพ์ สไลด์ หรือ แบบมัลติมีเดีย ซึี่่งเป็นภาษาคอมพิวเตอร์รูปแบบหนึ่ง ที่มีโครงสร้างการเขียนโดยอาศัยตัวกำกับ (Tag) ควบคุมการแสดงผลข้อความ, รูปภาพ หรือวัตถุอื่นๆ ผ่านโปรแกรมเบราเซอร์ แต่ละ Tag อาจจะมีส่วนขยายที่เรียกว่า Attribute สำหรับระบุ หรือควบคุมการแสดงผล ของเว็บได้ด้วยHTML เป็นภาษาที่ถูกพัฒนาโดย World Wide Web Consortium (W3C) จากแม่แบบของภาษา SGML (Standard Generalized Markup Language) โดยตัดความสามารถบางส่วนออกไป เพื่อให้สามารถทำความเข้าใจและเรียนรู้ได้ง่าย และด้วยประเด็นดังกล่าว ทำให้บริการ WWW เติบโตขยายตัวอย่างกว้างขวางตามไปด้วย Tag

ใบงาน เรื่อง Flowchart

นางสาวพิรญาณ์ สุขลาภ ม.5/2 เลขที่ 34 from piraya suklap

ใบงานที่ 6 เรื่อง การเขียนรหัสจำลอง (Pseudo Code)

       รหัสจำลอง หรือ Pseudo Code : เป็นคำบรรยายที่เขียนแสดงขั้นตอนวิธี(algorithm) ของการเขียนโปรแกรม โดยใช้ภาษาที่กะทัดรัด สื่อสารกับโปรแกรมเมอร์ผู้เขียนโปรแกรม โดยอาจใช้ภาษาที่ใช้ทั่วไปและอาจมีภาษาที่ใช้ในการเขียนโปรแกรมประกอบ แต่ไม่มีมาตรฐานแน่นอนในการเขียน pseudo code และไม่สามารถนำไปทำงานบนคอมพิวเตอร์โดยตรง(เพราะไม่ใช่คำสั่งในภาษาคอมพิวเตอร์) และไม่ขึ้นกับภาษาคอมพิวเตอร์ภาษาใดภาษาหนึ่ง

       นิยมใช้ pseudo code แสดง algorithmมากกว่าใช้ผังงาน เพราะผังงานอาจไม่แสดงรายละเอียดมากนักและใช้สัญลักษณ์ซึ่งทำให้ไม่สะดวกในการเขียน เช่นโปรแกรมใหญ่ ๆ มักจะประกอบด้วยคำสั่งต่างๆที่ใกล้เคียงกับภาษาคอมพิวเตอร์ที่ใช้ในการเขียนโปรแกรมจริงๆ เช่น begin…end, if…else, do…while, while, for, read และ print

    การเขียนรหัสจำลองจะต้องมีการวางแผนสำหรับการอ้างอิงถึงข้อมูลต่างๆที่จะใช้ในโปรแกรมด้วยการสร้างตัวแปร โดยใช้เครื่องหมายเท่ากับ (=) แทนการกำหนดค่าให้กำหนดตัวแปรนั้นๆ

ใบงานที่ 5 เรื่อง อัลกอริทึม (Algorithm)

อัลกอริทึม (Algorithm)

   

    1.อัลกอริทึม (Algorithm) หมายถึง กระบวนการแก้ปัญหาที่สามารถอธิบายออกมาเป็นขั้นตอนที่ชัดเจน เมื่อนำเข้าอะไร แล้วจะต้องได้ผลลัพธ์เช่นไร กระบวนการนี้ประกอบด้วยจะประกอบด้วย วิธีการเป็นขั้นๆ และมีส่วนที่ต้องทำแบบวนซำอีก จนกระทั่งเสร็จสิ้นการทำงาน


          2.ลักษณะของ อัลกอริทึม

1.เป็นกระบวนวิธีการที่สร้างขึ้นจากกฎเกณฑ์

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


2.การเขียนอัลกอริทึมต้องไม่คลุมเครือ

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

3.ต้องมีลำดับขั้นตอนที่ชัดเจน

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


4.กระบวนวิธีการต้องให้ผลลัพธ์ตามที่กำหนดในปัญหา

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


5.อัลกอริทึมต้องมีจุดสุดท้ายของการทำงาน

คุณสมบัติอีกข้อหนึ่งที่สำคัญคืออัลกอริทึมต้องมีจุดสุดท้ายของการทำงาน เนื่องจากเครื่องคอมพิวเตอร์ไม่สามารถประมวลผลไปเรื่อย ๆ (infinite) โดยต้องมีจุดสุดท้ายของการทำงานเช่น การบวกเลขจำนวนเต็มครั้งละหนึ่งค่าไปเรื่อย ๆ ในที่นี้จะไม่เป็นอัลกอริทึม เนื่องจากไม่ได้ บอกจุดสุดท้ายของตัวเลขจำนวนเต็ม ดังนั้นจึงเป็นขั้นตอนการทำงานที่ไม่มีจุดสิ้นสุด


        ตัวอย่าง : ในการวางแผนการใช้ทรัพยากรทางธุรกิจขององค์กร หรือ Enterprise Resource Planning ( ERP ) เพื่อให้เกิดการใช้ทรัพยากรอย่างมีประโยชน์สูงสุด ซึ่งจำเป็นต้องวางแผนอย่างเป็นระบบ เป็นขั้นตอน จึงจำเป็นต้องอาศัย Algorithm ด้วย เพื่อให้ทราบถึงขั้นตอนต่างๆ และสามารถตัดทอนขั้นตอนที่เกินความจำเป็น อีกทั้งยังสามารถปรับปรุง และเพิ่มเติมขั้นตอนใหม่ เข้าไปได้ ช่วยลดความสับสนขณะทำงานด้วย

ใบงานที่ 3 เรื่อง การเลือกเครื่องมือและออกแบบขั้นตอน

    1.การเลือกเครื่องมือที่ใช้ในการแก้ปัญหา

การกำหนดทรัพยากรที่ต้องการใช้ในการแก้ปัญหา

    2.การออกแบบขั้นตอนในการปฏิบัติงาน

เป็นการกำหนดแนวทางการแก้ปัญหาก่อนปฏิบัติจริง โดยจะต้องกำหนดขั้นตอนการปฏิบัติงานเป็นลำดับขั้น แล้วจึงนำมาระบุผู้รับผิดชอบและระยะเวลาการปฏิบัติงานในตารางปฏิบัติ

ใบงานที่ 4 เรื่อง การดำเนินการแก้ปัญหา การตรวจสอบและปรับปรุง

      1.การตรวจสอบและปรับปรุงโดยผู้ออกแบบ

เป็นการกระทำทั้งในระหว่างการดำเนินการและภายหลังการดำเนินการเสร็จสิ้นแล้วซึ่งเป็นการตรวจสอบและปรับปรุงกระบวนการทำงานก่อนการใช้งานจริง

    2.การตรวจสอบโดยผู้ใช้งานจริง

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