สรุปความรู้เทพ ๆ จากงาน WordPress Developer Night 3 !!

designil
wpdevnight

งาน WordPress Developer Night เป็นงานที่รวบรวมผู้ใช้ WordPress ทั่วประเทศไทยมาพูดคุยปล่อยของกัน ซึ่งจัดขึ้นโดย TiGERiDEA บริษัทที่โม WP ได้เทพมากบริษัทนึงครับ ครั้งนี้ก็จัดขึ้นเป็นครั้งที่ 3 แล้ว และเป็นครั้งแรกที่ผมได้มีโอกาสไปร่วมงานครับ ได้ความรู้ WordPress ใหม่ ๆ มากมายเอามาฝากท่านที่ไม่ได้ไปครับ
งานนี้แบ่งเป็น 4 Sessions ใหญ่ ๆ ครับ คือ

  1. WordPress Developer Resource โดย @rabbitinblack
  2. HTML + CSS Standards โดย @pornontha
  3. How to find WP clients and make them love you
    โดย Alex & Cory [Pronto Marketing]
  4. WP กับเว็บขนาดใหญ่ โดย @iMenn

มาดูกันครับว่าแต่ละ Session มีอะไรบ้าง ผมโน้ตไว้ประมาณ 90% นะครับ หากขาดตกตรงไหนไปก็ขออภัยด้วย

WordPress Developer Resource

การทำเว็บไซต์ด้วย WordPress ใช้ความรู้ในเรื่อง HTML, CSS, PHP, และ jQuery อันสุดท้ายนี่ไม่เป็นไม่เป็นไร แต่ถ้าเป็นจะทำให้เว็บดูดีขึ้นมากครับ ซึ่งเราสามารถศึกษาแต่ละอย่างผ่านเว็บไซต์ได้เลย เว็บไซต์ที่แนะนำคือ W3schools.com (ฟรี) TeamTreehouse.com (เสียเงิน)

อุปกรณ์ในการช่วยทำธีมคือ Normalize.css จะคล้าย ๆ Reset CSS แต่ไม่เหมือนซะทีเดียวครับ นอกจากนั้นก็มี Framework ที่ช่วยให้ขึ้น Layout เร็วขึ้น แถมยังช่วยด้าน Responsive นั่นก็คือ ZURB Foundation และ Twitter Bootstrap ครับผม (ปัจจุบันคนทำ Bootstrap ลาออกจาก Twitter แล้ว แต่ก็ยังดูแลโปรเจคนี้อยู่ครับ)

นอกจากนั้นก็แนะนำ WordPress Theme Framework ซึ่งเป็นธีมสำเร็จรูปที่จะเหมาะกับโปรแกรมเมอร์หน่อย เพราะจะมีฟังก์ชั่นในการแก้ไขด้วย PHP มาให้ครับ (โดยใช้การ hook, filter ใน WordPress ซึ่งเป็นการแก้ไขขั้นสูงครับ) โดยพูดถึง 3 Frameworks นั่นคือ Theme Hybrid, Gantry, และ Thematics

ต่อไปจะเป็นแหล่งหาความรู้เกี่ยวกับ WordPress ก็จะมี Smashing Magazine, WPTuts+, WPBeginner, และแหล่งที่ผมใช้ประจำ คือ WordPress Codex ครับผม

นอกจากนั้นก็จะให้คนที่มางานช่วยกันแนะนำของดี ๆ ของ WordPress ก็ได้มาเยอะแยะเลยครับ

HTML5 & CSS3 Standards

ช่วงนี้พูดถึงเรื่อง HTML5 และ CSS3 โดยพี่พร เจ้าของเว็บ Thaicss.com

เนื้อหาเรื่อง HTML5 และ CSS3 สามารถอ่านได้จาก บทความในเว็บไซต์ Thaicss.com ได้เลยนะครับ ผมขอพูดถึงเรื่องใหม่ ๆ ที่น่าสนใจนะครับ

เค้าบอกว่ายุคนี้เป็นยุคของ Floating Layout ครับ คือเราทำ Layout กันด้วยการใส่ float ซึ่งเทรนด์ใหม่ที่จะมาเร็ว ๆ นี้คือ Flex-Box ครับ เท่าที่ฟังมาคือเป็นการบอกได้เลยว่าให้กล่องไหนอยู่ตรงไหนของเว็บ เดี๋ยวขอไปหาข้อมูลก่อนแล้วจะมาอธิบายให้ฟังนะครับผม

