七夕前夜の雲隠れ
2022.0803(旧暦7月6日)
FUJIFILM X-A7
MAKSY60 + NIKON Teleconverter TC-14 (1.4×テレコンバータ)
07 Aug 2022
残暑お見舞い-svg

レイアウト崩れを防ぐには画像化するのが一番確実なのですが、文字情報がなくなります。
Adobe Illustrator_CCからSVG保存したものをインライン埋込み
写真:岡山西川アイプラザ
Adobe Illustrator_CCからSVG1.1/使用文字埋込みで保存。
imgタグで.svgファイルを読み込むのでなく、記事内に直接SVGのコードを入れています。
エリア内文字やシアーなど、HTML+ CSSではかなり面倒そうなレイアウトで試してみました。ブラウザーによって字間が少し崩れたり、フォント情報は無視されたりですが、テキストが選択できるのはありがたい。
問題は少し前のブラウザーだとSVG表示に対応していないことですね。
- 元のIllustrator ファイル:1.9 MB(画像は150ppiで埋込み)
- PDF:167 KB(同ファイルから画像圧縮JPEG<画質:高>・PDF1.7で保存)
- SVG:491 KB
SVG非対応ブラウザーに考慮したら、やはり代替画像も用意してobject タグで表示させる方がよさそうです。
SVGの対応状況など、渡辺竜さんのRruverサイトのページを参考にさせていただきました。
PDF埋込み
21 Aug 2013