自分のHPをデザインするに際し、保有する全てのデバイスで通用する様 レスポンシブデザインを取り入れる事とした。
対象とするデバイスは以下の通りとなる。

  • Windows PC
  • iPad(タブレット)
  • iPhone(スマートフォン)

また、対象とするブラウザは以下の通り

  • Edge(Windows,iOS)
  • Chrome(Windows, タブレット、スマートフォン)
  • Safari(タブレット、スマートフォン)

IEはサポート切れに伴い対象外とした。
このことにより、CSS Grid等、ほぼ最新のCSS技術が使用できる事になる。
従前はIEも対象にしていたことから、最大公約数を用いて記述を行っていたが、 今回は、IE対象外に伴い見直しを行っている。

基本的なレイアウトは、2カラムレイアウトと、ハンバーグメニューの組み合わせで 行う様組みたてを行った。
実装に際しては、PHP/JavaScriptのみを採用し、JQueryや他のワークフレームは採用していない。