WordPress เป็น Content Management System (CMS) และแพลตฟอร์มบล็อกกิ้งยอดนิยมโลก มีเหตุผลดีมาก เข้าถึงง่าย ใช้งาน simple และ intuitive ยืดหยุ่นมาก มี plugins และ themes มืออาชีพหลากหลาย หลายปีมา แสดงตัวเป็นตัวเลือก dominant สำหรับสร้าง dynamic responsive websites ผมเป็นผู้ใช้ที่พอใจ ใช้เองตั้งแต่ 2012 บนบล็อกเขียนหนังสือ แต่เสียดาย ความดีทั้งหมดนี้กำลังจะไหลท่วมท้องท่อ
WordPress 5.0 รีลีส major ถัดไป จะมี revised UI (backend) ใช้ framework ชื่อ Gutenberg UI ใหม่นี้ดูเหมือนจะเอาความดีทั้งหมดที่ทำให้ WordPress cool ไป และทำลาย elegance, efficiency และ simplicity ที่สวยงาม ด้วยสิ่งที่รู้สึก像 abstract, touch-optimized experiment มาพูดกัน
เพิ่มเติมเกี่ยวกับ Gutenberg
มีอะไรพูดได้เยอะแต่ไม่พูด ไม่ต้อง repeat สิ่งที่พูดแล้ว WordPress team release upcoming interface เป็น plugin ให้ทดสอบและ feedback ต้นสิงหาคม 2018 ตอนเขียนบทความ มี reviews มากกว่า 1,000 สองในสาม negative rating แย่ 2.3/5.0 นี่พูดมากกว่าคำพูด ไม่ว่า content จะเป็นไง คุณจริงๆ จะใช้/install plugin rating ต่ำกว่า 3 ไหม?
ธีมของ negative reviews (1-2 ดาว) consistent: Gutenberg ไม่ intuitive ทำลาย beautiful balanced design ช้า ไม่ efficient เพิ่ม mouse clicks ผมคิด จึงตัดสินใจทดสอบ ผมไม่ตัดสินโดยไม่มีประสบการณ์ ติดตั้ง plugin ดูว่ามันทำอะไร
Old editor (TinyMCE)
Simple, elegant, ออกแบบสำหรับเดสก์ท็อป ดูเหมือน text editor, text processor หรือ word processor ใดๆ เขียนได้ มี shortcuts โหลดสำหรับฟังก์ชัน common เพิ่มรูปและ styles ง่าย นี่ความสวยของ WordPress Perfection
เข้าสู่ Gutenberg
นี่ผลิตภัณฑ์ออกแบบสำหรับ touch world เหมือนทุกผลิตภัณฑ์ touch-based มัน simplistic, complicated และเพิ่ม mouse clicks (หรือ taps) มากเกินไปเมื่อใช้บนเดสก์ท็อป ไม่มี touch-based application ไหนทำงานดีบนเดสก์ท็อป หรือแม้แค่เล็กน้อยดีกว่า classic counterpart ในหมวดเดียวกัน เคยเห็นกับ Windows 8/10 และ Modern apps
Gutenberg ใช้ concept of blocks (ไม่ conform กับ web language style หรือ syntax) ย้าย blocks ได้ (อาจดึงดูด touch users ไม่มี select & copy ง่าย) บนเดสก์ท็อป non-intuitive nuisance เพิ่ม mouse clicks
คุณ waste time ทำสิ่งต้องการ เพิ่ม featured image? ต้องกด down arrow ก่อนถึง upload Old editor ต้อง single mouse click อยากตั้ง tags? ต้อง expand ก่อนใช้ เพิ่ม waste ไม่ได้เห็น most used tags ทันทีเหมือนเก่า
อยากเพิ่มรูปใต้ paragraph? Mouse clicks เพิ่มที่ไม่จำเป็น ก่อนหน้านี้กด Add Media button เสร็จ ตอนนี้กด + button แล้วเลือก block type ที่ต้องการ อย่างน้อย 2x administrative work จากเดิม
นี่คือ touch-optimized UI - ล้มเหลวบนเดสก์ท็อป ไม่ conform HTML/CSS logic ไม่ efficient บนเดสก์ท็อป ทำลาย foundation ของ WordPress - ซึ่งคือ fast, elegant simplicity
แค่นี้ก็พอสำหรับ interface นี้ ข้อเท็จจริงว่ามันเพิ่มงาน - เพิ่ม mouse clicks ที่ต้องทำ basic tasks เช่น เพิ่มรูป เป็น證明ของ conceptual และ design failure มีปัญหา technical อื่นเยอะ อ่าน 1000 กว่ารีวิวได้
เว้นแต่จะเปลี่ยนแปลง radically นี่จะทำลาย WordPress สิ้นสุด
โชคดีมียา (ชั่วคราว)
ถ้าไม่อยาก Gutenberg ติดตั้ง compatibility plugin ชื่อ Classic Editor ปิดอินเทอร์เฟซใหม่ ทำงานเหมือนเดิม Plugin นี้มี active installations 200,000+ rating เกือบ 5.0 เต็ม มี plugins อื่นคล้ายกันให้ old functionality
แตทั้งหมดนี้感覺像 déjà vu เหมือน Firefox!
Mozilla "ปรับปรุง" Firefox (ไม่มีเหตุผลดี) introduced Australis ergonomic change แย่ และสุดท้าย Firefox 57 undo Australis ให้ UI nice และ effective อีกครั้ง Australis aesthetic saber rattling ไปไหน? กลับจุดเริ่มต้น พร้อมพลังงานเสียและความผิดหวัง
ช่วงสั้นมี Classic Theme Restorer ให้ลุคเก่า Firefox จน Quantum ตัด add-ons พันๆ ความหล่อและพลังของ Firefox เข้าสู่ golden age ไม่ทองของ Mozilla Firefox ยังคง least annoying browser แต่ไกลจาก love และ enthusiasm ที่เคยขว้างเกินไป Beyond scope บทความนี้ plugins story ซับซ้อนกว่า แต่ tie in ไปกับ WordPress และ Gutenberg สาระเดียวกัน Pattern เหมือนกันเกิดขึ้น
เรามี reprieve แต่อาจไม่ยั่งยืน WordPress team mention Classic Editor เป็น measure ทำงานเหมือนเดิมสำหรับคนยังไม่พร้อม switch น่าจะหมายถึง Gutenberg จะกลายเป็น mandatory จุดหนึ่ง แต่สำหรับผมและพันๆ serious web designers (ไม่ได้เรียกตัวเอง) ไม่มี uncertain future state ที่ Gutenberg ในรูปแบบปัจจุบันจะ acceptable สำหรับผม ไม่มีเวลา switch ไป
Unholy Crusade ต่อเดสก์ท็อป
นับตั้งแต่ mobile (touch) กลายเป็น prevalent consumer platform มี focus พัฒนา mobile solutions มาก นี่ fine แต mobile solutions ถูกผลักดันไปเดสก์ท็อป ที่พวกมัน fail มาก Touch software ไม่ทำงานบนเดสก์ท็อป มันแค่ไม่ได้
มีปัญหาใหญ่กว่า: ขณะที่ content ส่วนใหญ่ consumed บน mobile ส่วนใหญ่ created บนเดสก์ท็อป ทำ sense เดสก์ท็อป platform infinitely superior สำหรับ writing และ image processing Full keyboard + mouse combo และ multi-application usability ชนะ touch solutions ทั้งหมด
ผมไม่ считать social media "updates" เป็น content ผมถือ content คือ meaningful articles ให้ข้อมูลใหม่และ unique ซึ่งน้อยลงทุกวัน ผมมั่นใจอย่างมาก vast majority ของ valuable articles และ posts ทำด้วย classic desktop formula ลองจินตนาการเขียน 500 คำบน keyboard vs touch
WordPress Gutenberg ตกใน touch category ผลิตภัณฑ์ optimized สำหรับ mobile แตไม่มีที่บนเดสก์ท็อป ถ้าคิดว่านี่ good idea จำ Windows 8 ได้ไหม? effort, money, intellect, work, marketing invest promoting Windows 8 as new radical UI Desktop จะกลายเป็น "just an app" บน Start Screen Design นี้ introduce ปัญหาเดียวกับ Gutenberg - 2x mouse clicks จากเดิม
Fast forward สองปี Windows 8 sour memory ทุกคนทำเป็นไม่เคยเกิด Windows 10 คืน classic menu layout เพราะมี ancient proven logic ในการจัดวาง ไม่ใช่โชคหรือ hype หรือ trend เป็น human natural evolution เธอร์โมไดนามิกส์
ไม่สามารถต่อสู้ natural order of things ได้ ผมอธิบายใน Windows Blue conspiracy article Touch จะไม่ replace เดสก์ท็อป เพราะมัน less optimized form of content creation มัน one-dimensional medium ในขณะที่ keyboard+mouse (และจอแยก) เป็น two-dimensional medium เขียนบน keyboard เร็วกว่า touch หน้าจอเดสก์ท็อปแสดง items มากได้เพราะ high-precision pointer minimize hierarchy depth เพิ่ม situational awareness และ work efficiency ทั้งหมด given ต่อสู้พวกมันนำไปสู่ sub-optimal product
ทำไมถึงเกิดขึ้น?
คุณอาจถาม ทำไม WordPress team ยิงเท้าตัวเอง? คำตอบ: competition from mobile players และ social media แค่推測 แตผมอาจเป็น smartest person ใน observable universe และข้าม ดังนั้น hypothesis ควรทำให้คุณ perk up ears - หรือตา - และอ่านต่อ
Social media - Instagram และ Pinterest โดยเฉพาะ - สร้าง short blog-like entries ง่าย โพสต์บรรทัดสองสาม เพิ่ม inspirational image Bob's your uncle แต่บน non-desktop form factor ทำคล้ายๆ นี้ NOT easy สำหรับ WordPress users
WordPress สร้างใน desktop era ลุคและฟีล desktop Admin backend สำหรับ content creation desktop-optimized ไม่ suitable สำหรับ tablet และ phone
Gutenberg น่าจะเป็น knee-jerk response ต่อ threat ของ mobile adversaries และ competitors ที่เสนอ simplified backend interfaces แต่ paradox ใน solution นี้คือ alienate almost entire user base ของ diehard professionals ที่สร้างเว็บไซต์ และในที่ของพวกเขา ดึงดูด rabble ของ casual "bloggers" ที่แค่อยากโชว์ว่า inspired และ empowered
แก้ปัญหาที่ไม่มีอยู่
นี่ส่วนใหญ่ของ issue Gutenberg fix สิ่งที่ไม่ต้อง fix WordPress 4.X perfect ที่สุดใน actual usability ทำงานดี ให้ efficiency และ flexibility เปลี่ยน equation นี้ ruin foundation ของ writing
Concept of distraction-free writing คือ nonsense buzzphrase หนึ่ง ถ้าคุณ distracted โดย static toolbar ที่มี shortcuts ไป font และ paragraph styling คุณไม่ควรเขียน สอง Gutenberg คือ opposite ของ distraction-free ข้อเท็จจริงที่คุณต้อง interact กับ blocks จริงๆ harm writing flow ไม่ improve ใดๆ
ผมเขียน 5,000-10,000 คำทุกวัน Every. Single. Day. กล่าวด้วยเกียรติว่าผมผลิต written content มากกว่าคนส่วนใหญ่ ปริมาณคำนี้แบ่งใน articles, technical books, fiction books, short stories ทุกวัน ผมสำรวจทุก medium และ technology สำหรับ writing Trust me ผม optimize actual process ของการแปลงความคิดเป็นประโยคเขียน
บอกได้ด้วย decades of writing confidence การใช้ technologies เช่น text editors, WYSIWYG editors, text processors (LateX และ LyX), word processors, HTML composers, Web-based design และ writing tools และทุกอย่าง ผมบอกว่า WordPress 4.X extremely friendly ให้ balance ดีระหว่าง writing productivity และ styling assistance ทำ styling ใน correct way มี reasonable emphasis บน separation ระหว่าง content และ style
Gutenberg ไม่ทำอย่างนั้น Introduce inline CSS styling และ comments ไม่ conform web standards บังคับให้กังวลเรื่อง things should LOOK ยังไง แทน focus writing ทำลาย separation content และ style กลับสู่ 90s Internet
Enable idiots หนึ่ง block ในแต่ละครั้ง
WordPress top-notch professional product และต้องคงอยู่เช่นนั้น Concept of blocks, galleries และ nonsense เหล่านี้อาจดึงดูด clueless phone users ที่จะ blithely swipe block นี้ block นั้น เพิ่ม drop-cap ใช้ colored background และ nonsense เหล่านี้
นี่ regression แย่ กลับยุค 1999 GeoCities และพวกเขา คน cobbled websites เหมือน post-apocalyptic scavengers ใน color-induced Mad Max nightmare Gutenberg ทำลาย strict rigor และ separation of style and content ทำ professional work ของ designing website ให้กลายเป็น joke
ทำเว็บไซต์ไม่ง่าย แม้บล็อกเขียนเรียบง่ายของผมใช้เวลามาก polishing และ tweaking - หา theme ใดๆ ทำ subtle CSS changes เพิ่ม HTML blocks และ custom code ชั่วโมงหลายชั่วโมง invested พยายามทำ presentable blog มากกว่า 12 plugins และแค่ simple writing blog ถ้าสนใจ นี่รายการ classes และ styles ที่ผมต้อง add หรือ modify เพื่อผลลัพธ์ที่อยากได้ (นอกจาก theme CSS):
h1, .h1, h2, .h2, h3, .h3 { margin-bottom: 20px !important; margin-top: 30px !important; }
.primary-menu li a { font-weight: bold !important; }
.site-title::after { width: 65% !important; }
.entry-meta::after { width: 65% !important; display: inline-block !important; }
.entry-content a { text-decoration: underline !important; }
.entry-content a.more-link { text-decoration: none !important; display: none; }
.entry-content .wp-caption-text { text-align: left; }
.entry-content figure { display:inline; }
.entry-content blockquote { margin-left: 0em !important; border-left: 5px solid #de7416 !important; padding: 1.3em !important; padding-right: 1.5em !important; }
.byline { margin-left: 7px; }
.read-more a { text-decoration: none !important; }
.btn-default { border: 1px solid #de7416; }
.widget ul { padding-left: 0em; }
.widget-title::after { width: 100px !important; height: 2px !important; }
.post-comments { padding: 2.5em; font-size: 10pt; line-height: 250%; }
.booklist { float: left; width: 48% !important; margin-right: 10px; padding-right: 10px; }
.imgborder { border: 1px solid #de7416 !important; padding: 7px !important; }
@media only screen and (max-width: 511px) { .booklist { float: none; width: 100% !important; }}
@media only screen and (max-width: 767px) { .entry-content img { display: block; margin: auto; }}
@media only screen and (min-width: 767px) { .read-more { text-align: left; }}
@media only screen and (min-width: 767px) { .entry-title { text-align: left; }}
@media only screen and (min-width: 767px) { .entry-meta { text-align: left; }}
นอกจากนี้ ผม edit PHP files เล็กน้อย introduced security hardening สร้าง custom htaccess files ต้อง sort out asynchronous loading และอื่นๆ แล้ว caching, page loading optimization, form factor optimization, privacy (GDPR) ทั้งหมดต้องการ technical understanding และ patience ไม่มี shortcuts ในเกมนี้ ไม่สามารถ quick 'n' dirty site ด้วย blocks เหมือนเด็ก 4 ขวบ และคาดหวังว่า work, ดูดี หรือ appeal ใครนอกจาก inner child
Gutenberg จะขับไล่ professionals - ที่คาดหวังและอยากใช้ professional platform นี่คือ critical core ของ supreme intellectual property และ experience ที่ทำให้ WordPress เป็นวันนี้ ถ้าคนเหล่านี้จากไป WordPress จะเสีย professional edge อาจมี glamor และ money จาก casual touch users (money อาจเป็น motivation อีกอย่าง) แต่ long run meaningless noise
จะเกิดอะไรเมื่อคน design 1000 websites ย้ายไป CMS อื่น? เมื่อถาม recommendation blog platform? กลับไป Mozilla example ทุกอย่าง Mozilla ทำกับ UI changes เพื่อ alienate hard core ของ loyal followers ถ้าถามผม 2010 browser ไหนแนะนำ จะบอก Firefox ด้วยหัวใจและความหลงใหล วันนี้ถ้าถาม non-committal answer (all same) แม้ Firefox least bad option ยังคง เป็นเช่นนั้น Likewise ถ้าถาม CMS ไหนใช้ จะบอก WordPress ผ่านๆ แต่ come Gutenberg? หนึ่งหรือสองปีหน้า? ไม่แน่ใจ
นี่คือวิธี bleed loyalty และ lose customers
อ่านเพิ่มเติม
รีวิวน่าสนใจอื่นๆ บนหัวข้อนี้:
Gutenberg Editor Review: Please Don't Include This in WordPress Core
7 Reasons to Not Switch to the Gutenberg WordPress Editor
สรุป
ปัญหา Gutenberg แก้ได้ง่าย อาจ project ไปไกลเกินไป stop หรือ cancel ไม่ได้ และ alter ให้ presentable จะใช้ปีๆ (agile nonsense) แต่ elegant seamless solution คือ offer เป็น plugin ไม่ทำเป็น core product และ offer classic editor เป็น plugin Pop notification ให้ new users ให้ choice ลอง mobile-friendly option ทิ้ง professionals ไว้ ไม่ harm anyone everyone wins
หรือดีกว่า - allow full customization level เริ่มจาก professional layout แล้ว allow trim down ถ้าคนรู้สึก distracted ใช่ means bigger code base แต่ ONLY way retain old users และ win new users ผมจะเกลียดมากถ้า WordPress wither แต่ hey their money, their decisions และ as a customer ผมเลือกได้ ผมไม่ใช่เด็ก ผมอยากใช้ professional products วันนี้ WordPress professional product พรุ่งนี้? Unknown ถ้ามาวันที่ Gutenberg mandatory ไม่มี alternative ผมจะ migrate site ไป platform อื่น และจบบทความเศร้านี้
Cheers.
