AI導入でローコード・ノーコード化するWebサイトの制作環境

5月27日（土）は、オープンソースのCMSであるWordPressのイベント、WordPress Dayです。しかも今年は、20周年という記念すべき節目の年です。

外部リンク

WP20

Celebrating 20 years of WordPress

URLhttps://wp20.wordpress.net/

今回は、WordPress Dayを祝いつつ、HTMLやCSSなどのコードをほとんどもしくは全く書かずにWebサイトが作れる、生成AIとの関係などのトレンドを見てみましょう。ただしこの話は、Webサイトの制作に限った話ではなく、何かのコンテンツやソフトウェアを制作する・制作を依頼する立場にある人に、広く関係する話題です。どうぞ最後までお付き合いください。

CMSとしてトップシェアを誇るWordPress

Webサイトがビジネスに不可欠だと認識され始めた初期の頃は、Webサイトを制作するには、HTMLというマークアップ言語をすべて手で記述していました。使われていたのは、汎用性のあるテキストエディターです。ツールは一般的なものの、専門のナレッジを持った人だけがWebサイトを制作可能でした。

その後、HTMLをすべて書かなくても一部は視覚的に操作でき、仕上がりの状態もその場で確認できるHTMLエディターが登場して人気を博します。既存の文書制作アプリケーションも、HTML機能をサポートし始めました。現在も、Microsoft Wordで作ったレイアウトを、そのままWebサイト用に保存することは可能です。ただし、無駄なコードが随所に挿入されるのでクリーニングが必要です。サイト全体を管理したり、複数人で作業するような、更新や編集の面でメンテナンス性もよくないので、使える場面は限られます。

現在では、Webサイトの制作はCMS（コンテンツ管理システム：Contents Management System）を使うことが常識になっています。CMSは、Webサイトを作るために不可欠な、テキストや画像、タグ、リンク、ユーザーと権限、公開日時などを、統合的に管理するサービスです。

WordPressは、オープンソースのCMSです。ベースになっている技術は、PHPとMySQL。2003年にリリースされて以来ユーザーを増やし、公式サイトによれば、Web上の全サイトのうち43%以上がWordPressで作られています。また、World Wide Web Technology Surveysによれば、CMSの63.3%で2位以下の11倍以上というトップシェアを占めています。

▼Usage Statistics and Market Share of Content Management Systems, May 2023
https://w3techs.com/technologies/overview/content_management

WordPressは、2018年12月にリリースされた5.0では、全く新しいビジュアルブロックエディタ「Gutenberg（グーテンベルク）」が導入されました。これによって、見出しや段落、画像、ボタンなど、すべてがブロック単位で扱われ、ドラッグ&ドロップで操作できるようになりました。

CMSに求められる機能も、Webのトレンドに合わせて強化されてきました。スマートフォンやタブレットの普及に合わせ、デバイスや画面の表示サイズ、縦横比、解像度が変わるのに合わせて表示を最適化するレスポンシブルデザイン。デスクトップと同じ情報・同じ見た目をそのままスマートフォンでも表示するのではなく、情報量やサイズ、UIなどをモバイルに最適化したアクセラレイテッド・モバイル・ページ（AMP）。チャットボットやサーバーレスアーキテクチャー、ダークモードの標準化など、ユーザー体験（CX）を最大化させる機能が、次々と実装されています。生成AIへの対応も、時代の要請の一つといえるでしょう。

WordPressで使える生成AIプラグイン機能例

WordPressで使える、生成AIに対応したプラグインが多数リリースされています。テキストやビジュアルコンテンツの生成や画像の最適化、自動レイアウトなど、Web開発の作業を自動化できます。機能は似ている面も多いので、個別の製品ではなく機能を紹介しましょう。どれも非常に魅力的です。

生成AIプラグインの代表的な機能の例

