タグ

HTMLとImageに関するefclのブックマーク (3)

  • GitHub - SoraKumo001/satoru

    efcl
    efcl 2026/05/31
    WebAssemblyで動作するHTMLをSVG/PNG/WebP/PDFへ変換するレンダリングエンジン。 描画にSkia、レイアウトにlitehtmlを利用し、CSSを含んだHTMLを画像へと変換する。 TTF/OTF/WOFF2のフォントやGoogle Fontsの解決、PNG/JPEG/WebP/AVIFの画像をサポー
  • HTML <img> 画像埋め込み要素 - HTML | MDN

    上記の例では、 <img> 要素の使い方を示しています。 src 属性は、埋め込みたい画像へのパスを保持します。srcset 属性が利用できる場合、src 属性は必須ではありません。ただし、src 属性または srcset 属性の少なくとも一方は指定しなければなりません。 alt 属性は、この画像のテキストによる代替情報を保持します。これは必須であり、アクセシビリティに非常に役立つものです。スクリーンリーダーは、この属性値をユーザーに読み上げるので、画像の意味が分かります。また、ネットワークエラーやコンテンツのブロック、リンク切れ等の理由で画像が読み込めなかった場合にも代替テキストが表示されます。 他にも、様々な目的で指定できる属性がたくさんあります。 セキュリティとプライバシーのためのリファラー/CORS 制御。 crossorigin および referrerpolicy を参照してく

    HTML <img> 画像埋め込み要素 - HTML | MDN
    efcl
    efcl 2026/04/12
    `<img sizes=(max-width: 30em)>`のようなmath functionがimageのsizes属性で利用できる。 Media Queryで表示する画像を出しわけできる
  • Alt Text Hall of Fame

    What is alt text? Alternative text (or alt text, in short) is the text you can use to describe an image when you publish it on your website or social media. Why is alt text important? Imagine, for a moment, that your browser stopped showing you images. You would still see them referenced in articles, you’d read conversations about them, people making jokes. What would this experience be like for y

    efcl
    efcl 2023/08/23
    画像の代替テキストについてのサイト。 なぜ必要なのかと具体的にどういうキャプションを書くのかの具体的な例などを紹介している
  • 1