เดือน: สิงหาคม 2012

[WordPress Plugin] SimpleReach Slide เพิ่มความสนใจให้คนอยู่ในบล็อกนานขึ้น

ไปเจอ plugin สำหรับ WordPress ตัวหนึ่ง ชื่อ SimpleReach Slide เมื่อติดตั้งมันจะสร้าง Slide แนะนำโพสที่เกี่ยวข้องกับเนื้อหาที่ผู้ใช้กำลังเปิดอยู่ให้ เมื่อเราเลื่อนอ่านเนื้อหาจนสุดด้านล่าง หรือจะ scroll ลงไปเลยก็ได้นะ มันจึงจะโผล่ออกมา

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

เรียกได้ว่าถูกใจมากเลย จึงเอามาบอกต่อครับ

SimpleReach Slide ปลั๊กอินสำหรับ WordPress

ที่ดาวน์โหลดปลั๊กอิน SimpleReach Slide

Developer เขียนในคำอธิบายว่ามันจะเพิ่มจำนวน pageviews กับ time on site ให้เว็บไซต์ของคุณได้ พอดูแล้วก็อาจช่วยได้ส่วนหนึ่งเพราะตอนที่มันเด้งขึ้นมา ทำได้น่าสนใจทีเดียว เหมือนมีอะไรตอบสนองตอนเราเลือนจอ สรุปว่าชอบก็แล้วกันครับ

ไฟล์ที่ Save บน iCould ที่เครื่องเราเก็บไว้ไหน?

เรื่องมีอยู่ว่าตอนที่ลอง save ไฟล์ Keynote รวมทั้งไฟล์อื่นๆด้วย ไปเก็บไว้บน iCloud ตอนเปิดใช้งาน แก้ไข ก็สะดวกดี แต่กับมีปัญหาตอนเราจะส่งไฟล์นี้ให้คนอื่น เพราะดันหาที่อยู่ของไฟล์ต้นฉบับไม่เจอ(มันเอาไปเก็บไว้ไหนฟะ?) จะ save as ก็ไม่มีเมนูนี้ ตอนนั้นก็ใช้วิธีบ้านๆคือ Duplicate ขึ้นมาอีกอันแล้วค่อยกด save ไว้ข้างนอก iCloud

iCloud

พอมีเวลาค่อยมาหาข้อมูลว่าไฟล์ที่เรา save ไว้บน iCloud ตำแหน่งที่ของไฟล์อยู่ในเครื่องเราอยู่ตรงไหน ก็ไปเจอที่บทความนี้ ใน OSX Daily ง่ายมาก ทำ 2 ขั้นตอน เพื่อให้ง่ายต่อการเข้าถึง

  1. เปิด Finder ขึ้นมา กด Command+Shift+G หรือคลิกที่ Go>Go to Folder  ก็ได้ พิมพ์ ~/Library/ เข้าไปในช่องค้นหา

    Go to Folder

  2. เลื่อนหาโฟว์เดอร์ที่ชื่อ “Mobile Documents” ไฟล์ทั้งหมดอยู่ในนั้นโดยแยกตามโปรแกรมต่างๆ ถ้าอยากเข้าถึงง่ายๆในครั้งหน้า ก็คลิกขวา Make an alias แล้ว Drag โฟว์เดอร์ไปวางไว้ที่ Favorites Sidebar ได้เลย

    Mobile Documents

น้องจากนี้ พวกโปรแกรมอื่นๆที่เราใช้ใน iOS ที่เลือก Save ขึ้น iCloud ไฟล์ก็ถูก Sync มาที่นี้เหมือนกัน เช่น รูปจากโปรแกรม SketchBook ใน iPod ก็เห็นในนี้เหมือนกัน

Graphic Design Principle 2nd edition หนังสือ หลักการและกระบวนการออกแบบงานกราฟิกดีไซน์

Graphic Design Principle second edition

ชื่อหนังสือ Graphic Design Principle 2nd edition: หลักการและกระบวนการออกแบบงานกราฟิกดีไซน์
ผู้แต่ง ปาพจน์ หนุนภักดี
บรรณาธิการ ปิยะบุตร สุทธิดารา
352 หน้า พิมพ์ครั้งที่ 1 : มีนาคม 2555
สำนักพิมพ์ DIGI ART
ราคา 295 บาท

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

ตัวอย่างเนื้อหา

