Change Log

ここにはこのブログの変更点などを記載していきます。

d231030v1100

2023年10月30日

「コメント一覧」ページの新規作成とアクセシビリティ関連の改良、ページ読み込み速度を向上させるアップデートを実施しました。

コメント一覧ページの新規開発
- コメントの一覧性向上を目的とした新しいページです。
  - 「コメント一覧」ページではお寄せいただいたコメントをページの枠組みを超えて閲覧できます。
アクセシビリティ関連の改良
- 商品紹介用ブロックのボタンの色や形を改良し、コントラストの高いデザインに変更しました。
PCでの閲覧時の快適性向上
- ページ遷移時のコンテンツの動きを抑えました。
- 試験的な記述順序切替の検証終了(戻しました) (v094)
- あたらしい記述順序の切替 (v094)
- ページ遷移時のアニメーションを復元
ページ読み込み時の負荷軽減
- CSSの記述を改善し、よりシンプルな記述に変更しました。 (v094)
- 不要な予約部分を削除 (v094)
- 「パンくずリスト」の改善(CSS) (v094)
- 「パンくずリスト」の改善(HTML) (v100)
- アバター読み込みロジックの一新 (v100)
  - 「コメント一覧」ページに対応しました。
  - エッジケースにも対応できるようにロジックを変更しました。

「コメント一覧」ページ

▼ 「コメント一覧」ページのデザイン

「コメント一覧」ページへはサイドバーの「最近のコメント」にある「すべてのコメントへ」ボタンからアクセスいただけます。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231025v1093

2023年10月28日

PC閲覧時の快適性を向上させるアップデートを行いました。

PCでの閲覧時の快適性向上
- ページ遷移時のコンテンツの動きを抑えました。
- 試験的な記述順序切替

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231022v1092

2023年10月22日

PC閲覧時の快適性を向上させるアップデートを行いました。

PCでの閲覧時の快適性向上
- ページ遷移時のアニメーションを削除しました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231021v1091

2023年10月21日

PC閲覧時の快適性を向上させるアップデートを行いました。

PCでの閲覧時の快適性向上
- ページ遷移時のアニメーションをより最適化し試験的に復活しました。
- 広告挿入時の挙動を改善しました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231020v1090

2023年10月20日

構造化データに関する追加の対応、アバター画像配信サイズの見直し、スマートフォンでの閲覧時の快適性を向上させるアップデートを行いました。

構造化データに関する追加の対応
- 各記事の情報を機械にも理解しやすいように配慮しました。
- かぼしーの表示名を変更しました。
アバター画像配信サイズの見直し
- 画像サイズを小さくし、通信コストを削減しました。
アクセスランキングのクラス追加とスタイルに関する処理を変更
- 不足していたクラスを追加し、レンダリング時の負荷を軽減しました。(kpp-d231020v1019)
スマートフォンでの閲覧時の快適性向上
- ページ遷移時のアニメーションをより最適化し復活しました。
- ページ上部に表示されるサイト名サイズの見直し

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231020v1089

2023年10月20日

スタイリング時の負荷軽減と簡略化、各記事ページでの各画像の配信サイズを見直し、通信コストを削減、閲覧時の快適性を向上しました。

スタイリング時の負荷軽減と簡略化
- 不足していたクラス指定を追加し、レンダリング時の負荷を軽減しました。
- クラス指定を簡略化しました。
各記事ページでの各画像の配信サイズを見直し
- 関連記事や前後のサムネイルサイズを見直しました。
閲覧時の快適性を向上
- スマホ閲覧時に英文が改行されず枠から飛び出してしまうエラーを解決

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231018v1088

2023年10月18日

エクスターナルなフォントの配信方法の変更とフォントの見直し、パフォーマンスを向上させる大型のアップデートを行いました。

エクスターナルなフォントの配信方法の変更とフォントの見直し
- サーバで配信していた外部フォントを停止し、Google Fontsを利用するように変更しました。
- 使用するウェイトを変更しました。
モバイルでの閲覧時の快適性向上
- サイト名と、各投稿ページのタイトルのサイズがデバイスごとに最適化されるように変更しました。
パフォーマンスの改善
- キャッシュの設定を見直しました。
- サイドバーの「アクセスランキング」で行われる処理を最適化し、ページの読み込み速度を改善しました。(kpp-d231018v1018 21600>0)
- フッターに表示されているアイコンのデフォルトサイズを指定しました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231017v1087