สำหรับคนที่อยากเรียนรู้ CSS สามารถเรียนได้จาก W3School.com หรือถ้าเก่งแล้วสามารถอ่าน Documentation ของ W3C ได้เลยครับ เหนื่อยหน่อยแต่เข้าใจข้อมูลเชิงลึกจริง เพราะ W3C เป็นคนร่างมาตรฐาน CSS ครับ

นอกจากนั้นยังมีการพูดถึงว่าใน HTML5 ได้มีแท็กใหม่ ๆ เกิดขึ้นมากมายเพื่อมาแทน div แต่ถ้าเราใช้ div แล้วกำหนด attribute role เช่น <div id=”main” role=”main”> ก็สามรถทำให้แท็ก div มีความหมายขึ้นมาได้เช่นกัน

How to make clients love you?

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

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

นอกจากนั้นในการสมัครงานต้องจำไว้ว่า You are your own brand หรือ เราเป็นแบรนด์ของตัวเราเอง เพราะฉะนั้นข้อความใน Facebook, Twitter ต้องคิดให้ดี ๆ ก่อนพิมพ์ ลอง Google ชื่อตัวเองดูว่ามีลิงค์ที่ไม่ดีโผล่ขึ้นมาบ้างหรือเปล่า

Response in 1st 24 hours : ในการคุยงานกับลูกค้า ถ้าลูกค้าใหม่ติดต่อมา เราควรตอบกลับภายใน 24 ชั่วโมง ถึงแม้ว่าจะเป็นช่วงที่เรางานเต็มมือ ไม่สามารถรับได้ ก็ควรจะตอบกลับไปว่าเรายังไม่มีเวลา เพื่อให้ลูกค้าทราบ ถ้าเราไม่ตอบเลยคราวหน้าเค้าก็ไม่ติดต่อเราอีกแล้ว

Be honest about your workload & abilities : คำนวณดูดี ๆ ว่างานทำทันมั้ย แล้วบอกเวลาที่แม่นยำให้ลูกค้า ไม่ใช่ว่าลูกค้าติดต่อมาอยากได้เว็บใน 3 วันก็ตอบตกลงทั้งที่รู้ว่าทำไม่ได้ ปกติ 1 เว็บเล็กถ้าจะเสร็จสมบูรณ์จะใช้เวลาอย่างน้อย 2 อาทิตย์ ควรจะบอกลูกค้าไปตามตรงจะได้ผลดีกว่าทั้งกับลูกค้าและกับเราด้วย

Become genuinely interested in your clients : ก่อนเริ่มทำงานควรจะสนใจลูกค้าให้มาก ๆ ติดต่อบ่อย ๆ เพื่อให้ลูกค้ารู้สึกว่าเราตั้งใจทำงานของเค้าจริง ๆ

Be clear and confident about Pricing : ไม่ควรพยายามให้ราคาถูก ๆ เพื่อลูกค้าจะได้ใช้บริการเรา เพราะถ้าเราได้เงินน้อยกว่าที่ควรจะได้ เราจะไม่มีความสุขเวลาทำงาน ทำให้งานออกมาไม่ดีตามไปด้วย เราควรตั้งราคาในระดับที่เราโอเคจะดีกับตัวเรามากกว่า

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

KFC – Know Your F***ing Clients : ก่อนเริ่มทำงาน เราควรจะทำความรู้จักกับลูกค้าให้มาก บริษัทของเค้าเป็นยังไง สินค้าของเค้าเป็นยังไง เพื่อให้เราทำเว็บไซต์ออกมาได้บ่งบอกความเป็นตัวตนของลูกค้ามากที่สุด

Solve your clients' problem. What problems are you solving? What problems are you creating? : ในการแก้ปัญหาของลูกค้า เช่น ลูกค้าอยากได้ระบบนู้นระบบนี้ เราก็ต้องมาคิดก่อนกว่าการแก้ปัญหาของเรา จะสร้างปัญหาอะไรเพิ่มมั้ย เช่น การใช้ปลั๊กอินที่ตอบโจทย์ลูกค้าสุด ๆ แต่ใช้ยากสุด ๆ ก็จะเสียเวลา Training ตามมา

Build VS Buy? : ในการแก้ปัญหาของลูกค้า เราก็ต้องคิดด้วยว่าควรจะซื้อของสำเร็จรูปมาใช้ หรือพัฒนาใหม่ดี ต้นทุนเวลาในการพัฒนาจะค่อนข้างสูง ลองดูว่ามีขายมั้ย แล้วตอบโจทย์ลูกค้ามากแค่ไหน

