วันจันทร์ที่ 12 มีนาคม พ.ศ. 2555

หลักในการออกแบบเว็บไซต์

หลักในการออกแบบเว็บไซต์


ขั้นตอนที่ 1 กำหนดโครงสร้างของเว็บไซต์

การสร้างเว็บไซต์นั้นควรเริ่มจากการสร้างแผนผังของเว็บไซต์ก่อน หรือที่เรียกว่า Site Map ดังภาพตัวอย่างมีการกำหนดหน้าเว็บเพจ 4 หน้า



ขั้นตอนที่ 2 กำหนดการเชื่อมโยงระหว่างเว็บเพจ
เราต้องกำหนดการเชื่อมโยงให้เว็บเพจแต่ละหน้าเชื่อมโยงถึงกันเื่พื่อให้กลับไปกลับมา ระหว่างหน้าต่าง ๆ ได้ โดยแสดงชื่อไฟล์ HTML แต่ละไฟล์ที่มีการเชื่อมโยงสัมพันธ์กันดังภาพ





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


ขั้นตอนที่ 4 การสร้างเว็บเพจแต่ละหน้า
นำเว็บเพจที่ออกแบบไ้ว้มาสร้างโดยใช้ภาษาhtml หรืออาจใช้โปรแกรมสำเร็จรูป เช่นFrontPage, Macromedia Dreamweaverหรือโปรแกรมสำเร็จรูปอื่น ๆ ตามความถนัด


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


ขั้นตอนที่ 6 การอัพโหลดเว็บไซต์
หลังจากสร้างเว็บไซต์และลงทะเบียนขอพื้นที่สำหรับฝากเว็บไซต์แล้ว ให้ใช้โปรแกรมสำหรับอัปโหลด (Upload) เช่นโปรแกรม CuteFTPเพื่อให้คนทั่วโลกสามารถเข้าชมเว็บไซต์ของเราผ่านทางระบบเครือข่ายอินเทอร์เน็ตได้


Graphic for web




Photoshop


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


Illustrator


โปรแกรม Illustrator เป็นโปรแกรมสำหรับสร้างภาพลายเส้นที่มีความคมชัดสูง งานภาพประกอบและงานกราฟิกแบบ 2 มิติต่างๆ เช่น การสร้างโลโก้สินค้า จนไปถึงการจัดเลย์เอาต์งานสิ่งพิมพ์ และมีเครื่องมึอที่ช่วยเหลือในงานเว็บไซต์อีกด้วย ภาพกราฟิกสามารถแบ่งได้เป็น 2 แบบคือ 1.ภาพแบบพิกเซล (pixel) คือ ภาพที่เกิดจากจุดภาพในรูปภาพที่รวมกันเป็นภาพขึ้น โดยภาพหนึ่งๆ จะประกอบไปด้วยจุดภาพหรือพิกเซลมากมาย และเเต่ละภาพที่สร้างขึ้นจะมีความหนาเเน่นของจุดภาพ หรือบางครั้งแทนว่าความละเอียด (ความคมชัด)ที่เเตกต่างกันไป จึงใช้ในการบอกคุณสมบัติของภาพ จอภาพ หรือ อุปกรณ์แสดงผลภาพได้ 2.ภาพกราฟิกส์เวกเตอร์ (vector graphics) คือ ภาพที่เกิดจากการกำหนดพิกัดและการคำนวณค่าบนระนาบสองมิติ รวมทั้งมุมและระยะทาง ตามทฤษฎีเวกเตอร์ในทางคณิตศาสตร์ ในการก่อให้เกิดเป็น เส้น หรือรูปภาพ ข้อดีคือ ทำให้สามารถย่อขยายได้ โดยคุณภาพไม่เปลี่ยนแปลง ข้อเสียคือภาพไม่เหมือนภาพจริงเป็นได้เพียงภาพวาด หรือใกล้เคียงภาพถ่ายเท่านั้น ข้อมูลภาพพวกนี้ได้เเก่ไฟล์สกุล eps, ai (adobe illustrator) เป็นต้น ** โปรแกรม Illustrator ทำงานแบบ vector graphicsความแตกต่างระหว่างรูปแบบ vector และแบบ pixel


Animation for web


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


1.ถ้าเราใช้ทำอนิเมชั่น ไฟล์จะมีขนาดใหญ่แล้วแต่ความซับซ้อนของอนิเมชั่นนั้น ทำให้การแสดงหน้าเว็บเพจทำได้ช้าลง
2.Search engine ต่างๆไม่สามารถอ่านข้อความที่อยู่ในไฟล์ Flash ได้ ทำให้เราเสียโอกาศในการอยู่ในอันดับดีๆของ search engine
3.ถ้าผู้ใช้ไม่มี Flash player จะทำให้ไฟล์ Flash ของเรานั้นไม่แสดงผล ดังนั้นเราควรใช้งานโปรแกรม Flash ให้เหมาะสมไม่ควรใช้มากเกินไป


ข้อดีของ Flash มีอยู่มากมาย อย่างเช่น
1.ทำให้เว็บไซต์เราดูน่าสนใจมากขึ้น
2.สามารถเปิดไฟล์วิดิโอ หรือไฟล์เสียง ผ่านเว็บไซต์ได้
3.Flash นั้นปัจจุบันมีความสามารถมาก สามารถสร้างโปรแกรม หรือเกมดีๆ ได้เลย ถ้าเรานำมาประยุกต์ใช้ให้ถูกต้องจะทำให้เว็บของเรามีความสามารถมากขึ้น

ไฟล์ Flash นั้นจะมี 2 แบบคือ
1.swf เป็นไฟล์ที่เราสามารถใส่ได้ทุกที่ในเว็บเพจ
2.flv เป็นไฟล์ Flash video

การใช้งาน flash ร่วมกับ dreamweaver เมื่อเราแทรกไฟล์ flash หรือ ไฟล์มัลติมีเดียต่างๆ ลงใน dreamweaver โปรแกรมจะทำการเขียน JavaScript ขึ้นมาโดยอัตโนมัติ ชื่อว่า AC_RunActiveContent.js ไฟล์นี้จะอยุ่ใน folder ชื่อว่า scripts การใช้งานจริงหรือการอัพโหลดข้อมูลสู่ webserver นั้นห้ามลืมที่จะอัพโหลดไฟล์นี้เด็ดขาด มิฉนั้นไฟล์ Flash หรือ ไฟล์มัลติมีเดีย ต่างอาจไม่แสดงผลได้


Swish
Swish คือ โปรแกรมที่ใช้ออกแบบข้อความและภาพเคลื่อนไหวรวมทั้งยังสามารถใส่เสียงเข้าไปใน Movieได้ด้วยซึ่งสร้างได้อย่างรวดเร็วและง่ายโดยภาพเคลื่อนไหวสามารถส่งออกไปเพื่อใช้กับหน้าเว็บเพจและเป็นป้ายโฆษณาต่าง ๆ ได้

Website Language
HTML
เป็นหลักภาษามาร์กอัปสำหรับหน้าเว็บ . องค์ประกอบ HTML เป็นหน่วยการสร้างพื้นฐานของหน้าเว็บ
HTML ที่เป็นลายลักษณ์อักษรในรูปแบบขององค์ประกอบ HTMLประกอบด้วยแท็กที่อยู่ในวงเล็บมุม(เช่น<html> ) ภายในเนื้อหาของหน้าเว็บ แท็ก HTML มามากที่สุดในการจับคู่เช่น<h1>และ</ h1>แม้จะแท็กบางอย่างที่รู้จักกันเป็นองค์ประกอบที่ว่างเปล่าที่มี unpaired ตัวอย่างเช่น<img> . แท็กแรกในคู่ที่เป็นแท็กเริ่มต้น , แท็กที่สองคือการแท็กสิ้นสุด (พวกเขาจะเรียกว่าแท็กเปิดและปิดแท็ก ) ในระหว่างแท็กเหล่านี้นักออกแบบเว็บสามารถเพิ่มข้อความ, ความเห็น, แท็กและเนื้อหาประเภทอื่น ๆ ขึ้นอยู่กับข้อความ
วัตถุประสงค์ของการเป็นเว็บเบราเซอร์คือการอ่านเอกสาร HTML และเขียนไว้ในที่มองเห็นหรือได้ยินเสียงหน้าเว็บ เบราว์เซอร์จะไม่แสดงแท็ก HTML แต่จะใช้แท็กในการแปลเนื้อหาของหน้าเว็บ
องค์ประกอบ HTML รูปแบบการสร้างบล็อกของเว็บไซต์ทั้งหมด HTML ที่ช่วยให้ภาพและวัตถุที่จะฝังตัวและสามารถที่จะใช้ในการสร้างแบบโต้ตอบ . ให้หมายถึงการสร้างเอกสารที่มีโครงสร้างโดยแสดงถึงโครงสร้างความหมายสำหรับข้อความเช่นหัวเรื่องย่อหน้า, รายการ, การเชื่อมโยง, ราคาและรายการอื่น ๆ มันสามารถฝังสคริปต์ในภาษาเช่นจาวาสคริปต์ที่มีผลต่อพฤติกรรมของหน้าเว็บ HTML ที่
เว็บเบราเซอร์ยังสามารถอ้างถึงcascading style sheets ของ (CSS) เพื่อกำหนดลักษณะและรูปแบบของข้อความและวัสดุอื่น ๆ W3C , ดูแลของทั้ง HTML และมาตรฐาน CSS, สนับสนุนการใช้ของ CSS มากกว่า presentational อย่างชัดเจน

PHP
PHPเป็นวัตถุประสงค์ทั่วไปในฝั่งเซิร์ฟเวอร์ ภาษาสคริปต์ที่ออกแบบมาสำหรับการพัฒนาเว็บในการผลิตหน้าเว็บแบบไดนามิก . มันเป็นหนึ่งในหนึ่งในครั้งแรกการพัฒนาด้านเซิร์ฟเวอร์ภาษาสคริปต์ที่ฝังอยู่ในHTML ที่เอกสารต้นฉบับแทนที่จะเรียกแฟ้มภายนอกเพื่อประมวลผลข้อมูล ในที่สุดรหัสที่ตีความโดยเว็บเซิร์ฟเวอร์ที่มีโมดูลการประมวลผลของ PHP ซึ่งจะสร้างหน้าเว็บที่เกิดขึ้น นอกจากนี้ยังมีการพัฒนาให้มีอินเตอร์เฟซบรรทัดคำสั่งที่มีความสามารถและสามารถใช้ในแบบสแตนด์อโลน โปรแกรมกราฟิก . PHP สามารถใช้งานบนเว็บเซิร์ฟเวอร์มากที่สุดและยังเป็นแบบสแตนด์อโลนเปลือกในเกือบทุกระบบปฏิบัติการและแพลตฟอร์มฟรี คู่แข่งเพื่อMicrosoft 's Active Server หน้า (ASP) เครื่องยนต์สคริปต์ฝั่งเซิร์ฟเวอร์ -และภาษาที่คล้ายกัน PHP ติดตั้งอยู่มากกว่า 20 ล้านเว็บไซต์และ 1 ล้านเว็บเซิร์ฟเวอร์ .
PHP แต่เดิมสร้างโดยRasmus Lerdorfในปี 1995 การดำเนินงานหลักของ PHP คือการผลิตในขณะนี้โดยกลุ่ม PHPและทำหน้าที่เป็นอ้างอิงอย่างเป็นทางการไปที่ภาษา PHP PHP เป็นซอฟต์แวร์ฟรีที่ออกภายใต้ใบอนุญาต PHPซึ่งเป็นที่ไม่เข้ากันกับใบอนุญาต GNU General Public (GPL) เนื่องจากการ ข้อ จำกัด ในการใช้งานของคำว่าPHP .ในขณะที่ PHP เดิมยืนสำหรับ"หน้าแรกส่วนบุคคล"ก็คือตอนนี้กล่าวว่าจะยืนสำหรับ"PHP : Hypertext Preprocessor"ซึ่งเป็นตัวย่อ recursive .

