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

jQuery เป็น 1 ใน Javascript Library ที่ดังมาก ในด้านการใช้งานง่าย เร็ว และความสามารถสูง ซึ่งเป็นหนึ่งในสิ่งที่ Front-End Developer ควรจะรู้วิธีใช้ไว้ครับ

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

ปกติ TutsPlus จะมีส่วน Premium คือต้องจ่ายเงินเป็นรายเดือน / รายปี แล้วจะได้อ่านเนื้อหาพิเศษ สอนเป็นวีดิโอเลย คราวนี้ก็เป็นโอกาสอันดีที่เค้าแจกฟรีให้เราเรียน 1 คอร์ส นั่นก็คือคอร์ส Learn jQuery in 30 Days หรือ เรียนรู้ jQuery ใน 30 วัน

วิธีการสมัครก็ง่ายมาก:

1. เข้าไปกรอกอีเมลเราที่หน้า Learn jQuery in 30 Days แล้วยืนยันอีเมล
2. ระบบจะส่งอีเมลมาทุกวัน เป็นวีดิโอวันละ 1 ตอน แต่เราไม่ต้องเข้าไปดูทุกวัน รอเสาร์อาทิตย์แล้วเข้าไปดูทีเดียว 5 ตอนก็ได้

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

หากตรงไหนไม่เข้าใจยังไงไปโพสถามใน Facebook Page ของเราได้นะครับ เพราะผมก็คงนั่งเรียนจนจบคอร์สเหมือนกันครับ

สวัสดีครับ กลับมาอัพเดทอีกครั้งหลังจากทิ้งช่วงไปสักพัก ก็ต้องขออภัยด้วยนะครับ อย่างไรก็ตามหน้า Fanpage ของ DesignIL มีการอัพเดทบทความน่าสนใจอยู่ตลอดเวลานะครับ ท่านใดสนใจเรื่องเว็บดีไซน์ ไม่ว่าจะเป็นมือใหม่หัดดีไซน์เว็บไซต์ หรือมือเทพก็แล้วแต่ อยากให้ลองไปเยี่ยมเยียนกันสักครั้ง กด Like กันสักหน่อยก็จะดีมากครับ (แต่ไม่กดก็ไม่เป็นไรนะ)

วันนี้จะมาพูดถึงว่า Front End Developer (นักพัฒนาด้านหน้าเว็บไซต์) และ Web Designer (นักออกแบบเว็บไซต์) ควรจะเรียนรู้เรื่องอะไรบ้างสำหรับใช้ทำงาน เพื่อให้คนที่อยากทำงาน หรือทำงานสายนี้อยู่ ได้เข้ามาอ่านกันว่ามีอะไรตัวเองยังขาดความรู้ด้านไหนไปอีกครับ

โพสนี้ได้รับแรงบันดาลใจมากจาก ImpressiveWebs ครับผม เค้าลิสต์เอาไว้เยอะมาก ๆ ส่วนผมจะเอามาพูดถึงเฉพาะอันที่สำคัญ ๆ และอธิบายคร่าว ๆ ให้ฟังกันครับ

Front-End Developer ควรรู้อะไรบ้าง

หลายคนอาจจะไม่ชินกับศัพท์คำนี้ (Front-End Developer) จะอธิบายให้ฟังกันก่อนนะครับ

การทำเว็บไซต์เว็บนึงแบ่งได้ง่าย ๆ เป็น 2 ส่วน คือ Front-End (สิ่งที่แสดงผลบนบราวเซอร์ คือ HTML, CSS, Javascript) กับ Back-End (ส่วนประมวลผล หรือโปรแกรมมิ่งนั่นเอง เช่น PHP, Ruby)

เพราะฉะนั้น Front-End Developer จะเป็นคนที่สามารถเขียน HTML, CSS และ Javascript ได้คล่องเพื่อทำให้การแสดงผลบนเว็บบราวเซอร์ออกมาสวยครับ คนที่ทำงานด้านนี้อาจจะดีไซน์เว็บไซต์ได้ดีด้วย (หรืออาจทำไม่ได้เลยก็ไม่แปลกครับ) เช่นเดียวกับ Web Designer ที่ถ้าทำงาน Front-End ได้ด้วยก็จะหรูมาก แต่ทำไม่ได้ก็ไม่ผิดอะไรครับ

มาดูกันว่าสิ่งที่ควรรู้มีอะไรบ้าง

• HTML4 / XHTML / HTML5
  HTML4 กับ XHTML จะคล้าย ๆ กัน ส่วน HTML5 ก็จะเปลี่ยนไปในระดับนึงครับ
• CSS2 / CSS3
  CSS2 นี่ต้องรู้ครับ ส่วน CSS3 ถ้ารู้ไว้ก็ดี แต่ถึงไม่รู้ก็ยังทำงานได้ครับ
• Javascript / jQuery
  jQuery เป็น Library ของ Javascript ที่จำเป็นต้องรู้ครับ เรียนรู้ได้ง่าย + ใช้ดีมาก ส่วน Javascript แบบสด ๆ ถ้าเขียนเป็นก็ดี แต่ถ้าเขียนไม่เป็นก็ไม่ต้องฝืนครับ
• CSS Framework / CSS Grid Framework / CSS Reset
  พวก Framework นี่ไม่รู้ก็ไม่เป็นไรครับ แต่ว่าง ๆ อาจจะหามาลองใช้สักตัว เพราะถ้าใช้คล่องจะประหยัดเวลาชีวิตไปได้เยอะเลยครับ ส่วน CSS Reset นี่ต้องรู้ครับ
• UX (User Experience) / Usability
  เป็นเทคนิคในการทำเว็บให้ใช้ง่าย และคิดถึงผู้ใช้ครับผม หากไม่ทราบว่ามันคืออะไรแนะนำให้อ่านบทความ UX User Experience คืออะไร เป็นสิ่งที่ควรรู้จริง ๆ ครับ
