グローバルサイトをつくるCGI（4）
iOS、Androidなどのスマートフォンへの対応と管理画面の調整。
各種スマートフォンに完全対応
ソーシャル関連の設定
いやぁ今日は日曜日ですね。いつもの日曜日ですね。ということでスマートフォンに対応。対応と書くのもおこがましいですが、最初からスマートフォンできれいに表示できるようにHTMLを組んでおいたので、スマートフォン用のHTMLを起こしたりはしてません。CSSを切り替えてるだけ。これこそが本来あるべき姿のスマートフォン対応だよね！！
グローバルサイトをつくる管理画面 ※パスワードはwada123
スマートフォンに対応したグローバルサイト
あとは管理画面。動かないけど見た目を調整して、設定項目を整理してみました。
スマートフォン対応
スマートフォン対応は前述の通りHTMLを変更する事なくCSSのmediaだけで対応しています。読み込むCSSを分岐させるのも面倒だったのでPCのCSSを上書きする形での実装ですね。手抜き全開。文字がとても大きくてすごく見やすいです。iPadではviewport指定のみでPC版と同じ表示。これが一番美しいから。
ソーシャル関連の設定
こうやって改めてソーシャル関連の設定を見なおしてみるとFacebookが超うざいという事実。昨今のFacebookはIPOを意識してるせいか、方向性にまとまりがないんだよなぁ。簡潔に言うなら美しくない。でもまあぁ時流だしね。グローバルサイトなのでmixiやはてなは抜き。かわりにLinkedInを入れてみた。Google Plusははやくガジェットを用意して頂きたいところだ。ハングアウトに期待大。
ページの並び替え
これはすごく悩んだ。数値入れてソートさせる方がいろんな意味で手っ取り早いんだけど、ドラッグ＆ドロップでソートは一度やってみたかったので、並び替えは別ペインにしてしまいました。まぁ高頻度で並び替える事も無いだろうし、これはこれでよかったかな。jqueryのライブラリを使いました。
ファイル・画像関連
最初はドラッグ＆ドロップAPIを使ってブラウザにドロップでアップロードにしてIEを殺そうと考えていましたが、ドラッグ＆ドロップAPIの恩恵ってそういう部分じゃないんだよなぁ。複数ファイルのアップロードであれば、それもアリだけど単発であればファイル選択ダイアログで十分かなと。でもdefaultのファイル選択ボタンはダッサイのでちゃんと画像ボタンにしてます。
ということであらかたできてきた。
ドラッグ＆ドロップで並び替え
ファイル・画像関連の設定
和田憲幸の広告
- BTOパソコン
- www.pc-take.com自作PCやBTOパソコンの事ならシューマイが美味しい神奈川県は横浜のPC-takeにお任せください。
- 事業再生のSTP
- www.s-tp.jp経営が苦しい、そんなときはSTPに経営相談や経営コンサルティングをご依頼ください。
- ドライフラワー卸売り
- www.coretrading.co.jpドライフラワーやプリザーブドフラワーの業務用卸売りならコアトレーディング。
- 通話録音装置 ネイクス
- www.neix.co.jp通話録音装置や通話録音システムのことならネイクス。
- インプラント 東淀川区上新庄
- www.higashi.ne.jp東淀川区上新庄でインプラントや矯正歯科ならひがし歯科で決まり！
- 吉野川 ラフティング
- www.safari-g.com四国は吉野川でラフティングやハイドロスピード、キャニオニングと言えばサファリだよね。
- ホームページ制作 アルバイト
- next-level.bizホームページ制作、Webデザイナーのアルバイト、SOHOのことはネクストレベルまでご相談ください。
- 札幌 美容室 アイウィル
- www.aiwill.jp札幌市中央区で美容師をお探しの際はアイウィルまでお越しください。
- WEBLOGS6.1.0
- www.synck.jpこのブログはシンクテクニカのウェブログでつくられています
- 札幌 ホームページ制作
- www.synck.com札幌でホームページ制作やWebアプリケーション制作ならシンクグラフィカへ。
- iPhoneで内線電話
- www.smartgate.biziPhoneやAndroidから内線電話が無料でかけれる。
- 新潟リフォーム
- www.neohouse.jp新潟で注文住宅とリフォームはネオハウス。
