webpage – Page 2

การสร้างงานและส่งออกไปเป็นเว็บเพจด้วย fireworks CS4

18 ก.พ.54 มีเพื่อนชื่อ ธรณ. สร้างงานไว้ด้วย Adobe Fireworks CS4 และใช้พัฒนาควบคู่ไปกับ Adobe Dreamweaver CS4 ซึ่งมีแนวทางการนำมาแก้ไขปรับปรุง ทั้งเปลี่ยนสี เปลี่ยนภาพ แต่ใช้ theme เดิม ดังนี้
1. เปิดแฟ้มต้นฉบับและทำงานออกแบบให้แล้วเสร็จ ตัวอย่างนี้เป็นภาพขนาด 2000 * 1000 pixels และจะเก็บในสกุล .png ซึ่งเป็นรูปแบบของ fire works ซึ่งขั้นตอนแรกมีรายละเอียดในการออกแบบ และใช้งานมากมายตามความซับซ้อนของเนื้องาน
2. จัดเก็บอีกครั้งด้วยการ save as เป็นแบบ Flattened PNG กำหนดขนาดเป็น 50% ผลคือแฟ้มนี้มีเพื่อนส่งออกไม่สามารถแก้ไขรายละเอียดได้ง่ายเหมือนต้นฉบับ และขนาดภาพคือ 1000 * 500 pixels เพื่อนำไปเป็นเว็บเพจ ซึ่งวางแผนไว้ว่าเว็บเพจกว้าง 1000 pixels และภาพถูกตัดออกเป็นชิ้นให้ download ได้อย่างรวดเร็ว แทนการใช้ภาพใหญ่เพียงภาพเดียว
3. ใช้ select tool สร้างพื้นที่ที่ต้องการตัด แล้วเลือก edit, insert, rectangular slice ผลการ slice จะเกิดขึ้นผลการตัดภาพใน web layer สำหรับเทคนิคตัดภาพนี้คล้ายกับที่เคยพบในโปรแกรม imageready แต่ปัจจุบันถูกรวมเข้าเป็นส่วนหนึ่งของ photoshop ตั้งแต่รุ่น CS2 ไปแล้ว หากจะตัดภาพทำ gif animation ก็ใช้ photoshop ได้เลย
4. ขั้นสุดท้ายส่งงานออกไปใช้ด้วยการเลือก file, export เป็น HTML and images ก็จะได้แฟ้ม html พร้อมภาพอีกหลายภาพ ที่จะไปใช้งานใน dreamweaver หรือควบคุมด้วย php ใน editor ใด ๆ ต่อไป
+ http://www.thaiall.com/fireworks/

การนำวีดีโอจากเทปใน SONY DCR ลงเว็บ

การนำวีดีโอจากเทปใน SONY DCR-TRV33E MiniDV ลงเว็บแบบ Streaming

1. เปิดตัวเลือก USB Streaming เป็น on ในเมนูของกล้อง
2. ติดตั้ง Driver สำหรับเชื่อม USB จากกล้องเข้าเครื่อง
3. เชื่อมสายจากกล้องเข้าเครื่องคอมพิวเตอร์ แล้วสั่ง play จากกล้อง
4. เปิดโปรแกรม Windows Movie Maker แล้ว Capture from video device
5. เมื่อสั่ง Start, Capture จะถ่ายวีดีโอไปยังแฟ้ม .wmv ทีละเฟรม เทียบเท่าเวลาที่บันทึกในวีดีโอ
6. ใช้โปรแกรม Total video converter หรือ Formatfactory แปลง .wmv เป็น .flv
7. ใช้ FlowPlayer แสดงแฟ้ม .flv แบบ Streaming
+ http://www.thaiall.com/media

<html><head>
<script type="text/javascript" src="flowplayer-3.2.4.min.js"></script>
</head><body>
<a href="http://www.xxx.com/x.flv"
style="display:block;width:425px;height:300px;" id="player"></a>
<script>flowplayer("player", "flowplayer.swf");</script>
</body></html>