• Website Speed / Performance Optimization
  หมายถึงการทำให้เว็บไซต์โหลดได้เร็วนั่นเองครับ เดี๋ยวนี้ Google จัดอันดับโดยคำนึงถึงความเร็วการโหลดเว็บไซต์ด้วยนะครับ
• Web Developer Tool / Firebug
  ควรจะศึกษาปลั๊กอินของเว็บบราวเซอร์ที่เอาไว้ช่วยทำเว็บไซต์ครับ ซึ่งทั้ง Firefox ทั้ง Chrome ก็มีปลั๊กอินดี ๆ เยอะแยะเลย สำหรับท่านที่ไม่รู้ว่ามีอะไรบางแนะนำให้อ่านบทความ รวมปลั๊กอิน Firefox เด็ด ๆ สำหรับทำเว็บไซต์ ครับผม
• Responsive Web Design
  เป็นเทคนิคใหม่ในการโค้ดเว็บไซต์ให้ Layout สามารถปรับเท่าขนาดจอได้ครับ คือเปิดในคอมหรือเปิดในมือถือก็ยังสามารถอ่านเนื้อหาได้ง่ายโดยไม่ต้องสร้างเว็บสำหรับ Mobile แยกออกมา
• Mobile Website Development
  หมายถึงการทำเว็บไซต์ใหม่สำหรับมือถือเลย โดยถ้าคนเข้าเว็บไซต์เราผ่านมือถือก็จะถูก redirect ไปยัง URL เว็บไซต์เวอร์ชั่นมือถือนั่นเอง เทคนิคนี้จะทำให้เราควบคุมการแสดงผลหน้าเว็บเวอร์ชั่นมือถือได้ดีกว่าเทคนิค Responsive Enhancement แต่ก็แลกกับเวลาที่ต้องทำหน้าเว็บใหม่
• Cross-Browser / Cross-Platform Development / Cross-Browser Bug (IE6)
  เป็นกรรมของคนทำเว็บไซต์ที่ 1 เว็บไซต์สามารถเปิดได้จากหลายทางเหลือเกิน ทั้ง Firefox, Chrome, Opera, Safari, iPhone, Blackberry etc. ซึ่งการทำให้สวยบนบราวเซอร์เดียวเป็นเรื่องง่าย แต่การทำให้สวยบนทุกบราวเซอร์นี่ยากเหลือเกิน โดยเฉพาะคู่ปรับอันดับ 1 อย่าง Internet Explorer 6 อย่างไรก็ตาม หากเจอปัญหากับ IE แนะนำให้อ่านบทความ เทคนิคสู้รบกับ IE6 IE7 IE8 ครับ
• CSS Preprocessor (LESS / SASS)
  หลายคนอาจเคยได้ยินชื่อ LESS CSS ผ่านหูมาบ้างนะครับ เป็นการเขียน CSS แบบผสมเทคนิคโปรแกรมมิ่งเข้าไปด้วย เช่น เก็บค่า Property ไว้ในตัวแปรแล้วนำมาใช้หลาย ๆ ที่ พอจะแก้ก็แก้ที่ตัวแปรอย่างเดียวพอ ว่าง ๆ จะนำมาเขียนวิธีใช้ให้อ่านกันครับ
• HTML5 Javascript API
  HTML5 ได้เพิ่มความสามารถมากมาย ทั้งการเล่นเพลง เล่นวีดิโอ การวาดรูป การจับที่อยู่ผู้ใช้ ซึ่งเทคนิคพวกนี้ถ้ารู้เอาไว้จะได้เปรียบมากครับ แทนที่เราจะพึ่ง Javascript Library หรือ Flash ในการทำพวกนี้ แนะนำให้ลองหันมาดู HTML5 บ้างครับ แนะนำให้อ่านบทความ ทุกอย่างที่คุณควรรู้เกี่ยวกับ HTML5 ครับผม
• CMS Theme (WordPress, Drupal, Joomla)
  CMS หมายถึงระบบจัดการเว็บสำเร็จรูปทั้งหลายครับ ซึ่งเว็บของเรา (designil.com) ก็ใช้ WordPress อยู่ การเรียนรู้วิธีทำธีมของ CMS ชื่อดังจะทำให้มีโอกาสด้านการหางานเพิ่มขึ้นไปอีกครับ โดยเฉพาะ WordPress มีการซื้อ-ขายธีมกันเยอะมาก
• Font Embedding (@font-face, Cufon, Google Web Font)
  เทคนิคในการใส่ฟ้อนต์หน้าตาประหลาด ๆ ไปใช้บนเว็บไซต์นี่สำคัญมากครับ ซึ่งก็มีหลาย ๆ เทคนิคให้เลือกใช้ หนึ่งในนั้นคือ Google Web Font ซึ่งเคยนำเสนอวิธีใช้กันไปในบทความ Google Font API คืออะไร ลองไปอ่านกันดูนะครับ ใช้ง่ายมาก ๆ เลย
• SEO (Search Engine Optimization)
  SEO คือ เทคนิคการทำเว็บไซต์ให้ Search Engine ชอบ (หลัก ๆ คือ Google) ซึ่งก็มีเทคนิคหลาย ๆ แบบทั้งสายมืดและสายสว่างครับ อย่างน้อยเราควรจะรู้พื้นฐาน SEO นิดหน่อยเพื่อให้เว็บไซต์ออกมาแล้ว Search Engine ไม่รังเกียจ สำหรับท่านที่ใช้ WordPress ลองอ่านบทความ เทคนิคจูน SEO ของ WordPress ให้เทพ ดูครับ รับรองว่ามีประโยชน์แน่นอน

หัวข้อต่าง ๆ ที่ลิสต์ไว้ได้ลองกันหมดหรือยังครับ ถ้าลองหมดแล้วและทำได้ดีทุกอัน ยอมรับว่าความสามารถด้าน Front-End ของคุณอยู่ในระดับสูง หางานได้สบายเลยครับ