ตัวอย่างการออกแบบโปสเตอร์หนัง

จัดกลุ่มตามรูปแบบการนำเสนอที่คล้ายกัน (เหมือนจะเคยเห็นที่ไหน?)

ตัวอักษรในงานกราฟิกดีไซน์

ได้ความรู้เกี่ยวกับตัวอักษรมากขึ้น เพิ่งจะรู้ว่า Serif คือตัวอักษรที่มีติ่งเล็กๆ ส่วน Sans-serif คือตัวอักษรที่ไม่มีติ่งยื่นออกมา Time New Roman ที่เราใช้กันอยู่ทุกวันนี้ได้รับการออกแบบมาเพื่อใช้ในหนังสือพิมพ์ The Times ตั้งแต่ปี คศ. 1931 ออกแบบโดย Victor Lardent เป็นฟอนต์อีกอันที่ใช้กันทั่วโลก และใช้งานต่อเนื่องยาวนานมาจนถึงปัจจุบัน (คนออกแบบเนี้ย สุดยอดจริงๆ)

การออกแบบโลโก้

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

หัวข้อการออกแบบโลโก้ ทำให้รู้ว่าลุง Paul Rand มีงานออกแบบโลโก้ที่สุดยอดจริงๆ เช่น โลโก้ของ IBM, NeXT, Ford, YALE เป็นต้น

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

การออกแบบ หน้าแรกของ 7 เว็บไซต์ข่าวเทคโนโลยี

ตอนที่จะเปลี่ยนธีมใหม่ให้บล็อก มีอย่างหนึ่งที่อยากรู้คือส่วนใหญ่แล้วเว็บไซต์ดังๆเขาออกแบบหน้าแรกยังไง เว็บไซต์ส่วนใหญ่ที่เข้าไปดูเป็นประจำก็คงหนีไม่พ้น 7 เว็บไซต์นี้ คือ AllThingsD, Engadget, Gizmodo, Mashable, SlashGear, TechCrunch และ The Verge ซึ่งสิ่งที่สนใจคือ หน้าแรกที่เราเปิดเข้ามาเจอเลย โดยที่ยังไม่เลื่อนลงด้านล่าง

ก็ใช้เครื่องตัวเองเป็น reference คือ แสดงผลใน Google Chrome ขนาดจอ 1280 x 800  ดังนั้นเอาทั้ง 7 เว็บไซต์มาดูทีละอัน ซึ่งเว็บไซต์ที่ชอบหน้าแรกมากที่สุด ขอยกให้ AllThingsD ส่วนเว็บไซต์อันอื่นดูดีในแบบของตัวเอง แต่ที่ชอบน้อยที่สุดก็ขอยกให้ SlashGear ที่ไม่ค่อยมีเอกลักษณ์มากนัก

ลองมาดูหน้าแรกของแต่ละเว็บไซต์

AllThingsD

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

TechCrunch

TechCrunch มีโพสที่เป็นเรื่อง Hot Topic ให้เลือกคลิกอยู่ 4 เรื่อง แล้วก็เหลือบเห็นหัวข้อของโพสด้านล่างโผล่มานิดหน่อย ด้านบนยังมีเมนู และหมวดหมู่ให้คลิกได้ ที่น่าสนใจอีกอย่างคือทำส่วนของโฆษณาได้ลงตัวกลมกลืนไปกับเนื้อหา ดูมีช่องว่าง ไม่แออัดจนเกินไป

The Verge

The Verge  เป็นอีกเว็บหนึ่งที่ชอบ ทำหน้าแรกออกมาได้ค่อนข้างน่าสนใจ มีหัวข้อที่เป็นฟีเจอร์อยู่ด้านหน้ามีภาพประกอบโพสและสีพื้นหลังจางๆ มีหัวข้อให้คลิก มีช่องค้นหา ไม่มีโฆษณาให้เห็น

Gizmodo ดูเรียบๆ มองเห็นโพสอันใหญ่โดดเด่นอันเดียว มีโฆษณาเด่นที่ด้านขวา มองเห็นโพสล่าสุดด้านขวาประมาณ 3 อัน เป็นหน้าแรกที่เรียบและดูดีทีเดียว

Mashable

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

Engadget

