タグ別アーカイブ: レスポンシブ

新web site完成


ようやくアップしました。

実は1年前の春完成予定でしたが、
間に合わずにようやく完成。

2年かかりました。

実際には春夏秋と作ってません(笑)。

前回は3年前ですね。

pc版とスマホ版の2種類作っていて、
スマホ版をレスポンシブに変えた時。

あの時点でレスポンシブを自社で作ってる人って、
珍しいんじゃなかろうか。


今回は、

1. pc版とスマホ版を統合して、
レスポンシブで1本化

2. ドロワーメニューの導入

ここまでのシステムを1年前の冬に作成。

この冬に、

3. ページの作成

4. SSL対応化

ということで、
2月中旬にアップしました。



ナビゲーションが下にずれていき、
最終的には2列になるという、
レスポンシブじゃないじゃん!

リキッドタイプをメインにしていて、
レスポンシブは退化しています(笑)。

時間があればレスポンシブでがんばります。

しばらく静観。


ドロワーメニューは、
CSSで作りました。

隠されたチェックボタン方式ですね。

しかし問題があって、
ドロワーメニューから行って戻ると、
ドロワーが開いた状態のとこに戻るということ。

この直し方がわかりません。

でもドロワーメニュー使わなくてもよさそう。

しばらく静観。


レスポンシブが活躍するのは、
写真の入れ替えやflexの解除。

写真は2つ書き込んで、
幅によって1つ消しています。

最終的に2週間悩んだのが、
予約フォームへのリンクですね。

2月中旬にアップしてたのに未完成でした。

PCで見るとPC版予約フォーム、
スマホで見るとスマホ版予約フォームへ飛ぶようにするには?

予約フォームをレスポンシブで1本化しようかと思いましたがあきらめて、
幅が狭くなるとスマホ版に飛ぶようにしました。

ボタンを2つ作って、
1つ消すタイプにしようとしましたが、
ちょっと形が崩れるんですね。

ここから1週間崩れたまま。

そして思いついたのが、
ナビゲーション丸ごと2つ作る。

これが上手くいきました。

案外単純なものですが、
思いつきませんでした。

これを風呂に入ってるときに思いつくんですね。

これが温泉の効果です(笑)。