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

การไปเอาโค้ดสำหรับปุ่ม Like ของ Facebook

1. เข้าไปที่ http://developers.facebook.com/docs/reference/plugins/like
2. เลื่อนหน้าจอลงไปแล้วตั้งค่า ดังตัวอย่างรูปด้านล่าง
   
3. กดปุ่ม Get Code
   
4. ทำการ Copy Code ในช่อง Iframe

การเพิ่มปุ่ม Like ของ Facebook ใน WordPress

1. เข้าไปที่หน้า Appearance > Editor
2. เปิดไฟล์ single.php
3. เปลี่ยนโค้ดที่ได้ตรงส่วน don-jai.com เป็น <?php the_permalink()?>
4. นำโค้ดไปวาง ของออฟจะเอาไปวางด้านล่างสุดของเอนทรี่นะคะ
   
5. กด Update
6. ตัวอย่างการแสดงผล
   

ถ้าอยากได้เฉพาปุ่ม แบบไม่มีรูปให้ตั้งค่าแบบนี้ค่า

1. เข้าไปตั้งค่า
   
2. เอาโค้ดไปวาง
3. ตัวอย่างการแสดงผล
   

วันนี้มาแนะนำการใช้งาน Remote System Explorer (RSE) สำหรับ Eclipse ซึ่งเจ้าตัว RSE นี้ก็มีเพื่อใช้งานในการ Remote เข้าไปและสามารถเลือกไฟล์ในการแก้ไขหรือเพิ่มได้ง่ายๆ ซึ่งมีประโยชน์อย่างมากในการทำเว็บร่วมกันหลายๆคนรวมไปถึงการต้องการเปิดไฟล์ที่อยู่ที่อื่นที่ต้องใช้การ remote เข้าไป เพราะว่าไม่เสียเวลาในการที่เปิดไฟล์ มาแก้ไข กว่าจะอัพโหลดไฟล์ขึ้นไปอีก

การติดตั้ง Remote System Explorer (RSE) ใน Eclipse

• ถ้ายังไม่มี Eclipse :

1. เข้าไปโหลด Remote System Explorer (RSE) in Eclipse ได้เลยค่า
2. เลือกตัว Build ที่ต้องการเช่น 3.1.1
3. แล้วก็ทำการดาว์นโหลดมาใช้เลยค่า

• สำหรับคนที่มี Eclipse แล้ว

1. ให้เปิดโปรแกรมขึ้นมาแล้วเลือก Help > Install New Software…
2. กดที่ปุ่ม Add แล้วใส่ค่าตามนี้
   - ช่อง Name : RSE
   - ช่อง Location  : http://download.eclipse.org/dsdp/tm/updates/3.1/
   
3. หลังจากเพิ่มแล้วที่ช่อง Word with  ให้เลือกที่ RSE – http://download.eclipse.org/dsdp/tm/updates/3.1/
4. เลือก TM and RSE 3.1.1 แล้วกด Nextไปเรื่อยๆ จนติดตั้งเสร็จ
   
5. restart โปรแกรมใหม่นะคะ

การตั้งค่าสำหรับการใช้งานครั้งแรก

1. ที่เมนูบาร์ด้านบนเลือก Window > Open Perspective > Other > Remote System Explorer.
   
   
2. ที่ New Connection เลือก FTP only
   
3. ตั้งค่า host
   
4. กด Next แล้วก็ Finsh
   

http://www.eclipse.org/dsdp/tm/tutorial/

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

• รูปแบบของเว็บไซต์สำนักทะเบียนและประมวลผลแบบเดิม

• รูปแบบของเว็บไซต์สำนักทะเบียนและประมวลผลแบบใหม่

ดูรูปใหญ่

• การเปลี่ยนแปลงที่เกิดขึ้น

