Safari 27.3 Adaptive Dark Mode ใน beta แปลงเว็บพื้นสว่างเป็นโหมดมืดอัตโนมัติ
Safari 27.3 Adaptive Dark Mode ใน beta 1 แปลงเว็บพื้นสว่างเป็นโหมดมืดให้ผู้ใช้ที่เปิดเอง ทีม WebKit ระบุเว็บ 90% ยังไม่รองรับโหมดมืดทั้งที่ผู้ใช้ราว 40% ใช้
โดย กองบรรณาธิการ THAI DATA อ่าน 5 นาที
สรุปประเด็นสำคัญ
- ทีม WebKit ประกาศ Adaptive Dark Mode ใน Safari 27.3 beta เมื่อ 3 พฤศจิกายน 2026 โดยผู้ใช้ต้องเปิดเองและตั้งโหมดมืดของระบบไว้ก่อน
- WebKit ระบุว่าเกือบ 40% ของการโหลดหน้าเว็บมาจากผู้ใช้โหมดมืด แต่มีเพียง 10% ของการโหลดที่เว็บรองรับโหมดมืด ฟีเจอร์นี้จึงมุ่งปิดช่องว่างนี้
- เว็บที่ประกาศรองรับโหมดมืดด้วย
color-scheme: light darkจะ ไม่ถูกเปลี่ยน ส่วนเว็บอื่นถูกแปลงสีโดยรักษาเฉดสีเดิมและพยายามให้ข้อความมีคอนทราสต์อย่างน้อย 4.5:1 ตามมาตรฐาน WCAG - Safari จะ ไม่ให้เว็บตรวจจับ ได้ว่าเปิดโหมดนี้อยู่ เพื่อไม่เพิ่มข้อมูลสำหรับติดตามตัวผู้ใช้ และค่าสีที่ JavaScript อ่านได้จะเป็นค่าเดิมที่เว็บกำหนด
- ตัวเลือก
light onlyที่ให้เว็บปฏิเสธการแปลง ยังไม่รองรับ ใน Safari 27.3 beta 1 ทีมเว็บจึงควรทดสอบหน้าเว็บของตนใน beta ก่อนรุ่นจริง
ทีม WebKit ของ Apple ประกาศ Safari 27.3 Adaptive Dark Mode เมื่อ 3 พฤศจิกายน 2026 ฟีเจอร์ที่แปลงเว็บซึ่งพื้นหลังสว่างให้แสดงเป็นโหมดมืดโดยอัตโนมัติ ใช้ได้ใน Safari 27.3 beta เมื่อผู้ใช้เปิดเอง WebKit ระบุว่าเกือบ 40% ของการโหลดหน้าเว็บมาจากผู้ใช้โหมดมืด แต่มีเพียง 10% ของการโหลดที่เว็บรองรับโหมดมืด
ข้อมูลทั้งหมดของ Safari 27.3 Adaptive Dark Mode ในข่าวนี้มาจากโพสต์ของทีม WebKit เอง ตัวเลข 40% และ 10% เป็นของ WebKit และโพสต์ไม่ระบุวิธีวัด ฟีเจอร์อยู่ในรุ่น beta 1 ซึ่งอาจเปลี่ยนก่อนรุ่นจริง และโพสต์ไม่ได้ระบุวันที่ออกรุ่นเสถียร
Safari 27.3 Adaptive Dark Mode ทำงานอย่างไร
เมื่อผู้ใช้ตั้งระบบเป็นโหมดมืดแล้วเปิดเว็บพื้นสว่างใน Safari 27.3 beta เบราว์เซอร์จะเสนอให้ดูตัวอย่าง ผู้ใช้กด Try เพื่อเปิด ฟีเจอร์จะวิเคราะห์สีของหน้าอย่างรวดเร็วว่าส่วนใหญ่สว่างหรือมืด ถ้าหน้าเป็นพื้นมืดตัวอักษรสว่างอยู่แล้วจะไม่เปลี่ยนอะไร ถ้าเป็นหน้าสว่างจึงแปลงเป็นมืด
ส่วนที่เว็บประกาศรองรับโหมดมืดอยู่แล้ว ด้วย meta color-scheme เป็น light dark ใน HTML หรือ color-scheme: light dark ใน CSS ฟีเจอร์จะไม่เปลี่ยนอะไรเลย ส่วนเว็บอื่นถูกแปลงสีด้วยเมทริกซ์ที่กลับความสว่างและคงเฉดสี ข้อความพยายามให้มีคอนทราสต์ตามอัตราส่วน 4.5:1 ของ WCAG และพื้นหลังแบบไล่เฉดสว่างถูกแปลงเป็นมืด
| องค์ประกอบ | วิธีที่ Safari 27.3 Adaptive Dark Mode จัดการตามโพสต์ |
|---|---|
| พื้นหลังสว่างและข้อความเข้ม | กลับความสว่าง คงเฉดสี ให้ข้อความมีคอนทราสต์อย่างน้อย 4.5:1 |
| ภาพ SVG | ตรวจและแปลงสีเมื่อจำเป็น เช่น ไอคอนและโลโก้ที่เสียคอนทราสต์ |
| ภาพบิตแมป | ส่วนใหญ่ไม่แตะ วิเคราะห์ฮิสโทแกรมของพิกเซลและกลับสีเฉพาะโลโก้ขาวดำแบบง่าย |
| เอฟเฟกต์ mask และ mix-blend-mode | บางกรณีปิดเอฟเฟกต์เพื่อไม่ให้ผลออกมาแปลก |
| เนื้อหาใน canvas | ไม่เปลี่ยน เพราะคาดเดาเนื้อหาได้ยาก |
ความเป็นส่วนตัวของ Safari 27.3 Adaptive Dark Mode
Apple ระบุว่าถ้าเว็บตรวจได้ว่าผู้ใช้เปิดฟีเจอร์นี้ จะเพิ่มข้อมูลที่ใช้ระบุตัวตนผู้ใช้ได้และลดการป้องกันการติดตาม Safari จึงไม่ให้เว็บตรวจจับได้ JavaScript ที่ถามสี CSS จะได้ค่าเดิมที่เว็บเขียนไว้ ไม่ใช่ค่าที่ถูกแปลง และภาพที่วาดลง canvas ยังเป็นรูปแบบเดิม
เว็บไซต์ควรปรับอย่างไรกับ Safari 27.3 Adaptive Dark Mode
WebKit ระบุว่าเว็บที่เขียนตามแนวปฏิบัติสมัยใหม่จะทำงานได้ดีกับฟีเจอร์นี้ ส่วนเว็บที่ยังใช้เทคนิคเก่าอาจต้องแก้เล็กน้อย โพสต์แนะนำให้เปลี่ยนโลโก้และไอคอนจากบิตแมปเป็น SVG ใช้สีทึบหรือไล่เฉดใน CSS แทนภาพพื้นหลังแบบเรียงซ้ำ แทนภาพ sprite ด้วย CSS สมัยใหม่สำหรับมุมโค้ง เงา และสถานะปุ่ม ทำภาพเนื้อหาให้พื้นโปร่งใสแทนการฝังสีพื้นหน้าเว็บลงในภาพ และเพิ่ม padding ให้ตู้เนื้อหาไม่แน่นเกินไป
ถ้าต้องการควบคุมเต็มที่แทน Safari 27.3 Adaptive Dark Mode ให้รองรับโหมดมืดเอง โพสต์ยกเทคโนโลยีที่ใช้ได้กว้างแล้ว เช่น meta color-scheme, prefers-color-scheme, ฟังก์ชัน light-dark(), color-mix() และ contrast-color() รวมถึงตัวแปร CSS สำหรับระบบดีไซน์ และแนะนำให้ประกาศ color-scheme ในส่วนหัวของ HTML หรือใน :root แทนการใส่ภายหลังด้วย JavaScript เพื่อให้หน้าแสดงถูกต้องเร็วที่สุด
ตัวเลือก light only ของ Safari 27.3 Adaptive Dark Mode ยังใช้ไม่ได้ใน beta 1
ถ้าไม่ต้องการให้เว็บถูกแปลง WebKit บอกให้ใช้ color-scheme แบบ light only ทั้งในรูป meta tag และกฎ CSS แต่หมายเหตุในโพสต์ระบุว่า คำว่า only ยังไม่รองรับใน Safari 27.3 beta 1 และให้กลับมาดูตามความคืบหน้าของ beta ทีมเว็บที่ภาพรวมของแบรนด์ต้องคงสีเดิม เช่น เว็บที่ใช้สีแบรนด์เข้มงวด จึงควรทดสอบก่อนรุ่นจริงและแจ้งปัญหาตามช่องทางที่ทีม WebKit ระบุ
ทำไม Safari 27.3 Adaptive Dark Mode จึงสำคัญ
Safari 27.3 Adaptive Dark Mode เปลี่ยนหน้าตาเว็บของคุณในเครื่องผู้ใช้โดยที่เจ้าของเว็บไม่ได้ตัดสินใจเอง ถึงจะเป็นการเปิดโดยผู้ใช้ก็ตาม สำหรับเว็บองค์กรที่ลูกค้าใช้ Safari บน iPhone และ Mac ความเสี่ยงคือโลโก้ แบนเนอร์ หรือกราฟที่ฝังพื้นหลังสีขาวอาจดูผิดเพี้ยน และเอกสารหรือฟอร์มบางหน้าอ่านยากขึ้น ในทางกลับกัน เว็บที่ประกาศรองรับโหมดมืดอย่างถูกต้องจะไม่ถูกแตะต้อง จึงเป็นเหตุผลให้ทีมเว็บลงทุนทำโหมดมืดเอง ไม่ปล่อยให้เบราว์เซอร์เดา
สิ่งที่องค์กรไทยควรทำกับ Safari 27.3 Adaptive Dark Mode
- ทดสอบเว็บหลักกับ Safari 27.3 Adaptive Dark Mode ใน beta ทั้งหน้าแรก หน้าฟอร์ม หน้าชำระเงิน และพอร์ทัลลูกค้า ด้วยโหมดมืดของระบบและเปิด Adaptive Dark Mode
- ตรวจโลโก้และไอคอน ว่าใช้ SVG หรือภาพพื้นโปร่งใส และไม่มีภาพที่ฝังพื้นหลังสีขาวเป็นส่วนหนึ่งของไฟล์
- ประกาศ color-scheme ให้ชัดเจน ถ้าเว็บรองรับโหมดมืดอยู่แล้ว ให้ใส่ใน HTML head และ :root ถ้ายังไม่รองรับ ให้ตัดสินใจว่าจะทำโหมดมืดเองหรือให้เบราว์เซอร์แปลง
- อย่าพึ่ง light only ตอนนี้ เพราะ beta 1 ยังไม่รองรับ ให้ตามผลในรอบ beta ถัด ๆ ไปก่อนใช้เป็นทางออกของเว็บที่ต้องคงสีเดิม
- ตรวจเอกสารที่ลูกค้าอ่านบนเว็บ เช่น ใบแจ้งหนี้และแบบฟอร์มที่พิมพ์หรือส่งต่อ ว่าอ่านได้ในโหมดมืด ติดตามข่าวซอฟต์แวร์และเบราว์เซอร์อื่น ๆ ได้ที่หมวด Software
บริการของ THAI DATA CLOUD ที่เกี่ยวข้อง
ทีมไอทีขนาดเล็กที่ดูแลเว็บองค์กรมักไม่มีเวลาไล่ทดสอบเบราว์เซอร์ใหม่ทุกรุ่น และไม่มีคนประสานงานเมื่อพบหน้าที่แสดงผลผิดเพี้ยน IT Support ของ THAI DATA CLOUD ดูแลเครื่องพนักงาน เซิร์ฟเวอร์ และเครือข่าย แจ้งผ่าน Ticket ที่ตรวจสอบได้ ตอบภายใน 6 ชั่วโมง โดยทีมไทย 24x7 (THAI DATA CLOUD เป็นผู้ดำเนินงานเว็บไซต์นี้)
คำถามที่พบบ่อย
Safari 27.3 Adaptive Dark Mode คืออะไร?
Safari 27.3 Adaptive Dark Mode คือฟีเจอร์ในเบราว์เซอร์ Safari 27.3 beta ที่แปลงเว็บซึ่งพื้นหลังสว่างให้แสดงเป็นโหมดมืดโดยอัตโนมัติเมื่อผู้ใช้เปิดใช้เองและระบบตั้งเป็นโหมดมืด ฟีเจอร์ทำงานในเอนจิน WebKit วิเคราะห์สีของหน้าเว็บแล้วกลับความสว่างโดยรักษาเฉดสี
เปิดใช้ Safari 27.3 Adaptive Dark Mode อย่างไร?
ตามคำอธิบายของ WebKit ต้องใช้ Safari 27.3 beta ตั้งการแสดงผลของระบบเป็นโหมดมืด แล้วเปิดเว็บที่พื้นหลังสว่าง Safari จะเสนอให้ดูตัวอย่างโหมดมืดแบบปรับตัว จากนั้นกด Try ฟีเจอร์ไม่เปิดเองโดยไม่ถามผู้ใช้
เว็บไซต์องค์กรต้องแก้อะไรเมื่อมี Safari 27.3 Adaptive Dark Mode?
เว็บที่เขียนตามแนวปฏิบัติสมัยใหม่มักใช้งานได้ดีกับ Safari 27.3 Adaptive Dark Mode WebKit แนะนำให้เปลี่ยนโลโก้และไอคอนเป็น SVG ใช้สีทึบหรือไล่เฉดใน CSS แทนภาพพื้นหลังแบบเรียงซ้ำ ทำภาพเนื้อหาให้พื้นโปร่งใส และถ้าต้องการควบคุมเต็มที่ให้ประกาศรองรับโหมดมืดเองด้วย color-scheme
Safari 27.3 Adaptive Dark Mode ปฏิเสธได้หรือไม่ถ้าไม่อยากให้เว็บถูกแปลง?
สำหรับ Safari 27.3 Adaptive Dark Mode WebKit บอกว่าใช้ color-scheme แบบ light only เพื่อบอกเบราว์เซอร์ไม่ให้แปลงได้ แต่คำว่า only ยังไม่รองรับใน Safari 27.3 beta 1 และจะดูความคืบหน้าตามรอบ beta ระหว่างนี้เว็บที่ไม่ต้องการถูกแปลงควรทดสอบและแจ้งทีม WebKit ผ่านช่องทางที่โพสต์ระบุ
แหล่งอ้างอิง
- Introducing Adaptive Dark Mode — WebKit
- WebKit — WebKit (Apple)
บุคคล องค์กร และสถานที่ในข่าวนี้
เลือกชื่อเพื่ออ่านข่าวทั้งหมดที่กล่าวถึง ตัวเลขคือจำนวนข่าว
- องค์กรและบริษัท
- Apple73
พบข้อมูลคลาดเคลื่อน? แจ้งกองบรรณาธิการ