ASP


ASP(Active Server Page) เป็นเทคโนโลยีที่ทำงานทางฝั่งด้านเซิร์ฟเวอร์ ที่ถูกออกแบบมาให้ง่ายต่อการพัฒนาแอพพลิเคชั่นผ่านเว็บเซิร์ฟเวอร์สำหรับนักพัฒนาเว็บไซต์ การใช้งาน ASP สามารถกระทำได้โดยเขียนคำสั่งหรือสคริปต์ต่างๆ ในรูปของเท็กซ์ไฟล์ธรรมดาทั่วๆไป แล้วนำมาเก็บไว้ที่เซิร์ฟเวอร์ เมื่อมีการเรียกใช้งานจากบราวเซอร์ ไฟล์เอกสาร ASP ก็จะถูกแปลโดย Server Interpreter แล้วส่งผลที่ได้ส่งกลับไปเป็นภาษา HTML ให้บราวเซอร์ที่เรียกดังกล่าว เนื่องจาก ASP สามารถรองรับได้หลายภาษา เช่น VBScript ,Jscript ,Perl และภาษาสคริปต์อื่นๆ ดังนั้นนักพัฒนาเว็บไซต์จึงไม่มีความจำเป็นต้องมีความรู้หรือต้องศึกษาในทุกภาษาเนื่องจาก ASP ได้ถูกออกแบบมาให้ขึ้นกับความรู้ของนักพัฒนาเว็บไซต์นั่นเอง การทำงานของโปรแกรม ASP นั้นจะทำงานอยู่ที่ฝั่งของ Server เท่านั้น เราจึงเรียกว่าเป็นการทำงานแบบ Server Side ซึ่งจากการทำงานทางฝั่ง Server ของ ASP นั้น ทำให้ Web Browser ของฝั่ง Client จะทำหน้าที่เพียงรับผลลัพธ์ที่ได้จากการทำงานทางฝั่ง Server เท่านั้น

CSS
CSS คือ ชุดคำสั่งที่ใช้สำหรับการกำหนดการแสดงผลข้อมูลหน้าเว็บพจ ซึ่งคำเต็ม ๆ ของ CSS คือ Cascading Style Sheets เป็นมาตราฐานหนึ่งของ W3C ที่กำหนดขึ้นมา เพื่อใช้ในการตบแต่งหน้าเอกสารเว้บเพจโดยเฉพาะ การใช้งาน CSS จะเข้ามาช่วยเพิ่มความสามารถให้กับ HTML เดิมที่เราใช้งานกันอยู่ในปัจจุบัน ซึ่งในปัจจุบันนี้ CSS ได้มาอยู่บนมาตราฐานที่เวอร์ชั่น 2.0 (CSS2.0)

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




SQL

เอสคิวแอล (SQL)


เอสคิวแอล (SQL) คือ ภาษาสอบถามข้อมูล หรือภาษาจัดการข้อมูลอย่างมีโครงสร้าง มีการพัฒนาภาษาคอมพิวเตอร์ และโปรแกรมฐานข้อมูลที่รองรับมากมาย เพราะจัดการข้อมูลได้ง่าย เช่น MySQL, MsSQL, PostgreSQL หรือ MS Access เป็นต้น สำหรับโปรแกรมฐานข้อมูลที่ได้รับความนิยมคือ MySQL เป็น Open Source ที่ใช้งานได้ทั้งใน Linux และ Windows


SQL เป็นภาษาที่ใช้ในการเขียนโปรแกรม เพื่อจัดการกับฐานข้อมูลโดยเฉพาะ เราสามารถแบ่งการทำงานได้เป็น 4 ประเภท ดังนี้

1. Select query ใช้สำหรับดึงข้อมูลที่ต้องการ
2. Update query ใช้สำหรับแก้ไขข้อมูล
3. Insert query ใช้สำหรับการเพิ่มข้อมูล
4. Delete query ใช้สำหรับลบข้อมูลออกไป
Select query

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

1. Select fmane,lname From stdinfo
หมายถึง ให้แสดงเฉพาะคอลัมน์ fname คือ ชื่อ และคอลัมน์ lname คือ นามสกุล จากตาราง stdinfo

2. Select fname,lname From stdinfo Where programe=”สังคมศึกษา”
หมายถึง ให้แสดงชื่อ และนามสกุลจากตาราง stdinfo ซึ่งมีโปรแกรมวิชาเป็นสังคมศึกษา

3. Select fname From stdinfo Where fname Like ‘ส%’
หมายถึง ให้เลือกรายชื่อ นักศึกษาที่มีอักษรนำหน้าเป็น “ส” ขึ้นมาแสดงทั้งหมด

4. Select id,fname,lname From stdinfo Where id=”001” AND id=”005”
หมายถึง ให้แสดง รหัสประจำตัวนักศึกษา ,ชื่อ และ นามสกุล ที่มีรหัสเป็น 001 และ 005
ข้อสังเกต

1. ประโยคย่อย WHERE เราสามารถระบุเงื่อนไขได้โดยใช้โอเดปอร์เรเตอร์ ทั้วไป เช่น NOT < > = กรณีที่คอลัมน์เป็นตัวเลข เราก็สามารถระบุเงื่อนไขที่เป็นการคำนวนได้เช่น +,-,*,/

2. คำว่า Like ใช้กับค่าในคอลัมน์ประเภทตัวอักษรว่าตรงกับประโยคที่ต้องการหรือไม่ เราสามารถใช้เครื่องหมาย widecard เช่น *,??,% ในประโยคได้ ตามตัวอย่างข้างต้น
3. ในการคำนวนนั้นมีฟังก์ชัน COUNT,SUM,AVG.MIN,MAX ซึ่งสามารถนำมาใช้ได้ เช่น
Select Count(id) From stdinfo
หมายถึง ให้แสดงจำนวนรายการทั้งหมดในตาราง
4. ในกรณีที่ตารางสองตารางมีความสัมพันธ์กัน เราก็สามารถดูข้อมูลทั้งสองตารางพร้อมกันได้ เช่น ตารางที่ 1 ข้อมูลนักศึกษาชื่อ stdinfo
กำหนดให้มีคอลัมน์รหัสประจำตัว (id) ,ชื่อ (fname), นามสกุล (lname)
ตารางที่ 2 ขอมูลเกี่ยวกับวิชาที่เรียน ชื่อ substd
กำหนดให้มีคอลัมน์ชื่อวิชา (subject), รหัสประจำตัวอ้างอิง (rid) ,อาจารย์ผู้สอน (teacher)
เราต้องการดูข้อมูลรหัสประจำตัว ชื่อ นามสกุล และชื่อวิชาที่เรียน เราจะใช้คำสั่งดังนี้
Select stdinfo.id, stdinfo.fname,stdinfo.lname,substd.subject From stdinfo,substd Where stdinfo.id=substd.rid
Update query

ใช้สำหรับการแก้ไขข้อมูลในตาราง โดยแก้ในคอลัมน์ที่มีค่าตรงตามเงื่อนไข มีรูปแบบดังนี้
Update ชื่อตาราง Set [ชื่อคอลัมน์=ค่าที่จะใส่เข้าไปในคอลัมน์นั้น ๆ ] Where เงื่อนไข
เช่น จากตารางแสดงรายชื่อนักศึกษากรณีที่นักศึกษาชื่อ สมบัติ มักน้อย ย้ายโปรแกรมวิชา จาก สังคมศึกษา ไปเป็นภาษาไทย เราใช้คำสั่งดังนี้
Select stdinfo Set programe=’ภาษาไทย’ Where Fname=’สมบัติ’ and Lname=’มักน้อย’
Insert query

ใช้ในการเพิ่มเติมข้อมูลใหม่ ๆ เข้าไปในฐานข้อมูล มีรูปแบบดังนี้
Insert Into ชื่อตาราง [=ชื่อคอลัมน์1,2..] Values [ค่าที่จะใส่ลงในคอลัมน์ 1,2…]
เช่น ต้องการเพิ่มรายชื่อนักศึกษา ที่มีรหัสประจำตัวเป็น 007 ชื่อ กมลวรรณ ศิริกุล โปรแกรมวิชา วิทยาศาสตร์ เราสามารถใช้คำสั่งดังนี้
Insert into stdinfo (id,fname,lname,programe) Values (‘007’,’กมลวรรณ’,’ศิริกุล’,’ วิทยาศาสตร์’)
Delete query

ใช้ลบข้อมูลออกจากตาราง มีรูปแบบดังนี้
Delete From ชื่อตาราง Where เงื่อนไข
เช่น ต้องการลบรหัสประจำตัวนักศึกษา 005 ออกจากฐานข้อมูล เราใช้คำสั่งดังนี้
Delete From stdinfo Where id=’005’
MySQL (มายเอสคิวแอล)

MySQL (มายเอสคิวแอล) เป็นระบบจัดการฐานข้อมูลโดยใช้ภาษา SQL. แม้ว่า MySQL เป็นซอฟต์แวร์โอเพนซอร์ส แต่แตกต่างจากซอฟต์แวร์โอเพนซอร์สทั่วไป โดยมีการพัฒนาภายใต้บริษัท MySQL AB ในประเทศสวีเดน โดยจัดการ MySQL ทั้งในแบบที่ให้ใช้ฟรี และแบบที่ใช้ในเชิงธุรกิจ

MySQL สร้างขึ้นโดยชาวสวีเดน 2 คน และชาวฟินแลนด์ ชื่อ David Axmark, Allan Larsson และ Michael “Monty” Widenius.

ปัจจุบันบริษัทซันไมโครซิสเต็มส์ (Sun Microsystems, Inc.) เข้าซื้อกิจการของ MySQL AB เรียบร้อยแล้ว ฉะนั้นผลิตภัณฑ์ภายใต้ MySQL AB ทั้งหมดจะตกเป็นของซัน

