忍者ブログ

room 42

プロフィール

HN:
ゆ~たろ
HP:
性別:
男性

カレンダー

09 2026/10 11
日 月 火 水 木 金 土
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31

アーカイブ

バーコード

フリーエリア

サイト移転に伴うデザイン変更について

2018/01/12 20:07

新サーバーへのコンテンツ移動に伴い、ページのデザインを変更することを考えています。
主な変更点は以下の通り。
  • 画面上部にメニューバー表示
  • コンテンツのメニューを画面左側に表示

画面上部にメニューバー表示


メニューバーについてはページ毎に記述すると変更が大変なため、
一部フリゲ紹介ページでも行っているように外部ファイル(JavaScript)を呼び出して表示させます。
これによって、フリゲ関連講座→自作ゲームなどへの流入を促す。
ただし、現在のメニューだとサイズが大きすぎるため、少し縮小する予定。

問題はCSSの記述方法。
CSSも外部ファイルに記述した方がわかりやすいのですが、その為にはメニューバーの他に外部ファイルの読込を追加する必要が有り。
或いはメニューの外部ファイルにCSSを埋め込んでもいいのですが、それもあまり美しくない。

その他、既にメニューのある自作ゲーム紹介ページもどうするか未定。
縦並びのメニューのページならともかく、既に横並びのメニューがあるのに更に追加するのは見栄えが悪い……。
これらのページは出口ページになることが多いため、追加しなくてもいいかもしれない。

コンテンツのメニューを画面左側に表示

イメージとしてはギャラリーページのメニューに近い方式。
フリゲ関連講座の他、メニューのない自作ゲームページにも追加出来そう。


問題はスマホでの閲覧時。
画像はギャラリーページをスマホから閲覧したときのSSですが、
コンテンツよりも先にメニューが表示されてしまいます……。
確かにスマホの狭い画面でメニューを並べたらコンテンツの表示領域が狭くなりますが、
それでもこの配置はメニュー横の余白が広すぎて気持ち悪い。

PCとスマホで表示を変える方法もあるみたいですが、出来れば同じデザインで統一したい。
そもそも、横長のPC画面と縦長のスマホ画面で同じUIを使用すること自体無理があるのかもしれない。


HPの方も出来れば思い出してください。

拍手[0回]

PR

コメント

ブログ内検索

最新のコメント

[10/02 secondary math tuition]
[05/20 ま]
[04/23 ゆ~たろ]
[04/12 掲載拒否についてですが]
[04/11 ゆ~たろ]

最新TB

忍者アナライズ