Engadget มีส่วนของแบนเนอร์โฆษณาที่อยู่ด้านบนเหมือนเป็นส่วนเกินของเว็บไซต์ไปเลย แต่ค่อนข้างดึงดูดให้คนดูเป็นพิเศษ และยังกระตุ้นให้ต้องเลื่อนลงข้างล่างด้วยสิ แต่ส่วนตัวไม่ค่อยชอบเท่าไหร่นัก ความฉลาดในการออกแบบอีกอย่าง นั้นคือการเอาโพสมาเป็นส่วนเฮดเดอร์ที่เปลี่ยนไปเรื่อยๆ มีเมนูหมวดหมู่ให้คลิก มี Top Stories ให้เลือก

SlashGear

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

สรุป 
แต่ละเว็บมีแนวทางของตัวเองชัดเจน มีสีเฉพาะตัว มีโพสที่น่าสนใจไว้เด่นที่สุด เป็นกรณีศึกษาที่ดีได้ทั้งสิ้น แล้วเอามาปรับใช้กับเว็บของตัวเองต่อไป

แนะนำบล็อกเกี่ยวกับ Medical Microbiology ของคนใกล้ตัว

Noobnim.in.th

ขอแนะนำบล็อกคนใกล้ตัวครับ Noobnim.in.th บล็อกของ @ac_nim แม้ว่าตอนแรกจะพยายามชักชวน ชักจูงยังไง ไม่เคยจะสนใจเขียนเลย(แรงดึงดูดไม่พอ!) สุดท้ายต้องขอบคุณบล็อกของ @khajochi https://www.khajochi.com ที่น่าจะเป็นแรงบันดาลใจสำคัญที่ทำให้เธอลุกขึ้นมาเขียนบล็อกของตัวเองบ้าง (ก็ทั้งหวานและโรแมนติกซะขนาดนั้น) ผมเลยได้เป็นหน่วย support ให้อย่างเต็มที่ ทั้ง Domain และ Hosting ก่อนหน้าที่จะมาเป็นบล็อกส่วนตัว ให้ลองไปเขียนบน WordPress.com ก่อน ซึ่งเคยเตรียมไว้ให้นานแล้วเหมือนกัน ตอนแรกคิดว่าคงจะเห่อแค่พักๆ แต่ผ่านมา 4 เดือนกว่าแล้ว ยังเขียนอยู่เป็นระยะๆ แสดงว่าคงจุดติดไปแล้ว ในฐานะผู้สนับสนุนเลยจะช่วยโปรโมทให้อีกทางครับ

Noobnim.in.th เรื่องที่เธอเขียนเป็นเรื่องเกี่ยวกับตัวเธอโดยเฉพาะ(ก็มันบล็อกส่วนตัวนิ) แต่ที่เน้นสุดคงจะเป็นเรื่อง จุลชีววิทยา ทางการแพทย์ (Medical Microbiology) ในระดับ Advanced สุดๆ เอาไว้อ่านเตรียมสอบกันเลยทีเดียว แต่คนที่สนใจทั่วไปรู้เรื่องชีววิทยาบ้างก็อ่านสนุกได้เหมือนกันครับ บางเรื่องที่น่าสนใจผมก็ขออนุญาติเอาไปลงไว้ที่ Biomed.in.th เหมือนกัน แต่เราๆท่านๆอาจจะต้องทำความเข้าใจเป็นพิเศษสำหรับบ้างเรื่อง แต่ผมว่านี้คือสิ่งสำคัญนะ เมื่อบล็อกมันก็เหมือไดอารี่ส่วนตัวของเรา เราเน้นเขียนเตือนความจำตัวเอง พูดง่ายๆคือ เขียนให้ตัวเองอ่าน ส่วนการเปิดให้คนอื่นเข้ามาอ่านได้ จนกระทั้งมีคนคอยติดตามอ่านตลอดนั้นเป็นผลพลอยได้ต่างหาก ยังไงซะจะต้องมีคนสนใจในเรื่องที่เราเขียน แม้มันจะเฉพาะทางมากๆก็ตาม

ส่วนเรื่องเบาๆที่น่าติดตาม เช่น ฟุตบอล หนัง นิยาย หนังสือ ก็มีให้อ่านเหมือนกันครับ

ตัวอย่างโพสที่น่าสนใจ

ขอเชิญชวนให้ติดตาม Noobnim.in.th ได้ที่

  1. URL:  www.nobnim.in.th
  2. Feed: https://feeds.feedburner.com/noobnim
  3. Twitter: @ac_nim