ชื่อ “MySQL” อ่านออกเสียงว่า “มายเอสคิวเอล” หรือ “มายเอสคิวแอล” (ในการอ่านอักษร L ในภาษาไทย) ซึ่งทางซอฟต์แวร์ไม่ได้อ่าน มายซีเควล หรือ มายซีควล เหมือนกับซอฟต์แวร์จัดการฐานข้อมูลตัวอื่น
การใช้งาน

MySQL เป็นที่นิยมใช้กันมากสำหรับฐานข้อมูลสำหรับเว็บไซต์ เช่น มีเดียวิกิ และ phpBB และนิยมใช้งานร่วมกับภาษาโปรแกรม PHP ซึ่งมักจะได้ชื่อว่าเป็นคู่ จะเห็นได้จากคู่มือคอมพิวเตอร์ต่างๆ ที่จะสอนการใช้งาน MySQL และ PHP ควบคู่กันไป นอกจากนี้ หลายภาษาโปรแกรมที่สามารถทำงานร่วมกับฐานข้อมูล MySQL ซึ่งรวมถึง ภาษาซี ซีพลัสพลัส ปาสคาล ซีชาร์ป ภาษาจาวา ภาษาเพิร์ล พีเอชพี ไพทอน รูบี และภาษาอื่น ใช้งานผ่าน API สำหรับโปรแกรมที่ติดต่อผ่าน ODBC หรือ ส่วนเชื่อมต่อกับภาษาอื่น (database connector) เช่น เอเอสพี สามารถเรียกใช้ MySQL ผ่านทาง MyODBC,ADO,ADO.NET เป็นต้น




JAVASCRIP


JavaScript ไม่ใช่ Java JavaScript ไม่ใช่ HTML JavaScript เป็นภาษาสคริปต์เชิงวัตถุ หรือเรียกว่า อ็อบเจ็กโอเรียลเต็ด (Object Oriented Programming) ที่มีเป้าหมายในการ ออกแบบและพัฒนาโปรแกรมในระบบอินเทอร์เน็ต สำหรับผู้เขียนด้วยภาษา HTML สามารถทำงานข้ามแพลตฟอร์มได้ โดยทำงานร่วมกับ ภาษา HTML และภาษา Java ได้ทั้งทางฝั่งไคลเอนต์ (Client) และ ทางฝั่งเซิร์ฟเวอร์ (Server)

JavaScript คือ ภาษายุคใหม่ที่ถูกพัฒนาขึ้นโดย เน็ตสเคปคอมมิวนิเคชันส์ (Netscape Communications Corporation) โดยใช้ชื่อว่า Live Script ออกมาพร้อมกับ Netscape Navigator2.0 เพื่อใช้สร้างเว็บเพจโดยติดต่อกับเซิร์ฟเวอร์แบบ Live Wire ต่อมาเน็ตสเคปจึงได้ร่วมมือกับ บริษัทซันไมโครซิสเต็มส์ปรับปรุงระบบของบราวเซอร์เพื่อให้สามารถติดต่อใช้งานกับภาษาจาวาได้ และได้ปรับปรุง LiveScript ใหม่เมื่อ ปี 2538 แล้วตั้งชื่อใหม่ว่า JavaScript JavaScript สามารถทำให้ การสร้างเว็บเพจ มีลูกเล่น ต่าง ๆ มากมาย และยังสามารถโต้ตอบกับผู้ใช้ได้อย่างทันที เช่น การใช้เมาส์คลิก หรือ การกรอกข้อความในฟอร์ม เป็นต้น
Dynamic HTML (DHTML) คืออะไร

เป็นเทคนิคที่ช่วยเพิ่มความสามารถให้ Browser สามารถทำการโต้ตอบการผู้ใช้งานเองได้ โดยไม่ต้องจำเป็นต้องไปขอข้อมูลจาก Web Server ทุกครั้งไป เป็นตัวเลือกที่จะให้ผู้ใช้สร้างเว็บเพจให้มีภาพเคลื่อนไหวมากขึ้นและตอบสนองผู้ใช้แบบ Interactive มากกว่า HTML เวอร์ชันก่อน ส่วนใหญ่ของ Dynamic HTML ได้รับการระบุใน HTML 4.0 ตัวอย่างของเพจ Dynamic HTML
สีตัวอักษรของหัวข้อเปลี่ยนเมื่อเมาส์เคลื่อนผ่าน
ยินยอมให้ผู้ใช้ในการ drag and drop ภาพไปยังที่อื่นบนเว็บเพจ Dynamic HTML ยอมให้เอกสารสามารถดูและทำงาน เหมือนโปรแกรมประยุกต์บน desk top หรือมัลติมีเดีย

ซึ่งวิธีการสร้างเป็นแบบ DHTML จะเป็นการใช้ เทคโนโลยีของ JavaScript และ Cascading Style Sheets เหล่านี้ช่วยในการกำหนดค่าต่างๆ ของความสูง ความกว้าง หรือตำแหน่งของส่วนต่างๆ ซึ่งอยู่บนเว็บเพจ หรืออาจจะเป็นการรับข้อมูล User Interface ได้ด้วย JavaScript ก็เป็นได้
กุญแจสำคัญที่ทำให้ JavaScript Accessible
ถ้าเป็นไปได้ไม่ควรใช้ JavaScript เพราะเป็นการทำงานทางฝั่ง Client ควรเลือกใช้ Script ที่ทำงานทางฝั่ง Server จะดีกว่า
จัดเตรียมข้อมูลที่มีความหมายเหมือนกับ การใช้ JavaScript ไว้ในส่วนของ<noscript> เพื่อแสดงในกรณีที่ Browser ไม่สนับสนุน JavaScript
อย่าเขียน JavaScript ที่รับ Input จาก Mouse ได้เพียงอย่างเดียว ควรเพิ่มฟังก์ชันการรับ Input จาก Keyboard ด้วย
อย่าเขียน JavaScript ให้มีการ Redirect
หากมีการสร้าง Link ด้วย JavaScript ให้เพิ่มชื่อ URL จริงของ link ที่สร้างด้วย ตัวอย่าง <a href="http://www.nectec.or.th/atc" onClick="javascript(this)">)
หลีกเลี่ยงการสร้าง Popup Windows
แจ้งเตือนผู้ใช้ล่วงหน้าก่อนจะเปิด Windows ใหม่
ให้ระวังการเปลี่ยนตำแหน่งโฟกัสของ Object ต่างๆ โดยที่ผู้ใช้ไม่ได้เป็นผู้เปลี่ยนเอง

JavaScript ก็เหมือนภาษาที่ใช้เขียนโปรแกรมทั่วไป ตรงที่มีตัวแปรสำหรับเก็บค่า จากส่วนหนึ่งของ Program แล้วก็เอาไปใช้ในส่วนอื่นๆได้ ตัวแปรก็คือ ชื่อที่เรากำหนดขึ้นมาสำหรับเก็บค่า อย่างเช่น เราอาจกำหนดตัวแปรชื่อว่า imageName เพื่อไปเก็บชื่อไฟล์ภาพๆหนึ่ง หรือ อาจกำหนดให้ amount ไปเก็บจำนวนเต็ม เป็นต้น


การตั้งชื่อตัวแปร

ชื่อของตัวแปรใน JavaScript สามารถขึ้นต้นด้วยตัวอักษรใหญ่ A-Z ตัวอักษรเล็ก(a-z) และ เครื่องหมาย _ ตามด้วย ตัวอักษร ตัวเลข หรือ เครื่องหมาย _ ก็ได้ ตัวอย่างชื่อตัวแปรที่ถูกต้อง

orderNumber2
_456
SUM
Image32
Amount_Click


ข้อควรจำ ชื่อตัวแปรใน JavaScript จะเข้มงวดในการใช้ตัวอักษรใหญ่หรือเล็กด้วย(case sensitive) เช่น Sum SUM sum จะถือว่าไม่เป็นตัวแปรเดียวกันนะ
ชนิดของตัวแแปร

สิ่งที่ต่างจาก Java และ ภาษาบางภาษาคือ ผู้ใช้ภาษา JavaScript ไม่จำเป็นต้องกำหนดชนิดของตัวแปร ชึ่ง JavaScript จะสามารถรู้ได้เองว่า ในการนำตัวแปรไปใช้นั้น คุณต้องการให้มันเป็นตัวแปรชนิดไหน เช่นถ้าผมกำหนด ให้ตัวแปร Ahha มีค่าเป็น 1 ตัวแปร Ahha อาจจะให้ค่าเป็น True ได้ ถ้าคุณใช้มันไปในทางตรรก หรืออาจจะเป็น 1.0000 ก็ได้ แต่ความสามารถแบบนี้ก็เปรียบเสมือนดาบ 2 คม ในแง่หนึ่ง คุณสามารถใช้ตัวแปรได้อย่างอิสระ เพราะไม่มีข้อจำกัดในด้านชนิดตัวแปร และในอีกแง่หนึง คุณต้องจำได้ว่า ตัวแปรของคุณจะเป็นชนิดไหนในแต่ละขั้นตอนของการคำนวน

JavaScript สนับสนุนการใช้ตัวแปรเก็บค่าข้อมูล 4 ชนิดคือ


Integer คือเลขจำนวนเต็ม
Floating-point numbers คือเลขจำนวนจริง
Logic or boolean values คือตรรก(มีค่าแค่ถูกกับผิด)
String คือข้อความ
ตัวแปรชนิดตัวเลข : Integer and Floating-Point

ในการทำงานกับตัวเลข JavaScript สามารถสนับสนุนได้ทั้ง Integer และ Float โดยทั้ง 2 ชนิด สามารถ แปลงไปหากันได้โดยอัตโนมัติ

ตัวแปร Integer ใน JavaScript จะอยู่ในรูปของเลขฐานได้ 3 ฐาน คือ 10 ,8 และ 16

ฐาน 10 โดยปกติแล้วตัวเลขที่ใช้ใน JavaScript จะเป็นเลขฐาน 10 อยู่แล้ว ฐาน 8 จะมีเลขโดดอยู่แค่ 8 ตัว คือ 0-7 การเขียนเลขฐาน 8 จะใช้ 0 นำหน้า ฐาน 16 จะมีเลขโดดอยู่ 16 ตัว คือ 0-9 และใช้ A-F แทน 10 - 15 การเขียนเลขฐาน 16 จะใช้ 0x นำหน้า

ส่วน Float จะใช้กับ เลขทศนิยมหรือ เลขที่มีค่ามากๆและน้อยมากๆจนต้องเขียนในรูปของเลขยกกำลัง เช่น
-4.2132
55.
12e2 (อ่านว่า 12 คูณ 10 ยกกำลัง 2)
1e-1 (อ่านว่า 1 คูณ 10 ยกกำลัง -1)
.5
-4e-4
ตัวแปรชนิดตรรก : Logical Values



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




WYSWYG

