Raindrop.io Bookmarks 01/25/2023

2023年1月26日 著

• Optimizing The Image Element LCP -- Smashing Magazine

  "Once the page template for your website has been defined, create and store all the images needed for each device and each DPR based on the imageRenderedSize x DPR formula. To simplify this step, you can use the TwicPics API to generate multiple versions at different dimensions from the high-quality original image."

• Priority Hints and optimizing LCP

  "If your LCP image is downloaded with a Low priority, use fetchpriority to hint the browser to download your image earlier. You can use preload to prioritize your LCP image on Firefox until fetchpriority is supported. Safari does not download images earlier when using the preload directive."

• Designing for Accessibility: Best Practices for Closed Captioning and Subtitles UX -- Smashing Magazine

  "While captions are designed for people with hearing difficulties, subtitles are designed to support hearing people who might not understand the original language."

• 6 Common SVG Fails (and How to Fix Them) | CSS-Tricks - CSS-Tricks

  "The viewBox is a common point of confusion when working with SVG. It's technically fine to use inline SVG without it, but we would lose one of its most significant benefits: scaling with the container."

• SSSVG: An Interactive SVG Reference | fffuel

  "Here's an interactive reference to the most popular and/or interesting parts of the SVG spec."

• Henry From Online | How To Make a Website

  "Write meaningful HTML that communicates the structure of your document before any style or additional interactivity has loaded. Write CSS carefully, reason your methodology and stick to it, and feel empowered to skip frameworks. When it comes time to write JavaScript, write not too much, make sure you know what it all does, and above all, make sure the website works without it."