HTMLスマホ&PC両対応にはリキッドスタイルが最適

2016/02/23 07:23
こんばんは! Benです。 今週はいよいよ職場のスマホ対応WEBサイトへの更新です。色々神経を使いますが、スマホやタブレットとか画面解像度が異なる機器で一つのWEBコンテンツで表示させるレスポンシブ対応デザインを使っています。そのうえで大事な基本をノートします。 昔のホームページはこんな感じでtableタグを使ってレイアウトをしていることが多かったです。これは幅をパーセントで指定すると画面幅が変わってもレイアウトが崩れないのがいいのですが、それ..

続きを読む

WEBページでスマホは幅全体でPCは最適幅で

2016/02/19 07:29
おはようございます! 会社のWEBサイト刷新中のBenです。今日、1支社の担当者が作業期限を2週間過ぎて催促したら「何をすればいいのかわからない」とメールが 切替まで一週間なのに・・・ということで気を取り直してWEBサイトのスマホ対応の続きです。 IT勉強ノートbyフクロウ こんばんは! Benです。今日は風が強くて道を歩いていたら突風に飛ばされ、気が付くと東京にいました。風で飛ばされないようにいっぱいご飯を食べて体重を増や..

続きを読む

スマホ&パソコン両対応のWEBサイトを作ろう①

2016/02/15 22:51
こんばんは! Benでございます。最近連日残業ですが、そのほとんどが職場全体のWEBサイトの更新です。 現在のWEBサイトは5年くらいたつのでデザインも古いし、継ぎ足していくたびにコンテンツがコテコテに 素人の手作りっぽくて嫌だという意見がありつつ、プロに依頼する予算もない…ということでに白羽の矢が立ちました。今回の更新の最大の売りが「スマホ対応」です。それもコンテンツ作成が面倒でないように、一つのコンテンツ(HTML)を作るだけでパソコンもスマホも、タブレットも対応す..

続きを読む

レスポンシブメニューSmartMenusを実装しよう

2016/02/13 18:04
こんばんは! Benです。 職場のWEBサイトのリニューアル作業真っ最中ですが、その中でプライベートでも使うjQueryを用いたレスポンシブメニューの実装をノートしたいと思います。 今回使ったのはSmartMenusというものです。以前、Flexnavというものを実装していたのですが、動作確認段階で、ブラウザのウィンドウ幅を変えたりするとメニューの開閉がおかしくなる現象が確認されました。アニメーションがきれいでとても便利だったのですが、私用ならともかく組織のサ..

続きを読む

もっと見る