icon เป็นสิ่งจำเป็นลำดับต้นๆ ของการทำเว็บในปัจจุบัน นอกจากจะช่วยให้หน้าเว็บสวยงามแล้ว ยังเป็นตัวที่ใช้บ่งบอกความหมายของตำแหน่งต่างๆ ในหน้าเว็บเพจ ทำให้ผู้ใช้ ไม่ต้องตีความอะไีรเพิ่ม เพียงเห็นไอคอน ก็รู้ได้ว่า ตรงส่วนนี้ใช้ทำอะไร หากเราใช้ไอคอนให้ถูกที่ ถูกเวลา ก็จะเป็นการสื่อความหมายได้อย่างดเยี่ยมเลยทีเดียว เช่น ไอคอน rss feed สีส้ม เห็นปุ๊บก็รู้ปั๊บ ไม่ต้อง บรรยายอะไรเพิ่มเติม

เราจะหาไอคอนสวยๆได้ที่ไหน? โหลดมาแล้วได้ใช้มั่งไม่ได้ใช้มั่งหงุดหงิดรำคาญใจ เปลืองเนื้อที่?

เรามาใช้บริการของ Icon search engine กันดีกว่า มี 3 ที่ ทดลองใช้แล้วรู้สึกว่าเวิร์คครับ หาไว ได้ตามต้องการ ได้ไอคอน png สวยๆ สไตล์ เว็บ 2.0

http://www.iconlet.com/

http://www.searchicon.net/

http://www.iconfinder.net/

ทดลองใช้กันดูครับ ส่วนอันนี้เจ้าของเว็บเมล์มาให้ช่วยลงให้ ผมเห็นว่ามีประโยชน์ดีก็ลองเข้าไปดูครับ มีไอคอน สวยๆ มากมายเลย ดาวน์โหลดฟรีครับที่ http://www.freeiconsdownload.com
สำหรับคนที่อยากได้ไอคอนเซ็ตเป็นชุดๆ แปลกใหม่สวยงาม ลองเข้าไปดูได้ที่ลิ้งค์ตามนี้
อ่านต่อ คลิกที่นี่ »

สวัสดีครับ สำหรับคนที่กำลังศึกษาการทำเว็บ หรือว่าจะหัดเขียน css xhtml แน่นอนว่าก็ต้องมีพื้นที่สำหรับทดลองทำเว็บกัน ของแบบนี้อ่านอย่างเดียวไม่เคยลองเขียนด้วยตัวเอง เราก็จะไม่เข้าใจมันจริงๆ นะครับ ดังนั้น เรามาสร้างพื้นที่ สำหรับ ทำเว็บกัน โดยไม่เสียค่าใช้จ่ายอะไรเลย เพราะเราจะใช้ บริการ ฟรี โฮสติ้ง และ ฟรีโดเมนกัน

เริ่มแรก เราก็ไป ตั้งชื่อโดเมนกันก่อน ไปที่เว็บ
http://co.cc/

• กรอกชื่อที่เราต้องการ ในช่อง แล้วกด check
• ถ้าชื่อนี้ยังไม่มีคนจอง ก็จะมีข้อความขึ้นว่า
  Congratulations! www.yourdomain.co.cc is available.
• แปลว่าเราสามารถจดชื่อนี้ได้ ก็กดที่ register now
• กรอกข้อมูลยืนยันตัวตน ที่อยู่ ok
• จะมีข้อความยืนยัน ว่า We have received your request for domain name registration.
  www.yourdomain.co.cc Please set up the domain in 48 hours. หมายถึงเรียบร้อยแล้ว แต่ให้ มาเซ็ตอัพโดเมนนี้ใน 48 ชม. ไม่งั้นระบบจะลบออก

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

Free hosting

สำหรับพื้นที่ฟรี ที่ไม่มีโฆษณามากวนใจ

http://www.000webhost.com/

• พื้นที่ 250 mb
• แบนวิธ 100 gb
• มี (cpanel)
• support php, Mysql, perl
• ไม่มีโฆษณา

รายละเอียดมากกว่านี้ ลองไปดูที่เว็บละกันนะครับ สมมติผมเลือก 000webhost เข้าไปที่เว็บ แล้วคลิก order now ครับ จากนั้นเอาโดเมน ของเราที่สมัครไว้ ใส่ใน ช่องแรก ใส่ชื่อ อีเมล์ พาสเวิด ติ๊กช่อง I aggree to Terms Of Service แล้วกด continue เรียบร้อยครับ ระบบ จะแสดง domainname username password ของเราและส่ง ข้อมูลไปไว้ที่เมล์เราด้วย จากนั้น ในหน้านี้ กดปุ่ม setup account ได้เลยครับรอสักครู่ เมื่อเรียบร้อย ระบบจะแสดงข้อมูลที่จำเป็นให้เราครับ ทั้ง nameserver account details และ ftp account ไว้สำหรับ upload ก็อปปี้ข้อมูลในหน้านี้ ใส่ word เก็บไว้เลยก็ดีครับ

จากนั้นให้ก็อปปี้ตัว
ns01.000webhost.com
ns02.000webhost.com

