Webflow公開前に必ず確認すべき設定項目11選

Webflowでサイトが完成した時、「こレデ公開しても大丈夫だろうか」と不安を感じたことはないでしょうか？WebflowはWebサイト構築に長けたツールですが、公開前に設定しておくべき項目が複数存在します。設定を怠ると、SEOの評価が正しく行われなかったり、フォームの通知が正常に届かなかったり、表示速度の最適化が機能しなかったり等の問題が起きる可能性があります。この記事では、Webflowのサイト設定画面でチェックしておきたい項目を11点に絞って解説します。

サイトの見た目を整える設定から始めよう

Webflowのサイト設定は、ダッシュボードから対象サイトの「Settings」に進むことで確認できます。ページデザインとは別の場所にあるため見落としがちですが、ここに重要な設定が集約されています。

FaviconとWebclipを設定する

最初に設定しておきたいのがFaviconとWebclipです。Faviconはブラウザのタブや履歴、ブックマークバーに表示される小さなアイコンで、16×16ピクセルや32×32ピクセルの画像を使用します。複数のタブを開いているユーザーにとって、Faviconはサイトを識別する重要な目印になります。WebclipはiOSやiPadOSのホーム画面にサイトを追加した際に表示されるアイコンで、180×180ピクセルが推奨サイズです。どちらもWebflowのSettings画面からZIPファイルを使わずに直接アップロードできます。

【画像】スクリーンショット WebflowのSite Settings画面でFaviconとWebclipのアップロードエリアが表示されている箇所

Webflowブランディングをオフにする

Webflowには、公開したサイトの下部に「Made with Webflow」のバッジを表示する機能があります。これはWebflowの無料プランや特定の条件下で表示されますが、クライアントのサイトや本番環境では非表示にしておくのが一般的です。設定画面のBrandingセクションからオフにできます。独自のブランドイメージを損なわないためにも、早めに確認しておきましょう。

SEOと検索エンジン向けの設定

SEOに関連する設定も、公開前に必ず確認すべき項目です。Webflowでは主に3つのSEO設定があります。

まずIndexingです。ここを「Allow indexing」にすることで、Googleなどの検索エンジンがサイトをクロールしてインデックスに登録できるようになります。開発中は意図せずインデックスされないよう「Disallow indexing」にしておき、公開直前にオンに切り替えましょう。ページレベルのSEO設定をさらに細かくコントロールしたい場合は、Webflowのページ別SEO設定機能も合わせて確認することをおすすめします。

次にSite Mapです。「On」にするとWebflowが自動的にsitemap.xmlを生成し、検索エンジンがサイト構造を把握しやすくなります。新規サイトの立ち上げ時や、ページ数の多いサイトでは特に有効です。サイトマップを生成後、Googleサーチコンソールにも登録しておくとインデックスの促進に役立ちます。

Google site verificationについては、GoogleサーチコンソールのHTML meta tag方式をWebflowの設定画面に入力することで認証できますが、Googleサーチコンソール上でHTML fileの代わりにDNSやGoogle Analytics経由で認証する方法も選べます。

【画像】スクリーンショット WebflowのSEO設定画面（Indexing・Site Map・Google site verificationの各トグル）

301リダイレクトを設定する

サイトリニューアルや既存URLの変更が生じた場合、301リダイレクト設定は欠かせません。301リダイレクトは旧URLへのアクセスを新URLへ転送する恒久的なリダイレクトで、SEOの評価を新URLに引き継ぐ効果があります。Webflowの設定画面から「旧URL → 新URL」の形式で入力できます。ページ数が多い場合は、Finsweet Extension for Webflowなどのブラウザ拡張機能を使うと一括でCSV管理ができます。

フォームとスパム対策の設定

サイトにお問い合わせフォームを設置している場合、フォーム関連の設定も事前に確認しておきましょう。

Form notificationsには、フォームが送信されたときに通知を受け取るメールアドレスを設定します。担当者のメールアドレスを正確に入力しておかないと、ユーザーからの問い合わせを見逃す可能性があります。複数のアドレスを設定することも可能です。

Spam filteringはオンにすることで、ボットによる自動送信を防げます。スパムが大量に届くとフォームのデータ管理が煩雑になるだけでなく、サービスの信頼性にも影響します。Webflowにはhoneypot方式のスパム対策が組み込まれているため、設定をオンにするだけで基本的なスパム対策が機能します。

【画像】スクリーンショット WebflowのForm設定画面（Form notifications、Spam filteringのトグル設定画面）

サイトのパフォーマンスを高める設定

Publishing Optionsをすべてオンにする

Publishing Optionsには、CSS・HTML・JavaScriptの圧縮（Minification）やGzip圧縮など、サイトの読み込み速度を向上させる設定が含まれています。これらの設定は公開時に自動的にコードを最適化し、ファイルサイズを削減します。デフォルトでオンになっていることも多いですが、設定画面を開いて全項目がオンになっているかを確認しておくことを推奨します。表示速度をさらに高めたい場合は、パフォーマンス計測ツールと改善手法で現状のスコアを確認してみましょう。

カスタムフォントをアップロードする

Webflowは多くのGoogle Fontsに対応していますが、独自フォントを使用する場合はカスタムフォントとしてアップロードすることを推奨します。Google FontsはGoogleのサーバーから読み込まれるため、GDPR（EU一般データ保護規則）の観点で問題になる場合があります。フォントを自前でホストすることで、プライバシーリスクを回避しつつパフォーマンスの最適化も図れます。アップロード時は使用するfont weightのみを選択し、不要なウェイトを増やさないようにしましょう。

ローカライゼーションとバックアップの確認

多言語展開を予定しているサイトでは、ローカライゼーション設定も公開前に確認が必要です。ターゲットとなるユーザーの言語やタイムゾーンを設定することで、各ユーザーに適した表示が可能になります。言語コードの設定はSEO的にも重要で、hreflangタグとの組み合わせで検索エンジンへの適切な言語情報の提供につながります。

【画像】スクリーンショット WebflowのBackups画面（自動バックアップの一覧と復元ボタン）

バックアップについては、Webflowが自動バックアップを行っているため、定期的にバックアップの状態を確認しておくと安心です。大きな更新作業の前には手動でバックアップを作成しておくと、万が一の際にすぐに復元できます。

まとめ

Webflowのサイト設定は、デザインとは別に確認が必要な重要な要素を多く含んでいます。FaviconやSEO設定、フォーム通知、パフォーマンス最適化オプションなど、公開前に一通りの設定を確認しておくことで、ユーザー体験と検索エンジン評価の両面でより良い結果を得られます。サイトの規模や目的によって必要な設定は異なりますが、この記事で紹介した11項目は基本として全サイトで対応しておくことを推奨します。リンクの動作や開き方の設定については、Webflowのリンク設定ガイドも参照してください。Webflowのポテンシャルを最大限に引き出すために、設定まわりも丁寧に整えていきましょう。