สำหรับหัวข้อไหนที่ยังไม่เคยลอง แต่ไม่รู้จะเริ่มจากตรงไหน ก็สามารถสอบถามได้ในส่วนของคอมเม้นท์ครับ ขอบคุณครับ

ตอนนี้หากท่านใดติดตามข่าวสารเว็บดีไซน์ใหม่ ๆ จะเห็นว่ามีเทคนิค HTML5, CSS3 เท่ ๆ ใช้งานง่าย ๆ ออกมาเยอะมาก  โดยเฉพาะ CSS3 นี่น่าจะเป็นสวรรค์ของ Web Designer อย่างเรา ๆ กันเลย

ท่านใดที่ไม่ค่อยได้ติดตามข่าวสารเกี่ยวกับการออกแบบเว็บไซต์ใหม่ ๆ แนะนำให้แวะไปที่ Fanpage ของ DesignIL ครับ ผมจะนำบทความที่น่าอ่าน หรือของฟรีดี ๆ เอามาแจกกันเรื่อย ๆ ครับ

จนถึงตอนนี้ ศัตรูอันยาวนานของนักออกแบบเว็บไซต์ ที่ชื่อว่า Internet Explorer 6 ก็ยังตามรังควานเราอยู่ครับ แน่นอนว่าด้วยความเก่าของมัน มันจึงไม่รองรับ HTML5, CSS3 เท่ ๆ ที่เราอยากใช้เลยครับ (แค่ CSS 2 ก็เรนเดอร์แปลกกว่าชาวบ้านแล้ว)

บทความนี้จึงเขียนขึ้นมาโดยรวบรวมจากทั้งประสบการณ์ และบทความต่าง ๆ ที่ผมได้อ่าน เพื่อใช้วางแผนต่อสู้กับ IE เวอร์ชั่นเก่า ๆ ครับ เพราะเว็บบราวเซอร์ (Web Browser - โปรแกรมที่ใช้เปิดเว็บไซต์) ตระกูล Internet Explorer นี่จะเริ่มรองรับ HTML5 กับ CSS3 จริง ๆ จัง ๆ ที่ IE9 นู่นเลย

ผมจะเขียนโดยแบ่งเป็น 2 ตอนครับ ตอนที่ 1 นี้จะเปิดเผยเทคนิค CSS, Javascript และวิธีการเช็คหน้าเว็บที่เรนเดอร์ใน IE เวอร์ชั่นเก่า ๆ ว่าเน่าไม่เน่ายังไงบ้าง ส่วนตอนที่ 2 จะพูดถึงการจัดการลูกค้าที่ต้องการให้เว็บรองรับ IE เวอร์ชั่นเก่าครับ (โดยเฉพาะ IE6)

เคลียร์สนามรบด้วย CSS Reset

หลาย ๆ คนอาจจะทราบกันอยู่แล้วว่า Web Browser แต่ละตัวเนี่ยจะกำหนด CSS พื้นฐานไม่เหมือนกัน เช่น Google Chrome อาจจะกำหนดขนาดฟ้อนต์เริ่มต้นไว้ใหญ่กว่า Internet Explorer(สมมตินะครับ)

CSS Reset เป็นชื่อที่เราใช้เรียกไฟล์ CSS ที่รวมกฎพื้นฐานต่าง ๆ เพื่อจะไปเขียนทับกฎพื้นฐานของแต่ละบราวเซอร์ ทำให้ทุกบราวเซอร์ใช้กฎ CSS พื้นฐานชุดเดียวกันนั่นเอง

โดยไฟล์ตระกูล CSS Reset ก็มีออกมาของหลายเจ้าให้เลือกใช้ครับ อันที่ดัง ๆ ที่คนใช้กันบ่อย ๆ คือEric Meyer CSS Reset (ปกติผมใช้ตัวนี้), HTML5Doctor, Blueprint Reset.css (Blueprint เป็น CSS Framework ที่ดังมาก ๆ) เลือกใช้กันได้ตามสะดวกเลยครับ

ปิดจุดอ่อนของ IE6 ด้วย IE9.js

อันนี้เป็นเครื่องมือที่อยากแนะนำมากครับ เป็น Javascript ที่ช่วยแก้บั๊ก HTML, CSS บางส่วนของ IE6-8 ที่เราเจอกันประจำ (โดยเฉพาะ IE6) และยังเอาไว้แก้ปัญหา PNG พื้นหลังไม่ใสใน IE6 ได้ด้วยครับ สรุปว่าโปรเจคไหนที่ลูกค้าอยากให้ซัพพอร์ท IE เวอร์ชั่นเก่าแนะนำให้แปะอันนี้ไปก่อนเลย

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

สามารถดาวน์โหลดได้ที่ Google Code: IE7.js เลยครับ อยากได้ IE8 หรือ IE9 ก็โหลดได้จากในเว็บนั้นเลย อย่าลืมอ่านตรงหัวข้อ Usage ด้วยครับ เป็นการอธิบายวิธีใช้ให้ถูกต้อง

สอน IE เก่า ๆ ให้เรนเดอร์ CSS3 ด้วย Library ต่าง ๆ

ปัจจุบันมีสคริปต์ต่าง ๆ ที่ช่วยให้ IE เวอร์ชั่นเก่าแสดงผล CSS3 ได้ออกมาหลายตัวด้วยกันครับ ผมจะแนะนำตัวที่น่าสนใจให้นำไปลองใช้ดูกันครับ

CSS3PIE เป็นเครื่องมือสำหรับทำให้ IE6-8 เรนเดอร์ CSS3 สวย ๆ ต่าง ๆ ได้ครับ เช่น border-radius (ทำกรอบมน) ที่หลาย ๆ คนชอบใช้กัน ลองดู ฟังก์ชั่นที่ CSS3PIE รองรับ กันก่อนเลยครับ

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

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

