CSSとHTMLのtableをAIに作ってもらった。

HTMLでこのようなテーブル（表）を作るのも地味に時間がかかりますよね。

そこで今回はAIに聞いたら思い通りのテーブルを作るHTMLとCSSを教えてくれるのかを実験してみました。

試してみたAIは「Copilot」「‎Gemini」の二つ。

CopilotはWindowsに搭載されたAIアシスタント、‎GeminiはChromeブラウザから利用できるGoogleのAIです。

それぞれのAIに以下のような同じ画像付きの質問をしてみました。

そうして回答されたHTMLとSCCから作られたテーブルはそれぞれこちらです。

AIに回答してもらったtable

まずは「Copilot」

ちょっと違う……普通のテーブルが作成されました。
メロンが２つになっていますね。

余談ですが、最初にバナナをひらがなで書いたらなぜか回答のHTMLでは「はなみず」になっていました。なぜ……

次に「‎Gemini」

こちらも惜しい……少し違いますね。
でも「商品名」と「価格」、という画像の無い見出しを自発的に付けてくれました。
すごい。

結果

どちらのAIも画像を解析して、簡単なテーブルならコードを教えてくれました。
しかし、「テーブルを結合する」というようなことは、画像を提示しただけではまだ出来ないのかもしれませんね。
（文章で追記するなどの工夫が必要かと思います）

おまけ

テーブルは以下のようなジェネレーターを使って作るのも制作時間短縮になるかもしれません。

Table Tag Generator