最高の静的サイトジェネレーター

最高の静的サイトジェネレーター


Webサイトの構築プロセスには2つの部分があります。コンテンツを提供してから、CMS — WordPressまたは使用するものを選択して、そのコンテンツを取得し、選択したテーマおよび選択したテンプレートと組み合わせて、そこからWebサイトを作成しますあなたの顧客またはあなたの読者が読むために。しかし、これらの2つの部分は一緒に実行する必要はありません。それらは互いに分離することができます。 静的サイトジェネレーター (SSG) する.

このガイドでは、静的サイト生成とその利点について説明し、静的サイトジェネレーターのベスト10を挙げて、静的サイトジェネレーターの選択方法に関するガイダンスを提供します。.

静的サイトジェネレータはどのように機能しますか?そして、なぜそれを使うのか?

前述のように、ほとんどのCMSは2つのことを実行します。コンテンツやテーマとテンプレートを組み合わせてコンテンツをHTMLに変換し、そのHTMLをWebサイトとして利用できるようにします。静的サイトジェネレーターは、そのプロセスを2つに分割します。コンテンツがHTMLに変換される部分は自分のコンピューター上で発生し、HTMLファイルでいっぱいのフォルダーを提供します。次に、それらのHTMLファイルをWebにアップロードし、Webサイトとして誰でも利用できるようにします。.

しかし、なぜこれを行うのですか?いくつかの利点があります.

最初は 安心. なぜなら、あなたのウェブサイトは人々が対話するものであり、単純なHTMLであり、ハッキングされるのははるかに難しいからです。また、静的サイトジェネレーターは、作業を行うすべてのコンピューターコードを含み、自分のコンピューターでのみ実行され、より広い世界に公開されていないため、ハッキングすることもできません。つまり、セキュリティ更新はほとんど不要です。 CMSの更新、プラグインの更新、サイトの更新を指示する定期的なポップアップに煩わされる必要はもうありません.

一部の人にとって、これはそれ自体で十分な理由かもしれませんが、静的サイト生成には2番目の大きな利点があります。 パフォーマンス.

静的HTMLで作成されたWebサイトは、アクセスのたびに処理する必要があるWebサイトよりもはるかに高速にロードできます。訪問者がサイトを表示するたびにコンテンツとテーマを新たに組み合わせるのではなく、この作業は生成時に一度コンピューターで実行され、その後は必要ありません。代わりに、ウェブサイトはすでに表示可能な形式になっています.

パフォーマンスの向上は、あらゆる方法でWebサイトにメリットをもたらします。あなたの顧客は見続け、そして 直帰率が低い,  Googleやその他の検索エンジンは高速なパフォーマンスを重視し、ランキングを向上させるため、ページの読み込み時間の短縮はSEOにとって素晴らしいことです.

トラフィックの急増は問題ではありません。訪問者の数が急増した場合、それは問題なく処理され、サイトが過負荷になった瞬間にサイトが過負荷になっても、これらの「502 Bad Gateway」メッセージは表示されません。.

雲はあるもののすべての銀の裏地があり、静的なサイトを生成するために、サイトでこの手法を使用するには、もう少し技術的な準備が必要であることは明らかです。.

「生成段階」と「公開段階」のこの分離は理解する必要があり、静的サイトジェネレーターは一般に、標準的な種類の動的CMSよりも技術知識のベースラインを少し多く想定する傾向があります。特に、ほとんどの静的サイトジェネレーターは、少なくとも コマンドライン:これらのアプリは、ポイントしてクリックするのではなく、コマンドを実行することで操作される傾向があります.

コマンドラインが必要なため、静的サイトジェネレーターはすべての人に適しているとは限りませんが、袖をまくり、通常より少し深くダイビングすることを検討する準備ができている場合、いくつかの潜在的な勝利があります。.

最高の10の静的サイトジェネレーターを見てから、それらをどのように選択するかを見てみましょう.