Use a Project Management System : ใช้ระบบจัดการโปรเจค เช่น Asana, Basecamp, Zendesk โดยทาง Pronto Marketing จะใช้ Zendesk ในการส่ง Ticket งานไปให้พนักงานบริษัท ว่าใครจะต้องทำอะไรบ้าง แอดมินขอแนะนำ FreedCamp, Producteev, และ Trello สำหรับท่านที่ต้องการใช้ของฟรีครับ

Use CRM (Customer Relation Management) : ใช้ระบบในการติดตามงานกับลูกค้า เนื่องจากถ้ามีลูกค้าไม่กี่คนเราอาจจะใช้แค่อีเมล แต่ถ้ามีเป็นหลักร้อย หลักพัน ควรจะมีระบบในการจัดการลูกค้า เช่น Insightly, Zoho หรือ Capsule CRM

Stay Organized : จัดระเบียบทุกอย่างในการทำงาน ไม่ว่าจะเป็นการจัดโฟลเดอร์ การจัด Layers ในไฟล์ PSD การตั้งชื่อไฟล์ การคอมเม้นท์ในโค้ด สิ่งเหล่านี้จะทำให้เราทำงานได้ดีขึ้น รวมถึงลูกค้าจะชอบที่เรามีระบบระเบียบในการทำงาน

Revision, Shape the path : ในการทำงานกับลูกค้า เป็นไปได้ว่าเราต้องส่งดีไซน์ให้ลูกค้าดู แล้วแก้มากกว่า 1 รอบ ดังนั้นการใช้ระบบที่รวบรวมการแก้ไขทุกครั้ง เช่น ProofHQ หรือ Bug Herd จะทำให้ลูกค้าตรวจเช็คได้ง่ายมากขึ้นว่าดีไซน์ใหม่ต่างกับดีไซน์เก่ายังไงบ้าง หรือทำไปทำมาลูกค้าอาจจะอยากได้ดีไซน์แบบแรกหลังแก้มา 10 รอบ

Hold your client's hand through launch : ผมชอบข้อนี้มากที่สุดครับ เค้าบอกว่าเราควรติดต่อกับลูกค้าตลอดเวลาไปจนถึงตอนเปิดเว็บไซต์เลย ซึ่งว่าง ๆ ก็อาจจะแวะไปทักทายลูกค้าที่บริษัท สิ่งเล็ก ๆ น้อย ๆ เหล่านี้อาจจะช่วยให้ความสัมพันธ์ของเรากับลูกค้าเพิ่มขึ้นอย่างมากครับ

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

Partner Up : อันนี้พูดถึงคนทำ WordPress ว่าควรจะจับมือร่วมกันทำงาน ตั้งเป็นทีมขึ้นมา ยิ่งเราเป็นทีมเราจะยิ่งแข็งแกร่งมากขึ้นในสายตาลูกค้าครับ

WordPress กับเว็บสเกลใหญ่

ในช่วงนี้พี่เม่น @iMenn มาพูดถึงการนำ WordPress ไปใช้กับเว็บไซต์ที่ต้องรองรับคนเข้าจำนวนมาก ๆ ครับ ซึ่งพี่เค้าก็ได้เอา WP ไปใช้กับเว็บไซต์ของ AIS โดยใช้ปลั๊กอินที่ชื่อว่า “Really Static” ในการทำให้เว็บไซต์เป็นกึ่ง Static ไปเลย ทำให้ Load บนเว็บไซต์แทบจะกลายเป็น 0 ไปเลยครับ (ส่วนใหญ่เว็บไซต์จะล่มได้ก็เพราะต้องประมวลผลเยอะ ๆ ตามจำนวนคนเข้าครับ)

ต่อไปก็พูดถึงเว็บไซต์ Major Cineplex ซึ่งใช้ WordPress ทำ ซึ่งสำหรับข้อมูลภาพยนต์ใหม่ เค้าใช้ปลั๊กอิน “Types” ในการช่วยทำ Custom Post Types / Custom Taxonomy / Custom Field ครับ แนะนำว่าใครใช้ WordPress ยังไงก็ควรจะต้องใช้เป็นครับ เพราะทำให้เราพัฒนา WordPress ไปมากกว่าความเป็นบลอคได้เยอะมาก

