Slack に HTML ファイルを送って、ページとして見てもらう方法

HTML のレポートや試作ページ、ChatGPT・Claude・Copilot に作ってもらったページを Slack でチームや社外の相手（Slack コネクト）に見てもらおうとファイルをチャンネルに添付しても、そのまま Web ページとしては見られません。HTML のソースコードを見せるならテキストのスニペットで共有できますが、ブラウザで開いたときの見た目を確認してもらうには、相手が一度ファイルをダウンロードして開くか、別の方法で共有する必要があります。

また、Slack のヘルプ「ファイルを Slack に追加する」ではファイルがメッセージの一部としてプレビュー表示されると案内されていますが、HTML ファイルがどう表示されるかまでは書かれていません。さらに Slack コネクトの会話では、設定によってファイルのアップロードや共有そのものが制限されていたり、特定のファイルタイプを追加できなかったりする場合もあります。

このページでは、Slack に HTML ファイルを追加したときの見え方や制限を整理したうえで、相手がダウンロードの手間なくブラウザですぐにページを見られる共有方法を紹介します。

Slack で HTML ファイルを添付して送る手順

HTML ファイルそのものをチャンネルやダイレクトメッセージ（DM）で渡すときは、通常のファイルと同じ手順で添付できます。Slack ヘルプ「ファイルを Slack に追加する」（2026 年 10 月 18 日確認）によると、追加できるファイルのサイズ上限は 1 GB で、アップロードされたファイルはウイルスやマルウェアのスキャンを受けます。

デバイスごとの送信手順は次のとおりです。

• デスクトップアプリ・ブラウザ版: HTML ファイル（一度に最大 10 個まで）をメッセージフィールドにドラッグ＆ドロップするか、メッセージフィールド横の「＋（プラスアイコン）」からファイルを選んでメッセージを送信します。
• モバイルアプリ: メッセージフィールド横の「＋（プラスアイコン）」をタップし、「最近使用したファイル」または「ファイルをアップロードする」からファイルを選んで、紙飛行機のアイコンをタップして送信します。

また、HTML のソースコードの一部だけをテキストとして見せたい場合は、デスクトップの「＋（プラスアイコン）」から「テキストのスニペットを作成する」を選ぶ方法もあります（Slack ヘルプ「Slack でコードスニペットを作成またはペーストする」、2026 年 10 月 18 日確認。なお、モバイルアプリからはスニペットを作成・共有できません）。

ただし、これらの方法で相手に届くのはあくまで「HTML ファイル（またはコードの文字列）」です。Slack のヘルプには「メッセージの一部としてファイルのプレビューが表示されます」と記載されていますが、HTML ファイルを Web ページとして描画する仕組みについては触れられておらず、添付しただけではブラウザで開いたときのような見た目では表示されません。さらに、社外の相手とやり取りする Slack コネクトの会話では、設定によってファイルのアップロードや共有そのものが制限されていたり、特定のファイルタイプを追加できなかったりする場合もあります。

Slack で HTML ファイルはページとして表示されるか

Slack のメッセージに .html ファイルを添付したり、コードスニペットとして貼り付けたりしても、Slack の画面の中でそのまま Web ページとして開いて見せることはできません。まずは Slack の公式ヘルプに書かれている仕様と、書かれていないこと、そしてファイルを受け取った相手の環境で実際に何が起きるかを整理します。

Slack のヘルプ「ファイルを Slack に追加する」（2026 年 10 月 18 日確認）には、ファイルの共有について次のことが書かれています。

• 追加できるファイルのサイズ上限は 1 GB です。
• デスクトップでは、最大 10 個のファイルをメッセージフィールドにドラッグ＆ドロップするか、メッセージフィールドの横のプラスアイコンから選んで送信します。
• モバイルでは、メッセージフィールドの横のプラスアイコンから「最近使用したファイル」または「ファイルをアップロードする」を選び、紙飛行機のアイコンで送信します。
• 追加されたファイルはウイルスやマルウェアのスキャンを受けます。
• 社外の相手とやり取りする Slack コネクトの会話では、設定によってファイルのアップロードと共有が制限されている場合があり、特定のファイルタイプは追加できません。

このヘルプには「Slack には、メッセージの一部としてファイルのプレビューが表示されます」という説明があり、画像や 50 MB を超える Microsoft Office ファイルについての条件は書かれています。しかし、HTML ファイルをどのように表示・プレビューするかについては書かれていません。

また、Slack にはコードを共有する機能もあります。ヘルプ「Slack でコードスニペットを作成またはペーストする」（2026 年 10 月 18 日確認）にあるとおり、デスクトップのプラスアイコンから「テキストのスニペットを作成する」を選ぶと、短いコードや設定ファイル、ログファイルを共有できます（モバイルアプリからは作成・共有できません）。ただ、これはあくまで HTML のソースコードを文字として見せる機能であり、デザインされたページとして描画するものではありません。