10の最高の静的サイトジェネレーター

1. Hugo

ヒューゴロゴ

Hugoは、ターミナルベースの静的サイトジェネレーターのセットアップと使用が簡単です。彼らの文書、特に Hugoのインストール方法 それを実行するには、非常に包括的であり、最初に新しいパッケージストアをインストールしてからHugoをインストールする必要はありません。.

それはたくさんあります ビルド済みのテーマ これにより、サイトに適した外観を簡単に選択できるようになり、Hugoチームの主な機能の1つはビルド速度です。.

コンテンツを追加または編集するか、テーマを変更してサイトに変更を加えるには、サイトを「再構築」する必要があります。つまり、コンテンツとテーマを組み合わせてHTMLにするプロセスをすべてのページで実行します。ビルド速度のパフォーマンスのわずかな違いでも、数秒待ってから数分待って、行った変更の結果を確認できます。Hugoはこれで最速になるように懸命に取り組んでいます.

既存のデータからサイトを構築している場合、Hugoの「データ駆動型コンテンツ」機能により、サイトのコンテンツをCSVまたはJSON形式で提供することが比較的簡単になります。これは、世界に公開したい既存のデータを、ExcelやGoogleスプレッドシートを起動することなく閲覧およびナビゲートできるより便利な方法で取得するのに便利な方法です。.

2. Eleventy、または11ty11tyロゴ

11tyは新しいSSGの1つですが、人気リストを急上昇させています。それ自体が「より単純な静的サイトジェネレータ」として請求されます。ただし、ある程度の技術的な知識が必要です(そのドキュメントにはこれが反映されています)。しかし、それを理解できる人にとっては、エレガントな方法で物事を行います.

11tyはJavaScriptで記述されているため、 node.js 働く;まだインストールしていない場合は、最初にインストールしてから、コマンドラインから11tyをインストールする必要があります。.

11tyは、ウェブサイトのパフォーマンスについて強い見方をしており、 パフォーマンスリーダーボード それを使って構築されたウェブサイトの数、そしてそれはウェブ専門家やオープンウェブをより一般的にキュレートして構築する人々の間で非常に人気があります.

3.ペリカンペリカンのロゴを取得

ペリカンは見た目がかなり削られていますが、基礎となるプログラミング言語としてPythonを使用しているため、少し余分なプログラミングを行うだけで、ほぼすべての方向に拡張できる可能性があります。.

WordPressからのサイトデータのインポートをサポートしているため、他の一部のSSGよりも、現在の設定を失うことなく、既存のWordPressサイトから静的サイト生成に簡単に移動できます。そして、より良いクラスのSSGのように、それは主にブログのためではなく、ウェブサイト全体を処理できるように設計されています.

ただし、ペリカンは最初は少し急な学習曲線を持っています。そのため、Pythonに少しでも慣れている人には、より適しています。同様に、コンピューターに既にPythonのインストールが必要であり、これを持たない開発者以外にはガイダンスは提供されません。しかし、Pythonをすでに使用している開発者タイプの場合は、Pelicanから始めるのが良いでしょう。.

4.ニコラ

ニコラのロゴ

Nikolaは、静的なサイト生成に対して非常に「バッテリーを含む」アプローチを採用しており、ブログや完全なWebサイト用の非常に詳細なテンプレートを提供するだけでなく、とりわけ画像ギャラリーや検索も提供しています。.

それはかなり広範なリストを持っています プラグイン とテーマも。ニコラは市場のより技術的な終わりに向かう傾向がありますが;ここで基本的なこと以上のことを行うには、Python開発にかなりの自信が必要ですが、Nikolaは他の多くの選択肢よりも拡張性を提供しています.

テーマのリストはそれほど包括的ではないため、有益ではなく美しいものを探している場合は、他の場所を探すほうがよい場合があります。ただし、再構築速度は他のほとんどの可能性よりも高速です。.

