4월의 새로운 웹 플랫폼 기능

2026년 4월 동안 안정 버전(stable) 및 베타 웹 브라우저에 도입된 흥미로운 기능들을 살펴보세요.

안정 버전 브라우저 출시

4월 동안 Chrome 147과 Firefox 150이 안정 버전으로 출시되었습니다. 이번 달 Safari의 안정 버전 출시는 없었습니다. 이 포스트에서는 이번 달의 다양한 새로운 기능들을 살펴봅니다.

contrast-color()

CSS 함수가 베이스라인(Baseline)이 되다

Chrome 147에 contrast-color() 함수가 탑재됨에 따라, 이 유용한 접근성(accessibility) 기능은 이제 모든 주요 엔진에서 사용할 수 있게 되어 'Baseline Newly available' 상태가 되었습니다.

이 함수는 색상 값을 입력받아, 제공된 색상과 대비가 가장 높은 색상인 검은색 또는 흰색 중 하나를 반환합니다. 이는 텍스트가 접근성 대비 요구 사항을 충족하도록 보장하는 데 도움이 됩니다.

ariaNotify() 메서드

Firefox 150은 Document 및 Element에 대한 ariaNotify() 메서드 지원을 도입했습니다. 이 메서드를 통해 콘텐츠 작성자는 스크린 리더(screen reader)가 발표할 텍스트 문자열을 대기열에 추가할 수 있습니다.

이는 특히 DOM 업데이트와 연결되지 않은 알림의 경우

요소(element)이며, 이를 통해 텍스트 경로 기하학(text path geometry)을 인라인(inline)으로 정의할 수 있습니다.

브라우저 지원 (Browser Support)

JSON 및 style에 대한 Modulepreload 지원

Chrome 147은 <link rel="modulepreload">의 목적지(destination)로 JSON 및 style 모듈 타입을 지원합니다.

브라우저 지원 (Browser Support)

Math.sumPrecise

Chrome 147은 Math.sumPrecise에 대한 TC39 제안을 구현하여, 반복 가능한 객체(iterable) 내 값들의 정밀한 합계(precise sum)를 반환합니다. 이 메서드는 이제 Baseline의 Newly available 단계로 사용 가능합니다.

베타 브라우저 출시 (Beta browser releases)

베타 브라우저 버전은 다음 안정화 버전(stable version)에 포함될 기능들을 미리 보여줍니다. 이는 전 세계적으로 해당 버전이 출시되기 전에, 사이트에 영향을 미칠 수 있는 새로운 기능이나 제거 사항들을 테스트하기에 아주 좋은 시기입니다. 이번 달의 새로운 베타 버전은 Chrome 148, Firefox 151, 그리고 Safari 26.5입니다.

Chrome 148 베타에는 CSS의 이름 전용 컨테이너 쿼리(name-only container queries), 비디오 및 오디오 요소에 대한 지연 로딩(lazy loading), 그리고 @supports 내에서 기능 감지(feature detection)를 위한 at-rule() 함수가 포함됩니다.

Firefox 151 베타에는 CSS 컨테이너 스타일 쿼리(container style queries)가 포함됩니다.

Safari 26.5 베타에는 수많은 이슈 해결과 더불어 <details>, <dialog>, <select>, 그리고 <input> 요소에 대한 :open 의사 클래스(pseudo-class) 지원이 포함됩니다.

이 포스트에는 이전에 스크롤 기반 애니메이션 범위 속성(Scroll-driven animation range properties)이 Baseline이 된다는 내용이 포함되어 있었습니다. 해당 속성들은 아직 Firefox에 출시되지 않았으므로, 잘못된 정보를 제거하기 위해 이 포스트를 업데이트했습니다.