ใหม่ใน Chrome 127

สิ่งที่จำเป็นต้องทราบมีดังนี้

  • font-size-adjust ช่วยปรับปรุงให้แบบอักษรสำรองอ่านได้ง่ายขึ้น
  • ตอนนี้การเปิดใช้งานของผู้ใช้จะได้รับการเผยแพร่ระหว่างเอกสารการแสดงภาพซ้อนภาพและโปรแกรมเปิด
  • ขณะนี้คอนเทนเนอร์แบบเลื่อนสามารถโฟกัสแป้นพิมพ์ได้โดยค่าเริ่มต้น
  • นอกจากนี้ยังมีอีกมากมาย

ฉันชื่อ Adriana Jara ไปดูกันเลยว่ามีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 127 กัน

CSS font-size-adjust

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

ภาพต่อไปนี้แสดงความแตกต่างระหว่างแบบอักษร Verdana และ Times แม้ว่าข้อความจะมีขนาดเท่ากัน

บรรทัดข้อความที่อ่านว่า "ข้อความนี้ใช้แบบอักษรสีเขียว (14px) ซึ่งมีอักษรตัวพิมพ์เล็กที่ค่อนข้างใหญ่" และ "ใช้แบบอักษร Times (14px) ซึ่งอ่านยากและมีขนาดเล็ก

หากเว็บไซต์กลับไปใช้แบบอักษร Times จะทำให้อ่านได้ยากขึ้น

พร็อพเพอร์ตี้ CSS ของ font-size-adjust ช่วยให้คุณปรับขนาดแบบอักษรของแบบอักษรสำรองเพื่อให้ค่าการแสดงผล (ความสูงของอักษรตัวพิมพ์เล็กหารด้วยขนาดตัวอักษร) สอดคล้องกัน เพื่อให้ข้อความออกมาคล้ายกันไม่ว่าจะใช้แบบอักษรใดก็ตาม

ในภาพต่อไปนี้ การใช้การปรับขนาดแบบอักษรจะคงความอ่านง่ายระหว่างแบบอักษร Verdana และ Times

   font-size-adjust: 0.545;

บรรทัดข้อความที่อ่านว่า "ข้อความนี้ใช้แบบอักษรสีเขียว (14px) ซึ่งมีอักษรตัวพิมพ์เล็กที่ค่อนข้างใหญ่", "ใช้แบบอักษร Times (14px) ซึ่งอ่านได้ยากหากมีขนาดเล็ก และ "ข้อความนี้ในแบบอักษร 14px Times จะมีการปรับค่าในสัดส่วนเดียวกับแบบอักษร Verdana ดังนั้นแบบอักษรตัวพิมพ์เล็กจึงได้รับการทำให้เป็นมาตรฐานเดียวกันในแบบอักษรทั้งสองแบบ

เมื่อเปิดตัว font-size-adjust ใน Chrome ฟีเจอร์นี้จะกลายเป็น "พื้นฐาน" ที่เพิ่งพร้อมใช้งาน อ่านรายละเอียดในการปรับขนาดแบบอักษรของ CSS จะอยู่ในเกณฑ์พื้นฐานแล้ว

การแสดงภาพซ้อนภาพในเอกสาร: เผยแพร่การเปิดใช้งานของผู้ใช้

ขณะนี้ Document Picture-in-Picture API เผยแพร่การเปิดใช้งานของผู้ใช้ระหว่างหน้าต่างการแสดงภาพซ้อนภาพของเอกสารและโปรแกรมเปิด

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

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

ไปที่การแสดงภาพซ้อนภาพสำหรับองค์ประกอบใดก็ได้ ไม่ใช่แค่ <video> สำหรับรายละเอียดเพิ่มเติม

คอนเทนเนอร์เลื่อนที่โฟกัสได้ของแป้นพิมพ์

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

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

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

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

ดูรายละเอียดเพิ่มเติมในตัวเลื่อนที่โฟกัสได้ของแป้นพิมพ์

และอีกมากมาย

แถมยังมีอีกมากมาย

  • การเปลี่ยนมุมมองเอกสารเดียวกันพร้อมกันในเฟรมหลักและ iframe ต้นทางเดียวกันพร้อมใช้งานแล้ว

  • ตอนนี้ข้อความแสดงแทนที่สร้างจากเนื้อหา CSS รองรับอาร์กิวเมนต์หลายอาร์กิวเมนต์แล้ว

  • ตอนนี้แผงประสิทธิภาพของ DevTools จะบันทึกเหตุการณ์ของข้อความ WebSocket และแสดงในการติดตามประสิทธิภาพ

อ่านบันทึกประจำรุ่นฉบับเต็ม

อ่านเพิ่มเติม

เราพูดถึงไฮไลต์สำคัญเพียงบางส่วนเท่านั้น โปรดตรวจสอบลิงก์ต่อไปนี้สำหรับ การเปลี่ยนแปลงเพิ่มเติมใน Chrome 127

สมัครใช้บริการ

หากต้องการติดตามข้อมูลล่าสุด โปรดสมัครรับข้อมูล ช่อง YouTube สำหรับนักพัฒนาซอฟต์แวร์ Chrome และคุณจะได้รับการแจ้งเตือนทางอีเมลเมื่อเราเปิดตัววิดีโอใหม่

ขอโทษครับ Adriana Jara นะ ทันทีที่ Chrome 127 เปิดตัว ผมจะมาบอกว่ามีอะไรใหม่ใน Chrome