• 記事タイトルや概要、リード、段落、要約を生成。テキストの修正、翻訳、言い換え、長く・短く編集にも対応。
• 文体は、フォーマルや中立的、プロなどのオプションでカスタマイズ。テンプレートとして保存・再利用可能。
• タイトルやディスクリプション、キーワードなどのメタタグを生成。見出しタグ（h1、h2、h3など）も自動追加。
• 画像ジェネレーターは、DALL-E･2とStable Diffusionに対応し、テキストに合わせた画像を自動生成。
• ChatGPT、GPT-3.5、GPT-4など、幅広いモデルに対応。AIをトレーニングして、特定のタスクを効率化。
• All In One SEOなど、人気のSEO（検索エンジン最適化）プラグインでコンテンツを最適化。
• FAQを自動生成し、その内容から抜粋して答えるチャットボット化。その後で人に代わる連携が可能。
• ECサービスWooCommerceの商品フィールド対応し、商品タイトルや説明、比較記事を自動化。
• 書き起こしを投稿するSpeech-to-Postが可能。逆に、テキストをリアルな音声合成に変換。
• メールやソーシャルメディア用のコンテンツとも連動。日本語を含む40種類の言語をサポート。

CMSとWebサイトジェネレーターの区別は曖昧に

CMSは、作るサイトの規模や目的、操作性、カスタマイズ性、セキュリティー機能、価格、普及率などで選択されます。そのサイト全体が特定のCMSだけで完結している場合もあれば、サブドメインはまた別のCMSが導入されていることも珍しくありません。企業用の大規模サイト向けCMSであれば、HubSpot CMSやMagnolia、Concrete、Joomla!、Drupalなどが人気です。他にも、企業から個人まで使えるプラットフォームとしては、ShopifyやWix、Squarespace、Jimdo、Moodleなど、さまざまなサービスがあります。

同時に、WordPressよりもさらに簡単にWebサイトを作れる「Webサイトジェネレーター」と呼ばれるサービスが、数年前から人気です。というより、CMSがWebサイトジェネレーター化しつつあり、両者の区別は曖昧になっています。エディターとしてリッチな機能を装備しているだけでなく、テンプレートも豊富だったり、複数の担当者による管理やカスタマイズの柔軟性も強化されています。AI化の流れもあり、今後は、Webサイトの制作はさらに自動化が進むと推測されます。

例えば、対話型のエディターとやり取りすることで、作りたいサイトのテイストや目的、機能をテキストで指示しながら進められます。テキストやビジュアル要素の配置はもちろん、レスポンシブル対応やアニメーション表示まで、複雑な動作も自律的に実行できます。また、一部のサービスでは、音声入力に対応しています。『余白をもっと空けて』『もっと写真を追加して』『アクセシビリティーを確保するのにコントラストを上げて』といった指示です。クリエイティブワークにも（クリエイティブワークだからこそ）、明確な言語化によるステップ・バイ・ステップの工程が必要になりそうです。

Webサイト制作に限らず、ソフトウェア開発はローコード・ノーコードと呼ばれる手法へとシフトしています。技術者でないユーザーでも、コンポーネントをドラッグ＆ドロップして接続することで、WebサイトやWebアプリケーション、モバイルアプリを簡単に作成できます。

ITシステムが高度化・複雑化する中で、マンパワーだけで対応するのは限界があります。加えて、IT業界の慢性的な人材不足は深刻化しています。当然、スキルの高いエンジニアはどこでも奪い合いです。つまり、システムをアップデートしながらビジネスの変化にタイムリーに対応するには、外部のSIerの力を頼るのではなく、自社で内製化することが必要です。自社の内部でエンジニアのスキルアップを目指すか、エンジニアではない人材をエンジニアとして育成していくことで、新しいチャンスが生まれます。これと同じことが、Web制作の現場でも起きているわけです。

リプリパ編集部

編集部員

XFacebookInstagram

リープリーパー（略称：リプリパ）編集部です。新しいミライへと飛躍する人たちのためのメディアを作るために、活動しています。ご意見・ご感想など、お気軽にお寄せください。
リプリパ編集部の記事一覧