รวมวิธีดูหน้าเว็บไซต์เรนเดอร์ใน IE เวอร์ชั่นเก่า

มาถึงปัญหาสำคัญสำหรับคนเขียน HTML/CSS กันเลยครับ ว่าจะเช็คหน้าเว็บไซต์ใน Internet Explorer เวอร์ชั่นเก่า ๆ ได้ยังไงในเครื่องที่ IE เป็นเวอร์ชั่น 8 เวอร์ชั่น 9 กันแล้ว หรือแม้แต่ใน Mac OS ที่ไม่มี IE ใช้ (จริง ๆ มี IE5 for Mac นะครับถ้าจำไม่ผิด)

ลองดูกันว่ามีวิธีไหนน่าสนใจบ้างในการดูเว็บไซต์เราว่า เปิดใน IE เวอร์ชั่นเก่าแล้วจะเน่ามั้ย

เครื่องมือที่หลาย ๆ คนน่าจะเคยใช้กัน น่าจะเป็น IETester และ MultipleIE ครับ ซึ่งจะมีปัญหาตรงที่เรนเดอร์ได้ไม่ตรงตามจริงครับ หลายท่านอาจจะเคยเจอปัญหานี้มากับตัวแล้ว จึงไม่แนะนำให้ใช้ครับ อีกอย่างคือ Javascript Engine ที่ใช้จะไม่ตรงตามจริงครับ ทำให้เวลาเทสพวก Interaction อาจไม่ตรงกับบราวเซอร์จริง

โปรแกรมที่แนะนำ คือ  IE Collection ครับ การใช้งานจะเหมือนกับ MultipleIE คือเลือกลง Internet Explorer เวอร์ชั่นที่เราต้องการทดสอบได้เลย โดยมีให้ลงตั้งแต่ IE 1.0 เลยทีเดียว (แต่ใครจะไปลงละนั่น) นอกจากนั้น Javascript Engine ที่ใช้ก็เป็นตัวต้นฉบับ ทำให้แน่ใจได้ว่าเรนเดอร์ได้ตรงตามจริง และตรวจเช็ค Interaction ได้ตามจริงเลยครับ

ถ้าเราต้องการเทสเว็บไซต์แบบต้องการแค่ดูว่าเรนเดอร์ออกมาแล้วเป็นอย่างไร ไม่สนใจเรื่อง Interaction บนเว็บไซต์ แนะนำให้ใช้ Browserlab ของ Adobe ครับ อันนี้จะเป็นเครื่องมือออนไลน์สำหรับเรนเดอร์หน้าเว็บไซต์ได้หลายบราวเซอร์ เหมาะมากสำหรับคนที่ใช้ Mac OS ด้วยครับ

สำหรับท่านที่ใช้ Windows และมี IE9 ลงอยู่ ในกรณีที่จะเทสเรนเดอร์เว็บใน IE7-8 สามารถให้Developer Tools ช่วยได้ครับ โดยเปิด IE9 แล้วกด F12 ก็จะมี Developer Tools เด้งขึ้นมา ให้คลิกตรง Browser Mode แล้วเปลี่ยนเป็น Internet Explorer 7 หรือ Internet Explorer 8 ครับ

บทความอ้างอิง และบทความต่าง ๆ ที่น่าอ่าน

สุดท้ายนี้จะเป็นลิสต์บทความที่ผมอ่านเพื่อนำมาเรียบเรียงในบทความนี้ และบทความที่น่าอ่านเพิ่มเติมเกี่ยวกับเรื่องนี้ครับ

• Reliable Cross-Browser Testing Part 1 – Smashing Magazine
• CSS Differences in Internet Explorer 6, 7, and 8 – Smashing Magazine
• CSS Reset for HTML5? – Stack Overflow

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

สวัสดีครับ วันนี้มีค่ายฟรี ๆ ดี ๆ มาแนะนำกันครับ สำหรับน้อง ๆ มอปลายตั้งแต่เพิ่งขึ้นม. 3 ไปจนถึงคนที่เพิ่งจบม. 6 เตรียมขึ้นมหาลัย ก็สามารถมาเข้าค่ายนี้กันได้ทุกคนครับ ^^ (คนที่เข้ามหาลัยไปแล้วก็ไม่ต้องเสียใจไปครับ เรามีค่าย YWC ที่จะจัดขึ้นในช่วงท้ายปี สำหรับเด็กมหาลัยครับ) เรามาดูกันว่าค่าย JWC3 นี้เกี่ยวกับอะไรครับ

Junior Webmater Camp 3 คืออะไร?

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

สำหรับปีที่แล้วในค่าย JWC2 เราไม่มีการแบ่งรับสมัครเป็นสาขาครับ แต่ปีนี้พิเศษหน่อยมีการแบ่งเป็น 3 สาขาดังนี้

1. Web Design – อยากดีไซน์เว็บไซต์ให้สวย ดึงดูดคนเข้า ดีไซน์อย่างไรให้เว็บออกมาดูดีและสื่อความหมายได้ดี อยากรู้ต้องสมัครเข้าสายนี้เลยครับ!
2. Web Content – เคยได้ยินมั้ยครับว่า “Content is King” เนื้อหาของเว็บเป็นส่วนสำคัญมากครับ ถ้าอยากรู้ว่าต้องเขียนอย่างไรให้น่าสนใจ คนอ่านติดงอมแงม ต้องมาสมัครสายนี้กันครับ
3. Web Marketing – การตลาดของเว็บก็สำคัญไม่แพ้ด้านอื่น ๆ เลย การทำให้เว็บมูลค่า 10,000 บาทกลายเป็น 10 ล้านบาทก็ต้องมาจากการตลาดนี่แหละ อยากรู้ความลับของสายนี้ก็ต้องสมัครกันเลย!

แต่ละสาขารับ 20 คนนะครับ ยกเว้น Web Marketing สายนี้โหดจริง ๆ รับแค่ 10 คนเท่านั้นครับ!

