siha blog

WordPress

初めてのWordPressテーマ制作を振り返る。

2019/09/17

夏休み明けの集中授業内でWordPressのテーマ制作を行いました。
何を意識して制作を進めていったのか振り返ります。

デザイン

  • ブログとして一番大切だと感じた、「読みやすさ」を特に意識した。
  • ゆとりのある空白で窮屈さを無くす。
  • トップページは色で分け反復させることでコンテンツのまとまりを分かりやすく。
  • marginやpaddingの値をある程度統一することで全体的なバランスを良く。
  • 文字の大きさを細かく変えて、より必要な情報を直感的に探しやすいように。
  • トップページでは特に見てほしい主要なカテゴリーとなる二つを表示させるように。
  • #000や#FFFは使わないようにした。#FFFはまぶしいと感じたため。
  • サイドバーのカテゴリーは全員が必要としているわけではないので、hover時に全体が表示されるようにしましたが、現状カテゴリー名の一部だけが見え不恰好なので、修正の必要あり。

コーディング

デザインデータを元に仮にCSSがなくてもある程度見やすいアウトラインになるようにしたり、誰が見ても分かりやすいCSSを意識してデザインに修正を加えながらコーディングを進めました。

が、WordPress化するタイミングでWordPress側で設定されるclass名と被り不具合が発生し修正にかなり時間をかけてしまいました。次回からは気を付けていきたいです。

HTMLとCSSはある程度理解しデザインデータを元にマークアップ出来るようになりつつありますが、JavaScript(jQuery)への理解はまだまだなので、どちらも着実に学び続けて技術を高めていきたいです。

WordPress化

MAMPでローカルで作業できる状態にしたり、WordPressをインストールしたり、テンプレートタグの追加や記事のループなど、環境構築を始め新しく覚えることが多く不安でしたが検索したり質問したりしてなんとか形に出来ました。
WordPress側で設定されるclass名との兼ね合いなど、戸惑うことも多かったですが、修正を重ねて少しずつ形になっていくのは楽しめた。

一通り終えた所感

一人でデザインからWordPress化までやるとなるとかなり大変ですが、デザインを柔軟に修正していける点は楽だった。
WordPressを想定した局所的なデザインの設定や、cssでのclass名の付け方など、細かい配慮が最終的な完成度や効率の良い制作に繋がる気がします。

今後の就職に向けて、また働き始めた後を見据えて、今後もweb制作に関する技術を高めていければと思います。

share

Profile

siha

web制作について勉強中の学生。