UPDATE:2024.6.28
- CATEGORY
CSSとHTMLのtableをAIに作ってもらった。
![](https://apricot-design.com/wp2023/wp-content/uploads/2024/06/table.png)
HTMLでこのようなテーブル(表)を作るのも地味に時間がかかりますよね。
![](https://apricot-design.com/wp2023/wp-content/uploads/2024/06/table_sample.jpg)
試してみたAIは「Copilot」「Gemini」の二つ。
CopilotはWindowsに搭載されたAIアシスタント、GeminiはChromeブラウザから利用できるGoogleのAIです。
それぞれのAIに以下のような同じ画像付きの質問をしてみました。
![](https://apricot-design.com/wp2023/wp-content/uploads/2024/06/question.jpg)
そうして回答されたHTMLとSCCから作られたテーブルはそれぞれこちらです。
AIに回答してもらったtable
まずは「Copilot」
![](https://apricot-design.com/wp2023/wp-content/uploads/2024/06/copilot.jpg)
メロンが2つになっていますね。
余談ですが、最初にバナナをひらがなで書いたらなぜか回答のHTMLでは「はなみず」になっていました。なぜ……
次に「Gemini」
![](https://apricot-design.com/wp2023/wp-content/uploads/2024/06/Gemini.jpg)
でも「商品名」と「価格」、という画像の無い見出しを自発的に付けてくれました。
すごい。
結果
どちらのAIも画像を解析して、簡単なテーブルならコードを教えてくれました。しかし、「テーブルを結合する」というようなことは、画像を提示しただけではまだ出来ないのかもしれませんね。
(文章で追記するなどの工夫が必要かと思います)
おまけ
テーブルは以下のようなジェネレーターを使って作るのも制作時間短縮になるかもしれません。Table Tag Generator