1. 公式配布の有無
権利者がポートフォリオ用途を許可しているか、公式ページで確認します。
先に確認すること
利用前に確認する3つのこと
迷った場合は、公式ロゴ画像を使わず、製品名・技術名を文字で表示する方法が安全です。
2. 利用条件
利用できる媒体、改変の可否、リンク先、余白などの条件を確認します。
3. クレジット位置
Webはフッターや専用ページ、印刷は奥付や最終ページが基本です。
クレジット表示は、ロゴ利用の許可証ではありません
HTML5 Logoのように公開ライセンスで利用できる素材と、Microsoft・Adobeの企業ロゴや製品アイコンのように、明示的なライセンスが必要な素材があります。後者は、商標文や免責文を掲載しても無許諾利用が許されるわけではありません。
掲載する場所
Webと印刷の掲載位置
CC BYなどが求めるのは、媒体に応じた合理的な帰属表示です。ロゴの真横へ長文を置くのではなく、閲覧者が自然に確認できるクレジット欄へまとめます。
WEB PORTFOLIO
Webサイトの場合
- 最もおすすめ
/credits/、/trademarks/、/licenses/のいずれかを作り、全ページ共通フッターから「商標・ロゴクレジット」として1クリックで開ける状態にします。 - 1ページ完結サイト
ページ最下部のフッターに、使用した素材だけをまとめて掲載すれば十分です。
- 特定の制作実績だけで使用
実績ページ末尾に短い表記を置き、詳細は共通クレジットページへリンクします。
- 避ける配置
ログイン後だけ見える場所、何階層も深い場所、画像の代替テキストだけ、閲覧者が通常は見つけられない場所へ隠さないでください。
フッターリンク例
<footer>
<a href="/credits/">商標・ロゴクレジット</a>
</footer>PRINT PORTFOLIO
印刷物の場合
- 通常の冊子
最終ページ、奥付、クレジットページへの掲載で構いません。小さすぎず読める文字サイズにします。
- 1枚物・折りパンフレット
下端または裏面のクレジット欄に掲載します。
- URL・ライセンス
原作ページとライセンスURLを文字で残します。QRコードを加えても、URL表記自体を省かないほうが追跡しやすくなります。
- 商標をタイトルに使用
Adobeなどが出版物タイトル向けの特別条件を定める場合は、最終ページだけではなく、表紙・裏表紙・著作権ページ等の指定へ従います。
奥付の見出し例
商標・ロゴクレジット
Trademark and Logo Credits実務上の基準
Webは「共通フッターから1クリック」、印刷は「最終ページまたは奥付」を基本にすると、対象ロゴの近くを圧迫せず、帰属情報も見つけやすくできます。各権利者が個別の位置を指定している場合は、その指定を優先します。
先に利用可否を確認
利用可否を先に比較
「公式配布先がある」「無料で取得できる」「クレジットを書く」は、必ずしも自由利用を意味しません。
| 素材 | 一般のポートフォリオ | 必要な表記 | 公式・一次配布先 |
|---|---|---|---|
| W3C HTML5 Logo | 利用可 | W3C・作品名・CC BY 3.0・原作URL | W3C HTML5 Logo |
| HTML LS 非公式ロゴ | 利用可 | W3Cへの帰属・CC BY 3.0・変更内容・非公式 | InkSignal Lab配布ページ |
| 現行CSSロゴ | 利用可 / CC0 | 法的な帰属表示は不要。任意で出所を表示 | CSS-Next Community Group |
| 旧CSS3シールド | 利用可 | W3C・CC BY 3.0。現行CSSロゴと誤認させない | W3C HTML5 Technology Icons |
| 黄色いJSコミュニティロゴ | 利用可 / 非公式 | 著作権表示とMIT License全文を保持 | logo.js GitHub |
| Microsoft 365 / Officeロゴ・アイコン | 原則不可 | クレジットでは代替不可。ライセンスが必要 | 一般向け自由配布なし |
| Adobe企業・製品ロゴ・アイコン | 原則不可 | クレジットでは代替不可。ライセンスが必要 | パートナープログラム等 |
HTML・CSS・JavaScript
HTML・CSS・JavaScript
見た目が似た技術ロゴでも、公式性・ライセンス・表示義務は異なります。
H5
W3C公式 / CC BY 3.0
W3C HTML5 Logo
HTML5向けの公式ロゴ
W3CがSVG・PNGを配布しています。Webや印刷で利用できますが、W3Cへの帰属とCC BY 3.0を表示します。ロゴを載せても、HTML文書の妥当性・仕様適合性・技能認定を証明するものではありません。
- Web
- 共通フッターから開けるクレジットページ
- 印刷
- 最終ページ・奥付
- 公式配布
- W3C HTML5 Logo ↗
- 改変時
- 変更したことも表示
コピー用
HTML5 Logo by W3C, licensed under CC BY 3.0.
Source: https://www.w3.org/html/logo/
License: https://creativecommons.org/licenses/by/3.0/LS
非公式 / CC BY 3.0
HTML LS 非公式ロゴ
W3C HTML5 Logoの改変物
HTML Living Standardに公式ロゴがないため、HTML5 Logoを基にした非公式素材です。InkSignal Worksへのクレジット・申請・報告は不要ですが、原作のCC BY 3.0に基づくW3Cへの帰属、変更内容、非公式である旨を表示します。
- Web
- 共通フッターまたはクレジットページ
- 印刷
- 最終ページ・奥付
- InkSignalへの表示
- 不要
コピー用
HTML LS非公式ロゴは、W3Cの「HTML5 Logo」（CC BY 3.0）を基にした改変物です。
変更内容：数字の「5」を「LS」へ置換、配色変更。
本素材はW3C・WHATWGの公式ロゴ、認定、承認、提携または推奨を示すものではありません。
原作：https://www.w3.org/html/logo/
ライセンス：https://creativecommons.org/licenses/by/3.0/CSS
現行公式 / CC0 1.0
現行CSSロゴ
CSS-Next Community Group制作
CSS全体を表す新しいロゴで、CSSWGの採択決議を経た現行ロゴです。CC0 1.0のため著作権上の帰属表示は必須ではありません。認識性とアクセシビリティのため、公式リポジトリのSVGを使い、ガイドラインに従う方法を推奨します。
- Web・印刷
- 利用可。法的なクレジットは不要
- 任意表示
- 出所を明示したい場合のみ掲載
- ライセンス
- CC0 1.0 ↗
任意のクレジット例
CSS logo by the CSS-Next Community Group, released under CC0 1.0.
Source: https://github.com/CSS-Next/logo.css
License: https://creativecommons.org/publicdomain/zero/1.0/CSS3
旧デザイン / CC BY 3.0
旧CSS3シールド
W3C HTML5 Technology Class Icon
青い盾に「3」が入った図柄は、現在のCSS全体の公式ロゴではなく、W3C HTML5アイデンティティ内の「CSS3 & Styling」技術クラスアイコンとして扱います。使う場合はCC BY 3.0の帰属を付け、「CSS3」または歴史的アイコンであることを明記します。
- Web・印刷
- CC BY 3.0で利用可
- 注意
- 現行CSSロゴとして説明しない
- 代替
- 現在は上記の紫色CSSロゴを推奨
コピー用
CSS3 / Styling Technology Class Icon by W3C, licensed under CC BY 3.0.
Source: https://www.w3.org/html/logo/
License: https://creativecommons.org/licenses/by/3.0/JS
コミュニティ / MIT License
黄色いJSコミュニティロゴ
Ecma International・TC39の公式ロゴではありません
よく見かける黄色い正方形のJSロゴは、JSConfコミュニティが公開したコミュニティロゴです。MIT Licenseで利用できますが、著作権表示と許諾文をコピーまたは実質的部分に保持する必要があります。印刷物でライセンス全文を載せにくい場合は、ロゴを使わず「JavaScript」と文字で表示する方法が簡単です。
- Web
- クレジットページに短い説明 + MIT全文
- 印刷
- 最終ページにMIT全文。難しければ文字表記
短い説明
JS community logo © 2011 Christopher Williams, used under the MIT License.
This is a community logo, not an official logo of Ecma International or TC39.
Source: https://github.com/voodootikigod/logo.js
The full MIT License notice must be retained with copies or substantial portions of the logo.MIT License全文を表示
ロゴと一緒に保持する全文
The MIT License (MIT)
Copyright (c) 2011 Christopher Williams <chris@iterativedesigns.com>
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.Microsoft 365・Office
Microsoft 365・Office関連
製品名を正確に文字で示すことと、Word・Excel・PowerPoint等の公式アイコンを使うことは別です。
ロゴ・アプリアイコンは要ライセンス
通常のポートフォリオでは、製品名を文字で掲載してください
Microsoftは、製品名・ワードマークを事実に即して参照することを一般に認めています。一方、企業ロゴ、アプリ・製品アイコン、デザインは明示的なライセンスなしに使用できないとしています。公式ファイルを入手できても、クレジットを付けるだけではスキルバッジとして使えません。
推奨されるスキル表示例
Microsoft WordMicrosoft ExcelMicrosoft PowerPointMicrosoft Outlook
自分のサイト用に作った統一テキストタグを使い、Microsoft製品名を自分のブランドより目立たせません。
Microsoft公式形式に沿う英語脚注
Microsoft, Excel, Microsoft 365, Microsoft Teams, Office, OneDrive, OneNote, Outlook, PowerPoint, and Word are trademarks of the Microsoft group of companies.日本語の補助文（任意）
Microsoft、Excel、Microsoft 365、Microsoft Teams、Office、OneDrive、OneNote、Outlook、PowerPoint、Word は、Microsoft グループ各社の商標です。本ポートフォリオは Microsoft との提携、承認、後援その他の関係を示すものではありません。Adobe製品
Adobe関連
Adobe製品名の参照と、企業ロゴ・製品ロゴ・アプリアイコンの使用を分けて考えます。
ロゴ・製品アイコンは要許可
最初は正式な製品名、ロゴは使わず文字で表示します
Adobeは製品を識別するための商標名を条件付きで使用できるとしていますが、Adobe企業ロゴや製品ロゴ・アイコンは、特定のライセンスプログラムまたは書面による許可がない限り使用できません。最初の目立つ表記では「Adobe Photoshop」「Adobe Illustrator」「Adobe Premiere」のように正式名称を使い、PS・AI・Prを正式名称の代わりにしないでください。
推奨されるスキル表示例
Adobe PhotoshopAdobe IllustratorAdobe InDesignAdobe Premiere
公式アプリアイコンは使わず、自分のサイトデザインに合わせた統一テキストタグを使います。
Adobe公式形式に沿う帰属文
Adobe, Acrobat, Adobe Premiere, After Effects, Creative Cloud, Illustrator, InDesign, Lightroom, and Photoshop are either registered trademarks or trademarks of Adobe in the United States and/or other countries.通常の独立ポートフォリオ向け補助文（任意）
This portfolio is independently created and is not authorized, endorsed, or sponsored by Adobe.Adobe商標を出版物・セミナー等のタイトルに使う場合
通常のスキル一覧とは別の特別条件です。Adobeは目立つ非提携表示を求め、表紙・裏表紙が望ましく、最低でも著作権ページまたは該当Webサイトへの掲載を求めています。
用途に合わせて製品名を修正
THIS [TITLE OF PORTFOLIO, PUBLICATION, CONFERENCE OR SEMINAR] IS NOT AUTHORIZED, ENDORSED OR SPONSORED BY ADOBE, PUBLISHER OF [ADOBE PRODUCT NAME(S)].クレジット文を作る
使用した項目からクレジット文を作る
ロゴ・製品名を選ぶと、Web用と印刷用の文面を生成します。Microsoft・Adobeについては製品名の商標脚注だけを生成し、ロゴ利用権は付与しません。
GENERATED CREDIT
生成結果
推奨位置：/credits/等へ掲載し、全ページ共通フッターから1クリックでリンク。
推奨位置：最終ページ・奥付・クレジットページ。
生成文の限界
JSコミュニティロゴを選ぶとMIT License全文も含まれます。Microsoft・Adobeのチェック項目は製品名の脚注用で、公式ロゴ・アプリアイコンの利用を許可するものではありません。公開直前に各公式ガイドの最新版を確認してください。
公式情報・一次情報
配布元・規約ページ一覧
非公式なロゴまとめサイトから画像を保存せず、一次配布元と利用条件を確認してください。
HTML5 Logo
公式SVG・PNG、FAQ、CC BY 3.0の帰属先。
公式ダウンロード ↗FAQ ↗HTML LS 非公式ロゴ
4配色、ライセンス文、第三者利用ガイドを同梱。
配布ページ ↗現行CSSロゴ
公式SVGと利用ガイド。CC0 1.0。
公式リポジトリ ↗CSSWG採択記録 ↗JSコミュニティロゴ
黄色いJSロゴの一次配布元。MIT License。公式標準化団体ロゴではありません。
配布リポジトリ ↗MIT License TXT ↓JavaScript仕様
JavaScript（正式にはECMAScript）の仕様を管理する一次情報。
TC39 ↗ECMA-262 Living Specification ↗Microsoft 365 / Office
商標名とロゴ・製品アイコンの条件。一般ポートフォリオ用の自由なアイコン配布先ではありません。
商標ガイド ↗限定用途のArchitecture Icons ↗Adobe製品
正式名称、帰属文、ロゴ・製品アイコンの許諾条件。
商標ガイド ↗商標データベース ↗重要な注意
公式条件を優先し、迷うロゴは文字表記へ。
本ページは2026年7月16日に確認した公開情報を、一般的なポートフォリオ用途向けに整理した実務補助です。個別の契約、パートナープログラム、地域の法令、利用文脈により条件は変わります。最終判断では権利者の最新ガイドを優先し、許可が明確でないMicrosoft・Adobeのロゴや製品アイコンは使わず、製品名を文字で示してください。