Dreamweaver 

คือโปรแกรมหรือเครื่องมือ ที่ใช้ในการพัฒนาเว็บไซด์ระดับมืออาชีพ มีความสามารถในการใช้สร้าง ออกแบบ เขียนโค้ด เว็บเพ็จ บริหารจัดการเว็บไซต์ และเว็บแอพพลิเคชั่น ได้อย่างมีประสิทธิภาพ ช่วยลดงาน ลดเวลาในการพัฒนาเว็บเพ็จ โดยสามารถสร้างโค้ดได้หลายภาษา เช่น HTML, PHP, ASP, JSP ฯ และสามารถติดต่อกับฐานข้อมูลได้หลายฐานข้อมูล เช่น MySQL, PostgreSQL, MS Access, MS SQL Server ฯ โดยที่ผู้ออกแบบเว็บเพ็จ ไม่จำเป็นต้องมีความความรู้ด้านภาษาและการจัดการฐานข้อมูล หรือมีความรู้เพียงเล็กน้อยก็สามารถสร้างเว็บเพ็จได้อย่างรวดเร็ว
การสร้างเว็บเพ็จด้วย Dreamweaver เครื่องคอมพิวเตอร์ต้องมีโปรแกรมเหล่านี้เป็นอย่างน้อย
1. Operating System (OS) เช่น Windows, Linux (SQL Database Server)
2. Web Server คือ Apache
3. PHP
4. Dreamweaver MX

Video on Website
Video Sharing Web Sites คือเว็บไซต์ที่มีลักษณะเปิดให้ใครก็ได้นำคลิปวิดีโอที่ตนมีอยู่ไปฝากไว้ และสามารถนำฟังก์ชันต่างๆ ที่เว็บสร้างขึ้นมาไปช่วยในการเผยแพร่คลิปนั้นๆ

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

CMS
๋Joomla

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

การสร้างเว็บไซต์จากอดีตจนถึงปัจจุบัน มีวิวัฒนาการที่เปลี่ยนแปลงไปในทุก ๆ วัน เริ่มจากการใช้ภาษาในการเขียนเว็บไม่กี่ภาษา มาเป็นใช้ภาษาหลาย ๆ ภาษาร่วมกัน ไม่ว่าจะเป็นภาษา HTML, DHTML, PHP, ASP ฯลฯ นอกจากนี้หากต้องการให้เว็บไซต์ของเรามีความสวยงามก็จะต้องมีความรู้ทางด้านกราฟฟิกส์อีกด้วย ไม่ว่าจะเป็นการตัดต่อ ย่อ ขยาย รูปภาพ สร้างภาพที่เป็น GIF Animation หรือจะให้ดูนุ่มนวลก็จะต้องมีความรู้เกี่ยวกับการสร้าง Flash ด้วยความหลายกหลายที่จำเป็นจำต้องมีในเว็บไซต์นั้น การที่จะสร้างเว็บส่วนตัว หรือองค์กรให้สวยงามและมีประสิทธิภาพ ด้วยคนเพียงคนเดียวนั้นอาจต้องใช้เวลานานมาก ด้วยเหตุนี้ปัจจุบันจึงมีกลุ่มคนที่รวมตัวกัน และร่วมกันพัฒนา ต้องขอใช้คำว่า "เว็บไซต์กึ่งสำเร็จรูป" ขึ้นมา เพื่อเป็นการลดภาระการทำงานหลาย ๆ ด้าน ให้มีความง่าย และสะดวกมากยิ่งขึ้น โดยให้ความหมายกับสิ่งที่พวกเขาได้พัฒนาขึ้นว่า CMS


๋Joomlaเป็น CMS ตัวหนึ่งในหลาย ๆ ตัวที่ได้รับความนิยมในปัจจุบัน สำหรับคุณที่ยังไม่รู้จักว่า CMS คืออะไร ขออธิบายสั้น ๆ เพิ่มเติมดังนี้ครับ CMS นั้นเป็นอักษรย่อของ คำว่า "Content Management System" ซึ่งเมื่อแปลเป็นภาษาไทย หมายถึง ระบบบริหารจัดการเนื้อหาของเว็บไซต์ นั่นหมายความว่า สิ่งที่เราจะต้องดูแลก็คือเนื้อหาของเว็บไซต์ เช่น การเพิ่มบทความ การเพิ่มรูปภาพ หรือการปรับแต่งโยกย้ายโมดูลต่าง ๆ ไม่จำเป็นจะต้องมานั่งเขียน Code ด้วยภาษา HTML, PHP, SQL เพียงแต่เรียนรู้วิธีการติดตั้ง การปรับแต่ง การใช้งาน CMS เท่านั้น สำหรับ Code ต่าง ๆ ที่นำมาสร้าง และ ออกแบบเว็บไซต์ จะทำโดยทีมงานของผู้พัฒนา CMS ของแต่ละทีม ซึ่งทำให้ประหยัดเวลาในการสร้าง และออกแบบเว็บไซต์ ได้อย่างมาก

๋Joomlaเป็น CMS ที่ได้รับความนิยมเป็นอันดับต้น ๆ เพราะมีระบบการจัดการเนื้อหาที่มีรูปแบบสากล การปรับแต่งหน้าตาของเว็บไซต์ทำได้ง่าย เพราะ ๋Joomlaถูกออกแบบมาให้รองรับกับเทคโนโลยีการ ออกแบบเว็บไซต์ สมัยใหม่ ไม่ว่าจะเป็นการรองรับ Flash หรือ GIF Animation นอกจากนี้คุณยังสามารถ Download templateได้อย่างมากมายมีทั้งแบบที่สามารถนำมาใช้งานได้ฟรี (โดยให้เครดิตผู้สร้างนิดหน่อย เช่น ไม่ลบชื่อทีมพัฒนา templateนั้นออกจาก templateเป็นต้น) หรือหากต้องการ templateที่มีประสิทธิภาพ และมีความสวยงาม ก็สามารถหาซื้อมาใช้ได้ เพราะมีเว็บไซต์ที่ให้บริการจัดทำ templateของ Joomlaอยู่มากมาย จุดเด่นของ Joomlaอีกจุดหนึ่งก็คือมี Extension จำนวนมากให้เราสามารถนำมาประยุกต์ใช้งาน เช่น component, module, Plugin มีทั้งแบบฟรี และแบบต้องชำระเงิน สำหรับเว็บไซต์อย่างเป็นทางการของ Joomlaคือ http://www.joomla.org เป็นศูนย์รวมข่าวสารการ Update Joomlaและคุณสามารถ download Joomlaและ extension ต่าง ๆ ได้จากที่นี่


Joomlaมีการ Update อย่างสม่ำเสมอ ทำให้เรามั่นใจได้ว่าการ ออกแบบเว็บไซต์ ด้วย CMS Joomlaจะมีความปลอดภัย ซึ่งปัจจุบัน (ตุลาคม 2553) เป็นรุ่น 1.5.21 และที่สำคัญที่สุด Joomlaรองรับภาษาไทย 100% เพราะมีทีมงานที่คอยดูแลเรื่องภาษา ทำให้เราไม่ต้องมากังวลกับการใช้งานภาษาไทยว่าจะผิดเพี้ยนในส่วนใดหรือไม่ และในขณะนี้ Team ผู้พัฒนา Joomlaกำลังร่วมกันพัฒนา Joomlaรุ่นใหม่ คือ Joomlaซึ่งในขณะนี้ก็ใกล้จะได้ใช้งานกันในเวลาอันใกล้นี้คือ Joomla 1.6.4 Released สำหรับในเวอร์ชั่น 1.5 ก็ยังคงพัฒนาเพิ่มเติมมาจนถึง 1.5.23 หากท่านใดใช้เวอร์ชั่นเก่าอยู่ก็แนะนำให้ upgrade ให้ทันสมัยอยู่เสมอนะครับ ทั้งนี้เพื่อประสิทธิภาพ และความปลอดภัยของเว็บไซต์ของท่านเอง



สิ่งที่ควรพิจารณาเป็นอันดับต้น ๆ สำหรับการใช้งาน joomla
สำหรับผู้เริ่มต้นใช้งาน joomla แล้วเกิดปัญหานั้นส่วนใหญ่ ไม่ได้มาจากตัวของ joomla แต่มักจะมีปัญหากับ PHP, MySql, เวอร์ชั่นเก่า ทำให้เกิดปัญหาได้ สำหรับการตรวจเช็คนั้นไม่ยากเลย เพราะในตอนที่ดำเนินการติดตั้งนั้น จะมีหน้าเว็บเพจที่ตรวจสอบว่าสามารถติดตั้ง หรือรองรับได้หรือไม่ หากไม่รองรับให้หาตัวใหม่มาลง เพราะฉะนั้นตอนติดตั้งมักไม่ค่อยเกิดปัญหา แต่จะเกิดปัญหาตอนที่เราติดตั้งตัวเสริมต่าง ๆ (Extension) ซึ่งบางตัวถึงขั้นไม่สามารถใช้งานได้เลย เพราะติดตั้งไปก็จะ error หรือติดตั้งผ่าน แต่พอใช้งานจริงก็จะมีปัญหา สำหรับคุณที่ต้องการติดตั้งบนโฮสติ้ง ก่อนจะใช้บริการก็ควรเช็ครายละเอียดของโฮสติ้งให้ดีว่า PHP, MySql นั้นเวอร์ชั่นใหม่หรือไม่ จะได้เกิดปัญหาน้อยลง

Web brower
คือโปรแกรมที่ใช้สำหรับเป็นประตูเปิดเข้าสู่โลก WWW (World Wide Web) หรือพูดกันอย่างง่ายก็คือโปรแกรมที่ใช้สำหรับเล่นอินเทอร์เน็ต ที่เรานิยมใช้กันอยู่ทุกวันนี้โดยเว็บเบราว์เซอร ์ (Web Browser) จะเข้าใจในภาษาHTML นี้คือเหตุผลว่าทำไมต้องใช้ภาษา HTML ในการสร้างเว็บเพจ เพราะโปรแกรมเว็บเบราว์เซอร์นั่นสามารถเข้าใจ และสามารถทำงานตามคำสั่งของภาษา HTMLได้
ฉะนั้นเมื่อนักเรียนเขียนเว็บเพจด้วยภาษา HTMLนักเรียนจะทราบว่าผลลัพธ์ของคำสั่งต่าง ๆ นั่นทำงานถูกต้องหรือไม่อย่างไร ต้องใช้โปรแกรมเว็บเบราว์เซอร์เปิดดู ซึ่งโปรแกรมเว็บเบราว์เซอร์ที่นิยมใช้ ในปัจจุบัน มีหลายโปรแกรม เช่น โปรแกรม Firefox , โปรแกรม Internet Explorer หรือโปรแกรม NetscapeComunicator แต่ส่วนมากนิยมใช้ โปรแกรม InternetExplorer หรือเรียกย่อ ๆ ว่า IE เพราะเป็นโปรแกรมที่มีมาพร้อมกับการติดตั้งระบบปฏิบันการวินโดวส์อยู่แล้ว ไม่ ต้องไปหาโปรแกรมเพิ่มเติม

