{"id":291856,"date":"2019-06-21T08:10:50","date_gmt":"2019-06-21T15:10:50","guid":{"rendered":"http:\/\/css-tricks.com\/?p=291856"},"modified":"2019-10-15T07:13:53","modified_gmt":"2019-10-15T14:13:53","slug":"weekly-platform-news-mozillas-av1-encoder-samsung-one-ui-css-dom-matches-method","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/weekly-platform-news-mozillas-av1-encoder-samsung-one-ui-css-dom-matches-method\/","title":{"rendered":"Weekly Platform News: Mozilla\u2019s AV1 Encoder, Samsung One UI CSS, DOM Matches Method"},"content":{"rendered":"

\u0160ime posts regular content for web developers on webplatform.news<\/a>.<\/p>\n

In this week’s weekly roundup, Vimeo and Mozilla partner up on a video encoding format, how to bind instructions to to form fields using aria labels, the DOM has a matching function, and Samsung is working on its own CSS library.<\/p>\n

<\/p>\n

\n

Vimeo partners with Mozilla to use their rav1e encoder<\/h3>\n

Vittorio Giovara<\/a>:<\/strong> AV1 is a royalty-free video codec designed by the Alliance for Open Media and the the most anticipated successor of H.264. Vimeo is contributing to the development of Mozilla\u2019s AV1 encoder.<\/p>\n

In order for AV1 to succeed, there is a need of an encoder like x264, a free and open source encoder, written by the community, for the community, and available to everyone: rav1e. Vimeo believes in what Mozilla is doing.<\/p><\/blockquote>\n

Use aria-describedby to bind instructions to form fields<\/h3>\n

Raghavendra Satish Peri<\/a>:<\/strong> If you provide additional instructions for a form field, use the aria-describedby<\/code> attribute to bind the instruction to the field. Otherwise, assistive technology users who use the Tab key might miss this information.<\/p>\n

<label for=\"dob\">Date of Birth<\/label>\r\n<input type=\"text\" aria-describedby=\"dob1\" id=\"dob\" \/>\r\n<span id=\"dob1\">Use DD\/MM\/YY<\/span><\/code><\/pre>\n
Samsung Internet announces One UI<\/abbr> CSS<\/h3>\n
Diego Gonz\u00e1lez<\/a>:<\/strong> Samsung is experimentally developing a CSS library based on its new One UI design language. The library is called One UI CSS and includes styles for common form controls such as buttons, menus, and sliders, as well as other assets (web fonts, SVG<\/abbr> icons, polyfills).<\/p>\n
\"\"
Some of the controls present in One UI CSS.<\/figcaption><\/figure>\n
DOM elements have a matches method<\/h3>\n
Sam Thorogood<\/a>:<\/strong> You can use the matches<\/code> method to test if a DOM element has a specific CSS class, attribute or ID<\/abbr> value. This method accepts a CSS selector and returns true<\/code> if the element matches the given selector.<\/p>\n
el.classList.has('foo')  \/* becomes *\/ el.matches('.foo');\r\nel.hasAttribute('hello') \/* becomes *\/ el.matches('[hello]');\r\nel.id === 'bar'          \/* becomes *\/ el.matches('#bar');<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"
In this week’s weekly roundup, Vimeo and Mozilla partner up on a video encoding format, how to bind instructions to to form fields using aria labels, the DOM has a matching function, and Samsung is working on its own CSS library.<\/p>\n","protected":false},"author":245432,"featured_media":291858,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[1649],"tags":[466,721,1674,1672,1673],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/06\/web-platform-news-190621.png?fit=1200%2C600&ssl=1","jetpack-related-posts":[{"id":283779,"url":"https:\/\/css-tricks.com\/native-video-on-the-web\/","url_meta":{"origin":291856,"position":0},"title":"Native Video on the Web","date":"March 6, 2019","format":false,"excerpt":"TIL about the HLS video format: HLS stands for HTTP Live Streaming. It\u2019s an adaptive bitrate streaming protocol developed by Apple. One of those sentences to casually drop at any party. \u00c4h. Back on track: HLS allows you to specify a playlist with multiple video sources in different resolutions. Based\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/02\/1_x4SPcU16wKczk9HBd_mGKw.png?fit=1200%2C630&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":373484,"url":"https:\/\/css-tricks.com\/gifs-without-the-gif-the-most-performant-image-and-video-options-right-now\/","url_meta":{"origin":291856,"position":1},"title":"GIFs Without the .gif: The Most Performant Image and Video Options Right Now","date":"September 28, 2022","format":false,"excerpt":"So you want an auto-playing looping video without sound? In popular vernacular this is the very meaning of the word GIF. The word has stuck around but the image format itself is ancient and obsolete. Twitter, for example, has a \u201cGIF\u201d button that actually inserts a