ในการออกแบบครั้งนี้ถือได้ว่า ต้องเริ่มจากจัีดเรียงกลุ่มข้อมูลใหม่ทั้งหมดเลย เพราะว่าข่าวสาร การประกาศต่างๆ แบบเดิมนั้นไม่ค่อยเป็นระเบียบเท่าไหร่นัก รวมไปถึงตัวกระพริบมากมายก็ตัดทิ้งไปทั้งหมด พยายามเน้นที่คอนเซปต์ “เรียบง่าย สบายตา”

เลือกใช้โทนสีฟ้าเพราะว่าให้ความน่าเชื่อถือมากกว่าและมีการใช้โทนสีไล่เรียงกัน เพื่อให้เห็นความแตกต่างของความสำคัญของแต่ละองค์ประกอบ

• ปัญหาในการออกแบบครั้งนี้

1. ใจอยากให้มีแบนเนอร์ใหญ่ๆข้างบน แบบนี้ แต่ว่าข้อมูลไม่ค่อยอำนวยเท่าไร่
2. การรวบรวมกลุ่มข้อมูลใหม่มีปัญหาค่อนข้างเยอะ
3. ทำโลโก้ยาก เพราะว่าชื่อมันยาว
4. การใช้คำพูดแทนหัวข้อต่างๆ

• หมายเหตุ

- ภาพที่เห็นในการออกแบบใหม่เป็นการใช้ photoshop ของออฟล้วนๆ แต่ว่าของจริงก็ต้องดูกันต่อไป
- อาจจะมีการเปลี่ยนแปลงเล็กน้อยเกิดขึ้นได้ ทำให้ของจริงอาจจะแตกต่างไปจากที่ออกแบบไว้

• สไลด์ประกอบเรื่อง Web Generation

Web Generartion
View more presentations from Kritiya Sangnitidaj.

• “พัฒนาการทำให้เกิดการเปลี่ยนแปลง”

นับตั้งแต่มีการพัฒนาเครือข่าย ARPANET (Advanced Research Projects Agency NETwork) ในปี ค.ศ. 1969 (พ.ศ. 2512) จนถึงวันนี้ อาจนับได้ว่าเป็นเวลากว่า 40 ปี ที่เครือข่ายอินเตอร์เน็ตได้ถือกำเนิดขึ้น และได้มีการเปลี่ยนแปลงและการพัฒนาสิ่งต่างๆ มากมาย โดย ณ จุดเริ่มต้น ทางกระทรวงกลาโหม ประเทศสหรัฐอเมริกาได้ริเริ่มทำการพัฒนาเครือข่าย ARPANET ขึ้น เพื่อเป็นเครือข่ายสำนักงานโครงการวิจัยชั้นสูง โดยมีวัตถุประสงค์หลักของเครือข่ายคือ การทำให้คอมพิวเตอร์สามารถเชื่อมต่อและมีปฏิสัมพันธ์กันได้

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

• Web1.0 ยุคแห่งการเริ่มต้น

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

“Read-Only” เป็นการกล่าวถึงลักษณะของการแสดงเนื้อหาและการโต้ตอบกันระหว่างเจ้าของ เวบไซต์กับผู้เข้าชมเวบไซต์ในยุค Web 1.0 ซึ่งมีลักษณะเป็นการตอบโต้ทางเดียวคือ เจ้าของเวบไซต์มีการผลิตเนื้อหาของเว็บไซต์ และผู้ที่ต้องการข้อมูลจะเข้าไปอ่านจากเวบไซต์หรือทำการค้นหาจาก Search Engine ซึ่งเป็นเครื่องมือหรือโปรแกรมในการค้นหาเว็บต่างๆเป็นส่วนใหญ่ ผู้เข้าชมเวบไซต์ส่วนใหญ่สามารถทำได้เพียงรับข้อมูลจากเนื้อหาของเวบไซต์แต่ ไม่มีโอกาสในการแสดงความคิดเห็นหรือมีการโต้ตอบกันระหว่างเจ้าของเวบไซต์กับ ผู้เข้าชมเวบไซต์ ถึงแม้ว่าในการพัฒนาต่อมาจะมีการนำกระดานข่าว (webboard) มาใช้เป็นแหล่งที่ให้ผู้เข้าชมเวบไซต์สามารถแสดงความคิดเห็นหรือแลกเปลี่ยน ข้อมูลข่าวสารกันได้ แต่กระดานข่าวยังไม่ได้มีการจัดเก็บข้อมูลอย่างเป็นระบบเพื่อรองรับการเข้า ชมจากผู้ชมเวบไซต์คนอื่น รวมไปถึงไม่มีการสนับสนุนหรือตัวช่วยในการค้นหาข้อมูลสำหรับผู้เข้าชมเวบไซ ต์ ซึ่งข้อจำกัดต่างๆส่งผลให้มีการพัฒนาเวบไซต์เพื่ออำนวยความสะดวกต่อผู้เข้า ชมมากยิ่งขึ้นอันเป็นที่มาของยุค Web 2.0

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