นอกจากนี้ยังได้พบปะพูดคุยกับเว็บมาสเตอร์ชื่อดัง และคนในวงการจากหลาย ๆ เว็บไซต์ เช่น Dek-D.com, Sanook.com, Tarad.com, Designil.com (อันหลังไม่ใช่แล้วครับ 55)

Junior Webmaster Camp 3 จัดที่ไหน เมื่อไร?

ค่ายนี้เป็นค่าย 2 วัน 1 คืน จัดขึ้นในวันเสาร์-อาทิตย์ที่ 7-8 พฤษภาคม 2554 ครับ โดยจัดขึ้นที่ มหาวิทยาลัยราชภัฏจันทรเกษม ถนนรัชดาภิเษก กรุงเทพ สำหรับน้อง ๆ ที่ต้องเดินทางมาจากต่างจังหวัดก็ไม่ต้องกลัวครับ เพราะก่อนวันค่ายจะมีบอกวิธีเดินทางมาอย่างละเอียดครับผม

สมัครค่าย Junior Webmaster Camp 3 ได้ที่ไหน?

สามารถคลิกได้ที่แบนเนอร์ด้านข้าง หรือลิงค์ด้านล่างนี้เลยครับ:

สมัครเข้าค่าย Junior Webmaster Camp 3 ที่นี่!

หากมีข้อสงสัยอะไรเกี่ยวกับค่ายนี้ สามารถไปสอบถามได้ใน เว็บบอร์ด ของค่ายได้เลยครับผม

สไลด์นี้เก็บตกมาจากงาน WPDevNight ครับ เป็นงานพบปะพูดคุยของคนทำเว็บไซต์ด้วย WordPress ครับผม (เว็บไซต์นี้ก็รันบน WordPress เหมือนกันครับ) โดยเนื้อหาจะเน้นเกี่ยวกับคนที่ “ทำ” เว็บไซต์ หรือ Web Developer ครับ ถ้าใครที่เป็นคนเขียนบลอคเฉย ๆ ไม่มีความรู้พวก HTML CSS PHP นิดหน่อยอาจงง ๆ ได้ครับ

สำหรับเนื้อหางานสามารถตามไปอ่านได้ที่ลิงค์เว็บไซต์หลักด้านบนได้เลยครับ ใครที่พลาดงานนี้ไปเอาไว้เจอกันใน Wordcamp (งานที่รวมทั้ง Developer & Blogger ที่ใช้ WordPress มาพูดคุยกัน) ครับผม

ผมเองก็พลาด WPDevNight เหมือนกัน แต่ไม่เป็นไรครับ ดีที่งานนี้ใช้การเขียนสิ่งที่บรรยาย (อาจจะไม่หมด) เข้าไปในเว็บ Smallpad.org ซึ่งเปิดให้ทุกคนสามารถเข้าไปอ่านได้ครับ มาดูกันเลยครับว่ามีอะไรที่น่าอ่านกันบ้าง

1. Web Design Business with WordPress

เปรียบเทียบ WordPress กับ CMS ตัวอื่น ๆ, วิธีการทำให้ลูกค้าเข้าใจเกี่ยวกับ CMS, ข้อดีของ WordPress, รูปแบบเว็บไซต์ที่ควรใช้ WordPress ทำ อ่านเนื้อหา Web Design Business with WordPress

2. WordPress Showcase & Plugin

รวมปลั๊กอินเวิร์ดเพรสต่าง ๆ ที่น่าสนใจ โดยแบ่งเป็นหมวดหมู่ และถ้าที่ลิสต์เอาไว้มีไม่พอ ก็มีลิงค์ให้ตามเข้าไปดูคลังปลั๊กอินเจ๋ง ๆ รวบรวมโดย @iannnnn ครับผม อ่านเนื้อหา WordPress Showcase & Plugin

3. WordPress Theme Design

สอนทำธีม WordPress โดยพูดถึง CSS และ Template Tag สำคัญ ๆ ต่าง ๆ ในธีม WP ดูสไลด์ได้ด้านล่างเลยครับผม อ่านเนื้อหา WordPress Theme Design

4. Interview with @ipeerapong

เชื่อว่าเว็บดีไซเนอร์หลาย ๆ คนที่ติดอกติดใจกับ WordPress น่าจะรู้จักเว็บไซต์ themeforest.net บ้างครับ เป็นเว็บไซต์ขายธีม WP ที่ใหญ่และคุณภาพดีมากเว็บหนึ่ง แล้วก็เคยมีการเอา Theme WordPress มาเซลล์ด้วย

ผมเคยได้ยินมาบ้างว่ามีคนไทยไปขายอยู่ด้วย ซึ่งคุณ @ipeerapong นี่แหละครับที่เป็นคนไทยที่ขายธีมเวิร์ดเพรสใน themeforest แล้วได้กำไรเป็นกอบเป็นกำ ใครสนใจอยากลองหรืออยากรู้ว่าเป็นยังไง ต้องอ่านครับ อ่านเนื้อหา Interview with @ipeerapong

5. WordPress Plugin Development

แนะนำพื้นฐานสำหรับคนที่สนใจอยากเขียนปลั๊กอิน WordPress เป็นครับ คนที่อยากทำแต่ไม่รู้จะเริ่มต้นยังไงสามารถเข้าไปอ่านได้เลยครับผม อ่านเนื้อหา WordPress Plugin Development

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

ใครที่ได้ไปงานนี้มาแล้วรบกวนช่วยบอกเล่ากันหน่อยนะครับว่าในงานเป็นอย่างไรบ้าง ขอบคุณมากคร้าบ

