PREMIUM
第1回
Sublimeで書く簡単レスポンシブwebページ制作
2014年2月8日 90min
スライド資料
授業の概要
チャプター
-
自己紹介＆アジェンダ
00:38 -
レスポンシブデザインとは何か？
02:59 -
schooのサイトをスマホで見てみる
02:54 -
スマートフォン向け検索ランキング変更って？
02:05 -
PCとスマートフォンの画面の違い
04:15 -
スマートフォンの解像度は機種によってどのくらい違うのか
01:16 -
レスポンシブデザインのキーワード一覧
00:40 -
「ビューポート」とは？(CSSへの組み込み方)
04:04 -
「フルードイメージ」とは？(CSSへの組み込み方)
01:10 -
「フルードグリッド」とは？(CSSへの組み込み方)
04:00 -
フルードグリッドを実装する導入におすすめ、便利なフレームワーク
03:39 -
レスポンシブデザインにおいて最も重要な機能「メディアクエリー」とは？
05:04 -
スマホ用のCSSで気をつけること
04:51 -
mobilizerを使ってレスポンシブデザインを作る方法
03:30 -
DLしたファイルの中身の解説
02:02 -
style.cssを開き、内容を確認する
04:01 -
全選択してコピーしたものをペーストする
04:28 -
ブラウザで確認してみる
03:53 -
スマホ、タブレット、PC用のcssを用意する
01:41 -
sublimeでindex.htmlを開く
04:57 -
html5shiv.jsとrespond.jsって？
04:39 -
レスポンシブデザイン例
00:01 -
レスポンシブデザインを作るのに便利なサイトまとめ
03:36
-
Q：ブレイクポイント毎に文字サイズの調整は必要？
03:44 -
Q：SEOとしてどうするのが、最適なのでしょうか？
02:45 -
Q：レスポンシブ対応サイトはPCサイトに比べて、制作料金はどれ位増しで請求していますか？
02:20 -
Q：@media only screen and (min-width:769px) { @import
01:20 -
Q：スマホでは見せたくないコンテンツは、どのように隠せばいいのでしょうか？
02:00 -
Q：display:none; を書いても画像はリクエストされたりしないでしょうか？
02:17 -
Q：display:none; の場合、Googleから隠しコンテンツとしてペナルティを受けませんか？
03:00 -
課題発表