• Web2.0 ยุคแห่งการพัฒนาการและการเชื่อมโยง

“มนุษย์เป็นสัตว์สังคม (Human being is social animal)” คำกล่าวของอริสโตเติ้ล นักปราชญ์ผู้ยิ่งใหญ่ เป็นการอธิบายถึงการใช้ชีวิตของมนุษย์ที่จะต้องมีการพึ่งพาอาศัยกัน ทำกิจกรรมร่วมกัน เพื่อความอยู่รอดและเพื่อสร้างความสุข ความมั่นคงให้กับชีวิต สังคมจึงเป็นแหล่งรวมศูนย์ทางความคิดที่มนุษย์ได้สร้างขึ้นมา เพื่อแสวงหาคำตอบทุกๆอย่างให้กับตนเอง ซึ่งเหตุผลแห่งการที่มนุษย์เป็นสัตว์สังคม อีกทั้งยังมีความต้องการอย่างต่อเนื่อง ในการทำสิ่งต่างๆ เพื่อให้เกิดความสุขและสะดวกสบายใจชีวิต  จึงทำให้มนุษย์เป็นสิ่งมีชีวิตที่มีการพัฒนาและค้นหาหนทางต่างๆเพื่อตอบสนอง ความต้องการของตน ในโลกของเทคโนโลยีเวิลด์ไวด์เว็บ และการออกแบบเว็บไซต์ก็เช่นกัน การที่เวบไซต์แบบเดิมนั้นไม่สามารถตอบสนองความต้องการในการแสดงความคิดเห็น การโต้ตอบ หรือการเชื่องโยงและการสร้างเครือข่ายสังคม จึงทำให้มีการพัฒนาและปฏิวัติรูปแบบของเวบไซต์และเทคโนโลยีต่างๆ เพื่อให้เกิดการตอบสนองต่อความต้องการมากขึ้น

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

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

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

ตัวอย่างลักษณะของเวบไซต์ในยุค Web 2.0 เช่น Wikipedia ซึ่งเป็นสารานุกรมออนไลน์หลายภาษาที่แจกจ่ายในลักษณะเนื้อหาเสรีที่ให้ผู้ ใช้สามารถสร้าง แก้ไข และปรับปรุงเนื้อหาร่วมกันได้อย่างแทบไม่มีขีดจำกัด, flickr แหล่งออนไลน์ในการ “ฝากและแสดง” ภาพถ่ายดิจิตอล โดยมีการให้ใส่คำจำกัดความของรูปภาพหรือที่เรียกว่า “Tag” เพื่อเป็นตัวช่วยในการจัดระบบและการค้นหาข้อมูล, Blog เวบไซต์ส่วนตัวสำเร็จรูปที่ช่วยให้การเผยแพร่ความรู้และประสบการณ์ทำได้ อย่างง่ายดาย

• Web3.0 ยุคแห่งโลกอนาคต

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

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