ปล. ใครอยากลุกขึ้นมาเขียนบล็อกของตัวเองบ้าง ผมยินดีให้คำปรึกษาเต็มที่เลยนะครับ สนับสนุนเต็มที่

บทความ “ทำเงินบนโลกไอที (84) : So.cl อีกทางเลือกที่ไม่ใช่เฟซบุ๊ก”

เป็นบทความที่ได้เขียนไว้กับทาง CyberBiz : ผู้จัดการ Online ตั้งแต่เดือนมิถุนายน 2555 ยังไม่ได้เอามาบันทึกไว้ในนี้เลย ก็เลยมาเขียนถึงสั้นๆเก็บไว้

นั่งเล่น so.cl อยู่หลายวัน พยายามหาแง่มุมต่างๆของมัน เขียนส่งไปทั้งข้อความรวมกับภาพประกอบ 8 หน้ากระดาษ A4 เลยทีเดียว น่าจะยาวสุดเท่าที่เคยเขียนอะไรแนวนี้แล้วล่ะ กว่าจะเขียนออกมาได้ใช้พลังงานไปเยอะพอสมควรเลย ได้ค่าเรื่องมากินขนมนิดหน่อย แต่ไม่ค่อยใส่ใจเรื่องนั้นเท่าไหร่ ตอนตอบตกลงไม่รู้ด้วยซ้ำว่ามีค่าเรื่องให้ด้วย แต่รู้สึกดีที่ได้ทำมากกว่า ขอบคุณ @goople ที่ให้โอกาสได้ทำครับ

ตัดมาแปะไว้บางส่วน ตามไปอ่านต้นฉบับได้ที่ ลิงค์นี้ ครับ

ทำความรู้จัก So.cl สังคมออนไลน์เพื่อการศึกษาของไมโครซอฟท์

       ***ทำความรู้จัก So.cl สังคมออนไลน์เพื่อการศึกษาของไมโครซอฟท์
(บทความโดย พงษ์ศักดิ์ สาระภักดี)

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

 So.cl (อ่านว่า “social”) เป็นสังคมออนไลน์จากไมโครซอฟท์ที่เปิดให้คนทั่วไปได้ใช้งานเมื่อวันที่ 21 พฤษภาคม 2555 ที่ผ่านมา หลังจากที่ปล่อยให้ใช้ในวงจำกัดมาตั้งแต่เดือนธันวาคม 2554 ไมโครซอฟท์ออกตัวชัดเจนว่าไม่ได้ออกแบบมาเพื่อแข่งกับ Facebook หรือ Twitter ที่ถือว่าเป็นสองเว็บไซต์สังคมออนไลน์ที่มีคนใช้งานมากที่สุดในโลกในตอนนี้

Facebook/Twitter ถูกเรียกว่าเป็น ”เครือข่ายทางสังคม”(social networking) ซึ่งเราค่อนข้างคุ้นเคยดีอยู่แล้ว เราสร้างสัมพันธ์กับคนรอบข้างด้วย ข้อความ คอมเม้นท์ ภาพถ่าย เกม ฯลฯ แต่ไมโครซอฟท์วางตัวให้ So.cl เป็น “สังคมแห่งการค้นหา” (social searching) กล่าวคือ สังคมออนไลน์ที่ผู้ใช้งานจะปฏิส้มพันธ์กันด้วยการแชร์ผลการค้นหาในสิ่งที่ตัวเองสนใจให้กันและกัน จะเห็นได้ว่าทั้งสองอย่างนี้มีจุดเหมือนและจุดต่างกันอยู่ในตัว

So.cl เกิดขึ้นจาก FUSE Labs ของไมโครซอฟท์ (ตัวอย่างผลงานของแล็บนี้ เช่น Docs.com, CompanyCrowd, Bing Social, Montage, Spindex เป็นต้น) เราจะเห็นว่าในปัจจุบันนั้นเว็บไซต์สังคมออนไลน์ได้รับความนิยมอย่างสูง โดยเฉพาะกลุ่มวัยรุ่นในวัยเรียน ทางทีมงานของ Fuse Labs มองเห็นถึงศักยภาพของสังคมออนไลน์เป็นอย่างดี จึงพยายามที่จะเปลี่ยนเว็บไซต์ในลักษณะนี้ให้เข้าไปอยู่ในห้องเรียนให้ได้

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

