mini Lateとは

mini Lateに関してあれこれ説明しています。ちょっと長いです。

最新のWeb技術を用いたWebサイト制作

mini Lateは「Jamstack」と呼ばれる設計思想をベースにサービスを提供しています。
Jamstackと聞いても「なんのこっちゃ？」と思われる方が多いと思いますが、この設計思想は、パフォーマンスやセキュリティに優れ、低コストでスケーラブル、更に優れた開発者体験をもたらせてくれます。

詳しく説明すると小難しい話が多くなってしまうので割愛しますが、この設計思想を実現するために色々な新しい技術を取り入れ、Webサイトを制作します。

このJamstackと言う設計思想は、Webサイト制作においてかなり普及すると思われる勢いで広まっており、今後のデファクトスタンダードになりうる可能性を秘めています。

Jamstackに関してもう少し詳しく知りたい方は、弊社コーポレートサイトのJamstackによるWebサイト制作もご覧ください。

分かりやすい料金設定

ページ数に応じてプランを設け、明確に価格を設定しています。
オプションでの変動は多少ありますが、フルオーダーメイドに比べ予算が立てやすいため、予算オーバーの心配がありません。

料金プランやオプションに関しては、料金・オプションをご確認ください。

お客様だけのデザイン

テンプレートは使わず、お客様の要望に合わせた最適なデザインを作成しますので、セミオーダーメイドとは言えフルオーダーメイドと遜色の無いデザインを経験豊富なデザイナーが提案させて頂きます。

実際のデザインに関しては、実績紹介をご確認ください。

レイアウトに関しては、トリッキーなレイアウトや、トップページだけナビゲーションの位置が異なる等の対応は出来ません。これは、価格を抑えてご提供させて頂くためと言う部分も有りますが、アクセシビリティにも関連する部分で、アクセシビリティの達成基準に「達成基準 3.2.3 一貫したナビゲーション」があり、位置や順番を変えることをNGとしているためです。

よりちゃんとCMSをCMSとして

WordPress等のCMSを使う目的の一つが、HTMLやCSS、JSが分からない方でも簡単に更新できる点が上げられます。しかし、工数削減などの理由から、予め静的なHTMLを作成（コーディング）した後に、固定ページやテンプレートにそのソースコードをそのまま貼り付けて終わりにしてしまうケースも多々あります。
これだと、編集するには結局ある程度HTMLの知識が必要になってしまい、CMSのメリットの一つを活かせなくなってしまいます。

mini Lateの場合、お客様が更新したいコンテンツに対して適切なフィールドを用意して実装しますので、よりCMSらしくHTMLは一切触れること無く更新が可能です。
※更新したいコンテンツの仕様に寄っては、HTMLの編集が必要になるケースもあります。

アクセシビリティに配慮したWebサイト

アクセシビリティと聞くと、障害者の方向けだけの対応だと思われるかも知れません。確かにその側面もありますが、アクセシビリティ対応はマシンリーダブル（検索エンジンなども含む機械に対してWebページの内容を適切に認識させる）である必要があります。
機械に対しても適切に伝わるようにすると、SEO的な面でもメリットがありますし、障害がなくとも音声のみでWebページの情報を取得すると言う使われ方も考えられます。

また、そもそも論的な部分として、これまで国や自治体のみが義務化されていたWebサイトのアクセシビリティ対応が、2021年6月の障害者差別解消法の改正により、民間事業者でも義務化されました。これは、公布から3年以内に対応が求められています。
罰則も、20万円以下の過料が課せられていたりと、民間事業者でも義務化されることで、無視できる問題では無くなってきています。

しかし、アクセシビリティ対応をしっかり行うとなるとどうしても相応の費用が掛かってしまい、中々対応が難しい現実もあります。

そこで、mini Lateのプランでは、「JIS X 8341-3 適合レベルAA」に準拠までは難しいですが、プラン料金内でアクセシビリティ対応の実績も有るメンバーが可能な限り配慮したデザイン・コーディングを提供させて頂きます。

今までのWebサイト制作の課題

ここではCMSにWordPressを使って制作したWebサイトを例に、現状の課題とJamstackによるメリットをお伝えします。

セキュリティ

まず上げられるのは、セキュリティ面での問題です。
WordPressに代表されるCMSを使う場合、脆弱性を放置しているとアタックを受けてサイトを改ざんされるリスクが高くなります。そのため頻繁にアップデートを行ったり、セキュリティ対策を講じたりしなければなりません。

しかし、Jamstackでサイトを制作すると、CMSをサーバーに設置する必要が無くなるため、CMSを動作させるのに必要なPHPやCGI、データベース等が不要になり、セキュリティリスクがかなり低下します。

実際問題、このセキュリティリスクは思ったよりも身近に潜んでおり、弊社で制作したサイトもCMSの脆弱性を利用されサイトの改ざんを受けたことがあります。

メンテナンスコスト

