Vivaldi でワークスペースとカスタムアイコンを使用する方法はこちら。 ブラウザがもっと楽しく、そしてもっと多くのことをこなせるようになったら、最高ですよね。

2 要素認証とは？

2 要素認証（2FA）は、アカウントにログインする際のセキュリティを強化する方法です。 有効にすると、ログインパスワードに加えて追加の方法による本人確認が求められます。 Vivaldi アカウントでは、2 番目の認証にアプリをベースとした認証やセキュリティキーを利用できます。

---

2 要素認証を有効にする

Vivaldi アカウントで 2 要素認証を有効にするには：

1. Vivaldi.net にアクセスする
2. Vivaldi アカウントにログインする
3. ホームページ上部のプロフィール画像をポイントすると表示される「アカウント」をクリックする
4. アカウントのプロフィールで、「2 要素認証を有効にする」をクリックする
5. アカウントのログインパスワードを入力してログインする
6. 2 要素認証に認証アプリあるいはセキュリティキーのどちらを設定するかを選択し、その後に表示されるインストラクションに従う

アプリベースの認証を設定する

認証アプリでは、時間をベースとしたワンタイムパスワード（TOTP）が設定した間隔で生成されます。 Vivaldi アカウントへのログイン時には、アクティブなコードを入力する必要があります。

TOTP Authenticator や Aegis Authenticator [Android]、あるいは、Raivo OTP [iPhone] のようなアプリを使用したり、Google や Microsoft による認証アプリを利用したりすることもできます。

Vivaldi アカウントで認証アプリを設定するには：

1. 2 要素認証の管理ページで、「認証アプリ」を選択する
2. スマートフォンで認証アプリを開き、新しいアカウントを追加する
3. アプリで QR コードをスキャンする
4. アプリでアカウント追加の手続きを終了する
5. アプリで Vivaldi アカウント用に表示された 6 桁のコードを設定ページで入力する
6. 「2 要素認証を有効にする」をクリックする

QR コードをスキャンできない場合は、設定キーを手動で入力できます。 キーを確認するには、QR コード画像の上にある「この設定キーを入力」をクリックしてください。

セキュリティキーを設定する

認証アプリの代わりに、物理的なキーやデバイスを利用できます。 セキュリティキーは好きなだけアカウントに追加することが可能です。 その場合、1 つが手元になくても、バックアップのキーを使用することができます。

セキュリティキーを設定するには：

1. コンピューター / モバイル端末にセキュリティキーを接続する
2. 2 要素認証の管理のページで「セキュリティキー」を選択する
3. 「新しいキーを追加する」をクリックする
4. 画面のインストラクションに従う
5. セキュリティキーに名前を付ける
6. 「保存」をクリックする

復元コード

少なくとも 2 つの 2 要素認証方法を設定することを強くお勧めします。 そうすることで、1 つの認証方法を利用できない場合でも、バックアップとして設定した別の方法を使ってアカウントにアクセスできます。 アプリとキー、複数のキー、アプリと復元コード、その他のコンフィギュレーションなど、どれを設定するかはユーザー次第です。

復元コードを保存するには：

1. 認証アプリかセキュリティキーのいずれかを設定する
2. 2 要素認証の管理ページに戻り、「別の方法を追加」で「復元コード」をクリックする
3. 「生成」をクリックする
4. 自動的に生成された 3 つのコードを安全な場所に保管する

各コードは一度だけしか使用できないので、コードを使用した時には、Vivaldi.net でアカウントのプロフィールにアクセスして設定を見直してください。必要な場合は 2 要素認証の方法をアップデートし、新しい復元コードを生成してください。

アプリパスワード

2 要素認証が有効の時に Vivaldi アカウントをメールやカレンダークライアントに追加する場合、ログインにはアカウントのログインパスワードが求められる OAuth と設定した 2 つ目の認証方法でログインするオプションか、アプリパスワードを生成して使用する方法があります。 アプリパスワードの場合は、一度だけログインするだけなのでシンプルだと言えます。 OAuth の場合は時折、再度ログインする必要があります。

アプリパスワードを生成するには：