FTP



FTP คืออะไร แล้วจะใช้งานอย่างไร
FTP เป็นโปรแกรมที่ใช้สำหรับ upload/download หรือดูโครงสร้างของไฟล์และ directory ใน Server FTP (File Transfer Protocol) เป็นมาตรฐานในการถ่ายโอนไฟล์ และเป็นส่วนหนึ่งของชุดโปรโตคอล TCP/IP มีประโยชน์มากสำหรับการรับส่งไฟล์ระหว่างเครื่องคอมพิวเตอร์ที่เป็นเครื่องลูก (FTP Client) กับเครื่องที่เป็นเครื่องให้บริการ (FTP Server) โดยเครื่องFTP Client อาจจะเป็นเครื่องคอมพิวเตอร์ที่เราใช้งานกันทั่วไป ส่วนเครื่อง FTP Server ก็อาจจะเป็นเครื่อง PC ธรรมดาจนถึงเครื่องที่มีสมรรถภาพสูง

FTP (File Transfer Protocol) เป็นระบบโอนย้ายไฟล์ข้ามระบบเครื่องคอมพิวเตอร์ที่มีความปลอดภัยพอสมควร โดยใช้โปรโตคอล TCP เป็นกลไกขนส่งข้อมูล การเข้าใช้งานผู้ใช้จะต้องแนะนำตนเองต่อเซิร์ฟเวอร์ด้วยชื่อผู้ใช้และรหัสผ่าน จากนั้นจะแสดงชื่อโฟล์เดอร์และชื่อไฟล์ที่มีอยู่ออกมา ความสามารถของ FTP ทำให้ไคลเอนต์โอนย้ายไฟล์ ระหว่างไคลเอนต์ และ FTP Server ได้ รวมทั้งระหว่างเครื่องสองเครื่องที่อยู่ห่างไกลกัน

FTP เป็นโปรโตคอลที่ยุ่งยากพอสมควร เพราะต้องสร้างช่องทางสื่อสารในระดับ TCP ถึงสองช่องทาง โดยช่องหนึ่งสำหรับโอนถ่ายข้อมูลและอีกหนึ่งใช้ส่งคำสั่ง เซิร์ฟเวอร์จะต้องมีตัวแปลโปรโตคอล (PI: Protocol Interpreter) สำหรับทำหน้าที่แปลและดำเนินงานตามคำสั่งของ FTP นอกจากนี้ยังต้องมีโมดูล โดนย้ายข้อมูลที่เรียกว่า DT (Data Transfer ) มารับผิดชอบจัดการกับข้อมูล ทั้ง PI ได้ โดยเรียกใช้ Telnet หรือไม่ก็จัดการโปรโตคอล Telnet หรือไม่ก็จัดการโปรโตคอล Telnet ใหม่ทั้งหมดเอง คำสั่งของ FTP

FTP (File Transfer Protocal) คือ มาตรฐานที่กำหนดใช้เพื่อการถ่ายโอนข้อมูลหรือการ Upload / Download ข้อมูลบน Internet ครับ โดยเราจะใช้โปรแกรมที่เรียกว่า FTP Client มาช่วยในการ Upload / Download ข้อมูลไปเก็บไว้ที่ Server เช่น โปรแกรม CuteFTP, WS_FTP ฯลฯ

FTP (File Transfer Protocol) คือการถ่ายโอนไฟล์ หรือเรียกได้อีกอย่างว่า การคัดลอกแฟ้มข้อมูลบนเครือข่าย คือ การโอนย้ายแฟ้มข้อมูลจากเครื่องคอมพิวเตอร์ระบบหนึ่งมายังอีกระบบหนึ่งผ่านเครือข่าย ซึ่งทำได้หลายรูปแบบ เช่น การโอนจากแม่ข่ายมายังเครื่องพีซี หรือเครื่องพีซีไปแม่ข่ายหรือระหว่างแม่ข่ายด้วยกันเอง การถ่ายโอนแฟ้มข้อมูลหรือการโอนย้ายแฟ้มข้อมูลอาศัยโปรแกรมหนึ่งที่มีการใช้งานกันมากและมีบริการอยู่ในโฮสต์แทบทุกเครื่อง คือ โปรแกรม FTP

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

วิธีการทำงานของ FTP
Ftp ทำงานในแบบไคลเอนต์เซิร์ฟเวอร์ โดยพัฒนาขึ้นตามโปรโตคอลพื้นฐาน TCP ซึ่งจะต้องมีการติดต่อเพื่อจองช่องสื่อสาร (Connection Establishment) ก่อนทำการสื่อสารจริง ซึ่งเรียกว่าเป็นการติดต่อแบบที่ต้องขอเชื่อมต่อก่อน (Connection - Oriented) ในการใช้งาน FTP เพื่อเริ่มการติดต่อสื่อสารนั้น จะต้องระบุหมายเลข IP ปลายทาง และต้องผ่านการแจ้งรหัส Login และ Password ของเซิร์ฟเวอร์ที่จะติดต่อก่อนจึงจะเข้าใช้งานได้
ข้อมูลของ FTP ที่สื่อสารระหว่างกันมี 2 ประเภทคือ


• ข้อมูล(Data) หมายถึงข้อมูลต่างๆที่ต้องการรับส่ง รวมทั้งไฟล์ที่รับมาจากเซิร์ฟเวอร์ หรือส่งมาจาก ไคลเอนต์แล้วไปเก็บที่เซิร์ฟเวอร์
• ข้อมูลคำสั่ง (Command) FTP จะมีคำสั่งที่ใช้สั่งงานต่างๆ เช่น dir เป็นคำสั่งที่ใช้แสดงชื่อไฟล์หรือไดเรคทอรีในเครื่องเซิร์ฟเวอร์

หรือ get ใช้โหลดไฟล์มาที่เครื่องไคลเอนต์ผ่านโปรแกรม FTP แล้วโปรแกรมจะส่งคำสั่งไปยังเซิร์ฟเวอร์เพื่อทำงาน และแจ้งผลการทำงานกลับมายังไคลเอนต์ ซึ่งผลการทำงานนี้จะนำหน้าด้วยตัวเลข 3 หลัก เป็นรหัสที่ใช้แสดงสถานะการทำงานภายในของ FTP และต่อด้วยข้อความที่เป็นเท็กซ์ต่อท้าย ซึ่งก็คือผลการทำงานหรือคำอธิบายต่างๆ โดยที่ FTP มีกระบวนการภายในที่จะตรวจสอบได้ว่าข้อมูลที่จะรับส่งนี้เป็นประเภทคำสั่งไม่ใช่ตัวข้อมูลที่ต้องการจะโอนย้าย การที่ FTP สามารถแยกแยะข้อมูลจริงออกจากข้อมูลที่เป็นคำสั่งได้นั้น ถือว่าเป็นหน้าที่การทำงานของโมดูลใน FTP ที่เรียกว่าโปรโตคอล (Protocol Interpreter Module หรือ PI) ซึ่งทำหน้าที่รองรับการทำงานคำสั่งต่างๆของ FTP และในส่วนของข้อมูลที่รับส่งนั้นจะเป็นหน้าที่ของโมดูลโอนข้อมูล (Data Transfer หรือ DT) ซึ่งโมดูลทั้งสองนี้จะต้องทำงานอยู่ทั้งในเครื่องที่เป็นเซิร์ฟเวอร์ และไคลเอ็นต์


ส่วน Shareware หมายถึง ซอฟต์แวร์ที่ผู้ผลิตแจกให้ลองไปใช้ดูก่อน และเมื่อใช้แล้วพอใจจะนำไปใช้จริงก็ค่อยส่งเงินมาชำระทีหลัง ถ้าไม่นำไปใช้จริงก็ไม่ต้องส่งเงินมาชำระ
ผู้ผลิต Freeware และ ผู้ผลิต Shareware จะทำการส่งซอฟต์แวร์ของตนเองที่ต้องการแจกจ่ายไปไว้ที่คอมพิวเตอร์ที่เป็น ftp server และใครก็ตามที่สนใจจะลองนำไปซอฟต์แวร์ของผู้ผลิตไปใช้ดูก็ให้ไปทำการ download จากคอมพิวเตอร์ที่เป็น ftp server เครื่องนั้นมายังเครื่องคอมพิวเตอร์ของตนเอง ในบางกรณีถ้าท่านมีข้อมูลที่น่าสนใจและต้องการเผยแพร่ ท่านก็สามารถส่งข้อมูลนั้นไปไว้ที่ ftp server ได้ ตัวอย่าง ftp server เช่น ftp.chula.ac.th

วันอังคารที่ 7 กุมภาพันธ์ พ.ศ. 2555

วิทยาลัยเทคโนโลยีสยามเปิดรับ นศ.ใหม่






วิทยาลัยเทคโนโลยีสยาม” ประกาศ รับสมัครนักศึกษาใหม่ ประจำภาคเรียนที่ 2/54 ระดับ ป.ตรี หลักสูตร 4 ปีและ 4 ปีเทียบโอน คณะเทคโนโลยี ศิลปะศาสตร์ รัฐศาสตร์ บริหารธุรกิจและคณะบัญชี ภาคปกติ ภาคค่ำและภาคพิเศษวันอาทิตย์ ด้านหลักสูตร ป.โท ซึ่งถือเป็นหลักสูตรแรกและหลักสูตรเดียวในประเทศ มี 4 หลักสูตร คือ ศึกษาศาสตรมหาบัณฑิต บริหารธุรกิจมหาบัณฑิตMBA รัฐประศาสนศาสตรมหาบัณฑิต หลักสูตรวิทยาศาสตรมหาบัณฑิต ด่วน!เปิดรับสมัครตั้งแต่บัดนี้ถึง 30 ตุลาคม 2554 ย้ำมีทุนสนับสนุน ทั้งประเภทเรียนดี ความสามารถพิเศษและทำคุณประโยชน์ให้กับสถาบัน

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

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

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