WordPress本体のアップデートはもちろんですが、プラグインを利用している場合、それらのアップデートも必要になります。さらに、プラグインの開発が止まってしまった場合、同様の別のプラグインを探す必要があるなど、メンテナンスコストが掛かりますし、場合によってはプロに依頼しなければならず思いがけないコストが発生してしまう可能性があります。

この点、JamstackですとCMSはサーバーに設置するのではなく、ヘッドレスCMSと呼ばれる外部サービスのCMSを使いますので、アップデートはサービス提供側で自動的に行われるため、何もする必要がありません。

パフォーマンス

WordPressは動的なサイトです。この動的なサイトは、アクセスが有った段階でサーバーからPHP等のプログラムを通じ、データベースにアクセスし情報を取得、それから表示するというような形で、ウェブページを表示するのにたくさんの経路を辿る必要があります。
そのため、どうしても表示が遅くなってしまいます。とは言え、最近はWordPressが如何に快適に使えるかがレンタルサーバーでは最重要ですので、サーバースペックも上がり体感上遅いと感じることはほぼ無いとは思いますが、Jamstackの場合は静的なHTMLになりますので、必要な経路が短く、サーバーのスペック等にも左右されないので、よりハイパフォーマンスなサイトが構築できます。

ランニングコスト

昨今、ワンコイン以下で使えるレンタルサーバーも多いのでそこまでコストは掛かっていないとは思いますが、Jamstackの場合、通常のレンタルサーバーは使用せず、代わりにJamstackに適したホスティングサービスを利用します。
mini Lateで使用するホスティングサービスは無料ですので、その分コストを抑えることが出来ます。
ただ、大変申し訳無いのですが、Jamstackに適したホスティングサービスを使う都合上、基本的に任意のレンタルサーバーを利用することは出来ません。技術的な点で言えばレンタルサーバーでも可能ですが、追加の工数が掛かってしまうため、任意のレンタルサーバーをご利用する場合はオプションとさせて頂いております。

Jamstackのデメリット

Jamstackでは色んな新しいWeb技術を使うため、メリットばかりではなくデメリットも存在します。

更新内容を即反映させることが出来ない

素のHTMLやCSSで有ればブラウザが解釈出来るため、該当ファイルをサーバーにアップすれば即反映されますが、Jamstackの場合、素のHTMLは書かないため、そのままではブラウザが解釈出来ないソースコードになっています。
そこで、ビルドというソースコードのチェックをし、実行可能なファイル（HTML）に変換すると言う処理が必要になるのですが、このビルドはページ数が増えれば増えるほど時間が掛かってしまいます。ただ、mini Lateの場合はページ数も少ないため、30秒から1分程度で反映することが可能です。
このビルドを行うのが通常のレンタルサーバーでは難しいため、Jamstackに適したホスティングサービスを使う必要が有ります。

ホスティングサービス（サーバー）の選択肢が少ない

現状では国内外含めてもホスティングサービス自体が少ない現状で、特に国内ではJamstackに適したホスティングサービスを展開している会社は1社くらいしか見当たりません。
本サービスでは、様々な要件を検討し現時点で最適と思われる Cloudflare Pages を使用することにしています。

動的なページを作るのが苦手

Jamstackは、最終的に静的なページとなるため、PHPやCGIといったサーバーサイドで動作させるプログラムが使えません。そのため、ブログのコメントのような機能や、サイト内検索、EC等の個人情報を扱うサイトの構築、フォーム機能等は苦手としています。
しかし、これらの問題点は、JavaScriptやAPIを提供しているサービスを使うことで多くの場合解決が可能です。

自身で更新するにはある程度知識が必要

CMSで管理していない部分のコンテンツを修正したり更新する際、必ずGitを利用する必要があります。また、HTMLも素のHTMLではなくテンプレートエンジンを使っていますので、HTMLの知識に加え、使用しているテンプレートエンジンの知識も必要になります。

mini Lateで使っている技術とかサービス

ここでは少々技術的な部分にも触れておきます。
mini Lateでご提供するWebサイトは主に次の技術やサービスで制作しております。

  • 静的サイトジェネレーター（SSG）には「Astro」を使用。
  • HTMLテンプレートエンジンはEleventyの場合「Pug」を使用。
  • CSSプリプロセッサには「Sass（scss形式）」を使用。
  • Gitのホスティングサービスには「GitHub」を利用（すでに、BitbucketやGitLabのアカウントがある場合それらも利用可能）。
  • Webのホスティングサービスは「Cloudflare Pages」を基本的に利用。
  • CMSには「microCMS」「Newt」のいずれかを利用。
  • Webデザインは「XD」「Figma」「PhotoShop」「Illustrator」のいずれかを使用。

SSGを使う場合、Next.js、Gatsby、NuxtJS辺りが人気ですが、いずれもJavaScriptの知識がかなり必要になるので、ちょっとHTMLとCSSが分かるレベルの方が触るのは中々厳しいのですが、Astroの場合は、ちょっとした修正レベルであればHTMLをある程度理解していれば対応可能です。