วันอังคารที่ 28 มีนาคม พ.ศ. 2560

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

เรียนรู้คำสั่งภาษา HTML

    ภาษา HTML นั้นไม่ได้มีรูปแบบเป็นภาษาคอมพิวเตอร์ ที่ยากจะเข้าใจ เช่น ภาษา C, Pascal, Java เป็นต้น เพราะภาษา HTML มีรูปแบบคำสั่งง่ายๆ คล้ายกับภาษาที่ใช้กันอยู่ทั่วๆไป เป็นรูปแบบตายตัว และเข้าใจง่าย โดยภาษา HTML นั้น จะมีการใช้คำสั่งอยู่ภายใต้ เครื่องหมาย < > และจะใช้ เครื่องหมาย / เพื่อจบคำสั่งนั้นๆ โดยหลักในการเขียนเว็บเพจนั้นผมขอเสนอแนะขั้นตอน ซึ่งเป็นทางเลือกหนึ่งในการสร้างเว็บเพจ ดังต่อไปนี้

   1. สิ่งที่ต้องการนำเสนอ ผู้พัฒนาจะต้องเตรียมข้อมูลต่างๆ ที่ต้องการนำมาเสนอลงบน Webpage โดยผู้พัฒนาอาจสร้างทีมงานขึ้นมาและแบ่งหน้าที่ในการทำงาน เช่น การหาข้อมูลข่าวสาร, การแบ่งหน้าที่ในการเขียน HTML รวมไปถึงการ Update ข้อมูลบนเว็บ เป็นต้น

   2. สร้างโครงร่างคร่าวๆ ลงในกระดาษ ผู้พัฒนาควรวาดโครงร่างรูปแบบของ Webpage คร่าวๆลงในกระดาษก่อนเพื่อดูรูปแบบโดยรวมแบบกว้างๆ ของหน้าจอเรา ว่าควรจะมีโครงสร้างแบบไหน ใช้รูปภาพและข้อความอะไร วางไว้ตำแหน่งไหนบนหน้าจอบ้าง

   3. เริ่มเขียน Webpage เริ่มต้นเขียน Webpage โดยภาษาที่ถนัด โดยทั่วไปเราจะใช้ภาษา HTML ในการเขียน ส่วนในการกำหนดลูกเล่น หรือใช้ระบบฐานข้อมูลบนเว็บเราอาจจะใช้ภาษา Scriptเข้ามาช่วย เช่น Java, CGI, Perl, PHP, ASP ฯลฯ เพราะ มาตรฐานของภาษา HTML นั้นไม่สามารถจัดการฐานข้อมูลได้

   4. นำ Webpage ขึ้นไปวางบน Server ในส่วนนี้เจ้าของ Server จะเป็นผู้จัดการวางไฟล์ต่างๆ ที่ได้สร้างเรียบร้อยแล้วไว้บน Server เพื่อเปิดให้ผู้บริการให้ผู้สนใจเข้าชม





วันจันทร์ที่ 27 มีนาคม พ.ศ. 2560

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