2023年10月17日

画像読み込み処理の変更とパフォーマンスを向上させる大型のアップデートを行いました。

各投稿ページ以外のページでサイドバーの「最近のコメント」で意図しないアバター画像が表示されるトラブルを改善
パフォーマンスの改善
- サイドバーの「アクセスランキング」で行われる処理を最適化し、ページの読み込み速度を改善しました。(kpp-d231017v1017:EL)
- コンテンツを一定期間キャッシュし、応答速度と表示速度を向上させました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231017v1086

2023年10月17日

CSSの最適化とパフォーマンスを改善するアップデートを実施しました。

CSSの最適化
- 不要なコードの除去と統合
パフォーマンスの改善
- ページ読み込み時のアニメーションを削除しました。
不要なファイルを除去しました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231016v1085

2023年10月16日

アクセスランキングのアップグレードとアクセシビリティを改善するアップデートを実施しました。

視認性の改善
- 各記事ページ下部に表示されるタグの色を見直し、背景色とのコントラストを上げました。
サイドバーの「アクセスランキング」をアップグレード
- 各ページに表示される「アクセスランキング」の集計方法と表示ロジックを変更しました。
  - 前回のアップデートと同様に一定時間のキャッシュ
  - アクセスの集計を5日間に変更
  - オンカーソル時のフィードバックを改善
  - スタイルシートのモダン化
  - 表示する個数の変更(7件から10件)

新旧の比較

▼ 左、改善後、右、改善前。より「今」に焦点を当てた設計に。
タイトルの文字の太さも変更しました。

▼ オンカーソル時の挙動。共に上から2番目にカーソルを当てています。改善版では若干ですがテキストの色を変更し、感覚的にカーソルが当たっていることを意識しやすくなりました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231015v1084

2023年10月15日

トップページとアーカイブページでアイキャッチ画像が表示されないエラーの解決、サイトのアクセシビリティを改善するアップデートを実施しました。

トップページとアーカイブページでアイキャッチ画像が表示されないエラーの解決
- 前回のアップデートによりトップページ、アーカイブページのアイキャッチ画像が表示されなくなるトラブルが発生しました。このアップデートではそれを修正しました。
アクセシビリティの改善
- トップページとアーカイブページの不要なタグの削除
  - 前回のアップデートによる過剰な表現を修正しました。
- 視認性の改善
  - トップページ、アーカイブページ、各記事ページに使用されている色を変更し、背景色とのコントラストを上げました。
  - 各記事ページの記事中のリンク(Anchor)の表現を変更し、リンクであることをよりはっきり認識できるようになりました。
オンマウス時のフィードバックとその他の改善
- サイドバーにある「タグ」、「最近のコメント」、「おんかぼの最新記事」に関して、リンクの上にマウスカーソルが乗った際には、文字色の変更やそれに加えて下線を表示するように変更しました。
- 「カレンダー」の前後の月の文字サイズとカレンダーとの間隔を調節しました。
- ページ遷移時のアニメーション短縮

新旧の比較

▼ 上、改善後、下、改善前。色のトーンを下げて、背景色とのコントラストを上げました。
また、リンクには下線を引き、リンクだということが分かりやすくなりました。

▼ ダークモードの場合

▼ オンカーソル時の挙動。オンカーソル時の文字色が明るすぎた問題を解決しました。
また、下線をオンカーソル時にはやや強く設定し、リンクが選択されていることを分かりやすくしました。

▼ ダークモードの場合。色の統一感を演出しました。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231014v1080

2023年10月14日

サイトのパフォーマンスとアクセシビリティを改善するアップデートを実施しました。

サイトの閲覧性向上(パフォーマンスの強化)
- トップページ、アーカイブページ、各記事ページの応答速度を向上させる変更を加えました。
- 各記事ページにおける「関連記事」の取得方法の変更
  - 関連記事の取得方法を改良し、より高速な方法に変更しました。
- 「人気記事」ブロックにおける改善
  - コンテンツをキャッシュし、より快適な閲覧環境を構築しました。
アクセシビリティ関連の改善
- トップページ、アーカイブページ、各記事ページを中心にアクセシビリティを改良しました。
  - スクリーンリーダに関する改良とよりセマンティックなコードに変更しました。

今回のアップデートでは主に読み上げに関する改善を行いました。
次回のアップデートでは配色に関する改善を行います。