1. Vivaldi アカウントで 2 要素認証を有効にする
2. 2 要素認証の管理ページで、「アプリパスワード」をクリックする
3. 「新しいパスワードを生成」をクリックする
4. メールクライアント、カレンダークライアント、あるいは、その両方のうち、どれに対してパスワードを生成するのかを選択する
5. パスワードを使用するアプリの名前を入力する
6. 「新しいパスワードを生成」をクリックする
7. パスワードは一度しか表示されないため、すぐに使用するか、安全な場所に保管する
8. 終了したら、ポップアップウィンドウの外側をクリックする

Vivaldi アカウントにクライアントを追加する度にパスワードを生成してください。

パスワードを失くしてしまった場合には、既存のパスワードを削除して新しいパスワードを生成してください。

---

2 要素認証でログインする

全ての Vivaldi サービスにおいて、2 要素認証が求められるようになりました。同期サービスに関しては、まもなく対応する予定です。

2 要素認証が有効の時にログインするには：

1. ログインページにアクセスする
2. アカウントのユーザー名とログインパスワードを入力する
3. 設定した方法により、認証アプリで生成されたコードを入力するか、セキュリティキーのインストラクションに従う

アプリベースの認証とセキュリティキーの両方を設定する場合、セキュリティキーによる認証が優先されます。 セキュリティキーでの認証をキャンセルするオプションを使用することで、アプリでの認証が行えるようになります。

アカウントに 2 要素認証を有効にしていて、設定したいずれの方法も利用できない場合、Vivaldi チームではアカウントへのアクセスを回復することはできないため、残念ながらアカウントを恒久的に失うこととなります。

---

2 要素認証を管理する

2 要素認証を見直してアップデートするには：

1. Vivaldi.net にアクセスする
2. Vivaldi アカウントにログインする
3. ホームページ上部のプロフィール画像をポイントすると表示される「アカウント」をクリックする
4. アカウントのプロフィールで、「2 要素認証を管理」をクリックする
5. アカウントのログインパスワードを入力してログインする
6. 内容を見直して必要があれば変更する

---

2 要素認証を無効にする

すべての認証方法をアカウントから削除して、2 要素認証を無効にできます。 2 要素認証を無効にするには：

1. アカウントのプロフィールで、「2 要素認証を管理」をクリックする
2. アカウントのログインパスワードを入力してログインする
3. 認証アプリを無効にし、セキュリティキーをすべて削除する

---

2 要素認証に関して不明な点がある場合や、サポートが必要な場合には、以下の問い合わせフォームを使用してメッセージを送信してください

一部のウェブサイトではページの閲覧に使用しているブラウザを確認し、その情報に基づいて表示する内容を変更する可能性があります。 コンテンツや機能へのアクセスがすべてブロックされることもあります。 Vivaldi を使用していることでウェブサイトが通常とは異なる形で表示されていないかを確認するには、ブラウザの Sec-CH-UA ヘッダーを変更し、再度、サイトを確認してください。

ブラウザのブランドを変更するには：

1. 設定 > ネットワーク > ユーザーエージェントブランドマスキング に移動
2. ドロップダウンメニューから、認識させたいブラウザのブランドを「ブランドなし」、「Google Chrome」、「Microsoft Edge」から選択
   ブラウザのブランドとバージョン番号を手動で入力し、カスタムブランドを設定できます。
3. ブラウザを再起動して変更を反映

「Vivaldi ブランドを追加」にチェックを入れ、選択したブランドに加えて Vivaldi のブランド情報を含めることができます。

重要！ ブラウザのブランド情報を変更するとサイトとの互換性に問題が生じる可能性があります。

最新版の Vivaldi には、すべてのツールバーボタンにカスタムアイコン機能が導入されています。この記事では、各アイコンを作成するときにリソースを最適に処理する方法を紹介します。

テーマ編集

Vivaldi UI におけるすべてのテーマボタンを変更することができます。オリジナルのアイコン変更するには、[設定 > テーマ > エディター > アイコン] に移動してください。カテゴリ別に並べ替えられた使用可能なすべてのツールバーアイテムのリストと、独自のアイコンを配置するためのインターフェイスを確認できるはずです。カスタムアイコンはテーマのエクスポート時に含まれます。

カスタムテーマアイコン編集画面

---

サイズ