“Read – Write – Execute” เป็นการคาดการณ์ลักษณะของการแสดงเนื้อหาและการโต้ตอบกันระหว่างเจ้าของ เวบไซต์และผู้เข้าชมเวบไซต์ในยุค Web 3.0 ซึ่งมีลักษณะเป็นการที่ผู้ใช้สามารถอ่าน เขียน และทำการจัดการเนื้อหาและปรับแต่งแก้ไขข้อมูลหรือระบบได้อย่างอิสระ  หรือในอีกลักษณะหนึ่งของ Web 3.0 คือ “Read – Write – Relate” เป็นลักษณะของการเชื่อมโยงข้อมูลเข้าด้วยกันมากขึ้นแทนที่จะเป็นเพียงข้อมูล ที่สามารถอ่านและเขียนได้เท่านั้น ซึ่งจะมีประโยชน์ต่อมาคือเมื่อเราสามารถหาความสัมพันธ์และการเชื่อมโยง ข้อมูลต่างๆได้ ก็จะทำให้เราเข้าใจความหมายของเครือข่ายการเชื่อมโยงต่างๆมากขึ้น

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

ตัวอย่างลักษณะของเวบไซต์ในยุค Web 3.0 เช่น Search Engine Google ที่เมื่อเราทำการสะกดคำที่ต้องการค้นหาผิด Google สามารถรู้ได้ว่าคำที่เราต้องการหาเป็นอะไร และทำการแสดงผลของคำที่เราน่าจะต้องการมาให้

• บทสรุปของพัฒนาการของเวิลด์ ไวด์ เว็บ

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

• สไลด์เพิ่มเติม (จากที่อื่น)

  Web3.0
  View more presentations from Johannes Bhakdi.
  Web 1 2 3 4

  View more documents from arts118.
  Web3.0 or The semantic web

  View more documents from darren131.

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

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

• ขั้นตอนเช็คการแสดงผลของเว็บเราในหลายๆ Browser

1. เข้าไปที่ http://browsershots.org/

2. ใส่ url ในช่อง

3. เลือกว่าต้องการจะทดสอบกับบราวเซอร์ไหนบ้าง

4. ตั้งค่าเพิ่มเติม

Screen size : กำหนดขนาดของการแสดงผล

Color depth : กำหนดความเข้มของสี

Javascript : กำหนด version ที่ต้องการทดสอบ

Java : เลือกว่ามีการ enable หรือไม่

Flash : กำหนด version ที่ต้องการทดสอบ

5. กด Submit เพื่อเริ่มการตรวจสอบ

• ผลของการเช็ค : 59 browsers selected, 25 uploaded, 3 failed, 31 expired

เวบไซต์จะทำการแสดงตัวอย่างของการจับภาพหน้าจอใน browser ต่างๆมาให้ดู ซึ่งก็สามารถดาวน์โหลดภาพเก็บไว้ได้ด้วย

เมื่อกดไปที่ภาพ Screenshot ของ browser ที่ต้องการก็จะได้ผลของการแสดงที่ใหญ่ขึ้นรวมไปถึงได้รู้รายละเอียดของตัวที่ใช้ทดสอบด้วยเช่น

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

วันนี้หลังจากที่ออฟไปพบเวบไซต์ pForm ซึ่งจะมาช่วยให้เราสร้างและแก้ไขฟอร์มอย่างง่ายใน 3 ขั้นตอน ก็เลยอยากจะมาบอกต่อค่า

• สร้างฟอร์มง่ายๆแค่ 3 ขั้นตอน

1. เลือกโทนสีที่ต้องการ ทางเวบไซต์มีโทนสีให้เลือกหลายรูปแบบเลยทีเดียว หลังจากเลือกแล้วกด Next

2.ออกแบบฟอร์มของคุณ โดยเวบไซต์จะมีตัวเลือกอยู่ทางด้านขวา ซึ่งเราสามารถ drag drop มาวางทางซ้ายได้เลย แถมยังให้เราสามารถปรับแต่งค่าได้ตามที่ต้องการด้วย หลังจากออกแบบเสร็จแล้วกดที่ Save Form