弊ブログは今後もより快適なWebサイトを目指して改良を続けてまいります。

d231012v1079

2023年10月12日

可読性の向上とパフォーマンスにおける緊急対応を行いました。
サイドバーの文字サイズを調節しました。
Cumulative Layout Shift (CLS)の問題が発生していたため、不要なアニメーションを取り外しました。

サイドバーの文字サイズを調節
- サイドバーにある「あのかぼ！」の新着記事の文字サイズをやや大きくし、今までより読みやすくなりました。
Cumulative Layout Shift (CLS)の問題が発生していたため、不要なアニメーションを取り外しました。
- ページ上の視覚的な要素が読み込み時にどれだけ予期せずに動いてしまうかを示す指標であるCLSが高い傾向にあったため、サイト公開の初期ごろからあった負荷の高いアニメーションを取り外しました。

▼ 新旧の比較

サイドバーの文字サイズの調節は実験的なものです。
投稿日との間隔や行間はさらに検討し今後のアップデートで変更します。

弊ブログは今後も快適なWebサイトになるべく、改善を続けていきます。

d230828v1078

2023年08月28日

広告の配信処理とUI/UXの改善を行いました。

コメント欄をアップデートしました。
- アバター画像をやや大きくし、表示名をアバター画像の横に配置するように変更しました。
- コメント本文の文字サイズをやや大きくしました。
- コメントタイトルをh3からh2に変更しました。
- URLにホワイトリスト機能を搭載し、より安全なWebサーフィンを推進します。
- 返信ボタンの変更
- その他、UIの修正

▼ 新旧の比較

この変更は既存のコメントにも適用されます。

弊ブログは今後も快適なWebサイトになるべく、改善を続けていきます。

d221230v1074

2022年12月30日

広告の配信処理とUI/UXの改善を行いました。

UI/UXのアップデート
- サイドバーとコモンノーツボックスの各を落としました。
ブロックベースのウィジェットに対応しました。
- 既存のブロックを含む多数のウィジェットをブロックベースのウィジェットに変更しました。
広告の配信処理の改善
- 一部のユーザに対して迅速な画面遷移を実現しました。

▼ コモンノーツボックスやサイドバーの角を落とし、柔らかい雰囲気になりました。

▼ 「アクセスランキング」ウィジェットは文字サイズを見直し、メリハリのあるデザインになりました。

▼ 「カレンダー」ウィジェット、「検索」ウィジェットもブロックベースのウィジェットに乗り換え、位置も変更しました。

▼ 「カテゴリー一覧」ウィジェットもブロックベースのウィジェットに変更し、デザインも変更しました。また、「リンク集」ウィジェットを新設し、関連コンテンツへのアクセスが柔軟に行えるようになりました。

▼ 「タグクラウド」ウィジェットもブロックベースのウィジェットに乗り換えました。
また、デザインも見直し、従来のウィジェットよりもコンパクトな表示になりました。

▼ 「ライターについて」も同様にブロックベースのものに乗り換えました。
また、各種SNSやFeedlyへのリンクを掲載するようになりました。

▼ 「最近のコメント」ウィジェットも同様です。
デザインを見直し、より分かりやすいものになりました。

▼ 「おんかぼ」の最新ニュースを確認できるウィジェットです。
こちらもブロックベースのウィジェットになり、デザインもアップデートしました。

弊ブログは今後も快適なWebサイトになるべく、改善を続けていきます。

d220902v1073

2022年09月02日

機能追加とアクセシビリティの改善を行いました。

機能追加
- 記事を複数のページに分割できる「改ページ」機能を利用できるようにしました。
アクセシビリティ
- フッターのコピーライトの言語を「英語」として明示しました。
デザインアップデート
- ダークモードでの閲覧時、淡く表示される画像の色を調節しました。

▼ KabocyEmoではダークモードを使用してページを閲覧すると、画像が眩しくないようにグレースケールのフィルターを使用しています。
ただ、若干フィルターが強く効きすぎているように感じられましたので、30%から10%に変更しました。

改ページ機能は2022年09月02日以降公開分の記事から使用されます。

d220820v1072

2022年08月20日

記事本文中に「補足」、「好事例」、「非推奨」、「警告」の4つのブロックを設定できる機能を追加しました。

機能追加
- 記事本文中に補足的な内容を追加できるように機能を追加しました。

補足的な内容が本文と混じることなく分かりやすくなりました。 (左が従来、右が変更後)