Vivaldi は、すべてのツールバーで 28 ピクセル× 28 ピクセルのビットマップ、または SVG 画像をサポートしています。大きな画像はこのサイズに自動でリサイズされます。

レイアウト

Vivaldi アイコンのサイズは、約 16 ピクセルです。 アイコンは、周りに余白を残す必要があるため、大きすぎるアイコンは少々窮屈に表示される可能性もあります。ただし、想像上の境界の外側にまたがる図形や大きなアイコンには、利用可能なスペースを自由に使用してください。

キャンバス上の推奨されるアイコンの配置

---

ビットマップ リソース

Vivaldi は、BMP、GIF、JPG、JPEG、PNG、および WEBP 形式のビットマップ画像をサポートしています。 アルファチャンネルマスクをサポートする形式の使用を検討してください。アイコンは、テーマアイコンセットが他のテーマでも使用できるため、ライトテーマとダークテーマの両方に対して十分なコントラストを維持する必要があります。

ビットマップリソースは、高 DPI ディスプレイでシャープにレンダリングし、UI スケーリングの余地を残すために、 ターゲットサイズの２倍 でエクスポートすると良いでしょう（つまり、28 ピクセルのターゲットに対して56 × 56 ピクセルで画像をエクスポートすることで解像度が２倍となります）。

---

SVG リソース

ビットマップとは別に、Vivaldi は SVG （スケーラブルベクターグラフィック）形式をサポートしており、これはいくつかの異なる方法で作成することができます。

アイコンに現在のテーマの色を継承させる場合は、塗りつぶしの色の定義を使用しないか、 currentColor キーワードを使用することで、すべての異なるツールバーとテーマの組み合わせで適切な色の継承が保証されます。

<svg
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 28 28"
  fill="currentColor"
>
  <!-- inherits fill color from current Vivaldi theme -->
  <path d="..." />
  <!-- uses specific fill color -->
  <path d="..." fill="#ffeea8" />
</svg>

SVG カラー継承の例

一方、現在のテーマの色に関係なく、すべてのストロークと塗りつぶしの色をローカルでコントロールが可能です。その場合は、予期しないテーマの色を継承してしまわないように、すべての色が設定されていることを確認する必要があります。

<svg
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 28 28"
  fill="#000"
>
  <!-- inherits default fill color #000 specified above -->
  <path d="..." />
  <!-- uses specific fill color -->
  <path d="..." fill="#ffeea8" />
</svg>

独自の色定義を持つ SVG コード例

塗りつぶしアイコンとストロークベースのアイコンのどちらを使用するかは、ユーザー次第です。後者の場合は、ストロークのプロパティをインラインで定義します。

<svg
  xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 28 28"
  fill="none"
  stroke="currentColor"
>
  <!-- no fill; stroke color inherited from current Vivaldi theme -->
  <path
    d="..."
    stroke-width="1"
    stroke-linecap="round"
    stroke-linejoin="round"
  />
</svg>

ストロークベースの SVG アイコンの例

最小化された SVG

SVGO などのツールを使用して、エクスポートされた SVG アイコンを最小化することをお勧めしています。エディターはエクスポート時に SVG も最小化している可能性があります。アイコンでプロパティを使用する場合は clip-path 、クリップパス ID が常に一意であることを確認してください。

SVG ファイルのエンコーディング

SVG ファイルは UTF-8 でエンコードする必要があり、インポート時にサニタイズされます。

---

テーマアーカイブ形式

現在の Vivaldi テーマ形式は、数多くあるツールバーボタンまたは コマンドチェーンのアイコンをサポートするように拡張されました。単一のアイコンリソースは、ボタン ID と画像パスのペアとしてテーマアーカイブ JSON にエクスポートされます。

"buttons": {
  "buttonId": "imagefile01.png"
}

アイコン画像をバッチ処理する場合は、Vivaldi でカスタムテーマをエクスポートし、結果の ZIP アーカイブで画像を置き換えて更新することを検討してください。

Figma テンプレート

公式の Vivaldi UI アイコンに基づいて新しいアイコンセットの作成を開始したい方々のために、Figma テンプレートを用意しました。 Figma を使って一括でアイコンを作成したい場合は、以下をご使用ください。
URL： https://www.figma.com/community/file/1214878626987427743