คุณสมบัติของผู้มีสิทธิสมัครเข้าศึกษาในระดับมหาบัณฑิต 1.มีคุณสมบัติครบถ้วนตามข้อบังคับวิทยาลัยเทคโนโลยีสยามว่า ด้วยการศึกษาขั้นปริญญามหาบัณฑิต 2.สำเร็จการศึกษาในระดับปริญญาตรีทางการศึกษา (หลักสูตร M.ed.) หรือสาขาอื่นที่เกี่ยวข้อง โดยได้รับคะแนนเฉลี่ยสะสมในระดับไม่ต่ำกว่า 2.50 หน่อ 3.สำเร็จการศึกษาในระดับปริญญาตรีสาขาอื่น โดยได้รับคะแนนเฉลี่ยสะสมในระดับไม่ต่ำกว่า 2.50 และมีประสบการณ์ด้านการบริหารการศึกษา หรือด้านอื่น ๆ ที่เกี่ยวข้องกับการศึกษาหรือด้านการบริหารธุรกิจหรือด้านอื่น ๆ ที่เกี่ยวข้อง 4.สำหรับผู้สมัครที่มีคุณสมบัติอื่น ๆ ที่เกี่ยวข้องนอกเหนือจากข้อ 2-3 ให้อยู่ในดุลพินิจของคณะกรรมการบัณฑิตวิทยาลัย วิทยาลัยเทคโนโลยีสยาม 5.สำหรับผู้ที่ต้องการเทียบโอนจากสถาบันอื่น หรือเทียบโอนความรู้และประสบการณ์ ให้เป็นไปตาม “ระเบียบวิทยาลัยเทคโนโลยีสยามว่าด้วยเกณฑ์การเทียบโอนผลการเรียนระดับปริญญาเข้าสู่การศึกษาในระบบ พ.ศ.2552”


ใน เรื่องของโครงการสนับสนุนทุนการศึกษา ประจำปีการศึกษา 2555 สำหรับนักศึกษาระดับชั้นมัธยมศึกษาปีที่ 6 และระดับอาชีวศึกษา ปวช.3/ ปวส.2 วิทยาลัยเทคโนโลยีสยาม กำหนดนโยบายส่งเสริมสนับสนุนการศึกษา ระดับอุดมศึกษาของชาติ และได้เริ่มให้ทุนการศึกษาแก่นักศึกษาที่ผ่านการคัดเลือกและวิทยาลัยรับเข้า ศึกษาต่อในหลักสูตร สาขาวิชาต่าง ๆ ของวิทยาลัย ตั้งแต่ปีการศึกษา 2549 ซึ่งเป็นปีที่เริ่มก่อตั้งวิทยาลัยเป็นต้นมาจนถึงปัจจุบัน โดยนโยบายดังกล่าวเป็นการเพิ่มโอกาสทางการศึกษาให้นักศึกษาของวิทยาลัยมี ความรู้ความสามารถทั้งภาคทฤษฎีและภาคปฏิบัติ และได้รับคุณวุฒิสูงขึ้น เพื่อรองรับความต้องการของสังคม และเป็นกลจักรแห่งความรู้สู่ทักษะอาชีพครบวงจร สามารถประกอบอาชีพได้ทันทีที่สำเร็จการศึกษา อันจะเป็นประโยชน์ต่อผู้สำเร็จการศึกษาของวิทยาลัยและต่อการพัฒนาสังคมและ ประเทศชาติต่อไป

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

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


วิทยาลัยเทคโนโลยีสยาม เปิดรับสมัครนักศึกษาใหม่ ประจำภาคเรียนที่ 2/2554 ตั้งแต่บัดนี้ถึงวันที่ 30 ตุลาคม 2554 เปิดภาคเรียนรอบปกติและรอบค่ำ วันอังคารที่ 1 พฤศจิกายน 2554 เปิดภาคเรียนรอบวันอาทิตย์ วันอาทิตย์ที่ 6 พฤศจิกายน 2554 ต่อสอบสอบถามรายละเอียดเพิ่มเติมได้ที่ วิทยาลัยเทคโนโลยีสยาม เลขที่ 46 ถนนจรัญสนิทวงศ์ เขตบางกอกใหญ่ กรุงเทพมหานคร 10600 โทร.0 2878 5000-3 www.siamtechu.net

วันอาทิตย์ที่ 2 ตุลาคม พ.ศ. 2554




Tablet Newspaper 1994 <<< คลิก >>>

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


ความสำคัญของ Tablet Newspaper คือ เปรียบเสมือนข่าวสารบ้านเมืองที่เราควรรู้ ควร ทันต่อโลกความสำคัญของหนังสือพิมพ์ธรรมมาดาก้อสำคัญเช่นกัน แต่ความสำคัญแตกต่างกัน



2. การใช้งานTablet Newspaperมีความเหมาะสมหรือไม่
จะว่าไปแล้ว Tablet Newspaper หรือหนังสือพิมพ์อิเล็กทรอนิกส์ ก็มีความเหมาะสมในการใช้งานเพื่อการศึกษาถึงข่าวสารบ้านเมือง มีความเหมาะสมอย่างยิ่งในการใช้งานทางด้านข่าวสารมีความสะดวกในการใช้งาน ในการพกพา แต่ถ้าคิดในแง่หนึ่ง อุปกรณ์นี้ไม่ใช่อุปกรณืชนิดเดียวที่เหมาะสมแต่เป็นเพียงอุปกณณ์ชนิดหนึ่งที่ให้ความสะดวกเท่านั้น


3. ข้อดีและข้อเสีย ของ Tablet Newspaper

ข้อดี

· เราจะสามารถใช้ Tablet โต้ตอบกับข้อมูลข่าวสารได้

· Tablet สามารถดูข้อมูลข่าวสารได้ ทางเสียง

· Tablet สามารถ ดูในแบบ วีดีโอได้

· Tablet สามารถพกพาได้สะดวกยิ่งขึ้น

· Tablet สามารถขยายดูรูปภาพเล็ก ๆ ได้อย่างชัดเจน

· ข่าวสารใน Tablet สามารถสั่งซื้อหรือดูได้ดีกว่า หนังสือพิมพ์ธรรมดา

ข้อเสีย

· Tablet ทำให้หนังสือพิมพ์ลดการใช้ได้น้อยลง

· ราคาแพง

· บางทีข้อมูลอาจจะผิดพลาดได้



4. ท่านคิดว่า Tablet Newspaper จะมาแทนหนังสือพิมพ์ทั่วไปหรือไม่ จงแสดงความเห็น

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

งานวิจัย





Direct X


Direct X คือ โปรแกรมที่ทำหน้าที่ติดต่อกัีบ อุปกรณ์โดยตรงโดยไม่ต้องผ่านระบบปฏิบัติการ ทำให้สามารถเข้าถึงคุณสมบัติืต่าง ๆ ของ hardware ได้โดยตรง ไม่ต้องผ่านระบบปฏิบัติการ ทำให้เข้าถึงคุณสมบัติต่าง ๆ ของ hard ware เช่น ภาพ เสียง และมีความสามารถในการวอเคราะห์ความสามารถของ hrad ware เพื่่อปรัีบแต่งค่าต่าง ๆ ของ โปรแกรมให้เหมาะสมหรือชดเชยการทำงานที่เครื่องไม่สนับสนุน
ทำให้โปรแกรม Multimedia หรือเกมส์ที่ติดต่อผ่าน DirectX ใช้ความสามารถด้านฮาร์ดแวร์ของระบบได้อย่างเต็มประสิทธิภาพ และยังสามารถทำงานบนเครื่องคอมพิวเตอร์ที่มีระบบ Hardware ที่แตกต่างกันได้


FTP



File Transfer Protocol (FTP)
FTP (File Transfer Protocol) เป็นโปรโตคอลมาตรฐานในอินเตอร์เน็ต ซึ่งเป็นวิธีที่ง่ายที่สุดในการแลกเปลี่ยนไฟล์ ระหว่างคอมพิวเตอร์บนอินเตอร์เน็ต คล้ายกับ Hypertext Transfer Protocol (HTTP) ที่ใช้ในการส่งเว็บเพ็จและไฟล์ที่เกี่ยวข้อง และ Simple Mail Transfer Protocol (SMPT) ที่ใช้ส่งผ่าน e-mail ซึ่ง FTP เป็นโปรโตคอลประยุกต์ที่ใช้โปรโตคอล TCP/IP โดย FTP ใช้ในการส่งไฟล์เว็บเพจจากแหล่งที่เก็บไปยังเครื่องคอมพิวเตอร์ โดยแสดงฐานะเป็นเครื่องแม่ข่าย สำหรับทุกคนบนอินเตอร์เน็ต และนิยมใช้ในการ download โปรแกรมและไฟล์มายังเครื่องคอมพิวเตอร์จากเครื่องแม่ข่ายอื่น
การใช้ FTP สามารถใช้คำสั่งติดต่อแบบ command line (เช่นเดียวกับคำสั่งของ MS_DOS) web browser สามารถสร้างคำขอ FTP เพื่อ download โปรแกรมที่เลือกจากเว็บเพจนอกจากนี้ FTP สามารถใช้ปรับปรุงไฟล์บนเครื่องแม่ข่าย โดยต้อง logon ไปที่ FTP server การสนับสนุน FTP โดยพื้นฐานในฐานะที่เป็นส่วนหนึ่งโปรแกรมที่มากับ TCP/IP อย่างไรก็ตามโปรแกรม FTP แบบ client ที่มีการติดต่อแบบ GUI ต้อง download จากบริษัทที่ผลิต




่java applets

java applets คือภาษาที่ใช้ในการเขียนเพื่อตกแต่ง Web อีกภาษาหนึ่ง ซึ่งเป็นที่นิยมในปัจจุบัน เป็นตัวเสริมทำให้เวปเพจมีความน่าสนใจมากยิ่งขึ้น โดยใช้เทคนิกที่ภาษา HTML ไม่สามารถทำได้โปรแกรมที่เขียนโดยบนภาษา JAVA ทำงานในเว็บ browser ส่วนใหญ่จะมีความซับซ้อนไม่สามารถเขียนโดยภาษาสคริปได้เช่น โปรแกรมอัพโหลดรูปภาพ ของ facebook เป็นต้น ซึ่งโปรแกรมสามารถใช้ทรัพยากรเครื่องได้อย่างมากมายดังนั้นควรระวังมัลแวร์หรือไวรัส โดยสังเกตจากผู้ผลิตตอนอนุญาตให้รัน Java Applets คือโปรแกรมในภาษาจาวาที่ถูกกำหนดให้ใช้งานได้บนเว็บเพจโดยแสดงผลผ่าน Web browser มีลักษณะเป็นพื้นที่รูปสี่เหลี่ยมที่มีองค์ประกอบภายในเป็นภาพกราฟิกส์ เป็นปุ่ม หรือกล่องข้อความ ภาพเคลื่อนไหวหรือเสียง โดยสามารถตอบสนองเหตุการณ์ต่างๆและสามารถมีปฏิสัมพันธ์กับผู้ใช้
ในการสร้าง Java Applet ให้ทำงานได้จะต้องมีไฟล์ 2 ไฟล์คือ ไฟล์ .java ซึ่งเป็นโปรแกรมในภาษาจาวาโดยจะถูก compile เป็นไฟล์ .class ก่อนนำไปใช้งาน อีกไฟล์หนึ่งคือไฟล์ .html ใช้เรียก applet ให้ทำงานด้วยประโยค applet เช่น ซึ่งจะเรียก MouseAddImage.class มาทำงานโดยแสดงผลบนพื้นที่ขนาด 950x400 โดยที่ browser จะเป็นผู้โหลดไฟล์ .html มาจากคอมพิวเตอร์ส่วนตัว หรือจากคอมพิวเตอร์แม่ข่าย(Server)เมื่อไฟล์ .html ทำงานถึงประโยค โปรแกรม MouseAddImage.class ก็จะถูกโหลดมาทำงาน โปรแกรม Java Application จะทำงานภายใต้ Java Interpreter ไม่จำเป็นต้องใช้โปรแกรมอื่น ส่วoโปรแกรม Java Applet ทำงานภายใต้สภาวะแวดล้อมที่กำหนดโดย browser วิธีนี้ทำให้เราสามารถส่งโปรแกรมไปทำงานบนเครื่องใดๆในระบบอินเทอร์เน็ตได้โดยใช้ html page เป็นตัวกลาง Applet ตัวหนึ่งสามารถเรียกได้ว่าเป็น GUI(Graphic User Interface) เพราะเมื่อแสดงผลบนหน้าจอคอมพิวเตอร์จะมีลักษณะเป็นพื้นที่รูปสี่เหลี่ยมที่สามารถมีองค์ประกอบอื่นๆภายใน เช่น ปุ่ม กล่องข้อความ รูปภาพหรือกราฟิกส์รูปทรงต่างๆ นอกจากนี้ยังสามารถตอบสนองเหตุการณ์ต่างๆ เช่นการคลิ๊กเมาส์ เป็นต้น


