Web制作を中心にITの分野で様々な業界のビジネスをサポートしています。 大学や専門学校の非常勤講師としても活動中。Web制作からWebアプリケーション開発、情報処理に関するコンピュータスキル、情報科学の講義を担当。ほか、企業のICT活用のご相談や教育機関でのFD・SD研修の講師も行っています。 Webエンジニアのブログ https://blanche-toile.com/ note https://note.com/akira_ao Bluesky ビジネスアカウント @nuovasfida.comhttps://bsky.app/profile/akirao.bsky.socialhttps://bsky.app/profile/akirao.bsky.social/post/3mr5gpyqkx226SEOだけでなくAIO・GEO（生成AI最適化）の観点からも注目されるHTML/CSSバナーですが、ブラウザの強制ダークモードで意図せず色反転してしまう問題があります。 今回はメディアクエリを使わず、CSSを2行追加するだけで元のライトモードデザインを維持する実装方法をご紹介します。 ↓　↓　↓ 【HTML+CSSバナーのダークモード問題！ブラウザの強制反転を無効化してデザインを保つ方法】 https://blanche-toile.com/web/html-css-banner-darkmode #デザイン #Webデザイン #CSS #SEO #AIO #GEO21 Jul 2026 08:54 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mr5gpyqkx226https://bsky.app/profile/akirao.bsky.social/post/3mr57d2qq2k2l休憩。 連休明け、各地で気温40度越えが多発するのかな。 コーヒーだけでなく、冷たいアイスも食べたい。 ということで、合体！ 抹茶コーヒーフロートを作る。21 Jul 2026 06:42 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mr57d2qq2k2lhttps://bsky.app/profile/akirao.bsky.social/post/3mqqfl5zixs2dそういえば、プログラミング関連の講義で、開発環境について準備からその仕組みなどみっちり教えたことがないな。 結局、準備された環境で学ぶので、トラブルの対処はできないよね。 大学の講義だと1コマ使いそう。16 Jul 2026 04:29 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mqqfl5zixs2dhttps://bsky.app/profile/akirao.bsky.social/post/3mqixymtt6s27AIが発達しても、関連する技術に必要な知識やスキルはしっかり学んで理解しておかないといけない。 これは毎回、学生に伝えている。 皆、知らないことによるリスクを誰からも教わっていない。13 Jul 2026 05:37 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mqixymtt6s27https://bsky.app/profile/akirao.bsky.social/post/3mqgt7oevdk2z画像バナーとHTMLバナーそれぞれの特徴を整理してまとめました。 今後の検索やAI（AIO・GEO）への最適化を考慮しつつ、スマホ表示にも柔軟に対応できるHTML構造の組み方を解説しています。 ただの制作作業というわけではなく、今後のWebマーケティングの成果にも深く関わってくる部分です。 実務での活用を想定した、汎用的なHTML・CSSの実装テンプレートコードもご用意しました。 ↓　↓　↓ 【HTML+CSSバナーがSEO・AIO・GEOに与える成果と具体的な実装方法】 https://note.com/akira_ao/n/nd63cca5b60d3 #Web制作 #SEO #AIO #GEO12 Jul 2026 09:06 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mqgt7oevdk2zhttps://bsky.app/profile/akirao.bsky.social/post/3mq42vrf5722sもうレスポンシブの文字サイズ調整で、JSやclampを使う必要はない？ Chrome 150から本格導入されたtext-fitプロパティだけで手軽に行えます。 text-fit: grow consistent; で、改行後もデザインを崩さずぴったり調整。 最新のレスポンシブWebデザインに便利に活用していきましょう。 詳しいコード解説は、以下の記事で公開しています。 ↓　↓　↓ 【CSS】JSもclamp()も不要に。文字サイズをコンテナ幅にフィットさせるtext-fitプロパティの使い方 https://blanche-toile.com/web/css-text-fit-property #CSS #デザイン08 Jul 2026 02:25 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mq42vrf5722shttps://bsky.app/profile/akirao.bsky.social/post/3mpvzjn4xyc2a日付またいで連続7コマ、3つのプログラミング言語と2つのアプリケーションを教えていた頃に比べれば楽なはずだが。 体力の衰えとは認めたくない05 Jul 2026 16:44 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mpvzjn4xyc2ahttps://bsky.app/profile/akirao.bsky.social/post/3mpvyy2fnmc23土曜日も講義があったので、疲れが取れないまま週明け。 水にポッカレモン入れてレモン水を作って飲む。 頼むよクエン酸。05 Jul 2026 16:34 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mpvyy2fnmc23https://bsky.app/profile/akirao.bsky.social/post/3mpiq57rerc2lChrome 150から本格導入されるtext-fitプロパティの使い方のご紹介。 CSSだけでコンテナ幅に文字サイズを自動フィットさせるHTMLバナー実装をサンプルに、clamp()の細かな計算やJSの監視が不要になる実装方法を解説します。 ↓　↓　↓ 【CSS】JSもclamp()も不要に。文字サイズをコンテナ幅にフィットさせるtext-fitプロパティの使い方 https://blanche-toile.com/web/css-text-fit-property #CSS #WebDesign #Webデザイン30 Jun 2026 09:51 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mpiq57rerc2lhttps://bsky.app/profile/akirao.bsky.social/post/3mpfu3a5rvs2uグランパスのユニフォームカッコいい。 仕事頑張ろ！29 Jun 2026 06:24 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mpfu3a5rvs2uhttps://bsky.app/profile/akirao.bsky.social/post/3mowylumv422bグランパスの若手はミシャの指導のもと成長するのもありだが、出場機会や試合感、レンタル先での指導を期待して送り出しているのか。 でもちょっぴり寂しいところはある。23 Jun 2026 08:35 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mowylumv422bhttps://bsky.app/profile/akirao.bsky.social/post/3momvxpuvs22d通常の検索でもAI要約が優先される今、参照元に選ばれないサイトは、これまで制作にかかった時間と費用、さらに月額のサーバー代とドメイン代をドブに捨てているのと同じです。 dlタグやSchema.orgだけでは足りない、AI検索時代に必要なマークアップの重要なポイントについてまとめました。 ↓　↓　↓ 【Webサイトが生成AIに引用されるための構造化。検索エンジンに情報源として認識される重要なHTMLタグ】 https://note.com/akira_ao/n/n32084bb90ef6 #Web制作 #SEO #AIO #GEO19 Jun 2026 08:21 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3momvxpuvs22dhttps://bsky.app/profile/akirao.bsky.social/post/3mofgizblc227趣味の一つとして、 読書（論文） という、ちょっとカッコつけた趣味を付け加える！16 Jun 2026 08:56 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mofgizblc227https://bsky.app/profile/akirao.bsky.social/post/3mnr4m4zgkc2r【WordPress 7.0以降】JS（React）不要！PHPのみでカスタムブロックを作成する方法 https://blanche-toile.com/web/wordpress-php-custom-block #WordPress #CustomBlock #PHP08 Jun 2026 07:05 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mnr4m4zgkc2rhttps://bsky.app/profile/akirao.bsky.social/post/3mnko34ahsk2qいくつかの講義の課題のタイミングがかぶると、130名ほどの学生の課題を採点することになる。 半日かかったよ。 PythonやJavaのソースコードが夢にも出てきそうだ。 起きたら何かアプリが出来上がっているかもしれない。05 Jun 2026 17:29 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mnko34ahsk2qhttps://bsky.app/profile/akirao.bsky.social/post/3mneqj4qrs226note質問箱を開設しました。 note.com/qa/akira_ao #note https://note.com/qa/akira_ao03 Jun 2026 08:57 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mneqj4qrs226https://bsky.app/profile/akirao.bsky.social/post/3mn7xdlstak2d「分かったつもり」になっているかも。 AIに答えを急がせる多くの現代人は、脳の思考体力は確実に衰えています。 私自身、普段から学生たちに強くおすすめしている、科学的根拠に基づいた『あえて脳に負荷をかける学習法』をまとめました。 ↓　↓　↓ その「分かったつもり」が危ない。AI時代の長期記憶をつくる『望ましい困難』の実践法 https://note.com/akira_ao/n/n3ada96497581 #生成AI #学習法 #AI活用01 Jun 2026 11:16 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mn7xdlstak2dhttps://bsky.app/profile/akirao.bsky.social/post/3mmgno6sqic23JavaScriptなし！CSSだけでランダム処理が可能に！？ 最新のCSS random() 関数を使えば、カードデザインや、clip-path を使ったランダム変形シェイプと、ランダム処理がCSSだけで実装することができます。 実装のサンプルコードや解説は、以下の記事でご紹介しています。 ↓　↓　↓ CSSのみでランダム処理が可能に！CSSのrandom()関数の使い方 https://blanche-toile.com/web/css-random-function #CSS #Design #WebDesign #Webデザイン22 May 2026 09:46 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mmgno6sqic23https://bsky.app/profile/akirao.bsky.social/post/3mmgamkov4c24WordPress 7.0への更新メンテナンスを徐々に進める。 WordPress 7.0では、PHP7.2/7.3のサポートが終了するので、PHP7.4以降が必要になります。22 May 2026 05:53 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mmgamkov4c24https://bsky.app/profile/akirao.bsky.social/post/3mlnvdyje3c2dCSSの新機能 at-rule() 関数。アットルールの対応状況を @supports で判定できるようになります。 最新機能を安全に使い分けるための方法として、覚えておくとよさそうです。 ↓ ↓　↓ 【CSSのat-rule()関数の使い方｜アットルールのサポート状況を判定して最新構文を使い分ける】 https://blanche-toile.com/web/css-at-rule-function #CSS #WebDesign12 May 2026 13:27 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mlnvdyje3c2dhttps://bsky.app/profile/akirao.bsky.social/post/3mlikvimzm22aAIエージェントの普及で、Webサイトが「人」だけでなく「AIエージェント」にも選ばれる時代に。 新しい設計標準『Agentic UX』についてまとめました。 ここで問題になるのは、生成AIに頼りきった制作体制になることです。AIに丸投げするような制作は、SEOだけでなくAIOやGEOの視点でも大損をすることになります。 制作者もクライアントも他人事ではない、これからのWeb制作の実務についてお話しします。 ↓ ↓ ↓ 【AI時代のWeb制作標準「Agentic UX」 ―― AIエージェント向けの設計と人間味の演出】 https://note.com/akira_ao/n/nf8513dfc813f10 May 2026 10:37 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mlikvimzm22ahttps://bsky.app/profile/akirao.bsky.social/post/3mkruzh7j2k2o教育機関で多くの学習者を見てきて実感したのは、「覚えようとするのをやめる」ことが、結局は一番の近道になるということです。 せっかくの貴重な学習時間を、ただの「暗記の繰り返し」で終わらせてしまうのはもったいない。 根性で詰め込むのをやめて、自分なりに「納得」して記憶のルートを作る。脳の仕組みに逆らわない、学びを楽にするコツをまとめました。 ↓　↓　↓ 暗記ではなく「理解」で記憶を定着させる。脳の性質に逆らわない、学びがもっと楽になる方法。 https://note.com/akira_ao/n/nb2556a47bbe3 #教育 #学習法01 May 2026 10:07 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mkruzh7j2k2ohttps://bsky.app/profile/akirao.bsky.social/post/3mk7tm7wqus2fPythonの仮想環境パスが.venvに統一される？　PEP 832が提案される https://atmarkit.itmedia.co.jp/ait/articles/2604/21/news007.html #Python24 Apr 2026 05:54 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mk7tm7wqus2fhttps://bsky.app/profile/akirao.bsky.social/post/3mk7o5di4g22qPythonのデータ分割をスマートに。itertools.batchedを使いこなそう https://blanche-toile.com/web/python-itertools-batched #Python #itertools #batched24 Apr 2026 04:16 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mk7o5di4g22qhttps://bsky.app/profile/akirao.bsky.social/post/3mk52lkujz22r大学の講義では、基礎だけでなく、直近で仕様が変更になった新しい情報も共有している。 おそらく、一般のクリエイターよりも私の学生の方が最新情報をもっているかもしれない。23 Apr 2026 03:20 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mk52lkujz22rhttps://bsky.app/profile/akirao.bsky.social/post/3mjj2c27eq22p仕事用のバッグに常備しているものたち。15 Apr 2026 04:22 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mjj2c27eq22phttps://bsky.app/profile/akirao.bsky.social/post/3mjh3nlndes2i2025年9月に危惧していた予測が、的中してしまいました。 海外ではAIエージェントの導入により、すでに「AI待ち」の人から居場所を失っています。 思考を止めた人から役割を失っていく、厳しい現実をまとめました。 ↓　↓　↓ 【生成AIの次に来るAIエージェント時代。思考を捨てた人たちが払う「空白」の代償】 https://note.com/akira_ao/n/nfb241f1f5841 #AI #働き方 #キャリア14 Apr 2026 09:41 +0000at://did:plc:hrmf2nq2igstdhimw3lpbiod/app.bsky.feed.post/3mjh3nlndes2i