ワークスペースを使用すると、仕事、研究、ショッピング、学校などのさまざまなトピックに関連するページのタブを同じウィンドウにすばやくグループ化できます。 ワークスペースの切り替えは、メニューボタンまたはショートカットで簡単に行うことができます。

ワークスペースの追加

新しいワークスペースを追加するには：

1. タブバーの左側にあるワークスペースボタン（縦型タブバーの場合はリストの上部）をクリック
2. [新しいワークスペース] をクリック
3. 空のワークスペースを作成するか、現在のウィンドウで開いているタブを新しいワークスペースに移動するかを選択
4. 名前を入力し、新しいワークスペースのアイコンを選択
5. [作成] をクリックするか、Enter キーを押す

ワークスペースが作成され、リストに表示されます。 通常のタブに戻るには、リストの最初の項目（この場合は [スタートページ]）をクリックします。

または、次のいずれかの方法でワークスペースを作成できます。

• クイックコマンドで「新しいワークスペース」と入力
• ワークスペース作成のアクションをキーボードショートカットまたはマウスジェスチャーを作成

---

ワークスペースの切り替え

別のワークスペースに切り替えるには、いくつかの方法があります。 お好みのものを選択してください。

• [ワークスペース] メニューを開き、開くワークスペースを選択
• クイックコマンドにワークスペースの名前、「次のワークスペース」、「前のワークスペース」、または「このウィンドウ」と入力
• キーボードショートカットを使用
  （ワークスペースの順序がわかっている場合は、Ctrl + Shift / ⌘ ⇧ とワークスペースの番号（Ctrl + Shift + 3 など） を使用 [次のワークスペース] と [前のワークスペース] のショートカットを作成することもできます。）
• ワークスペースを切り替えるためのマウスジェスチャーを作成
• ウィンドウパネルで、開きたいワークスペース内のタブを（ダブルクリック）クリック
• Vivaldi メインメニュー > ウィンドウ > その他のワークスペースとタブで、開きたいワークスペース内の タブを選択

ワークスペースとウィンドウ

ワークスペースは、一度に１つのブラウザウィンドウで開くことができます。 別のウィンドウで開いているワークスペースに切り替えると、現在のウィンドウでワークスペースを開くのではなく、選択したワークスペースが既に開いているウィンドウにフォーカスが移動します。

---

ワークスペースの編集

ワークスペースの名前を変更するには：

1. ワークスペースメニューを開く
2. 編集したいものを右クリック
3. [ワークスペース名の変更] を選択
4. ワークスペースに新しいタイトルを付ける
5. Enter

または、ウィンドウパネルでワークスペース名を２回クリックするか、ワークスペース名を右クリックしてコンテキストメニューの[名前の変更]からでも名前の変更が可能です。

ワークスペースのアイコンを更新するには：

1. ワークスペースメニューを開く
2. アイコンをクリック
3. 新しいものを選択または入力
   

---

ワークスペースのタブの管理

ワークスペース内では、通常のウィンドウと同じようにタブを開いたり閉じたりできます。 タブスタック、タブタイリングの使用ももちろん可能です。

ワークスペース間でのタブの移動

オプション１ – ウィンドウパネル

1. ウィンドウパネルを開く
2. 移行元と移行先のワークスペースフォルダーを展開する
3. あるワークスペースから別のワークスペースにタブをドラッグ。
   （Shift キーまたは Ctrl / ⌘ キーで複数のタブを選択すると、一度に多くのタブを移動できます。 ）

オプション２ – タブバーのコンテキスト メニュー

1. 移動するタブを右クリック
   （Shift キーまたは Ctrl / ⌘ キーで複数のタブを選択すると、一度に多くのタブを移動できます。 ）