HTML คืออะไร??
   HTML (HyperText Markup Language) คือ ภาษาคอมพิวเตอร์ที่ออกแบบมาเพื่อใช้ใน การเขียนเว็บเพจ ถูกเรียกดูผ่านเว็บบราวเซอร์ เริ่มพัฒนาโดย ทิม เบอร์เนอรส์ ลี (Tim Berners Lee) ในปีค.ศ.1990 HTML เป็นมาตรฐานที่จัดการโดย World Wide Web Consortium แต่ปัจจุบัน W3C ผลักดัน XHTML ที่ใช้ XML มาทดแทน HTML รุ่น 4.01 HTML ย่อมาจากค าว่า “HyperText Markup Language” เป็นภาษาที่ใช้ในการเขียน โปรแกรมภาษาหนึ่งของคอมพิวเตอร์ ที่แสดงผลในลักษณะของเว็บเพจ ซึ่งสามารถแสดงผลได้ใน รูปแบบต่างๆ ไม่ว่าเป็นภาพกราฟิก ภาพนิ่ง ภาพเคลื่อนไหว เสียง หรือการเชื่อมโยงไปยังเว็บเพจอื่นๆ ภาษา HTML เป็นภาษาที่มีลักษณะของโค้ด กล่าวคือ จะเป็นไฟล์ที่เก็บข้อมูลที่เป็นตัวอักษร ในมาตรฐานของรหัสแอสกี (ASCII Code) โดยเขียนอยู่ในรูปแบบของเอกสารข้อความ จึงสามารถ ก าหนดรูปแบบและโครงสร้างได้ง่าย


   ภาษา HTML (Hyper Text Markup Language) เป็นภาษาที่ใช้ในการเขียนโปรแกรมข้อมูล ที่ใช้แสดงผลบนเครือข่ายอินเตอร์เน็ตในลักษณะของข้อความ รูปภาพ เสียง และภาพเคลื่อนไหว ต่างๆ ภาษา HTML เป็นภาษาที่ง่ายต่อการเรียนรู้สามารถก าหนดรูปแบบและโครงสร้างได้ง่าย ท าให้ ได้รับความนิยม และมีการพัฒนาอย่างต่อเนื่องเพื่อให้ใช้งานง่ายขึ้น และตอบสนองต่องานด้านกราฟิก มากยิ่งขึ้น และสนับสนุนการแสดงผลในเว็บบราวเซอร์มากมาย และบันทึกในรูปของไฟล์นามสกุล htm หรือ html บทเรียนในการศึกษาภาษา HTML ต่อไปนี้ มีความประสงค์จะให้ผู้เรียนได้ฝึกฝนและทำความเข้าใจในการเขียนโค๊ดคำสั่งด้วยตนเอง จึงมีความจำเป็นจะต้องใช้เครื่องมือพื้นฐานที่มีอยู่แล้วให้ เป็นประโยชน์มากที่สุด โดยไม่ต้องลงทุนอะไรมากมาย เมื่อทำความเข้าใจและเขียนโค๊ดได้ถูกต้อง แม่นยำค่อยหาเครื่องมือมาช่วยอำนวยความสะดวกอีกที

วันพฤหัสบดีที่ 23 มีนาคม พ.ศ. 2560

ใบงานที่7 การเขียนผังงาน(Flowchart)

ความหมายของผังงาน
   ผังงาน (Flowchart) คือ รูปภาพ (Image) หรือสัญลักษณ์(Symbol) ที่ใช้เขียนแทนขั้นตอน คำอธิบาย ข้อความ หรือคำพูด ที่ใช้ในอัลกอริทึม (Algorithm) เพราะการนำเสนอขั้นตอนของงานให้เข้าใจตรงกัน ระหว่างผู้เกี่ยวข้อง ด้วยคำพูด หรือข้อความทำได้ยากกว่าการใช้ผังงาน ผังงานเป็นเครื่องมือแสดงขั้นตอนหรือกระบวนการทำงานโดยใช้สัญลักษณ์ที่เป็นมาตรฐานเดียวกันซึ่งในสัญลักษณ์จะมีข้อความสั้น ๆ อธิบายข้อมูลที่ต้องใช้ผลลัพธ์หรือคำสั่งประมวลผลของขั้นตอนนั้น ๆ และเชื่อมโยงขั้นตอนเหล่านั้นด้วยเส้นที่มีลูกศรชี้ทิศทางการทำงานตั้งแต่เริ่มต้นจนจบกระบวนการ
   ในการเขียนโปรแกรมด้วยภาษาคอมพิวเตอร์ โดยทั่วไปจะมีหลักการหรือขั้นตอนที่สาคัญทั้งหมด 5 ขั้นตอนได้แก่
   1. การวิเคราะห์ปัญหา
   2. การออกแบบโปรแกรม
   3. การเขียนโปรแกรม
   4. การทดสอบและแก้ไขโปรแกรม
   5.ทำเอกสารประกอบโปรแกรม

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

   ประเภทของผังงาน โดยทั่วไปผังงานคอมพิวเตอร์แบ่งเป็น 2 ประเภทใหญ่

