From 721d3496c8ac745920c5c1465ab0463d02ab1e28 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Thu, 15 Apr 2021 02:51:10 +0900 Subject: Web/SVG を更新 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 2021/03/15 の英語版に同期 --- files/ja/web/svg/index.html | 62 +++++++++++++++++++++------------------------ 1 file changed, 29 insertions(+), 33 deletions(-) diff --git a/files/ja/web/svg/index.html b/files/ja/web/svg/index.html index 5ea3aae3fa..bc2f471ea8 100644 --- a/files/ja/web/svg/index.html +++ b/files/ja/web/svg/index.html @@ -6,82 +6,78 @@ tags: - Graphics - Icons - Images - - References + - Reference - Responsive Design - SVG - Scalable Graphics - Scalable Images - Vector Graphics - Web - - 'l10n:priority' + - l10n:priority translation_of: Web/SVG ---
{{SVGRef}}
-
始めよう
-このチュートリアルは、 SVG を使い始めるのに役立つでしょう。
+

SVG を始めましょう

-

Scalable Vector Graphics (SVG) は、二次元ベースのベクター形式のための XML に基づくマークアップ言語です。そのため、どんな大きさでもきれいにレンダリングできる画像を記述するためのテキストベースのオープンなウェブ標準であり、特に他のウェブ標準、例えば CSS, DOM, JavaScript, SMIL などとうまく機能するように設計されています。 SVG は本質的に、グラフィックに対するもので、テキストに対する HTML のような位置づけです。

+

Scalable Vector Graphics (SVG) は、二次元ベースのベクター形式のための XML に基づくマークアップ言語です。そのため、どんな大きさでもきれいにレンダリングできる画像を記述するためのテキストベースのオープンなウェブ標準であり、特に他のウェブ標準、例えば CSS, DOM, JavaScript, SMIL などとうまく機能するように設計されています。 SVG は本質的に、グラフィックに対するもので、テキストに対する HTML のような位置づけです。

-

SVG 画像と関連する振る舞いは XML のテキストファイルに定義されるので、検索したり、インデックスをつけたり、スクリプトで操作したり、圧縮したりすることができます。加えて、これはあらゆるテキストエディターやドローソフトで作成したり編集したりできることを意味します。

+

SVG 画像と関連する振る舞いは XML のテキストファイルに定義されるので、検索したり、インデックスをつけたり、スクリプトで操作したり、圧縮したりすることができます。加えて、これはあらゆるテキストエディターやドローソフトで作成したり編集したりできることを意味します。

旧来の {{Glossary("JPEG")}} や {{Glossary("PNG")}} のようなビットマップ画像形式と比較して、 SVG 形式のベクター画像は、品質を損なうことなく任意の大きさでレンダリングすることができ、テキストを更新することで、グラフィックエディターを使用せずに簡単にローカライズすることができます。適切なライブラリを使用すれば、 SVG ファイルをその場でローカライズすることも可能です。

SVG は1999年から World Wide Web Consortium (W3C) によって開発されています。

-

ドキュメント

+

ドキュメント

-
SVG 要素リファレンス
-
各 SVG 要素についての詳細情報です。
-
SVG 属性リファレンス
-
各 SVG 属性の詳細情報です。
-
SVG DOM インターフェイスリファレンス
-
JavaScript と連携するための SVG DOM API の詳細情報です。
-
HTML コンテンツへ SVG 効果を適用する
-
SVG は {{Glossary("HTML")}}、{{Glossary("CSS")}} と {{Glossary("JavaScript")}} と連携して動作します。SVG を使用することで、通常の HTML ページや Web アプリケーションを拡張できます。
+
SVG 要素リファレンス
+
各 SVG 要素についての詳細情報です。
+
SVG 属性リファレンス
+
各 SVG 属性の詳細情報です。
+
SVG DOM インターフェイスリファレンス
+
JavaScript と連携するための SVG DOM API の詳細情報です。
+
HTML コンテンツへ SVG 効果を適用する
+
SVG は {{Glossary("HTML")}}、{{Glossary("CSS")}} と {{Glossary("JavaScript")}} と連携して動作します。SVG を使用することで、通常の HTML ページや Web アプリケーションを拡張できます。
-

コミュニティ

+

コミュニティ

-

ツール

+

ツール

- + -

アニメーションとインタラクション

+

アニメーションとインタラクション

HTML のように、SVG はドキュメントモデル (DOM) およびイベントを持ち、JavaScript からアクセスが可能です。これを利用することで、開発者はリッチなアニメーションやインタラクティブな画像を制作できます。

-

地図、グラフ、ゲームおよび 3D の実験

+

地図、グラフ、ゲームおよび 3D の実験

SVG をほんの少し利用するだけでも、ウェブコンテンツを格段に向上させることができます。以下に挙げるのは、SVG を本格的に使用した例です。

-- cgit v1.2.3-54-g00ecf