USB




USB ย่อมาจาก Universal Serial BUS ซึ่งถูกพัฒนาโดย COMPAQ, Digital Equipment (รวมกิจการกับ COMPAQ), IBM, Intel, Microsoft, NEC และ Northern Telecom. เพื่อขยายขีดความสามารถในการทำงานของพอร์ตอนุกรม เป็นอินเตอร์เฟสที่เชื่อมต่อระหว่างอุปกรณ์ I/O กับคอมพิวเตอร์

ระบบ USB นั้นนับว่าเป็นระบบที่ทันสมัยรองลงมาจาก Fire wire เนื่องจากรองรับอุปกรณ์ได้มากขึ้น และ ง่ายต่อการติดตั้ง มีความสามารถรองรับ Plug & Play จึงทำให้ USB เป็นที่นิยมอย่างมากใน ปัจจุบัน โดยอุปกรณ์เชื่อมต่อที่ใช้ซึ่งมีมากมาย เช่น CD-ROM, Mouse, Keyboard, กล้องดิจิตอลและอุปกรณ์อื่นอีกมากมาย ซึ่ง USB มีคุณสมบัติ ดังนี้

- ลดข้อจำกัดของอุปกรณ์ต่อพ่วงโดยมากขึ้นถึง 127 อุปกรณ์ในคอมพิวเตอร์เครื่องเดียว

- "Hot Pug" สนับสนุนการต่อ, ถอดออก และ เซต อุปกรณ์ที่ติดต่ออยู่โดยไม่จำเป็นต้อง boot เครื่องใหม่
- สามารถจ่ายไฟฟ้าขนาด
5 Volt ให้แก่อุปกรณ์ที่ต่อพ่วงกับ USB

- สายเคเบิลนั้นสามารถนั้นสามารถยาวได้ถึง 5 เมตร
- มี MODE การทำงานแบบ Suspend เพื่อช่วยในการประหยัดพลังงาน
- สามารถกำหนดค่าตำแหน่งแอดเดรสของ อุปกรณ์ต่างๆ โดยอัตโนมัติ
- USB มีคอนเนคเตอร์ที่เป็นแบบเฉพาะ ทำให้ช่วยป้องกันความผิดพลาดในเรื่องของการต่ออุปกรณ์ผิดประเภท

ข้อดีของมาตรฐาน USB 2.0
- สนับสนุนพอร์ต USB 6 พอร์ต
- การต่อเชื่อมที่ความเร็วสูงกว่า USB 1.1 ถึง 40 เท่า, USB 2.0 ให้ความเร็ว 480 Mbps เมื่อเทียบกับ USB 1.0 ที่ให้ความเร็ว 12 Mbps
- เข้ากันได้กับมาตรฐาน USB 1.1
- รองรับการโอนย้ายข้อมูลวิดีโอ 30 เฟรม/วินาที ทำให้เห็นภาพที่ต่อเนื่องสมจริง

ตำแหน่งขาของ USB
- ขา 1 เป็น Voltage +
- ขา 2 เป็น DATA -
- ขา 3 เป็น DATA+
- ขา 4 เป็น Voltage -

ถ้าหากเปรียบเทียบกับมาตรฐานการต่อเชื่อมของ FireWire (IEEE 1394) แล้ว จะเห็นว่ามาตรฐาน USB 2.0 นั้นสูงกว่า FireWire IEEE 1394 อยู่บ้าง อย่างไรก็ตาม ในด้านการใช้งานแล้ว FireWire จะมุ่งเน้นไปทางด้านมัลติมีเดียมากกว่า USB แต่ทั้งคู่ก็เป็นการต่อเชื่อมผ่านบัสอนุกรมเหมือนกัน


VGA


Graphics Processing unit (GPU) สามารถเรียกอีกชื่อหนึ่งได้คือ visual processing unit (VPU) ซึ่ง GPU หน้าที่หลักของ GPU ก็คือช่วยในการประมวลการทำงานในด้านภาพกราฟฟิกบนหน้าจอคอมพิวเตอร์ให้มี ประสิทธิภาพมากยิ่งขึ้นหลักการทำงานก็คล้ายกับ CPU แต่จะแตกต่างกันตรงที่ การ์ดแสดงผลสมัยเก่า ทำหน้าที่แปลงข้อมูลดิจิตอลเป็นสัญญาณเท่านั้น แต่จากกระแสความนิยมของการ์ดเร่งความเร็วสามมิติ ในช่วงครึ่งหลังของทศวรรษที่ 90 โดยบริษัท 3dfx และ nVidia ทำให้เทคโนโลยีด้านสามมิติพัฒนาไปมาก ปัจจุบันการ์ดแสดงผลสมัยใหม่ ได้รวมความสามารถในการแสดงผลภาพสามมิติมาไว้ เป็นมาตรฐาน และได้เรียกชื่อใหม่ว่า GRAPHICS PROCESSING UNIT โดยสามารถลดงานด้านการแสดงผลของของหน่วยประมวลผลกลาง (CPU) ได้มากมีหน้าที่เปลี่ยนสัญญาณ digital ให้เป็นสัญญาณภาพ โดยมี Chip เป็นตัวหลักในการประมวลการแปลงสัญญาณ ส่วนภาพนั้น CPU เป็นผู้ประมวลผล แต่ปัจจุบัน เทคโนโลยีการประมวลผลภาพนั้น VGA card เป็นผู้ประมวลผลเองโดย Chip นั้นได้เปลี่ยนเป็น GPU (Grarphic Processing Unit) ซึ่งจะมีการประมวลภาพในตัว Card เองเลย เทคโนโลยีนี้เป็นที่แพร่หลายมากเนื่องจากราคาเริ่มปรับตัวต่ำลงมาจากเมื่อก่อนที่เทคโนโลยีนี้เพิ่งเข้ามาใหม่ๆ โดย GPU ค่าย Nvidia เป็นผู้ริเริ่มการลุยตลาด




การ์ดจอ (Video Card)
การ์ดแสดงผล หรือ กราฟฟิกการ์ด (Graphic card) เป็นแผงวงจรอิเล็กทรอนิกส์ ที่ทำหน้าที่ในการนำข้อมูลที่ได้จากการประมวลผลของซีพียูมาแสดงบนจอภาพ ทำให้ผู้ใช้ สามารถควบคุมการทำงาน ได้อย่างมีประสิทธิภาพ โดยจอภาพจะเป็นส่วนที่รับข้อมูลจากการ์ดแสดงผลอีกทีหนึ่ง การ์ดกราฟฟิกทีได้รับความนิยมและใช้กันแพร่หลายในอยู่ปัจจุบัน เป็นการ์ดกราฟฟิกที่มี GPU เป็นตัวประมวลผล




กระบวนการทำงาน

การ์ดแสดงผลมีหน้าที่หลักในการรับข้อมูลดิจิตอลมาแปลงเป็นสัญญาณอะนาล็อก เพื่อส่งออกไปแสดงผลยังหน้าจอ ซึ่งสามารถแบ่งการทำงานของการ์ดแสดงผลออกเป็น 2 โหมดคือ โหมดตัวอักษร (Text Mode) โหมดการแสดงผลที่สามารถแสดงได้ เฉพาะข้อความที่เป็นตัวอักษรบนจอภาพ ไม่สามารถแสดงรูปภาพกราฟฟืกต่าง ๆ ได้ หน่วยย่อยที่สุดบนจอภาพในโหมดนี้ คือ ตัวอักษร เช่น การทำงานในระบบ DOS และ โหมดกราฟฟิก (Graphic Mode) ลักษณะการทำงานแบบกราฟฟิก ในคอมพิวเตอร์ PC ของ IBM ได้แก่ ได้แก่การทำงานที่แสดงออกมาเป็นภาพ เส้นและตัวอักษรบนจอภาพ graphic mode สร้างภาพโดยวิธีใช้จุด pixel แต่ละจุดมาต่อเรียงกันเพื่อสร้างเป็นภาพ เป็นโหมดที่ต้องการความละเอียดในการแสดงผลสูงดังจะเห็นได้จากโหมดการทำงานของระบบปฏิบัติการวินโดวส์ที่ใช้อยู่ในปัจจุบัน

ยี่ห้อการ์ดจอต่างๆ
ปัจจุบันการ์ดแสดงผลมีหลายยี่ห้อ เช่น XFX MSI Inno 3D Winfast ASUS


วันอังคารที่ 21 มิถุนายน พ.ศ. 2554

Audio search engine

Audio search engine

ก่อนอื่นเรามาทำความรู้จักกับ Search Engine กันก่อนน่ะครับ

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

โดยในหัวข้อ Audio Search Engine นี้ เราจะเน้นไปทางการค้นหาประเภทมัลติมิเดียโดย Audio Search Engine นี้ เป็นเครื่องมือในการค้นหาข้อมูลประเภทมัลติมิเดียไม่ว่าจะเป็น เสียง รูปภาำพ วีดีโอ ฯลฯ Audio Search Engine เป็นการค้นหาข้อมูลประเภทเสียงเป็นหลัก โดยมีเว็บที่ให้บริการด้านนี้อยู่มากมายเช่น www.4shared.com , www.kazaa.com เป็นต้น ดังตัวอย่างในภาำพนี้เป็นเว็บที่ให้บริการค้นหาข้อมูลประเภทมัลติมีเดีย ท้งหลายครับ

ตัวอย่างที่1

ตัวอย่างที่2