そのため、Slack に .html ファイルを添付して送った場合、受け取った相手は一度自分のパソコンやスマートフォンにファイルを保存して開くことになります。このとき、相手の環境では次のようなことが起きます。

• パソコンでダウンロードして開いた場合（別ファイルの CSS や画像が消える） Convika がパソコンの Chromium で試したところ（2026 年 10 月 13 日）、元のフォルダの中で HTML ファイルを開けば、同じフォルダにある別ファイルの CSS、画像、スクリプト（JavaScript）は正常に読み込まれました。しかし、HTML ファイルだけを別の場所にコピーして開くと（Slack から HTML ファイル 1 つだけをダウンロードしたときと同じ状態）、別ファイルの CSS・画像・スクリプトは 3 つとも読み込めず、文字の色や大きさはブラウザの初期設定に戻ってしまいました。見た目が保たれたのは、HTML ファイルの中に直接書き込んだ CSS だけです。
• iPhone で受け取って開いた場合（スクリプトや外部の画像・フォントが動かない） スマートフォンで見る相手はさらに不便です。Apple の iPhone シミュレーター（iOS 26.3）で iPhone の「ファイル」アプリのプレビューを試したところ（2026 年 10 月 6 日）、ページ内の JavaScript は動かず、https:// で始まる外部の画像や Google Fonts も読み込まれませんでした。

ChatGPT や Claude、Copilot に作ってもらった 1 枚の HTML ファイル（CSS や JavaScript が中にまとめられているもの）なら、パソコンでダウンロードしてブラウザで開けば見えることもありますが、スマートフォンで見る相手には動きません。また、画像や CSS ファイルが分かれているレポートや試作ページは、.html ファイルだけを送っても相手の画面では崩れてしまいます。

Slack で HTML を共有するときは「コードを見せるか、ページを見せるか」で選ぶ

Slack で HTML を共有する方法は、相手に中身のコードを見てほしいのか、それとも完成したページをブラウザで見てほしいのかで使い分けるのが確実です。

エンジニアにコードを直してほしいときや、HTML ファイルそのものを受け渡したいときは、ファイルをそのまま添付するかスニペット機能を使います。Slack ヘルプ「ファイルを Slack に追加する」（2026 年 10 月 18 日確認）によると、1 GB までのファイルをデスクトップ（1 回に最大 10 個までドラッグ＆ドロップ、またはメッセージフィールド横のプラスアイコンから選択）やモバイルアプリ（プラスアイコンから「最近使用したファイル」または「ファイルをアップロードする」を選択して紙飛行機アイコンで送信）で送ることができ、追加されたファイルはウイルスやマルウェアのスキャンを受けます。また、短いコードを共有したいときは、Slack ヘルプ「Slack でコードスニペットを作成またはペーストする」（2026 年 10 月 18 日確認）にあるとおり、デスクトップのプラスアイコンから「テキストのスニペットを作成する」を選べば、コードとして見やすく共有できます（モバイルアプリからはスニペットを作成・共有できません）。

一方で、レポートや試作ページ、ChatGPT・Claude・Copilot で作ったページを「見た目どおりに開いて確認してほしい」という相手には、HTML ファイルの添付ではなく URL にして送るのが向いています。Slack のヘルプにはメッセージの一部としてファイルのプレビューが表示されると書かれていますが、画像や 50 MB 超の Microsoft Office ファイルの条件はあるものの、HTML ファイルがどう表示されるかは書かれていません。さらに、ファイルを添付して送る方法には次のようなつまずきやすい点があります。

• 別ファイルの CSS・画像・スクリプトが外れる: パソコンの Chromium で確かめたところ（Convika のテスト、2026 年 10 月 13 日）、フォルダの中で HTML ファイルを開けば別ファイルの CSS、画像、スクリプトも読み込まれますが、HTML ファイルだけを別の場所にコピーして開くと 3 つとも読み込めず、文字の色や大きさはブラウザの初期設定に戻り、HTML の中に直接書いた CSS しか効きませんでした。
• スマホのプレビューで動きや外部の画像・フォントが止まる: Apple の iPhone シミュレーター（iOS 26.3、2026 年 10 月 6 日）で試したところ、iPhone の「ファイル」アプリのプレビューではページの JavaScript が動かず、https:// の画像や Google Fonts も読み込まれませんでした。
• 社外とのやり取りでは添付できないことがある: Slack コネクトの会話では、設定によってファイルのアップロードと共有が制限されている場合があり、特定のファイルタイプは追加できません。

ファイルのまま送る方法と URL にして送る方法の違いをまとめると、次のようになります。

