---
title: "Qiita・ZennでHTMLを見せられない理由と使い分け"
description: "QiitaやZennは技術記事を書いて公開するのに最適ですが、HTMLやJavaScriptを自由に動かして見せることには制限があります。実物のHTMLを動いた状態で見せたい場合に何を使えばいいか、理由とともに整理します。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/qiita-zenn-vs-giga-site"
markdown: "https://giga-site.com/articles/qiita-zenn-vs-giga-site/index.md"
category: "比較"
publishedAt: "2026-06-24"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# Qiita・ZennでHTMLを見せられない理由と使い分け

QiitaやZennは技術記事を書いて共有するのに最適なプラットフォームですが、記事内でHTMLやJavaScriptを自由に動かして見せることには制約があります。この記事では、その理由と、実物のHTMLを見せたいときの使い分けを整理します。外部サービスの仕様は変わるため、本文ではレビュー共有で変わりにくい判断軸を中心に整理します。

> Source HTML: https://giga-site.com/articles/qiita-zenn-vs-giga-site
> Article index: https://giga-site.com/articles/index.md

## QiitaやZennでHTMLが自由に動かせない理由

QiitaやZennは、Markdownで書いた技術記事を共有するためのプラットフォームです。記事の本文に任意のHTMLやJavaScriptを書いても、そのまま実行されるわけではありません。これはセキュリティ上の理由が大きいです。

もし任意のスクリプトが動いてしまうと、閲覧者のブラウザで悪意あるコードが実行されたり、他の利用者に被害が及んだりする恐れがあります。そのため、これらのサービスは投稿内容をサニタイズし、危険なタグやスクリプトを無効化しています。

結果として、コードはコードブロックとして「テキストで表示する」ことはできても、その場で「動くページとして描画する」ことは基本的にできません。

## 記事としての共有が得意なこと

QiitaやZennは、解説・知見・チュートリアルを文章とコードブロックで構造的に共有するのに優れています。検索からの流入も期待でき、多くの読者に知識を届けるのに向いています。

コードの説明、設計の意図、つまずきポイントの共有といった「読んで理解してもらう」用途では、これらのプラットフォームが最適です。コミュニティからのフィードバックも得やすいです。

## 結論：この用途ならどちらを選ぶべきか

Qiitaで迷うときは、まず「本番公開したい」のか「確認用に短期間だけ見せたい」のかを分けます。前者はホスティングや開発基盤の比較、後者は認証・期限・差し替え・相手の開きやすさの比較になります。

Qiita・ZennでHTMLを見せられない理由と使い分けの判断では、機能名だけでなく、レビュー相手がアカウント作成なしで開けるか、共有後に古いURLが残らないか、修正後も同じURLで確認してもらえるかを見ます。比較して迷う場合は、まずレビュー用途か本番公開用途かを分けます。確認用なら、認証・期限・同じURLでの差し替えをまとめて扱える共有サービスで小さく試すのが安全です。

- 本番公開向き: 独自ドメイン、CI/CD、ソース管理、長期運用を重視する
- レビュー共有向き: 認証、期限、差し替え、非エンジニアへの渡しやすさを重視する
- 避けたいケース: 機密情報を含むHTMLを、認証なしの公開URLに置く
- 確認すること: 料金、公開範囲、URLの寿命、削除・差し替え手順、相手側の閲覧条件

## 実物のHTMLを動かして見せたい場合

一方で、記事の補足として「実際に動くデモ」を見せたい、あるいは制作したHTMLそのものの挙動を関係者に確認してもらいたい場面があります。ここで必要なのは、テキストではなく描画され実行された状態のページです。

外部のデモ用サービスやサンドボックスを使う手もありますが、関係者以外に見せたくない場合や、確認が終わったら閉じたい場合には、認証と公開期限のある共有が便利です。記事はQiitaやZennに置き、動くデモは別途リンクで見せる、という分業ができます。

## ギガサイト便で動くデモを共有する手順

ギガサイト便は、HTMLやZIPをそのまま描画された状態で公開し、認証と期限を付けられます。記事の補足デモや限定共有に向いた流れは以下の通りです。

1. 見せたいデモのHTMLまたはZIPをトップページにドロップする
2. 発行された共有URLを取得する（HTTPSは自動）
3. 公開範囲に応じて認証方式を選ぶ（広く見せるならURLのみも可）
4. 必要なら公開期限を設定する
5. 記事中や関係者へのリンクとして共有する

## 使い分けの指針

解説や知見をテキストとコードで広く届けるなら、QiitaやZennが最適です。検索流入やコミュニティの反応を活かしやすく、記事としての資産になります。