3. ดาว์นโหลดฟอร์ม หลังจากที่ออกแบบเสร็จแล้วก็สามารถดาว์นโหลดไปใช้ได้เลย หรือจะกลับไปแก้ไขเพิ่มก็ได้

• ผลจากการใช้งาน

ถ้าลองใช้งานจริงๆจะพบว่าสามารถสร้างฟอร์มได้สวยและตรงตามความต้องการได้ภายในไม่เกิน 5 นาทีเท่านั้น (เวลาขึ้นกับการออกแบบของแต่ละคน) และที่สำคัญไม่้ต้องสมัครสมาชิกอะไรให้ยุ่งยากอีกด้วยค่ะ

ใครที่กำลังค้นหาไอคอนอยู่ ออฟก็ขอนำเสนอเวบไซต์ที่ช่วยในการค้นหาไอคอนให้เรา รวมไปถึงบางเวบไซต์ที่มีการรวบรวมไอคอนเอาไว้อย่างมากมาย

Iconfinder Veryicon Iconlet Iconlook IconSeeker Icons-Search

EasyIconFinder Iconspedia Dreamstime IconArchive

SSH (Secure Shell) เป็นโปรโตคอลสื่อสารมาตรฐาน ที่มีการสร้างช่องทางสื่อสารที่มีความปลอดภัยระว่างระบบสองระบบโดยใช้ สถาปัตยกรรม client-server โดยที่ตัวโปรโตคอล SSH เองได้มีการจัดเตรียมกลไกล การพิสูจน์ตัวตนทั้งสองฝ่าย (authentication) การเ้ข้ารหัสข้อมูล (encryption) และ การรักษาความคงสภาพของข้อมูล (integrity) โปรโตคอล SSH นี้เองได้ถูกนำมาแทนที่โปโตคอลการสื่อสารรุ่นเก่าเช่น telnet, rlogin, rsh, rcp ที่ไม่มีการเข้ารหัส หรือบางครั้งนำมาใช้ร่วมกับโปรโตคอลการสือสารเดิมโดยการทำอุโมงค์ (tunnel) เพื่อเพิ่มความปลอดภัยในการสื่อสาร

อ้างอิง

- http://www.cpsk.info/wiki/Secure_SHell_(SSH)

- ประวัติ SSH (.ppt)

- การใช้ SSH โดยไม่ต้องใส่รหัสผ่าน

- การใช้ Secure Shell ในการเข้าถึงระบบจากระยะไกล

- http://citec.us/forum/Hardening-SSH-Server-Secure-Shell-t18866.html

FTP

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

FTP คือโปรโตคอลสำหรับถ่ายโอนข้อมูล โดยเครื่องที่เปิดบริการ FTP จะเปิด TCP port 21 ไว้ การเชื่อมต่อของ FTP มี 2 mode
1. FTP standard mode คือ การเชื่อมต่อที่ server เชื่อมต่อกับ client ผ่าน port 20 เป็น Out going port ส่วน port ฝั่ง client จะแล้วแต่ตกลงกัน แต่ถ้า client มี firewall ที่ไม่บริการ ftp ก็จะติดต่อไม่ได้
2. FTP passive mode คือ การเชื่อมต่อที่ client เป็นผู้เชื่อมต่อไปยัง server เพื่อใช้หมายเลข port ที่แล้วแต่จะตกลงในการส่งข้อมูล

อ้างอิง

- http://www.itwizard.info/technology/linux/active_passive_ftp/active_passive_FTP.html

- http://www.thaiall.com/internet/internet04.htm

-http://fetchsoftworks.com/FetchWebHelp/Contents/Concepts/ActiveAndPassive.html

HTTPS