HTMLファイルをURLにしてSlackに貼る手順

Convika を使うと、手元の HTML ファイルやコードを数分で URL のあるページにできます。まずは下のボックスで、登録なしで見え方を確かめるところから始められます。

1. ページを1つのHTMLファイルにまとめる

共有したいページを 2 MB までの .html（または .htm）ファイル 1 つ、あるいは HTML コードとして用意します。別の CSS ファイルは読み込めないため、スタイルは HTML の <style> タグの中に書くか、ChatGPT・Claude・Copilot に「CSS を 1 つの HTML ファイルにまとめて」と頼んで書き出してもらいます。画像を入れるときは、パソコン内のファイルパスではなく https:// で始まる画像の URL を指定してください。

2. ボックスに入れてプレビューを確かめる

このページのアップロードのボックスに HTML ファイルをドロップするか、「コードから」に切り替えてコードを貼り付け、「プレビューのリンクをつくる」を押します。登録なしで 3 分間だけ開ける確認用の URL ができるので、Slack で送る前にレイアウトや文字が崩れていないか自分で確かめます（このプレビューではスクリプトとフォームは止まります）。

3. ページを受け取って公開する

プレビュー URL の上にある「このページを受け取る（無料・カード不要）」を押してアカウントを作ると、ページが管理画面に入ります。管理画面で「公開する」を押すと、「一般公開」か「限定公開」を選ぶ確認画面が出ます。無料の一般公開は検索結果や Convika のギャラリーに出ることがあるため、社内向けのページは「限定公開」（Pro・1年パス）を選ぶか、さらに絞りたいときはパスワードをかけます。

4. 公開URLをコピーしてSlackに貼る

公開されたら、「公開URL」の横にある「コピー」を押してリンクをコピーし、Slack のチャンネルや DM（Slack コネクトの相手も含む）のメッセージに貼り付けて送ります。受け取った相手は、ファイルをダウンロードしなくてもリンクを押すだけでブラウザでそのままページを見られます。この URL は「公開停止」を押すまで変わりません。Free プランに含まれるのは、すべてのページの合計で月 10,000 ページビューです。

Slack に貼った URL で、タイトルや画像のプレビューを出すには

HTML を公開して URL で共有すると、Slack のメッセージの下にページのタイトルや説明、画像がカードのように展開されます。相手はクリックする前に何のページかひと目でわかります。

Slack ヘルプの「リンクの共有とプレビューの設定」（2026 年 10 月 18 日確認）によると、ウェブサイトへのほとんどのリンクは会話に貼ると自動でプレビュー表示されます。もしプレビューが出ないときは、次のような原因が挙げられています。

• ウェブページに必要なデータが埋め込まれていない
• パスワードで保護された動画など、非公開のページやファイルへのリンクである
• 同じリンクがその会話で過去 1 時間以内に共有されている
• 1 件のメッセージに 5 つ以上のリンクが含まれている

この「必要なデータの埋め込み」にあたるのが、HTML の <head> 内に書く <title> や OGP（og:title、og:description、og:image など）のタグです。ChatGPT や Claude、Copilot に HTML を作ってもらうときに「Slack でプレビューが出るように <title> と OGP タグも入れて」と頼んでおくと、わかりやすいカードになります。

なお、Convika で HTML を公開した場合、プレビュー用のタグは次のように扱われます。

• アップロードした HTML にある <title> や og:title、og:description はそのまま使われ、書き換えられません。
• og:url は、公開されたページの URL に自動で置き換わります。
• HTML に og:image が指定されていればその画像が使われ、ない場合は Convika が用意した画像の og:image が入ることがあります。

なお、ページの管理者は Slack の URL デバッグツールを使って、どのプレビュー用データが読み取られているかを確かめることもできます。

社外の人や特定のメンバーだけに見せるとき

Slack コネクトで社外の相手とやり取りしているチャンネルでは、組織の設定によってファイルのアップロードや共有が制限されていたり、特定のファイルタイプを追加できなかったりすることがあります。Convika で発行した URL をメッセージに貼る形なら、ファイルの添付が制限されている会話でもリンクを送るだけでページを見てもらえます。

公開するときは、確認画面で公開範囲を選べます。

• 検索結果に出さないようにする（限定公開、Pro・1年パス）: 確認画面で「限定公開」を選びます。受け取った相手はアカウントやパスワードなしでそのまま開けますが、ページには noindex の設定が自動で入るため、Google などの検索結果には出ないよう伝えられ、Convika のギャラリーにも載りません。無料の「一般公開」では、検索結果やギャラリーに出ることがあります。
• パスワードをかける: さらに絞り込みたいときは「パスワードを知っている人だけ」を選びます。検索エンジンにはパスワードの入力画面しか見えないため、中身が検索結果に出ることもありません。一度入力したブラウザは 7 日間入れ直さずに開けます。パスワードは Pro（月額 ¥1,800）の機能です。

