ToolRoll
必要な道具を、すぐ広げる。ITミニツール集。

HTMLリンク生成ツール｜URLからaタグを作成

Webツール

HTTP・HTTPS URL、相対URL、ページ内リンクを入力できます。

開き方

新しいタブではtarget="_blank"とrel="noopener"を追加します。

rel属性（任意）
表示プレビューリンク表示文字

URLとリンク表示文字を入力してください。

このツールでできること

URLと表示文字を入力して、Webページへ貼り付けられるHTMLのaタグを1件生成できます。HTTP・HTTPSの絶対URL、/guide/や../about/等の相対URL、#section等のページ内リンクに対応します。

同じタブまたは新しいタブで開く設定、nofollow、sponsored、ugc、noreferrer、title属性を選べます。

使い方

  1. URLとリンク表示文字を入力します。
  2. 開き方と必要な属性を選びます。
  3. 「HTMLリンクを生成」を押します。
  4. 結果をコピーしてHTMLへ貼り付けます。

表示プレビューはリンク文字の見え方を確認するための表示で、クリックできるリンクではありません。入力や設定を変更すると、以前の生成結果は消去されます。

入力例・出力例

URLhttps://example.com/、表示文字公式サイトを入力すると、同じタブで開く次のコードを生成します。

<a href="https://example.com/">公式サイト</a>

URLHTTPS://Example.COM:443/a/../b?x=%7e&y=1、表示文字公式 & 詳細、新しいタブ、nofollow、title案内 "ページ"を指定すると、次のコードになります。

<a href="HTTPS://Example.COM:443/a/../b?x=%7e&amp;y=1" target="_blank" rel="noopener nofollow" title="案内 &quot;ページ&quot;">公式 &amp; 詳細</a>

URLの大文字、既定ポート、..、%7eは正規化せず入力表記を保持し、HTML属性内の区切り文字&だけを&amp;へ変換しています。入力に文字列&amp;が含まれる場合は復号せず、その&もHTML用にエスケープするため、生成コードでは&amp;amp;になります。

よくある利用場面

  • URLと表示文字から基本的なHTMLリンクを作るとき
  • 外部リンクへnoopener・nofollow・sponsored等を指定するとき
  • URLやtitleに特殊文字を含むリンクコードを安全に生成するとき

処理仕様

  • URLの制御文字を拒否して前後空白を除きます。スキームがある場合はHTTP・HTTPSだけを許可し、ブラウザ標準のURL APIで構文を検証します。URL APIは検証にだけ使用し、URLの大文字・小文字、パス、パーセント表記等を正規化しません。
  • リンク表示文字は必須で、空白だけの入力と実改行を拒否します。title属性は任意で、制御文字を拒否して前後空白を除きます。
  • 同じタブではtarget属性を省略します。新しいタブではtarget="_blank"とnoopenerを追加し、選択したrel値をnoopener、nofollow、sponsored、ugc、noreferrerの固定順で1つのrel属性へまとめます。
  • URLとtitleは二重引用符付きのHTML属性値として&、"、<、>をエスケープします。表示文字はHTMLテキストとして&、<、>をエスケープし、引用符はそのまま保持します。
  • 属性はhref、target、rel、titleの順で出力します。入力済みのHTMLエンティティ、パーセント表記、バックスラッシュと英字のnからなる文字列\nを一律に復号・変換しません。

リンク先への通信、存在確認、リダイレクト確認、URL短縮、SEO上適切なrel値の判定は行いません。生成したコードを使用するページの目的に合わせて、rel属性を選んでください。

入力データについて

外部ライブラリを読み込まず、入力の検証とHTML生成はブラウザ内だけで処理します。入力したURLへ通信せず、入力内容をToolRollのサーバーや外部サービスへ送信しません。Cookie、Web Storage、IndexedDBにも保存しません。

「HTMLコードをコピー」を押したときだけ、生成結果をブラウザのClipboard APIへ渡します。自動コピーできない場合は、結果欄から手動でコピーできます。