kamenokoki.com

【168日目】自作ブログ投稿フォーム:投稿フォームのスタイルを修正

Posted:  Last Update:

「記事の投稿ページを作成する」プロジェクト。基本的なフォームの形ができ、本文も部分的に呼び出せるようになったのですが、操作性が低いので、今日は少し見た目について研究してみたいと思います。

ここまでの成果

前回の作業から少し間が開いてしまいましたね…。

今手打ちでタグとかも書いている入力を、フォームで簡単にできるようにするのが目標。一大プロジェクト「記事の投稿ページを作成する」!今のところできているのは次の4つです。

  1. フォームのデザインを整えた
  2. ページ左側のMenuからサイトを選ぶと、真ん中に記事一覧ページを表示させられるようになった
  3. 記事のクリックで編集ページに遷移できるようになった
  4. 編集ページに記事の一部を表示できるようになった

2月10日の作業が最後でした。そのときは、既存記事の小見出しと本文の一部を表示できるようになっていました。こんな感じです。

本文の見出しとパラグラフを同時に読み込む

直感的な見た目にしたい

ここまで読み込みなどは順調ですが、問題は小見出しの大きさなどが一定で、何を編集しているのかよくわからない点ですね…。

少しデザインに修正を加えていきたいと思います。

…ちょっと間があいてしまったので、今まで何をしてきたのか忘れてしまいました(笑)

うーーん。とりあえず、見だしの部分を左側にもってきてみましょうか。こんな感じにしてみました。分かりにくさは変わらないですね…。

直感的な見た目にしたい-1

小見出しを、階層ごとに大きさを変えてみるとか、どうでしょうね?

変更してみまみしたが、…変わらない!

直感的な見た目にしたい-2

デザインを研究してみる

ちょっとよくわからなくなってきたので、WordPressの画面(ネット上に出ている画像)などをみて研究して見たいと思います。

どうやら、最終的なブログ画面とよく似た画面にしているみたいですね。今の状態とは大きく変えた方がいいみたい。小見出しには見だしをつけずに、デザインで「ここが小見出しですよ~」とよく分かるようにするのがいいみたいです。要するに、デザインの変更が必要!

本文のパラグラフの表示は問題がないように思えるので、大きく変更が必要なのは小見出しのデザインかな…?

今日はここまで

あまり何もしないうちに時間が来てしまいました。少しブランクがあったので、何をしていたのか思い出すのに時間がかかってしまったのもあります…。

なんとなく操作性の高いデザインがどんなものか分かったので、明日はデザインの変更の作業をしていきます!

では、また明日!

記事をシェアする

亀の子に連絡

ランキング参加中!ぽちっとしてね

F2cランキングアイコン 人気ブログランキング ブログランキング・にほんブログ村へ

広告