ระบบ Comment ของ fb สำหรับเว็บเพจภายนอก

15 พ.ย.53 มีโอกาสทดสอบระบบ Comment ของ fb ซึ่งสามารถนำมาแปะกับเว็บเพจหน้าใดก็ได้ในเว็บไซต์ของเรา .. จากการทดสอบกับหลายเว็บไซต์ และหลาย Browser ผมยังไม่มั่นใจที่จะนำมาใช้กับมหาวิทยาลัยโยนก เพราะระบบ Comment ที่มีอยู่เสถียรกว่าระบบของ FB มาก ผมทดสอบกับ IE6 จำนวน 3 เครื่อง และ IE7 พบว่า Comment ออกบ้างไม่ออกบ้าง
แม้พยายาม Refresh แล้วก็ไม่ออก .. ตอนผมใช้กับเครื่องบริการนอกมหาวิทยาลัยต้องสร้างเป็น iframe จึงจะทำงานได้ เพราะเรียกใช้ในเว็บเพจที่มี Javascript ของผมจะพบว่าขัดแย้งกัน เมื่อเปลี่ยนไปใช้ iframe ไม่มีปัญหาเรื่องความขัดแย้ง

ถ้าสนใจสามารถ view code แล้วคัดลอกได้เลยครับ
http://www.thaiall.com/facebook/fb_comments.htm

เหตุที่ผมเลิกออกแบบเว็บไซต์ส่วนตัว แล้วแนะให้จิ้ม

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

เป็นเหตุให้ผมขุดความทรงจำเรื่อง template มาได้ ว่าเคยจัดอบรมเรื่องเทมเพจเมื่อปี 2548 และผลการอบรมครั้งนั้น ทำให้ผมรู้ว่าโลกนี้มีความสวยงามอยู่มากมายและหลากหลาย ตั้งแต่นั้นผมจึงไม่ให้เวลากับการออกแบบเว็บไซต์อย่างที่ควร เพราะวัตถุประสงค์ของเว็บไซต์ คือ การให้ข้อมูลมิใช่การออกแบบ ถ้าจะออกแบบให้สวยงาม ก็แค่ชี้นิ้วไปยังเทมเพจที่ต้องการ แล้วก็เนรมิตในเวลาชั่วข้ามคืน ซึ่งนักพัฒนาที่รับจ้าง สามารถรับงานพัฒนาเว็บเพจที่สวยที่สุดในเวลาชั่วข้ามคืนเท่านั้น ถ้ารู้จักการใช้ template แต่ถ้ามานั่งออกแบบเองก็คงไม่มีอะไรรับประกันได้ว่าจะถูกใจเจ้าของธุรกิจคนนั้นหรือไม่ .. เพราะอังกฤษ อเมริกา อินเดีย จีน พม่า ต่างก็มองผู้หญิงสวยกันไปคนละแบบ แต่วัตถุประสงค์ของการมีคู่ครองคงมิใช่ความสวยเพียงอย่างเดียว นางงามจักรวาลก็ยังเลิกกับสามีมาแล้วหลายคน เพราะความสวยอย่างเดียวไม่พอ ต้องดูเนื้อหาเป็นสำคัญครับ ว่าจะอยู่กันยืดหรือไม่ .. ดังโบราณท่านว่ารักง่าย หน่ายเร็ว .. เว็บไซต์ขององค์กรหลายแห่งเห็นสวยมาหลายรุ่น เมื่อเปลี่ยนผู้ดูแล ความสวยนั้นก็ถูกหน่ายไปในที่สุด ที่ยังต้องอยู่คือเนื้อหา และวัตถุประสงค์ที่ชัดเจนสอดรับกับแผนกลยุทธ์ขององค์กร
http://www.thaiall.com/template
http://www.freelayouts.com
http://www.templatesbox.com/templates.htm
http://www.steves-templates.com/templates.html