หลังจากที่ปกติเจอแต่บทความรวมโปรแกรมสำหรับเขียน HTML & CSS บน Mac ในที่สุดก็เจอบทความรวมโปรแกรมเขียนโค้ดของวินโดว์ครับ จริง ๆ อยากเขียนรวบรวมเองทั้งหมดเหมือนกันครับ แต่ผมก็ไม่ได้ใช้โปรแกรมเยอะขนาดนั้นเลยไม่ค่อยรู้จักเท่าไร ใช้แค่ที่ถนัด ๆ อยู่ตัวเดียวเองครับ (ส่วนตัวอื่นอาจเคยลองผ่าน ๆ มาแต่ยังไม่ประทับใจ)

ตอนนี้การเขียน HTML5 และ CSS3 ก็มาแรงมาก ๆ ถ้ามี Editor เอาไว้ช่วยเขียนจะทำงานได้เร็วขึ้นมากเลยครับ

โปรแกรมที่ผมใช้บ่อย ๆ ตอนเขียน HTML กับ CSS บน Windows ก็คือ:

Notepad++ สุดยอด Text Editor สำหรับเขียน HTML/CSS/PHP

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

• Highlight Syntax (ใส่สี syntax แต่ละส่วนแยกเป็นคนละสี เพื่อให้อ่านโค้ดได้สะดวกขึ้น) ได้หลายภาษาเลยครับ ตั้งแต่ Assembly ยัน PHP เพราะงั้นโปรแกรมเมอร์ทั้งมือเก่ามือใหม่ ทั้งคนที่เขียนเว็บหรือเขียนโปรแกรมทั่วไป ก็ได้ประโยชน์จากโปรแกรมนี้แน่นอน!!
• ขนาดโปรแกรมเพียง 14 mb และถ้าอัด Zip เหลือ 4 mb เท่านั้น!
• ไม่ต้องติดตั้ง เป็นโปรแกรมแบบ Portable ใส่ในแฟลชไดรฟ์ก็พกพาไปใช้ได้ทุกที่ (แบบติดตั้งก็มีให้ใช้ครับ แล้วแต่ชอบเลย)
• ความสามารถต่าง ๆ เทียบเท่าโปรแกรมเสียเงิน โดยเฉพาะอย่างยิ่งความสามารถพิเศษมากมายในเมนู TextFX และ Plugins ของโปรแกรมทำให้จัดการโค้ดสะดวกขึ้นมาก และมีความสามารถที่โปรแกรมเสียเงินหลาย ๆ ตัวไม่มีอีกด้วย
• เปลี่ยน Theme ได้! สำหรับคนที่เบื่อการเขียนโค้ดตัวอักษรสีดำบน Background สีขาวแล้ว ลองมาเขียนโค้ดใน Background เข้ม ๆ บ้างจะติดใจครับ (ตอนนี้ผมก็ใช้แบบ Background สีดำอยู่ครับ ชื่อธีม Monokai)
• ข้อสุดท้าย มันเป็นโปรแกรมฟรี ฟรีและดีจริง ๆ ช่วยให้งานทำเว็บไซต์สบายขึ้นอีกเยอะเลยครับ และด้วยความที่มันไม่มีเวอร์ชั่นเสียตังค์ ความสามารถทุกอย่างของโปรแกรมใช้ได้เต็มที่ ไม่มีล็อคครับ ไม่เหมือนอีกหลาย ๆ โปรแกรมที่มีทั้งเวอร์ชั่นฟรี กับเวอร์ชั่นเสียตังค์

สำหรับใครที่สนใจแล้ว สามารถไปอ่านรายละเอียดเพิ่มเติม และดาวน์โหลดได้ที่

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

โปรแกรมที่อยู่ในลิสต์นี้มีทั้งโปรแกรมฟรี และไม่ฟรีครับ นอกจากนั้นบางตัวก็ไม่ใช่แค่ Text Editor แต่ทำหน้าที่เป็น IDE (integrated development environment) หรืออธิบายง่าย ๆ ว่ามันเป็น Text Editor ที่สามารถ compile/debug/version control และอื่น ๆ อีกมากมายครับ ซึ่งเอาจริง ๆ เราใช้แค่ Text Editor ก็เพียงพอแล้วครับ เพราะ IDE จะเหมาะกับโปรแกรมเมอร์มากกว่า

สวัสดีครับ คราวที่แล้วแนะนำเกมส์เขียนด้วย HTML5 ที่เป็นของใหม่กันไปแล้ว เรามาลองดูของเก่าแต่น่าสนใจกันบ้างครับ

ฟ้อนต์ชื่อ Comic Sans คิดว่าคนส่วนใหญ่ต้องเคยได้ยิน หรือเคยใช้กันมาอยู่แล้วครับ ฟ้อนต์น่ารัก ๆ ที่ติดมากับ Windows ตัวนี้ตอนเด็ก ๆ ที่ผมทำรายงานก็ชอบใช้เหมือนกันครับ มันอ่านแล้วสบายตา แล้วก็ให้ความรู้สึกแบบชิว ๆ ดีด้วยครับ

สำหรับสาเหตุที่มาเขียนบทความนี้ เพราะหลงเข้าไปเจอเว็บ Comic Sans Criminal มาครับ เป็นเว็บไซต์อธิบายว่า ทำไมเราถึงควรเลิกใช้ฟ้อนต์ Comic Sans

ประวัติ: Comic Sans Font เกิดขึ้นมาได้ยังไง

ฟ้อนต์ตัวนี้เกิดขึ้นมาจากฝีมือของพนักงานตำแหน่ง Typographic Engineer ใน Microsoft ครับ โดยเป็นคนเดียวกับที่ดีไซน์ font ชื่อ Trebuchet กับ Magpie สำหรับฟ้อนต์สุดแอ๊บแบ๊วตัวนี้เขาสร้างขึ้นมาเพราะอยากได้อะไรง่าย ๆ ที่มีส่วนโค้ง และให้ความรู้สึกนุ่มนวล ไม่แข็งกระด้างแบบ Times New Roman