1. ผังงานระบบ (System Flowchart)

   เป็นผังงานที่แสดงถึงขั้นตอนการทางานภายในระบบหนึ่ง ๆ เพื่อให้เห็นโครงสร้างโดยภาพรวมของระบบ ซึ่งจะแสดงถึงความเกี่ยวข้องของส่วนที่สาคัญต่างๆ ในระบบนั้น เช่น เอกสารข้อมูลเบื้องต้น สื่อบันทึกข้อมูลที่ใช้ ข้อมูลจะส่งผ่านไปยังหน่วยงานใด มีกิจกรรมประมวลผลข้อมูลอะไรในหน่วยงานนั้น แล้วจะส่งต่อไปหน่วยงานใด เป็นต้น ดังนั้นผังงานระบบอาจเกี่ยวข้องกับข้อมูล สื่อหรือแหล่งบันทึกข้อมูล วัสดุปกรณ์ คน หรือฝ่ายงานที่เกี่ยวข้อง ซึ่งแต่ละจุดจะประกอบไปด้วย
การนาข้อมูลเข้า วิธีการประมวลผล และการแสดงผลลัพธ์ (Input – Process - Output) ดังภาพ
2. ผังงานโปรแกรม (Program Flowchart) หรือเรียกสั้นๆ ว่า ผังงาน
   
   ผังงานประเภทนี้แสดงถึงขั้นตอนของคาสั่งที่ใช้ในโปรแกรม ผังงานนี้อาจสร้างจากผังงานระบบโดยผู้เขียนผังงานจะดึงเอาแต่ละจุด ที่เกี่ยวข้องกับการทางานของเครื่องคอมพิวเตอร์ที่ปรากฏในผังงานระบบมาเขียน เพื่อให้ทราบว่าถ้าจะใช้คอมพิวเตอร์ทางานควรที่จะมีขั้นตอนคาสั่งอย่างไร เพื่อให้ได้ผลลัพธ์ตามที่ต้องการ และจะได้นามาเขียนโปรแกรมคอมพิวเตอร์ต่อไป
ดังนั้นการเขียนผังงานก็จะมีประโยชน์ เหมาะสาหรับผู้บริหาร ผู้วิเคราะห์ระบบ ผู้เขียนโปรแกรม และบุคคลอื่นที่ต้องการศึกษา ทาให้ทราบถึงความสัมพันธ์ของระบบตั้งแต่เริ่มต้น ว่ามีการปฏิบัติแต่ละขั้นตอนอย่างไร ใช้วิธีการอะไรบ้าง สุดท้ายจะได้ผลลัพธ์อะไรบ้าง เมื่อเข้าใจระบบงานหรือสิ่งที่กาลังศึกษาก็จะช่วยให้สามารถปฏิบัติงานและแก้ปัญหาได้อย่างมีประสิทธิภาพมากยิ่งขึ้น ดังภาพ

สัญลักษณ์ผังงาน




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

   การเขียนรหัสจำลอง (Pseudo Code) คือการเขียนอัลกอริทึมโดยใช้ประโยคภาษาอังกฤษที่สื่อความ
หมายง่าย ๆ สามารถอ่านแล้วเข้าใจได้โดยทันที แต่ก็สามารถใช้รูปแบบที่เป็นภาษาพูดด้วยภาษาไทยและภาษาอังกฤษก็ได้
   โครงสร้างของรหัสจำลองเริ่มต้นด้วยข้อความ Begin แล้วอธิบายขั้นตอนการทำงานโดยใช้คำสั่งต่าง ๆ ที่ใกล้เคียงกับภาษาคอมพิวเตอร์ในการเขียนโปรแกรม เช่น คำสั่ง read หมายถึง การอ่านค่าหรือรับค่าข้อมูลตัวแปรตามที่กำหนดไว้ คำสั่ง print หมายถึง การแสดงผลลัพธ์ที่ได้จากการคำนวณ
และพิมพ์ข้อความ End เมื่อจบการทำงาน
   การเขียนรหัสจำลองจะต้องมีการวางแผนสำหรับการอ้างอิงถึงข้อมูลที่จะต้องนำไปใช้ภายในโปรแกรมด้วยการสร้างตัวแปร โดยใช้เครื่องหมายเท่ากับ (= ) แทนการกำหนดค่าตัวแปร

 

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

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

   2.Pseudocode อธิบายด้วยรหัสจำลองหรือรหัสเทียม

   3.Flowchart อธิบายด้วยแผนผัง


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

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