HTTPS (Hypertext Transfer Protocol over Secure Socket Layer หรือ HTTP over SSL) เป็นโปรโตคอลเว็บที่พัฒนาโดย Netscape และฝังอยู่ใน browser ที่ encrypt และ decrypt คำขอเพจของผู้ใช้ และเพจที่ได้รับการส่งออกโดยแม่ข่ายเว็บ HTTPS เป็นเพียงการใช้ Secure Socket Layer (SSL) บน Netscape ในระดับย่อยภายใต้ HTTP บนชั้น application (HTTPS ใช้พอร์ต 443 แทนที่ HTTP พอร์ต 80 ในการปฏิสัมพันธ์กับชั้นต่ำกว่า TCP/IC) ขนาดคีย์ของ SSL เป็น 40 บิตสำหรับอัลกอริทึม RC4 stream encryption ซึ่งได้รับการพิจารณาว่าองศา encryption เพียงพอสำหรับการแลกเปลี่ยนเชิงพาณิชย์

อ้างอิง

- http://202.28.94.55/web/322461/2550/report/g9/HTTP&HTTPs.doc

- http://202.28.94.55/web/322461/2550/report/g9/https.html

POP3 & IMAP

POP3 = Post Office Protocol version 3
POP ถูกออกแบบสำหรับการเข้าถึงแบบ offline คือ จดหมายอยู่ใน server และผู้ใช้สามารถใช้โปรแกรมที่สนับสนุน POP ในการเข้าถึงจดหมายจากระยะไกล การจัดการใดๆ กับจดหมายจะเป็นการจัดการในเครื่องของผู้ใช้เท่านั้น ถึงแม้ว่าข้อจำกัดของการเข้าถึงแบบ offline จะทำให้เกิดความคิดที่จะทำให้ POP สามารถใช้งานในแบบ online หรือ แบบ disconnected ได้ แต่ POP ขาดคุณสมบัติที่จำเป็นบางอย่าง ส่วนการเข้าถึงแบบเสมือน online (pseudo-online) จดหมายจะไม่ถูกลบออกจาก server แต่ก็ไม่ใช่การเข้าถึงแบบ online ที่แท้จริง เพราะขาดโปรโตคอลในการเข้าถึงระบบไฟล์ในเครื่อง server ในการที่จะเข้าถึงหรือเปลี่ยนแปลง folder หรือ สถานะต่างๆ ของจดหมาย ตัวอย่างเช่น การตั้งค่าสถานะของจดหมาย เช่นได้ถูกอ่านแล้ว จะถูกตั้งค่าเพียงแค่ในเครื่องไคลเอนท์ที่ใช้เท่านั้น แต่สถานะของจดหมายที่แท้จริงบนเซิร์ฟเวอร์ยังคงไม่เปลี่ยนแปลง หรือการจัดเก็บจดหมายลง folder จะถูกจัดเก็บลงในเครื่องไคลเอนท์เท่านั้น ซึ่งที่จริงควรจะจัดเก็บไว้บนเซิร์ฟเวอร์ เพราะหากว่ามีการใช้ไคลเอนท์เครื่องอื่น ก็ยังสามารถเห็น folder นั้นๆได้

IMAP
มี ความสามารถในการเข้าถึงทั้งแบบ offline และแบบ online โดยในแบบ online จดหมายจะไม่ถูกดึงมา แต่จะเป็นแบบโต้-ตอบกับ server นั่นคือผู้ใช้สามารถดึงเฉพาะหัวข้อจดหมาย , บางส่วนของจดหมาย หรือค้นหาจดหมายที่ตรงความต้องการ โดยจดหมายที่ถูกเก็บไว้บน server และสามารถตั้งค่าสถานะของจดหมายต่างๆ เช่น ถูกลบไปแล้ว , ตอบไปแล้ว และจะยังอยู่ใน server จนกว่าผู้ใช้จะสั่งลบ อธิบายง่ายๆ คือ IMAP ถูกออกแบบให้การเข้าจดหมายจากระยะไกลเหมือนกับการเข้าถึงจดหมายจากภายใน เครื่องของผู้ใช้เอง ซึ่งขึ้นอยู่กับโปรแกรมที่ใช้ว่าจะเก็บจดหมายไว้ในเครื่องของผู้ใช้เอง หรือเก็บไว้ใน server หรือให้ผู้ใช้เลือกเองอย่างใดอย่างหนึ่ง