สำหรับการทำเว็บไซต์ให้เป็น 2 ภาษา เค้าแนะนำปลั๊กอินชื่อ “WPML” ครับ เป็นปลั๊กอินขาย แต่ใช้ดีกว่าปลั๊กอินฟรีสำหรับทำเว็บไซต์หลายภาษามากครับ อีกทั้งยังรองรับ Custom Post Types อีกด้วย

ส่วนปลั๊กอินสำหรับทำ SEO ผมแอบไปเห็นมาว่าเค้าใช้ “WordPress SEO by Yoast” ครับ ตัวนี้ได้ยินมาว่ามันดีที่สุด แต่ปกติผมใช้แค่ All in one SEO เพราะตั้งค่าได้ง่ายครับ

การใช้ WordPress เอามาทำเว็บไซต์ที่รองรับคนเข้าจำนวนมาก ๆ จำเป็นต้องมีการ Cache ครับ ด้วยปลั๊กอิน “W3 Total Cache” นั่นเอง คนทำ Infastructure ให้พี่เม่นบอกว่่าปลั๊กอินตัวนี้ config ได้สะดวกกว่าปลั๊กอินอีกตัว คือ “WP Super Cache”

นอกจากนั้นก็แนะนำให้ใช้ “HTML5 Boilerplate” ในการทำธีม เพราะใน Boilerplate ได้จัดเตรียมทุกอย่างที่เราต้องการใช้ในเว็บไซต์ไว้ให้แล้ว แม้แต่ไอคอนเว็บที่จะถูกใช้ตอนไอโฟน Bookmark เว็บไซต์เรา

สุดท้ายมีการแนะนำ Slider เจ๋ง ๆ ชื่อว่า “RoyalSlider” ที่ใช้อยู่ในเว็บไซต์ Major Cineplex ข้อดีคือมันสามารถใช้นิ้วลากสไลด์ได้เลย และมีเอฟเฟกต์สวย ๆ มากมาย ส่วนข้อเสียคือมันไม่ใช่ของฟรี แต่ผมคิดว่าคุ้มค่ากับการซื้อครับ

ต่อไปก็เป็นช่วงให้คนที่มางานถามหรือแชร์สิ่งต่าง ๆ ซึ่งก็มีคนพูดถึงระบบ Member ว่าใช้ปลั๊กอิน “WP Members” ซึ่งใช้ดี และฟรีอีกด้วย

มีคนถามเรื่องการทำ E-Commerce บน WordPress ซึ่งก็ได้ข้อสรุปว่าปลั๊กอินส่วนใหญ่จะไม่รองรับภาษาไทย เช่น เสิร์จด้วยภาษาไทยไม่ได้ หรือ Import ข้อมูลสินค้าด้วย CSV ภาษาไทยแล้วเจ๊ง เป็นต้น มีคนแนะนำ “Jigoshop” มาและบอกว่ารองรับภาษาไทยได้ในระดับนึง ซึ่งอันนี้ผมยังไม่ได้เทสนะครับว่าทำอะไรได้บ้าง

วิธีแก้ไขที่พี่เม่นใช้ คือ ใช้บริการร้านค้าของ “Ecwid” แล้วเอามา iframe ลงใน WordPress แทน ซึ่งถ้าต้องการ E-Commerce เต็มรูปแบบจริง ๆ ยังไงก็ต้องไปใช้ Magento ครับ

สรุปงาน WordPress Developer Night 3

จบงานนี้แล้วได้รับความรู้ WordPress มาเยอะมาก รวมถึงคำแนะนำของ Freelancer ก็ให้ข้อคิดดีมากครับ นอกจากนั้นยังได้เรียนรู้ CSS แบบพื้นฐานเลยด้วย ก็ต้องขอขอบคุณวิทยากรทุกท่านที่สละเวลามาพูดในงานนี้ รวมถึง TiGERiDEA ที่จัดงาน และ Pronto Marketing ที่เป็นสปอนเซอร์สถานที่กับของว่างด้วยครับผม

บทความที่เกี่ยวข้อง

designil

designil

Data engineer & WordPress Developer ทำงานที่บริษัทแคนว่า ซิดนีย์ออสเตรเลีย ปัจจุบันเป็นเจ้าของเว็บไซต์ Designil, DataTH ชอบอ่านบทความใหม่ๆ ตลอดเวลา และชอบสรุปเรื่องราวเกี่ยวกับเทคโนโลยีให้ภาษาที่เข้าใจง่าย ยินดีที่ได้รู้จักทุกคนนะครับ
บทความทั้งหมด