実物のHTMLを動かして見せたい、特に関係者だけに認証付き・期限付きで確認してもらいたい場合は、ギガサイト便が向いています。記事は記事プラットフォームに、動くデモは限定共有に、と役割を分けると無理がありません。

## よくある質問

### なぜQiitaやZennは記事内でスクリプトを動かせないのですか

主にセキュリティ上の理由です。任意のスクリプトが動くと、閲覧者のブラウザで悪意あるコードが実行される恐れがあります。そのため投稿内容はサニタイズされ、危険なタグやスクリプトは無効化されます。

### 記事の補足として動くデモを見せるにはどうすればよいですか

デモのHTMLを別の場所で公開し、記事からリンクする方法が一般的です。ギガサイト便ならHTMLやZIPをドロップして描画された状態の共有URLを発行でき、必要なら認証や公開期限も付けられます。

### 限定公開のデモが検索結果に出るのを避けたいです

ギガサイト便の一時公開ページにはnoindexが付くため、検索結果には出ません。ただしnoindexはアクセス制御ではないので、関係者以外に見せたくない場合は認証を併用してください。

### デモを修正したら記事のリンクも貼り替えが必要ですか

ギガサイト便は同じURLのままファイルを差し替えられるため、デモを修正してもリンクは変わりません。記事に貼ったリンクを貼り替えずに、中身だけ更新できます。

### 結局、レビュー用途ならどの方法を選ぶべきですか？

公開後も長く運用するなら本番向けホスティング、短期間の確認なら認証・期限・差し替えが簡単な共有サービスを選びます。相手が非エンジニアの場合は、アカウント作成なしで開けることも重要です。

## 関連記事

- [Vercel Blobなどオブジェクトストレージ共有との違い](https://giga-site.com/articles/vercel-blob-vs-giga-site/index.md)
- [Codeberg Pagesとの違いと使い分け](https://giga-site.com/articles/codeberg-pages-vs-giga-site/index.md)
- [SourceHut Pagesとの違いと使い分け](https://giga-site.com/articles/sourcehut-pages-vs-giga-site/index.md)
- [Web魚拓・archive.todayでページを見せる場合との違い](https://giga-site.com/articles/lp-archive-vs-giga-site/index.md)
- [ペライチ系インスタントLP作成との違い｜常設LPと確認用共有](https://giga-site.com/articles/instant-page-vs-giga-site/index.md)
- [BASE・STORESのショップページ公開との違い](https://giga-site.com/articles/base-shop-vs-giga-site/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Qiita・ZennでHTMLを見せられない理由と使い分け",
  "description": "QiitaやZennは技術記事を書いて公開するのに最適ですが、HTMLやJavaScriptを自由に動かして見せることには制限があります。実物のHTMLを動いた状態で見せたい場合に何を使えばいいか、理由とともに整理します。",
  "datePublished": "2026-06-24",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/qiita-zenn-vs-giga-site",
  "url": "https://giga-site.com/articles/qiita-zenn-vs-giga-site",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "比較",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "なぜQiitaやZennは記事内でスクリプトを動かせないのですか",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "主にセキュリティ上の理由です。任意のスクリプトが動くと、閲覧者のブラウザで悪意あるコードが実行される恐れがあります。そのため投稿内容はサニタイズされ、危険なタグやスクリプトは無効化されます。"
      }
    },
    {
      "@type": "Question",
      "name": "記事の補足として動くデモを見せるにはどうすればよいですか",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "デモのHTMLを別の場所で公開し、記事からリンクする方法が一般的です。ギガサイト便ならHTMLやZIPをドロップして描画された状態の共有URLを発行でき、必要なら認証や公開期限も付けられます。"
      }
    },
    {
      "@type": "Question",
      "name": "限定公開のデモが検索結果に出るのを避けたいです",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "ギガサイト便の一時公開ページにはnoindexが付くため、検索結果には出ません。ただしnoindexはアクセス制御ではないので、関係者以外に見せたくない場合は認証を併用してください。"
      }
    },
    {
      "@type": "Question",
      "name": "デモを修正したら記事のリンクも貼り替えが必要ですか",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "ギガサイト便は同じURLのままファイルを差し替えられるため、デモを修正してもリンクは変わりません。記事に貼ったリンクを貼り替えずに、中身だけ更新できます。"
      }
    },
    {
      "@type": "Question",
      "name": "結局、レビュー用途ならどの方法を選ぶべきですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "公開後も長く運用するなら本番向けホスティング、短期間の確認なら認証・期限・差し替えが簡単な共有サービスを選びます。相手が非エンジニアの場合は、アカウント作成なしで開けることも重要です。"
      }
    }
  ]
}
```