一方で、次のような制限はかけられません。

• Slack のアカウントでのログイン制限: 「このワークスペースやチャンネルのメンバーだけが開ける」といった、Slack のアカウントと連動した認証はできません。
• URL の転送を止めること: URL を受け取った人がそのリンクを別の人に転送すれば、転送先でも開けます。パスワードをかけていても、URL とパスワードの両方が伝われば開ける点には注意してください。
• 誰が見たかの特定: 直近 90 日分の日ごとの訪問数は確認できますが、Slack のどのメンバーが開いたかまではわかりません。

見せる必要がなくなったときは、管理画面で「公開停止」を押せば同じ URL から開けなくなります。詳しい設定手順や注意点は、HTML のページを限定公開するやHTML ページにパスワードをかける方法で解説しています。

よくある質問

Slack で HTML ファイルを共有するには？

相手がそのままブラウザで開けるようにするには、HTML ファイルを URL のあるページとして公開し、そのリンクを Slack に貼ります。Slack のメッセージ欄に HTML ファイルをドラッグ＆ドロップするかプラスアイコンから添付して送ることもできます（上限 1 GB、ファイルを Slack に追加する）が、Slack コネクトの会話ではファイルのアップロードや特定のファイルタイプが制限されている場合があります。

このページのアップロード欄から HTML ファイル（2 MB までの .html / .htm 1 つ、またはコードの貼り付け）を登録して公開すると、共有用の URL ができます。Free プラン（カード登録なし、公開 1 ページ・月 10,000 ビューまで）では無料の「一般公開」になり、検索結果や Convika のギャラリーに出ることがあります。パスワードやアカウントなしで開け、検索エンジンの結果には出さないよう noindex を伝える「限定公開」は、Pro・1年パスで選べます。

Slack で HTML をプレビューできますか？

HTML ファイルをページとして公開して URL を Slack に貼れば、メッセージの下にリンクのプレビューが表示され、クリックすればブラウザでページそのものを見られます。Slack のヘルプ「ファイルを Slack に追加する」にはメッセージの一部としてファイルのプレビューが表示されるとありますが、画像や Microsoft Office ファイルの条件が書かれているだけで、添付した HTML ファイルをどう表示するかは書かれていません。また、「テキストのスニペットを作成する」は短いコード共有用（デスクトップのみ）で、ページの見え方を表示するものではありません。

Convika で公開したページの URL を貼ると、HTML に書いた <title> や og:title、og:description がそのまま使われ、og:image がない場合は Convika が作った画像が入ることがあります（Slack のリンクプレビューは、同じリンクが過去 1 時間以内に共有された場合や 1 件のメッセージに 5 つ以上のリンクがある場合は出ません）。相手へ送る前に自分で見え方を確かめたいときは、このページのアップロード欄で「プレビューのリンクをつくる」を押すと、登録なしで 3 分間だけ開ける確認用の URL ができます（この確認用 URL ではスクリプトとフォームは止まります）。

Slack に HTML を埋め込めますか？

Slack のメッセージの中に HTML ページそのものを埋め込んで動かすことはできません。Slack でできるのは、ファイルを添付する、デスクトップからコードスニペットとしてソースコードを貼る、または公開したページの URL を貼ってリンクのプレビューを展開させることです。

なお、Convika で公開したページもほかのサイトの中に埋め込むことはできない仕組み（frame-ancestors 'none'）になっており、Slack には公開 URL を貼ってブラウザで開いてもらう形で共有します。

Slack で受け取った HTML ファイルが開けないのは？

ダウンロードした HTML ファイル 1 つだけを開いているか、スマホのアプリ内プレビューで開いているため、デザインやスクリプトが動いていない可能性があります。

Convika のテスト（2026 年 10 月 13 日、パソコンの Chromium）では、HTML ファイルだけを別の場所にコピーして開くと、別ファイルになっていた CSS・画像・スクリプトは 3 つとも読み込めず、HTML の中に直接書いた CSS 以外は文字の色や大きさもブラウザの初期設定に戻りました。また、iPhone の「ファイル」アプリのプレビュー（iOS 26.3 シミュレーター、2026 年 10 月 6 日）では、ページの JavaScript が動かず、https:// の画像や Google Fonts も読み込まれませんでした。

スタイルやスクリプトを HTML 1 ファイルの中にまとめ、アップロード欄から Web ページとして公開して URL で送れば、パソコンでもスマホでもブラウザでそのまま開けます。内容を直したときも、管理画面の「新しいバージョンのアップロード」から差し替えれば同じ URL のまま更新できます。