อ้างอิง

- http://www.dld.go.th/ict/article/general/gen08.html

JavaBean

ในการเขียน JSP สำหรับระบบใหญ่ ๆ  นักพัฒนาจะไม่นิยมใส่ java code ลงไปในไฟล์ JSP มากนัก สิ่งที่อยู่ในไฟล์มักจะเป็นเพียง HTML code และค่าของ variables ต่าง ๆ ที่ได้มาจาก JavaBeans เท่านั้น. ข้อดีของการใช้ JavaBean คือการง่ายต่อการเปลี่ยนแปลงลักษณะของ look-and-feel ของไฟล์ JSP ที่เป็นเช่นนี้เพราะ ส่วนที่เป็น data (variables) กับส่วนที่เป็น presentation (HTML) จะอยู่ด้วยกันอย่างหลวม ๆ ดังนี้เราจึงสามารถเปลี่ยนตัว presentation เมื่อไหร่ก็ได้ โดยตัว JavaBean ที่ใช้เก็บค่าของ variables ต่าง ๆ ยังคงเหมือนเดิม

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

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

ในการใช้งานกล่อง (JavaBean) ดังกล่าวร่วมกับ JSP เราสามารถที่จะสร้างกล่องขึ้นมาโดยใช้ <jsp:useBean …/>, ส่งค่าเข้าไปในกล่องโดยใช้ <jsp:setProperty …/> และอ่านค่าต่าง ๆ ที่อยู่ในกล่อง โดยใช้ <jsp:getProperty …/> tag แต่ก่อนที่เราจะเรียนรู้ถึงการใช้ tag เหล่านี้ เรามาพูดถึง JavaBean ในรายละเอียดอีกซักเล็กน้อยเสียก่อน

ที่มา : http://www.jarticles.com/jsp/actions.html

เรื่องมันมีอยู่ว่า…

หลังจากที่ได้รับมอบหมายให้เขียนโปรแกรมในส่วนของ Bean ออฟก็เปิด Eclipse แล้วนั่งพิมพ์จนเสจผลปรากฏว่า

1. เสีัยเวลาประมาณเกือบชั่วโมง ในการพิมพ์ (ต้องเขียนทั้งหมดประมาณ 10 ไฟล์ และแต่ละไฟล์มีฟังก์ชั่นประมาณ 5-10 ฟังก์ชั่น)

2. มีบางฟังก์ชั่นพิมพ์ get กับ set สลับกัน

3. พิมพ์ไม่ครบด้วยความเบลอๆๆ

จะเห็นได้ว่าเกิดความเน่าๆ ขึ้นมากมาย แล้วพอมาบ่นๆกับเพื่อน ๆเลยได้ตัวช่วยที่ง่ายมากๆมา (แล้วทำไมไม่บอกตั้งแต่แรกก็ไม่รู้อะ = =)

ขั้นตอนง่ายๆ ในการสร้าง

1. หลังจากที่สร้างตัวแปรทีต้องการใช้งานเสร็จแล้ว

2. ให้คลิกขวาเลือก Source > Generate Getters and Setters

3. เลือกว่าต้องการจะสร้างของอันไหนบ้าง แล้วกด OK

4. ผลที่ได้ถูกต้องและรวดเร็ว

คำคมวันนี้ : “รู้ช้าดีกว่าไม่รู้”

• Kaspersky เว็บไซต์ http://www.kaspersky.com/virusscanner
• Symantec เว็บไซต์ http://security.symantec.com
• McAfee เว็บไซต์ http://us.mcafee.com/root/mfs/scan.asp?affid=56
• Bitdefender เว็บไซต์ http://www.bitdefender.com/scan8
• Windows Live OneCare เว็บไซต์ http://onecare.live.com/site/en-us/default.htm
• Panda Security เว็บไซต์ http://www.pandasecurity.com/homeusers/solutions/activescan