ตอนแรกฟ้อนต์นี้ถูกโยนลงถังขยะเนื่องจากปัญหาด้านความสามารถของโปรแกรมในขณะนั้น เพราะฟ้อนต์นี้ไม่สามารถวางลงบนกริดได้ แต่หลังจากนั้นไม่นานก็ได้มีการถูกนำไปใช้กับโปรแกรม Microsoft Movie Maker เวอร์ชั่นแรก และถูกรวมเข้าไปเป็นฟ้อนต์ที่มากับ Windows ตั้งแต่ Windows 95

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

(เล่าแล้วเหมือนดราม่าเลยครับ 55)

ทำไมดีไซเนอร์ถึงไม่ชอบฟ้อนต์ Comic Sans

ในช่วงแรกการดีไซน์บนคอมพิวเตอร์ยังไม่มีใครสนใจเรื่องการเลือก Font มากนักครับ ต่างกับตอนนี้ที่เรื่อง Typography เป็นเทรนด์เว็บดีไซน์อันดับต้น ๆ ของปี 2011 เลยทีเดียว

ต้องบอกก่อนว่าฟ้อนต์ Comic Sans นี่ออกแบบมาสำหรับ:

• ใช้ในกล่องคำพูดของตัวการ์ตูน
• ใช้สำหรับเด็กโรงเรียนประถม อนุบาล
• บัตรเชิญเด็ก ๆ มางานปาร์ตี้ของลูกตัวน้อย

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

อย่างไรก็ตาม ก็ปฏิเสธไม่ได้ว่าการต่อต้านของเค้าค่อนข้างมีเหตุผลครับ ลองมาดูตัวอย่างว่า Comic Sans ไม่เหมาะกับงานแบบไหน

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

ลองคิดง่าย ๆ ว่ามีจดหมายที่เนื้อหาถึงขั้นคอขาดบาดตายส่งมาถึงคุณ แต่ดันใช้ฟ้อนต์ Comic Sans ที่น่ารักนุ่มนิ่มเขียน คุณจะรู้สึกแปลก ๆ หรือเปล่า?

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

สรุปว่าเราควรใช้ฟ้อนต์ Comic Sans มั้ย

ฟ้อนต์ Comic Sans ไม่ใช่ฟ้อนต์ที่ออกแบบมาแย่ครับ มันเป็นฟ้อนต์ที่ออกแบบมาดี และเหมือนกับฟ้อนต์ทั่ว ๆ ไปที่ต่างก็มีที่อยู่ที่เหมาะสมของมันครับ เราแค่ต้องเลือกใช้ให้ถูกกับงานเท่านั้น

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

อ่านแล้วคิดเห็นยังไงโพสคอมเม้นท์ไว้เลยครับ อยากทราบความคิดเห็นที่ทุกท่านมีต่อฟ้อนต์นี้ครับ

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

Young Webmaster Camp 8 คืออะไร?

ค่ายนี้เรียกย่อ ๆ ว่า IYWC8 หรือ INET Young Webmaster Camp 8 นั่นเองครับ เป็นค่ายสอนทำเว็บฟรี ๆ สำหรับนิสิต-นักศึกษาระดับปริญญาตรี (หรือเทียบเท่า) ครับ ไม่จำกัดว่าเรียนมหาวิทยาลัยไหน คณะอะไร ขอแค่มีความสามารถในการทำเว็บก็พอครับ

ค่ายนี้แบ่งผู้เข้าสมัครเป็น 4 สาขาตามความสามารถที่ถนัด ตามนี้เลย:

1. Web Marketing
   การตลาดของเว็บไซต์ ทำยังไงให้เว็บดัง คนเข้าเยอะแยะ โดยไม่ได้สนใจเฉพาะ SEO นะครับ แต่เน้นเรื่องการคิดแผนการตลาดจริง ๆ ที่กลุ่มเป้าหมายเป็นคน ไม่ใช่ Search Engine ครับ สอนโดยผู้มีประสบการณ์จริง ปั่นเว็บไซต์เป็นเงินหลักล้านมาแล้ว
2. Web Design
   สอนการออกแบบเว็บไซต์อย่างเทพ เลือกสีอย่างไร เลือกกราฟฟิกอย่างไร จัดวางเลย์เอาท์เว็บไซต์อย่างไรให้ดึงดูดคน ทำอย่างไรให้ดีไซน์ไม่ใช่แค่ดูดี สวยงาม แต่สื่อความหมายได้ดีอีกด้วย ใครชอบอ่านบลอคนี้ควรไปสมัครอย่างด่วนเลยครับ!
3. Web Content
   เนื้อหาบนเว็บไซต์สำคัญถึงขนาดมีคำกล่าวไว้ว่า “Content is King” แต่ Content จะเป็น King ไม่ได้เลย ถ้าคนที่ทำ Content ไม่มีความสามารถพอ ค่ายนี้จะสอนว่าทำ Content อย่างไรให้เป็น King!
4. Web Programming
   สอนทิป-เทคนิคลับ ๆ ในการเขียนโปรแกรมบนเว็บไซต์ แนะนำเครื่องมือเด็ด ๆ ที่ช่วยทุ่นแรง ลดเวลาการทำ รวมไปถึงเทคโนโลยีใหม่ ๆ ในการทำเว็บไซต์ที่มีมาเรื่อย ๆ ไม่มีสิ้นสุด ใครชอบเขียนโค้ดไม่ควรพลาด!

นอกจากนี้ยังได้พบปะ-พูดคุยกับเว็บมาสเตอร์เจ้าของเว็บไซต์ดัง ๆ มากมาย อาทิ กระปุก Kapook.com, เด็กดี Dek-D.com, ตลาด TARAD.com, ดีไซน์นิล Designil.com (รู้สึกอันหลังไม่เกี่ยว 55) และวิทยากรชื่อดังอีกหลาย ๆ ท่านที่จะมาให้ความรู้ว่า ทำยังไงเว็บไซต์เล็ก ๆ ถึงได้เติบโตเป็นเว็บไซต์ใหญ่โตระดับประเทศ

Young Webmaster Camp 8 จัดขึ้นเมื่อไร ที่ไหน