การเขียนเว็บเพจ 3 หน้าด้วย DOS

8 ส.ค.53 จัดทำวีดีโอคลิ๊ปสาธิตการเขียนเว็บเพจ 3 หน้าด้วย DOS Command มีขั้นตอนดังนี้ 1) เว็บเพจแรกชื่อ a.htm มีคำว่า ant และเชื่อมโยงไปยัง b.htm 2) เว็บเพจที่สองชื่อ b.htm มีคำว่า boy และเชื่อมโยงไปยัง c.htm 3) เว็บเพจที่สามชื่อ c.htm มีคำว่า cat และเชื่อมโยงกลับมายัง a.htm 4) เปิดเว็บเพจ a.htm ด้วย explorer ซึ่งบทเรียนนี้ไปเกี่ยวข้องกับการใช้คำสั่งดอส การเขียนแบทไฟล์ การเขียนเว็บเพจ และความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์
+ http://www.youtube.com/watch?v=LXRUblip8P4
+ http://www.thaiall.com/assembly/internalcmd.htm

การปรับปรุงเว็บเพจแบบ static จำนวน 100 เว็บเพจ

24 มิ.ย.53 มีโอกาสต้องแก้ไขแฟ้มจำนวน 100 เว็บเพจที่เป็นแบบ static และอยู่ใน folder แตกต่างกัน จึงใช้วิธีเปิดแฟ้มผ่านโปรแกรมแบบ batch เพื่อเปิดแฟ้มทั้งหมดพร้อมกัน ด้วยการสั่งให้ editplus เปิดแฟ้มทั้งหมด แล้วจัดการทุกแฟ้มพร้อมกันได้ง่าย (ต้อง regist โปรแกรมก่อนนะครับ ไม่งั้นเปิดทีเดียว 100 แฟ้มไม่ได้) สิ่งที่ต้องการจัดการคือ sponsor frame ผลการทดสอบใช้ editplus พบว่า editplus สามารถรองรับแฟ้มจำนวน 100 แฟ้มได้ เมื่อแก้ไขจนแล้วเสร็จ ก็ใช้ filezilla สั่ง upload folder ทั้งหมด พบว่า สามารถส่งแฟ้มที่ใหม่กว่าเข้าไปทับแฟ้มเก่าได้อัตโนมัติ ผมเพียงแต่เลือก folder ทั้งหมด แล้ว upload ด้วยโปรแกรม filezilla ซึ่งทำหน้าที่เลือกเฉพาะแฟ้มที่ใหม่กว่าในแต่ละ folder ไปทับแฟ้มเก่ากว่าใน folder ของเครื่องที่ทำการ remote เข้าไป .. มีผลถูกต้อง
เช่น “C:\Program Files\EditPlus 2\editplus.exe” d:/thaiall.com/thai/kingsong.htm

สร้าง fan box ของ facebook ไปใส่ในเว็บเพจ

9 มี.ค.53 การสร้าง fan box แล้วเปิดให้เพื่อนที่เป็นสมาชิกของ facebook สมัครเข้าเป็น fan ใน box ของเรา มีขั้นตอนดังนี้ 1) เข้า facebook widgets หรือ Create a Profile Badge อยู่ล่างสุดท้างซ้ายของ profile 2) เข้า Page Badges แล้วคลิ๊ก created a Page จนแล้วเสร็จ 3) เข้า Widgets Home ตามด้วย Fan Box แล้วเลือก Other ก็จะมี javascript ให้ 4) นำ javascript ไปวางในเว็บเพจ ของผมไปวางไว้ใน thaiall.com/members ก็สำเร็จตามที่เคยเห็น yoso ใช้งานนั่นเอง 5) ผมเป็น creator ยังต้องเปลี่ยนตัวเองเป็น fan จะได้เข้าไปอยู่ใน fan Box ถ้าเข้าดู box ก็เข้าผ่าน profile และ boxes ในเมนูบาร์ด้านบน
+ http://www.thaiall.com/members/