私はウェブサイト運営初心者ですが、AIの登場で、自力でウェブサイトを運営するハードルは、間違いなく下がっていると感じます。今回ブログサイトの見出しデザインを変更しましたが、AIをどのように活用したのかをご紹介します。
見出しデザイン変更には「CSSコード」が必要
もうすぐブログ開設から1年10ヶ月経過します。しかし年月の経過に関わらず、ウェブサイト運営に関してはまだまだ初心者です。ブログ運営を開始したときに、記事を更新するために最低限必要なことを学び、その最低限の知識の中で運営してきました。
デザインなど気になっていたものの、着手できずにいました。「できるイメージ」がなく、ちょっと腰が重いなという気持ちもありました。
特に、ウェブサイトのデザインに関わる、サイズや色やレイアウトなどについては、CSS(Cascading Style Sheets)コードを書かなければいけません。私がウェブサイトの作成・運営するために使っている「WordPress」というシステムでは、CSSコードを書くことができなくても運営できるようになっています。しかし、提供される内容は限られたものですので、自分の望むものがあるならCSSのコードを書かなくてはいけないのです。
CSSコードは、インターネット上にもたくさん情報があります。CSSコードをコピーできるサイトもあります。
しかし、調べる手間や、コードを書くための労力や時間が気になっていました。
AIに見出しデザインの提案を依頼
そこで、AIにCSSコードを書いてもらうことにしました。デザインも提案してもらうことに。
まずは、好みや方向性も伝えずに、
・「見出しを提案して」
・「見出しのデザインを変えたくて、コードを書いて。」
というざっくりな指示をしました。
すると以下のように「モダンでクリーンな見出し」を提案してくれました。
前後の文脈の読み違いのためか、意図した指示を誤解することもありましたが。
ともあれ、コードをブログサイトにコピペしてみて、自分好みのデザインかどうかを確認してみました。いくつか試してみたところ、色は自分の好みに合わない提案が多く、自分で指定することにしました。
楽しようとして、色だけ書き直してもらうと⋯
CSSコードの中には、色を指定している部分があります。「＃」から始まるコードです。
該当場所がわかるので自分で書き換えればよいのですが、見出しの階層を6階層設定したものですから、AIにCSSコード全体を書き換えてもらうことにしました。
「提案してくれた見出しの色を〇〇に変えて」というような指示をしたのですが、
それがうまくいきませんでした（汗）
色だけでなく、見出しデザインまで変わっていました。なぜ？？
またやり直すと、指定した色とは違う色に書き換えているのです。なぜ？？
堂々と間違ったレスポンスをすることもありますので、注意が必要です。
指摘すると理解して謝ってくれました。
結局、的確な指示にたどりつくために、時間がかかってしまいました。AIへの指示の仕方の練習なので良しとします。
Webサイトの運営にも使えるAI。みなさんも活用してみてくださいね。
【日記】
次女は今日も保育園お休みしました。「ふたりだからいっしょに遊ぼう」と誘ってくれます。う、うん⋯。「『なにしてあそぶ？』って聞いて」と続きます。薬が効いて楽になり元気です。元気なので、「明日は保育園行く？」と聞いてみたところ、「おせきがおともだちにかかったらだめだからやすむ」とそれらしいことを言っていました。（笑）
長女は急成長を感じます。日常生活を自分でしっかり行えることが増えました。寝るのも一人で⋯。たくさん食べるようにもなりました。学校も楽しんでいます。
宿題の音読を毎日一生懸命やりますが、それを聴くのが私の楽しみです。妹は隣でカスタネットをカンカンカンカン鳴らしていましたけれど。
【something new】
Favicon.io