เปลี่ยนธีมอันใหม่ให้บล็อก

ธีมตัวเก่า Wide Blog Happens Theme โดย @imenn

ธีมตัวเก่าใช้มาเกือบจะ 4 ปี แล้ว ใช่ว่าไม่อยากเปลี่ยนธีมใหม่ให้ทันสมัยนะ แต่เหตุผลหลักๆที่ทำให้ไม่ได้เปลี่ยนสักที พอสรุปได้ดังนี้ครับ

  • Hard code ลงในธีมเยอะมาก ทั้งใน header.php , page.php, post.php จะเปลี่ยนทีต้องใช้เวลานานพอสมควรเลย
  • ภาพที่ใช้ประกอบในบล็อก ค่อนข้างทำ size ให้เหมาะกับธีมเดิม ต้องหาธีมที่กระทบกับโพสอันเก่าให้น้อยที่สุด คงไม่มีทางมานั่งแก้โพสเกือบ 500 โพสให้เข้ากับธีมใหม่แน่ๆ ตัวเลือกเลยน้อยลงไปอีก
  • โพสอันเก่าไม่ได้ทำ feature image ไว้เลย แต่ใช้ plugin เป็นตัวช่วยดึงมา ธีมสมัยใหม่จะใช้ข้อมูลอันนี้เกือบหมดแล้ว เป็นอีกหนึ่งเหตุผลที่จะทำให้โพสอันเก่ามีปัญหา
  • คิดว่าธีมอันเก่านั้นค่อนข้างโอเคในระดับที่ยังยอมรับได้อยู่

แล้วเหตุใดจึงต้องเปลี่ยนธีมใหม่

  • อยากได้ Responsive theme ซึ่งจะทำให้บล็อกเปลี่ยนเลเอาท์ให้เหมาะสมกับขนาดหน้าจอของอุปกรณ์ที่เปิดใช้งาน คิดว่าตอนนี้คนเข้าดูเว็บไม่ได้ดูผ่านทางคอมพิวเตอร์อย่างเดียวแล้ว แม้จะมี plugin ช่วยอยู่ก็ตาม แต่คิดว่าสู้ Responsive theme ไม่ได้หรอก เท่กว่าเยอะ
  • คิดว่าถ้าทิ้งปัญหาต่างๆของด้านบนไว้นานๆจะยิ่งทำให้การเปลี่ยนธีมในอนาคตทำได้ยากขึ้นอีก
  • บล็อกเก่ามีติด Google Adsense ไว้ใต้หัวข้อโพสก่อนจะเริ่มเนื้อหา เป็นตำแหน่งที่ตัวเองก็ไม่ชอบนัก แต่เป็นตำแหน่งที่ทำให้คลิกเยอะสุดแล้วเมื่อเทียบกับตำแหน่งอื่นๆ อยากจะเปลี่ยนแปลงตรงนี้ แต่ไม่กระทบรายได้ของบล็อกมากนัก (แต่เพราะมันเป็นตัวหล่อเลี้ยงเว็บไซต์อื่นๆที่ทำตามใจอีกกว่า 5 เว็บไซต์) ซึ่งธีมใหม่ถือว่าช่วยได้ในระดับที่น่าพอใจเลย
  • ธีมเก่าไ่ม่มี feature post เลย เคยพยายามทำแล้ว แต่ทำยังไงก็ออกมาดูไม่ดีเลย เปลี่ยนธีมใหม่ไปเลยน่าจะเป็นคำตอบ

เกณฑ์ในการเลือกธีมใหม่

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

พอตั้งเกณฑ์ได้ประมาณนี้เลยช่วยให้ค้นหาและเลือกธีมที่มีอยู่มากมายได้ง่ายมากขึ้น พอค้นเจอก็ลองเปิดดู demo theme นั้นก่อน ซึ่งส่วนใหญ่เว็บแจกธีมมักจะมีตัวอย่างให้ดูอยู่แล้ว พอเข้าข่ายก็ดาวน์โหลดเก็บไว้ จากนั้นติดตั้งเข้าไปเลย ตอนแรกเลือกมาประมาณ 15 ธีม แล้วก็ลองเปิดพรีวิวดูในบล็อกของตัวเอง แล้วค่อยตัดตัวเลือกออกทีละตัวจนเหลือ 3 ตัวสุดท้าย แล้วลอง activate ธีมนั้นดู ลองปรับแต่งสักเล็กน้อยดูว่าเหมาะแค่ไหน แล้วจึงเลือกเอาอันที่คิดว่าเหมาะสมที่สุด