2. コンテキストメニューで、[タブの移動] / [# タブの移動] > ワークスペース > ワークスペース名を選択

---

ワークスペースの休止

タブをワークスペースに分割すると、数百とは言わないまでも数十のタブを簡単に累積できるので、それほど多くのタブが開いていないような錯覚を覚えることがあるでしょう。大量のタブを開いていると必然的にメモリの消費が増大し、ブラウザの操作に支障を来たす場合があります。メモリ使用量を減らすには、使用していないタブを休止状態にしておくことが有効です。

ワークスペースを休止するには：

1. ワークスペースメニューを開く
2. 休止状態にしたいワークスペースを右クリック
3. [ワークスペースを休止状態にする] を選択

---

ワークスペースの削除

ワークスペースを削除するには：

1. ワークスペースメニューを開く
2. 削除したいワークスペースを右クリック
3. [ワークスペースの削除] を選択

ワークスペースを削除すると同時に、ワークスペース内のすべてのタブも閉じます。タブを保持するには、ワークスペースを削除する前にタブを移動してください。誤ってタブを閉じてしまった場合は、[最近閉じたタブ] で 見つけることができます。

---

ワークスペースのオプション

ワークスペース名を非表示にする

ワークスペースごとに一意のアイコンを設定すると、ワークスペースを簡単に区別できるため、ワークスペースのタイトルを非表示にして、タブのスペースを増やすことができます。

ワークスペース名を非表示にするには：

1. ワークスペースメニューボタンを右クリック
2. [ワークスペース名の表示] をクリック

ワークスペースの非表示メニュー

タブバーからワークスペースメニューを非表示にするには、次のいずれかを実行します：

• タブバーのワークスペースを右クリック > [タブバーにワークスペースを表示] を選択
• 設定 > タブ > タブの表示 > タブバー に移動 > [タブバーにワークスペースを表示] のチェックを外す

ワークスペースメニューの移動

ワークスペースのアイコンを別の場所に移動したい場合は：

1. Vivaldi メイン メニュー > ツールバーエディター へと進み、ツールバーをカスタマイズ
2. [ナビゲーションツールバー] セクションで、[ワークスペース] を見つける
3. アイコンをツールバー内の希望の場所にドラッグ & ドロップ

ワークスペースの無効化

ワークスペースを無効または再度有効にするには：

1. 設定 > タブ > タブ機能 に移動
2. [ワークスペースを有効にする] のボックスのチェックを外す

Vivaldi Social と Mastodon について時間をかけずに理解できるよう、この便利なチュートリアル動画で Ruari が Fediverse について詳しくご説明します。

この動画では、タブを効率よく整理し、生産性をアップしてワークフローを簡素化するためのヒントと方法についてご説明します。

Vivaldi Social や Mastodon には、基本的に、ユーザーの興味関心に基づいてコンテンツを表示するというようなアルゴリズムは無いため、他の人をフォローしたり、タグ付けをしたりして、完全に自分でフィードを管理する必要があります。特定のサーバーに閉じ込められない連合型ソーシャルネットワークの Mastodon では、Vivaldi Social のアカウントを使って、どの Mastodon インスタンスのアカウントでもフォローすることができます。

アカウントのフォロー

Vivaldi Social でアカウントをフォローするには：

オプション 1

1. フォローしたいアカウントのプロフィールを開く
2. プロフィール画面でカバー画像の右下に表示される「フォロー」ボタンをクリック

オプション 2

1. 検索フィールドでフォローしたいアカウントのユーザー名（@ユーザー名 @インスタンス名）を検索
2. 検索結果で、名前の横に表示される 「フォロー」をクリック

---

タグのフォロー

ユーザーアカウントに加えて、タグもフォローできます。

タグをフォローするには：

1. 投稿に含まれるタグ（例： #Vivaldi、#Caturday、#PhotoMonday など）をクリックするか、タグを検索
2. タグが使用されている最近の投稿を確認
3. ページ右上の 「フォロー」をクリック

---

フィードを使って Vivaldi Social のコンテンツをフォロー

Vivaldi フィードリーダーや、その他のフィードリーダーを利用されている場合、新しい投稿がフィードクライアントに直接配信されるように設定できます。

Vivaldi フィードリーダーでコンテンツを購読するには：

1. 設定 > 一般 > 生産性機能 で「メール、カレンダー、フィード機能を有効にする」が有効になっているかを確認
2. Vivaldi Social で、フォローしたいプロフィールやタグが含まれるページを開く
3. ページの URL の最後に「.rss」を追加
   （例えば、https://social.vivaldi.net/@Vivaldi.rss や https://social.vivaldi.net/tags/Vivaldi.rss のようになります。）
4. Enter を押してリンクを開き、フィードのプレビューを確認
5. ページタイトル下の「購読」をクリック
6. レビューをして、必要であれば、フィードタイトルや更新頻度を編集
7. 「フィードの追加」をクリック

他のフィードリーダーを使用している場合、末尾に「.rss」があるリンクをコピーして、クライアントのインストラクションに従い、利用するフィードリーダーに追加してください。

アプリの一部の権限はデフォルトで有効になっていますが、ブロックされているものもあります。多くの場合、カメラやマイクへのアクセス、通知など、ウェブサイトに許可する権限をユーザーに確認します。

各設定を確認して調整するには：

1. Vivaldi メニュー > 設定 > ウェブページ > サイトの設定
2. リスト内の権限をタップしてオプションを確認

権限に対する許可をウェブサイトから求められた場合、ダイアログにあるドメイン名をタップすると表示される権限のリストから設定を調整できます。 多くの場合、デフォルトの設定に例外を追加することもできます。

Android 版 Vivaldi での設定と権限

• Cookie
  ブロックレベルの選択：
  • Cookie を許可
  • シークレットモードでサードパーティの Cookie をブロックする
  • サードパーティの Cookie をブロックする
  • すべての Cookie をブロックする（推奨されません）
• 位置情報
• カメラ
• マイク
• モーションセンサー
• 通知
• JavaScript
• ポップアップとリダイレクト
• 広告（煩わしい広告や誤解を招く広告）
• バックグラウンド同期
• 自動ダウンロード
• 保護されたコンテンツ
  再生を許可する（推奨）、ブロックする、コンテンツの再生を許可するか確認する、から選択できます
• 音声
• 保存データ
  閲覧したウェブサイトの詳細や、許可した権限を確認して管理できます。 各サイトの保存データや、すべてのデータを消去することもできます。
• NFC デバイス
• USB デバイス
• クリップボード
• バーチャルリアリティ（VR）
• 拡張現実（AR）
• デバイスのアクティブ状態
• サードパーティのログイン
• ウェブページ用ダークモード
  設定 > 外観 > テーマ からもアクセス可
• 常にデスクトップ用サイトを表示
  設定 > ウェブページ からもアクセス可
• 動画の自動再生
  デフォルトでブロックされているため、サイトで動画を表示するには再生ボタンをタップする必要があります。 モバイルデータの通信量を気にすることがなく、ウェブページでの動画を常に自動再生したい場合には、この設定を有効にしてください。

一般的に、スマートフォンやタブレット端末などのモバイルデバイスの画面は、デスクトップやノートパソコンの画面と比べて小さいと言えます。 このため、モバイルデバイスではユーザーインターフェイスの要素やウェブコンテンツは、より小さく表示されるため、ブラウジングがしにくいと感じます。 しかし Android 版 Vivaldi では、備わっている複数のズーム設定を調整して、目にかかる負担を軽減することができます。

ウェブページを拡大する

デフォルトのズームレベルを変更するには：

1. Vivaldi メニュー > 設定 > ウェブページ > ユーザー補助機能 > ズームに移動する
2. スライダーを動かして、ウェブサイトのテキストや画像を大きくしたり、小さくしたりする

メインメニューからページのズームレベルを変更できるようにするには：

1. Vivaldi メニュー > 設定 > ウェブページ > ユーザー補助機能 に移動する
2. 「ズームを表示」を有効にする

設定を終了すると、メインの Vivaldi メニューに新しく「ズーム」のオプションが表示されます。 ここから、開いているウェブサイトのズームレベルを調整できます。設定したズームレベルは、同じサイトを他のタブで開いても適用されます。

サイトによってはズームレベルを変更できないようになっています。 ユーザー補助機能の設定にある「強制的にズームを有効にする」を有効にすると、拡大・縮小が行えるようになります。

ユーザーインターフェイスのズームレベルを変更する

ツールバー（アドレスバー、タブバーなど）やパネル、設定のインターフェイスのサイズを変更するには：

1. Vivaldi メニュー > 設定 > ウェブページ > ユーザー補助機能 > インターフェイスズーム
2. スライダーを動かしてユーザーインターフェイスを大きくしたり、小さくしたりする