Pelicanと同様に、NikolaはすでにPythonが利用可能であることを前提としており、それを可能にする方法を説明していません。そのため、Windowsを使用していない場合は、他の選択肢の1つを検討することをお勧めします。.

5.ギャツビーギャツビーのロゴ

ギャツビーは、それ自体を静的PWAジェネレーターと呼びます。 PWAは、 プログレッシブウェブアプリ, オフラインで作業したり、モバイルのホーム画面に追加したりできます。他のSSGで生成されたものを含め、どのWebサイトでもこれを行うことができますが、Gatsbyはすぐにこのサポートを提供します.

WebコンポーネントライブラリであるReactに精通している人にとっては、Gatsbyはそれを中心に構築されているため、適切な選択となる可能性があります。, React自身のWebサイト ギャツビーで構築されています.

Gatsbyにはnode.jsとバージョン管理システムの両方が必要です ギット インストールされます。彼らはかなり詳細なセットを持っています ドキュメントページ Windowsを含むGatsby環境のセットアップ方法について説明しますが、コマンドラインに慣れていない場合は、かなり複雑なプロセスになります。また、ドキュメントにはWindowsとLinux、Macの手順が混在しているため、理解するのが少し難しい.

6.ジキル

ジキルロゴ

Jekyllは最も古い静的サイトジェネレーターの1つですが、まだ活発に開発が進んでおり、その人気により、このリストの他のすべてを生み出しているSSGイノベーションの洪水が大いに刺激されました.

名声へのその主張の1つは、Githubコードホスティングサービスに組み込まれていることです。コンテンツをGithubに保存することが可能です。 リポジトリ, GithubがJekyllコードを実行するように、コード用のクラウドドライブ ために コードを実行しなくても、コンテンツをWebサイトに変換できます。.

このように、 Githubページ サービスは静的なウェブサイトのホストとして無料で使用でき、これを設定する方法のドキュメントはかなり明確でわかりやすい.

ただし、それでも、 ギット コード制御システム。もちろん、自分のコンピューターでJekyllを自分で実行することもできます。 一連のWindowsインストール手順, Windowsは公式にはサポートされていませんが.

7. Statiq.web

statiqロゴ

Statiq Webは、SSGのランクへの比較的新しい追加であり、まだかなり開発が進んでいます。そのため、そのプロセスに積極的に参加し、何がうまく機能し、何がうまくいかないかをフィードバックすることでコミュニティに参加する意思がある人に最適です。.

そのユニークなセールスポイントは、.NETで構築されていることです。そのため、そのプログラミングスタックについてある程度の知識がある人は、Statiq Webを既存の経験にうまく適合させることができます。これは、より一般的なStatiqフレームワークのサンプルプロジェクトであるため、経験豊富なプログラマは、より大きなフレームワークを採用して、より包括的なものを構築できる可能性があります。.

8. Publii

Publiiロゴ

Publiiは、ここにある他のほとんどの静的サイトジェネレーターとは異なり、コマンドラインツールではありません。代わりに、Windows、Mac、Linuxで利用できるデスクトップアプリケーションです。.

これはWordPressに似ていると考えるかもしれませんが、Webサイトではなく、コンピューター上で実行され、静的なバージョンのWebサイトを生成し、他のツールと同じように公開できるアプリケーションです。.

Netlifyやクラウドホスティングロケーションなど、さまざまな既存のホストに静的なWebサイトをプッシュするための組み込みの公開ツールがあります。既存のWordPressサイトをPubliiに変換するためのインポートシステムと、有料のプロフェッショナルレベルのテーマの市場があります。.

アプリケーション自体は無料でオープンソースであり、ディスカッションフォーラムで互いに助け合うアクティブなユーザーコミュニティがあります。 Publiiは、現在提供されている静的サイトジェネレーターの中で最も技術的ではありませんが、ほとんどすべての利点を備えています。コーディングやコマンドラインベースのアプローチを検討していない人にとって、これは素晴らしいソリューションです。.