2022年08月21日公開以降の記事にこの機能が積極的に活用されていきます。
古い記事に関しても、順次使用予定です。

d220429v1071

2022年04月29日

2022年初から2022年4月29日までの軽微な累積的な更新です。

RSSの配信を開始しました。
- https://blog.kabocy.com/feed/
パスワード保護記事が記事一覧に表示される事象を修正しました。
タグ出力に関する処理を変更しました。

d211213v1070

2022年12月13日

ページ表示速度の改善のためのアップデートを行いました。
- 記事一覧のサムネイルの記述を変更しました。

d211212v1069

2021年12月12日

ユーティリティ性能のアップデート
- 記事タイトルの下にSNSシェアボタンを追加しました。
ページデザインのアップデート
- 一部見出しの大きさを修正しました
  - h5を使用すると異様に文字が小さく表示されていたのを修正しました。
- 特定の設定で表を掲載した際の表示上の不具合を修正しました
  - ブラックテーマで閲覧すると特定の表デザインのみ文字が見づらくなる問題を修正しました。

各ブログ記事のタイトルの下にSNSシェアボタンを設置しました (左が従来、右が変更後)

ブラックテーマ時、特定の表デザインで文字色と背景色が近い色になっていた問題を修正(左が従来、右が変更後)

d210818v1068

2021年08月18日

ページデザインのアップデート
- ブログカードの幅を調節しました。
  - 記事中のブログカードの幅を記事の幅にフィットするよう変更しました。
- サイドバーのタグクラウドの効果の追加
  - タグホバー時、不透明度を下げるように変更を加えました。

d210801v1067

2021年08月01日

ページデザインのアップデート
- サイドバー
  - アクセスランキングを7位まで表示するように変更しました。
- 表
  - キャプションを中央ぞろえに変更しました。
新しい広告のテスト
- ご迷惑おかけして申し訳ありません。Google AdSense の承認を得られたため、現在新しい広告のテストを実施中です。ご意見などございましたら、どうぞお気軽にお問い合わせください。

d210715v1066

2021年07月15日

デザインアップデート
- 表のデザインが追加されました。
- 画像のキャプションを中央ぞろえにしました。
- 記事中のコードを示す部分の背景の角を丸めました。
- キーボード操作を示す部分のデザインを刷新しました。

キーボード操作の部分は角の丸い囲みを用意し、ソリッドなイメージを崩さずにわかりやすいデザインを実現しました。

d201218v1064

2020年12月18日

ページ読み込みの最適化
- JS
  - 不要な参照を削除しました。
- HTML
  - 不要なタグを削除しました。

d201217v1063

2020年12月17日

ページ読み込みの最適化
- CSS
  - 3つのCSSを統合しました
  - 読み込む順番などを調整いたしました。
  - フォントの処理を少しだけ変更しました。
- HTMLタグの追加
  - 軽微な修正を施しました。
その他デザインの変更点
- 試験機能の廃止
  - 特定の画面幅のデバイスでアイキャッチ画像にマウスカーソルを乗せると画像が大きくなる機能を廃止しました。

d201122v1062

2020年11月22日

機能バグの修復
- ブログ記事ページとその他のページで生じていたTwitter共有ボタンを押しても動作しない問題を解決しました。

d200520v1061

2020年5月20日

表示デバイスに合わせた表示
- ビューポートによる分岐(ブレイクポイント)にHiDPIを追加
  - 表示サイズが従来より8％小さく表示されます。
  - 画面幅を従来より最大2％大きく設定しました。
- HiDPI以上の場合
  - 画面幅を従来より200px大きく設定しました。
その他デザインの変更点
- アイキャッチの最大幅の設定を撤廃しました。
- サイドバーの単位を変更しました。

d200517v1060

2020年5月17日

文字デザインの変更
- タイトルの大きさを変更しました。
- 大見出し、中見出し、小見出しのサイズを変更しました。
- 文字間を広げました。
その他デザインの変更
- Code部分のデザインを変更しました。

d200510v1058

サイト軽量化のための更新
- トップページ記事一覧のアイキャッチ画像のサイズを1024pxから450pxに変更しました。
- アーカイブページのアイキャッチ画像のサイズを1024pxから450pxに変更しました。
- 検索ページのアイキャッチ画像のサイズを1024pxから450pxに変更しました。
- サイドバーのアイキャッチ画像のサイズをフルサイズから150pxに変更しました。