SVG Viewboxとディスプレイサイズのベストプラクティス

Question

imgタグとsvgファイルをデバッグしている間、これがchromeに気づいています。 SVGはスケーラブルであることを意味すると、すべてのスケーリングが正しく行われているが

。 viewbox属性で定義される "イメージ"の初期サイズがあります。

ビューボックスを表示サイズと同じにすることを常に試みるべきですか？または、これはSEOとブラウザのページのレンダリング時間の両方に実際には関係しないものですか？

Answer 1

ビューボックスは、SVG内の座標の解釈方法を定義するSVGの論理部分です。たとえば、0,0,1,1のビューボックスと0,0,1,1の矩形は、-10、-10,10,10のビューボックスとまったく同じで、その次元の矩形です。

これは、タグ自体またはCSSを使って定義できる出力サイズとは無関係です。

ビューボックスのサイズを2倍にすると、要素の座標は同じままで、内部的に「表示ウィンドウ」を2倍にするため、画像全体が半分に収縮します。 "ズームアウト"と想像してみてください。