9. WP2Static

wp2staticロゴ

WP2Staticは、他の静的サイトジェネレーターとはかなり異なるアプローチをとります。それ自体は厳密にはサイトマネージャーではありません。代わりに、WordPressと連携して、WordPress自体が管理するサイトの静的バージョンを作成します。.

上記の説明の言語では、WP2Staticは、WordPressを編集し、テーマやテンプレートと組み合わせてコンテンツをHTMLに変換します。次に、WP2Staticにステップインして、そのHTMLを取得して公開します なので ウェブ上のどこかにプレーンHTML.

これには明らかな利点がいくつかあります。 使い慣れたWordPressインターフェースを使い続けることができ、テーマとプラグインのWordPressの幅広いライブラリすべてにアクセスできます.

しかし、これには欠点もあります:WordPressのインストールを別の場所に移動することが重要です。そうしないと、静的なサイト生成の利点の大部分が失われます。.

サイトを静的にすると、WordPressなどの動的な製品を使用しないため、セキュリティ上の大きなメリットがありますが、このソリューションでは、 まだWordPressを使用しています。そのため、WordPressをあなた以外の誰も到達できない場所に隠すことが重要です。.

技術志向の人はそれを隠しサーバーに移動したり、ローカルマシンでWordPressを実行したりできます。その方法をすぐに理解していない人は、関連する概念に従うのが難しい場合があります。また、(非表示の)WordPressが生成するサイトは、公開ボタンまで一般に公開されるサイトではないことを覚えておくと混乱する可能性があります押されている.

ただし、WordPressのユーザーインターフェースに非常に慣れている場合、または特定のWPプラグインやテーマに強く関連付けられており、他のSSGで見つけたり利用したりすることが難しい場合、WP2Staticが理想的なソリューションになる可能性があります。.

10. Next.js

Nextjsロゴ

Next.jsは静的サイトのジェネレーターではなく、Reactを使用して静的アプリケーションを構築するためのフレームワークです。静的サイト生成をサポートし(2020年初頭の9.3リリースでこのサポートを大幅に改善してサポートを改善しました)、Reactを使用してアプリケーションを構築し、それをバックアップするクラス最高の静的サイト生成が必要な場合は、次へ.jsは見やすい場所です.

JavaScriptとReactの両方について十分な知識があることを前提としているため、非技術者向けではなく、ドキュメントはWindowsユーザーにリップサービスが支払われるLinuxまたはMac環境に傾いています.

しかし、それが価値のあるものについては、それは非常に良いです、そしてそれの周りにかなりの話題があります、それはそれが激しい開発を得て飛躍的に前進することを意味します.

正しいものを選ぶ方法?

そこにあります:何を選択するかのリスト.

しかし、どのようにして最適なものを選ぶのですか?

コマンドラインに興味がない場合は、確かにPubliiを確認してください。あなたが静的になりたいと思っているWordPressの専門家であれば、WP2Staticはあなたがすでに持っているこれらの広範なスキルに基づいて構築されます。あなたがスピードを気にするなら、11tyまたはHugoがあなたが見る場所です.

特定のプログラミング言語または環境での経験がある場合は、その言語で記述された静的サイトジェネレーターを選択して、既存のスキルを最大限に活用してください。Pythonの場合は、PelicanまたはNikolaを使用します。 Ruby、Jekyll、.NET、Statiq、ReactでNext.jsとGatsby、JavaScriptで11ty.

既存のWordPressサイトから移動する場合は、選択したツールにWordPressコンテンツのインポーターがあることを確認してください(ほとんどの場合)。実験は安くて簡単です。いくつかのサンプルコンテンツを使用してテスト静的サイトを構築し、他の誰かがそれを見ることができないように、自分のコンピューター上でそれを生成できます。.

サウンドが気に入っているツールを試してみてください-それらはすべて無料で、オープンソースです。準備ができたら、静的コンテンツをホストする場所を探し始めます。.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map