Audio Search Engine นั้น เป็นการค้นหาข้อมูลประเภท เสียง ซึ่งรวมอยู่ในการค้นหาข้อมูลประเภทมัลติมีเดียทั้งหลายที่เรารู้จักกันดี ซึ่งการค้นหาทั้งหมดนี้เป็นการค้นหาผ่านทาง เทคโนโลยีที่เราเรียกว่าSearch Engine นั้นเองครับ

ตัวอย่างเว็บที่ใช้ค้นหาไฟล์ประเภทMultimedia Search Engines: Image, Audio & Video Searching

AllTheWeb http://www.alltheweb.com/

AltaVista http://www.altavista.com/

Ditto (images only) http://www.ditto.com/

Google Images (images only) http://images.google.com

Kazaa Media Desktop (MP3 only) http://www.kazaa.com/

youtube (Vedio) http://www.youtube.com

Canvas

Canvas

ก่อนอื่นต้องบอกก่อนว่า HTML5 นั้น ไม่ได้มีแต่ฟีเจอร์เรื่องของ Video และ Audio นะจ๊ะ ยังมีฟีเจอร์อื่นๆ ที่น่าสนใจและจะเป็นตัวพลิกโฉมวงการเว็บเลยก็ว่าได้ หนึ่งในนั้นก็คือ Canvas element ซึ่งเป็นคุณสมบัติทางด้านกราฟฟิกที่มาพร้อมกับ HTML5 และเจ้า Canvas element นี่แหละที่ผมคิดว่ามันอาจจะเป็นพระเอกของ HTML5 เพราะเจ้ากราฟฟิกตัวนี้ มันสามารถทำให้คุณสามารถสร้างระบบต่างๆ ที่คุณต้องการขึ้นมา ไม่ว่าจะเป็นระบบเกมส์ หรือโปรแกรมวาดภาพบนเว็บ ที่รองรับทุก platform หลายๆ คนคงจะเคยเห็นและเล่นเกมส์แฟรช (Flash Games) ซึ่งข้อเสียของมันก็คือต้องใช้ปลั๊กอินที่ชื่อว่า Flash player และแน่นอนว่าถ้าเครื่องไหนไม่สามารถลงปลั๊กอินตัวนี้ได้ ก็จะไม่สามารถเข้าชม หรือเล่นได้นั้นเอง แต่ถ้าระบบหรือเกมส์ นั้นๆ ถูกพัฒนาด้วย HTML5 มันจะสามารถเล่นได้ทุกระบบปฏิบัติการ โดยที่ไม่จำเป็นต้องลงปลั๊กอินใดๆ เพิ่ม

Canvas element จะมี Tag สั้นๆ จำง่ายๆ ก็คือ ซึ่งเป็นคำสั่งที่จะใช้สร้างกราฟฟิกผ่านในตัว Canvas แต่เจ้า Canvas เองไม่สามารถทำงานได้ด้วยตัวเอง เนื่องจากมันก็ยังเป็น HTML ดีๆ นี่เอง ยังคงต้องอาศัยภาษาสคริปในการควบคุม ซึ่งจะทำงานได้ต้องอาศัยภาษา JavaScript เป็นตัวควบคุมในการทำงานต่างๆ เช่นสั่งให้วาดเส้นตรง และขีดเขียน ซึ่งในตอนที่ 1 นี้ผมจะยังไม่ลงลึกถึงวิธีการเขียน จะเล่าคร่าวๆ ก่อนว่า Canvas มันคืออะไร ตัวอย่างการแรกใช้งาน หรือการเขียน Canvas ใน HTML5 ดู Code Highlighter ด้านล่างครับ

Canvas element มีคำสั่งในการควบคุมเยอะแยะเช่น วาดเส้น วงกลม สี่เหลี่ยม เส้นตรง เส้นโค้ง ฯลฯ ณ จุดนี้ผมออกปากก็เลย เพราะเดี๋ยวคงจะมีคนมาถามว่า การเขียน Canvas element ใน HTML5 นั้นยากไหม ? ผมบอกก่อนเลยครับว่า มันไม่ใช่เรื่องยาก (สักเท่าไหร่) แต่…… คนที่จะเขียนต้องมีความรู้พื้นฐานและเข้าใจในโครงสร้างของภาษา HTML และ JavaScript พอสมควร ไม่งั้นก็เหมือนหัดเขียนใหม่แหละจ๊ะ ถ้ายังนึกไม่ออกว่าcanvaselementในHTML5นั้นมันทำงานยังไงลองดูตัวอย่างนี้ http://www.krapalm.com/html5/ (ไม่รองรับ IE) ซึ่งในเรื่อง Introduction ของ Canvas element ก็คงหมดเพียงเท่านี้ ติดตามดูกันต่อในตอนที่ 2 และตอนต่อๆ ไปครับว่า Canvas มีอะไรให้เราเล่นบ้าง

อ่อเกร็ดความรู้นิดหน่อย canvas element ของ HTML5 นั้นถ้าข้อมูลผมไม่ผิด Apple เป็นผู้ที่นำ canvas element ไปใช้เป็นเจ้าแรก Mac OSX Dashboard
View :1168
Related Post

  • * Z-Type เกมที่พัฒนาจาก HTML5 ได้รับแรงบรรดาลใจจากเกม The Typing of the Dead
  • * เริ่มต้นเรียนรู้ HTML5 อย่างไรดี
  • * Canvas element ใน HTML5 คืออะไร ? ตอนที่ 2
  • * HTML5 มี Elements อะไรใหม่ๆ เพิ่มขึ้นมาบ้าง
  • * เครื่องมือวาดภาพพัฒนาจาก HTML5 รองรับ Mobile device และ iPad
  • * ContentEditable แก้ไขเนื้อหาในหน้าเว็บได้ทันทีด้วย HTML5
  • * โลโก้ HTML5 อย่างเป็นทางการมาแล้ว
  • * เก็บตกงาน GTUG BootCamp 2011 สำหรับใครที่ไม่มีโอกาสได้ไป
  • * Theme Wordpress ที่ใช้ HTML5 & CSS3 ในการพัฒนา
  • * 52ramework: HTML5 Frameworks ที่น่าลอง
  • * ฟังบรรยายจากทีมงาน HTML5 in Thai ในหัวข้อ HTML5 : The future of website
  • * HTML5 กับ Div Element หรือ Semantic Markup ที่เปลี่ยนไป
  • * LeanBack: HTML5 player ที่รองรับการใส่ Subtitle เข้าไปในวีดีโอได้
  • * HTML5 in Thailand ปรับโฉมใหม่ เชิญชวนมาเป็นส่วนหนึ่งของเรา
  • * Aloha Editor : HTML5 Editor


canvas

หลังจากเราได้รู้แล้วว่า มันคืออะไร ทำงานอย่างไร จากบทความ Canvas element ใน HTML5 คืออะไร ? ตอนที่ 1 คราวนี้เราจะมาดูตอนที่ 2 กัน ซึ่งตอนนี้ผมจะมาสอนวิธีการสร้าง Canvas กัน Canvas ใน นั้นมี attribute ที่สำคัญที่จำเป็นต้องมีหลักๆ อยู่ 3 ตัวด้วยกัน ต้องกำหนด id, width, และ height ทั้ง 3 ตัวเป็น attribute ที่จำเป็นสำหรับ Canvas Element อย่างแรกทำไทต้องกดหนด id ให้ ตรงถ้าใครที่เคยพัฒนาเว็บมาอยู่แล้วก็คงทราบๆ กันดีว่าเพื่ออะไร แต่ใครไม่ทราบผมจะอธบายสั้นๆ ละกันครับ กำหนด ID ก็เพื่อให้ง่ายต่อการเรียกใช้งานหรือเข้าถึง Element นั้นๆ แน่อนครับเวลาจะใช้งานต้องเปิด Element ด้วย

ตัวอย่างการใช้งาน Canvas Element ใน HTML5width="200" height="100">

อย่าง ที่ผมบอกในบทความก่อนครับ Canvas Element นั้นเป็นเหมือนคำสั่งที่จะใช้สร้างกราฟฟิก แต่เจ้า Canvas เองไม่สามารถทำงานได้ด้วยตัวเอง เนื่องจากมันก็ยังเป็น HTML ดีๆ นี่เอง ยังคงต้องอาศัยภาษาสคริปในการควบคุม ซึ่งจะทำงานได้ต้องอาศัยภาษา JavaScript เป็นตัวควบคุมในการทำงานต่างๆ เช่นสั่งให้วาดเส้นตรง และขีดเขียน เรามาดูคำสั่ง JavaScript ที่จะควบคุมให้เจ้า Canvas สามารถวาดภาพที่เราต้องการได้อย่างไร



จะเห็นว่าชุดคำสั่ง JavaScript ชุดนี้ได้เข้าถึง Element ที่ ID ที่ชื่อว่า myCanvas นั้นเองครับ สังเกตได้จากบรรทัด

var c=document.getElementById("myCanvas");

จากนั้นเมื่อหา Element ดังกล่าวเจอก็จะทำการสร้าง context object ขึ้นมา

var cxt=c.getContext("2d");

คำ สั่งบรรทัดนี้ ตรง getContext(“2d”) เป็น built-in object ที่มาพร้อมกับ HTML5 ซึ่งจะประกอบไปด้วยคำสั่งต่างๆ เช่น คำสั่งวาดเส้นตรง วงกลม รูปสี่เหลี่ม ตัวหนังสือ รูปภาพ หรืออื่นๆ

ต่อมาก็เป็นการสร้างรูปสี่เหลี่ยมพื่นภาพสีแดงขึ้นมา

cxt.fillStyle="#FF0000";

cxt.fillRect(0,0,150,75);

อ่อเกือบลืม ไอ้ตรง c. หรือ cxt. นี่คงเข้าใจนะครับว่ามันคืออะไร มันเป็นชุดคั่งสั่งของ JavaScript มาต่อกันเลยละกัน fillStyle นั้นเป้นการกำหนดสีแดงลงไป ส่วน fillRect เป็นการกำหนด รูปร่าง ตำแหน่ง แล้วก็ขนาดของวัตถุ

canvas

ผลที่ได้จากคำสั่งก็เป็นดังรูปด้านบน

-----------------------------------------------------------------------------------------

Canvas cheat sheet My memory isn't very good and I often find myself looking up simple things in various specs but sometimes they're just too damn long-winded when you're simply looking for argument x of function y. That's where cheat sheets and reference cards come in handy with their compact, bare-bones information crammed into, at most, a few pages. There are cheat sheets for just about anything out there but I couldn't find one for the HTML5 canvas element, so I decided to do something about that, mostly for my own sake but if other people find it useful that's just all the better.

The information is pretty much just a copy of what is found in the WHATWG specs, just condensed and hopefully a bit easier to read. There are virtually no explanations, however, and no examples other than some graphics for compositing values and a few other things (the appearance of which is very much inspired by those found in Mozilla's examples). So, it's basically just a listing of the attributes and methods of the canvas element and the 2d drawing context.