本ブログの大規模リニューアルを完了しました（第2弾）
本ブログが2019年2月10日付で、リニューアルの第2弾を実施しました。
本ブログの大規模リニューアル計画を変更しますの記事の通り、第2弾では、主にシステム面での機能強化・改善を行っています。
第2弾のポイント
リニューアルの第2弾における主な変更内容は、以下の通りです。
デザイン
- HTML
- <body>要素直下を<header>・<main>・<footer>の3要素に集約するよう、DOM構造を全体的に見直しています。
- HTML5の仕様に合致するよう、<nav>要素の適用箇所を変更しています。
- CSS
- Windows 10 October 2018 Updateに含まれる「BIZ UDPゴシック」フォントを利用可能としています。
- 画面の横幅が320pxのスマホにおいて、一部コンテンツのレイアウトが乱れる不具合を修正しています。
- 画面の横幅が640px前後のスマホにおいて、表示レイアウトが横1列になったり横2列になったりする不具合を修正しています。
- 表示レイアウトが横2列の場合、左右のコンテンツ間の余白が一定しない不具合を修正しています。
- <button>要素などにおいて、押下可能な状態から不可能な状態へと遷移する際のアニメーション表示を取り止めています。
- JavaScript
- 今後、CSS Variablesの取り扱いを可能とするため、専用関数を追加しています。なお、現時点ではCSS Variablesを使用していません。
- 表内の注目行列を強調表示する処理において、JavaScriptエラーが発生する場合がある不具合を修正しています。
システム
- CSS
- Internet Explorer 11において、相互リンク先の投資ブログへのリンクなどがクリックできない不具合を修正しています。
- JavaScript
- 画面サイズ変更時・画面スクロール時の処理負荷を軽減するため、読了率の算出ロジックを最適化しています。
- デバッグログの出力やGoogle Analyticsとの連携など、ログの一元管理を実現するため、専用関数を追加しています。
- Outbrainのレコメンド機能の状態を管理するため、MutationObserver()によるイベント検出を追加採用しています。
- DOM操作系の汎用関数として、任意の要素間に含まれるすべての要素を取得するための関数を追加しています。
- DOM操作系の汎用関数において、各関数の機能分割を見直しています。
- タイマー管理関数において、タイマー満了時のロジックに誤りがあった不具合を修正しています。
- ユーザー操作に伴うDOMイベントを一元管理するため、イベント毎に割り当てていた関数の一部を集約・統合しています。
- プライバシーポリシー未同意時と広告ブロッカー検出時の動作を共通化するため、関連機能の一部を集約・統合しています。
- 「ページトップ」リンクをクリックした際、URLにフラグメント（#top）が付与されないようにしています。
- XMLHttpRequestのレスポンスを受信した際、readystatechangeイベントのキャンセル処理が漏れていた不具合を修正しています。
- 広告表示やイベント管理など、コンテンツ処理時の負荷を軽減するため、広告管理関数の仕様を全体的に見直しています。
- コンテンツをコピーした際、テキスト形式・HTML形式の各データを整形する処理を大幅に強化しています。
山積している課題に1つずつ対処していきます
リニューアルの第2弾は完了しましたが、未だに無駄なコードや記述の重複が目立つことから、今後も断続的にシステム面の改善を進めます。
また、画面レイアウトに関する細かな問題を検出していることから、デザイン面の微調整にも並行して取り組んでいきたいと考えています。
読者の皆様におかれましても、本ブログの問題点や改善すべき点を見つけたり、あるいはリニューアルに関するご意見・ご感想などありましたら、どうぞお気軽にコメント・ご連絡くださいますようお願いします。
コメントを表示します