ไปใส่ไว้ที่ domain ของเราครับ จากหน้าเดิมที่เราเปิดค้างไว้ เมื่อกี๊ กด Set up domain ครับ จากนั้นกด please setup แล้วติ๊กช่อง Manage DNS ครับ ใส่ Name Server1 เป็น ns01.000webhost.com ใส่ Name Server2 เป็น ns02.000webhost.com กด set up domain เรียบร้อยครับ

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

เท่านี้เราก็มีเว็บเป็นของตัวเอง จะลองอะไรหัดเขียนอะไรก็ลองเลยครับ

หายไปนานเลยครับ web master ไม่ค่อยจะมา talk กัน เพราะ ทำแต่งานครับ หนังไม่ได้ดู ไม่ได้เที่ยวไหน เลยไม่รู้จะคุยอะไร และก็ไม่ค่อยได้เข้ามาอัพเดทเว็บเลย 2-3 เดือนมาแล้ว วันนี้ได้ฤกษ์ ก็มาแจ้งข่าวสารกันซักหน่อย ว่ายังอยู่ดีนะครับ ไม่ได้ตีจากกันไปไหน ก็ยังมีเรื่องให้ เขียนอีกมากมายเลย อยู่ที่ว่า จะมีอารมณ์เค้น สิ่งที่อยู่ในหัว ออกมาแค่ไหน ใครอยากรู้เรื่องอะไร หรือ มีเรื่องที่เขียนเอง ที่เกี่ยวกับการทำเว็บไม่ว่าจะเป็น ข่าวสาร หรือ บทความ ก็ ติดต่อมาที่ cssmarter@divland.com ได้เลยนะครับ ถ้าเห็นว่ามีประโยชน์ ก็จะโพสต์ ขึ้นทันที

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

ถ่ายด้วย มือถือ N82 ครับ จริิงๆขนาดใหญ่ แต่อัพขึ้นแล้วเค้า ลดความละเอียดลงเลยชัดได้แค่นี้ เชิญชมเลยครับ
อ่านต่อ คลิกที่นี่ »

เรามาทำกล่องขอบโค้ง โดยใช้รูป มุมมน และเขียนแบบพื้นฐาน ด้วย html แบบ standards กัน ผมขอเสนอ วิธีที่เคยใช้ง่ายๆ 3 แบบด้วยกัน ลองนำไปใช้ ตามโอกาส

แบบที่ 1 ตัดรูป ขอบด้านบนและล่างมาแบบนี้

= curve_top.gif

= curve_bottom.gif

เขียน html ดังนี้

<div class=”curvetop”></div>
<ul>
<li>aaaa</li>
<li>bbbb</li>
<li>cccc</li>
</ul>
<div class=”curvebottom”></div>

เขียน css ดังนี้
<style type=”text/css”>
.curvetop {background:url(curve_top.gif) no-repeat; height:9px; font-size:1px}

.curvebottom {background:url(curve_bottom.gif) no-repeat; height:9px; font-size:1px}

ul {background:#8ACA80; margin:0; padding:0 10px 0 10px; list-style:none; width:157px}

li {border-bottom:1px #FFFFFF dashed}
</style>

ได้ผลดังนี้

ไม่มีอะไรมาก ก็ใส่รูปที่ .curvetop และ .curvebottom แล้วก็ใส่สี ที่ ul ใส่ เส้นประที่ li ส่วนที่ว่าทำไมต้องใส่ font-size:1px อ่านอันนี้ประกอบ การจัดการกับความสูง และ อ่าน อันนี้ด้วยก็ได้ ถ้ายังไม่เข้าใจ ul li เรียนรู้การใช้ ul li step by step
อ่านต่อ คลิกที่นี่ »

วันนี้เราก็มี tool ที่ใช้แล้วรู้สึกเวิร์ค จะมาแนะนำกัน เป็น firefox extension ใช้สำหรับ Browser firefox นั่นเอง ตัวแรกเป็น

View source chart

เมื่อเราลง addon ตัวนี้แล้ว เราจะสามารถคลิกขวาที่หน้าเว็บ แล้วเลือกคำว่า view source chart เราก็จะสามารถ ดูซอร์ส โค้ด ของหน้าเว็บ ได้อย่าง advance มากขึ้น โดยจะมีการแบ่ง เป็น สี และ ครอบ object แต่ละก้อนให้เราดูอย่างชัดเจน

ตัวอย่าง

ดาวน์โหลด ตัว addon นี้ ได้ที่นี่ View source chart

Fire shot

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

ตัวอย่าง

แต่ว่าตัวนี้ จะต้องใช้กับ firefox เวอชั่น 2.0 เป็นต้นไป นะครับ ดาวน์โหลด ได้ที่นี่ fire shot 

ผมเคยแนะนำตัว Addon ไปหลายตัวเหมือนกันทั้ง web developer tool bar,  firebug เพื่อนๆ มี addon ตัวไหน ที่ใช้อยู่ ใช้แล้วดี ใช้แล้วมันส์ ก้แนะนำกันมาได้ในคอมเม้น เลยนะครับ บรรยายสักหน่อย ใส่ลิ้งค์มาเลย