สุดท้ายก็เลือกธีม Oxygen 

ธีมใหม่ของบล็อก

เกี่ยวกับ Oxygen theme

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

รายละเอียดของการติดตั้งธีมใหม่ 

  • ลดการใช้ hard code ให้ได้มากที่สุด เน้นใช้ plugin ช่วย
  • ไม่เอา Feature post อันใหญ่ของธีม เพราะขาดใหญ่มาก คิดว่าอาจเสียเวลาโหลดนานเกินไป
  • Feature post ด้านบนใช้ Plugin WP Featured Content Slider แล้วแก้ไข css เองอีกนิดหน่อย
  • Ralated Post ใช้ Plugin Related Posts Thumbnails
  • ปรับแต่ง css อีกนิดหน่อย

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

ว่าแล้วก็ เชิญติชมธีมใหม่ได้เลยครับ

เปลี่ยนความยาวคลื่นแสงเป็นโค้ดสี

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

แสงที่ตาเรามองเห็นมีความยาวคลื่นประมาณ 390->750 นาโนเมตร ถ้านึกไม่ออกคิดถึงแฉดสีของรุ้งกินน้ำครับ

Spectrum

ม่วง->คราม->น้ำเงิน->เขียว->เหลือง->ส้ม->แดง

ยกตัวอย่าง ถ้าหากแสงที่ความยาวคลื่น 532 นาโมเมตร ตาเรามองที่เลเซอร์ก็รู้ว่าเป็นแสงสีเขียว แล้วจะใช้โค้ดสีตัวไหนดีในขั้นตอนใส่สีถึงจะถูกต้องหรือใกล้เคียงที่สุด? (เขียวเข้ม เขียวอ่อน เขียว ฯลฯ อะไรประมาณนี้)

นึกอยู่สักพักก็ทดลองเอาแผ่น color checker ไปถ่ายภาพคู่กับแสงที่อยากรู้ เอาเข้า photoshop ปรับแสงสีให้สีใน color checker ถูกต้อง แล้วหยิบเอาสีของแสงที่ต้องการออกมา ดูว่ามีโค้ดอะไร บันทึกเก็บไว้ ภายหลังรู้วิธีที่ง่ายกว่านี้ แต่โค้ดสี RGB ที่ได้จากวิธีนี้ก็ใกล้เคียงพอสมควร แต่คงลำบากมากถ้าต้องทำหลายๆตัว และยังมีปัจจัยอื่นอีกหลายๆอย่างที่เราควบคุมได้ยาก

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

Chromaticity coordinates
  • อันแรกใช้งานผ่านเว็บไซต์ได้เลยที่ Wavelength To RGB เว็บนี้ใส่ความยาวคลื่นแสงในหน่วยนาโนเมตรเข้าไป เว็บจะคำนวณแล้วรายงานรหัสสี RGB, Hex มาให้เลย ง่ายและสะดวกดี
  • มีคนทำโปรแกรมให้ใช้ง่ายๆ สำหรับ Windows ด้วยนะ ดาวน์โหลดได้ที่ wavelengthtoRGB เอา Algorithm มาจาก https://www.midnightkite.com ผลลัพท์ที่ได้ต่างกับตัวที่ใช้บนเว็บนิดหน่อย แต่ไม่ซีเรียสขนาดนั้น เพราะเราแยกสีสองอันไม่ออกหรอก!
  • มีรายละเอียดอื่นๆเกี่ยวกับ Spectrum&RGB ที่น่าสนใจ เกี่ยวกับสี วิธีการอนุมาณสีจากความยาวคลื่นในแบบต่างๆ ปัจจัยที่ทำให้สีที่ได้แตกต่างกัน ดูได้ที่ https://mintaka.sdsu.edu, https://www.fourmilab.ch, https://www.techmind.org
จบด้วยภาพเทียบระดับของ RGB, ความยาวคลื่น, สีที่มองเห็น
ความยาวคลื่นเทียบกับสีที่มองเห็น

ก่อนจะฉลาดต้องโง่ก่อนสินะ!

Exit mobile version