ค่ายนี้จัดขึ้นในวันที่ 22-25 ตุลาคม 2553 ครับ โดยจัดขึ้นที่ มหาวิทยาลัยนเรศวร จ.พิษณุโลก ภาคเหนือเลยครับ แต่ไม่ต้องห่วงเรื่องการเดินทางนะครับ เรานัดพบกันที่กรุงเทพก่อนเดินทางไป จ.พิษณุโลก อยู่แล้ว ค่าเดินทางไม่ต้องเสียสักบาทเลยครับผม!

วีดิโอโปรโมท IYWC8 แบ่งตามสาขา

วีดิโอโปรโมทค่ายจัดทำโดยทีมงาน Eventpro.in.th ครับ ขอขอบคุณมา ณ ที่นี้ด้วย โดยในวีดิโอจะมีรุ่นพี่มาแนะนำว่าสาขานั้น ๆ เป็นยังไง และแอบบอกด้วยว่าการคัดเลือกแต่ละสาขาทำกันยังไง ใครสนใจอยากสมัครก็ลองไปดูกันนะครับ

ตอนนี้มีวีดิโอออกมาทั้งสิ้น 2 สาขาครับ โดยอีก 2 สาขาที่เหลือจะตามมาเร็ว ๆ นี้ครับ:

IYWC8 – Web Content

Powered by www.eventpro.in.th

IYWC8 – Web Design (ใครชอบเว็บนี้ ต้องดู!!)

Powered by www.eventpro.in.th

อยากสมัคร IYWC8 แล้ว ต้องไปสมัครที่ไหน?

คลิกเข้าไปตามแบนเนอร์ด้านล่างเลยครับ!!

มีข้อสงสัยอะไรเกี่ยวกับค่ายนี้ ถามในส่วนคอมเม้นท์ได้เลยนะครับ! รับรองว่าตอบทุกคอมเม้นท์คร้าบ!!

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

แต่พอดี Envato Birthday Bundle 2010 วางขายครับ เลยต้องรีบมาอัพเดทกัน เพราะเค้าวางขายแค่ 5 วันเท่านั้น!!

หลายคนอาจสงสัยว่ามันคืออะไรกันแน่? Envato เป็นบริษัทที่เป็นเจ้าของเว็บขายกราฟฟิก ธีมเวิร์ดเพรส ธีม XHTML/CSS แฟลช เสียง Texture 3D Model ฯลฯ สำหรับเอาไว้ทำเว็บไซต์ล้วน ๆ เลยครับ

ผมก็ชอบไปเดินตลาดของเค้าบ่อย ๆ โดยเฉพาะที่ GraphicRiver ซึ่งขายกราฟฟิกสำหรับเว็บไซต์ราคาไม่แพง และ ThemeForest ซึ่งขายธีม XHTML/CSS รวมถึงธีม WordPress ในราคาพอรับได้ครับ

ทีนี้เนื่องจากครบรอบ 4 ปีของ Envato เค้าเลยเอาไฟล์ต่าง ๆ ที่เค้าขายแยกบนตลาด เอามาแพ็กขายในราคาพิเศษสุด ๆ ครับ แค่ $20 (630 บาท) เท่านั้น จากราคาเต็ม $400 (12,000 บาท) ครับ

คลิกรูปด้านล่างเพื่อเข้าไปดูเลยครับว่าในแพ็กมีอะไรบ้าง:

ไม่ใช่แค่ไฟล์กราฟฟิก ธีม แฟลช เพลง บลา ๆ ทั้งหมด 50 ไฟล์ที่มาในแพ็กเท่านั้นนะครับ ยังมีคูปองเงินสด $50 (1,500 บาท) สำหรับใช้เช่าโฮสต์ MediaTemple โฮสต์ต่างประเทศชื่อดังที่คุณภาพสูงมาก ๆ (ราคาก็สูงมาก ๆ เช่นกัน แบบถูกสุด $20 / เดือนเลยทีเดียว)

ตบท้ายด้วยคูปองเงินสด $10 (315 บาท) สำหรับซื้อ E-book จาก Rockable Press ครับ หนังสือที่น่าสนใจมาก ๆ สำหรับคนทำเว็บ หรือเว็บดีไซเนอร์ คือ Photoshop to HTML สอนเขียนโค้ด HTML จากไฟล์ PSD (Photoshop) ครับ เล่มนี้แถมวีดิโออีกด้วย

หนังสืออีกเล่มที่น่าสนใจก็คือ Rockstar WordPress Designer หนังสือสอนทำ Theme WordPress สวย ๆ ซึ่งเขียนดีมากจนทำให้การทำธีมเป็นเรื่องง่ายเลยครับ แถมล่าสุดนี้เพิ่งอัพเดทเนื้อหาของ WordPress 3.0 เข้าไป ไม่คุ้มก็ไม่รู้จะว่ายังไงแล้วคร้าบ

รีบ ๆ ซื้อกันนะครับสำหรับ Envato Birthday Bundle ขายแค่ 5 วันเท่านั้นนะครับ !!

สวัสดีครับ บทความสอนดีไซน์เว็บไซต์เป็นภาษาไทยนั้นต้องยอมรับว่าหายากมาก ถึงแม้พวกบทความ Tutorial ภาษาอังกฤษจะอ่านไม่ยากนัก แต่บางครั้งก็มีการใช้ศัพท์เทคนิคซึ่งอาจทำให้คนที่ไม่รู้งงได้ครับ

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

ไม่ต้องกลัวว่าใช้ Photoshop ไม่ค่อยเป็นแล้วจะงงกันนะครับ เค้าสอนแบบละเอียดมาก ๆ ครับ

สำหรับงานดีไซน์ตอนเสร็จแล้วจะเป็นแบบนี้ครับ:

>> อ่านบทความสอนเว็บดีไซน์ใน Photoshop โดย Kotzhul ได้ที่นี่ครับ <<