週刊Webテク通信
2015年4月第5週号 1位は,レスポンシブデザインの3つの失敗とそれを防ぐ方法,気になるネタは,国内メーカーが「ガラケー」を生産終了へ,Android搭載「ガラホ」に集約
ネットで見かけたWebテク
1. 3 responsive design disasters (and how to avoid them) | Webdesigner Depothttp://www.webdesignerdepot.com/2015/04/3-responsive-design-disasters-and-how-to-avoid-them/
レスポンシブデザインの3つの失敗とそれを防ぐ方法をまとめた記事です。
- 水平メニューが改行されてしまう
- カテゴリ分けするなどして数を減らす。カテゴリを選んだときドロップダウンでサブカテゴリのメニューを出現させる
- ブレイクポイントを小さくしてギリギリまで改行しなくする
- デバイスによってスライドメニューなどの違ったメニューを用意する
- 固定幅の画像を使ってしまう
- 画像の横幅を可変するように設定する
- Bootstrapなどのフレームワークを使いレスポンシブイメージのクラスを適用する
- 要素のゆがみ
(デザイン上の優先順位などが変わってしまう) - 要素の高さ,
幅, 余白などを個別に調整する
- 要素の高さ,
2. We're Doing Responsive Web Wrong, But We Can Fix It | Social Media Todayhttp://www.socialmediatoday.com/marketing/2015-04-23/were-doing-responsive-web-wrong-we-can-fix-it
こちらの記事も,
- 通常使用する機能は指の届くエリアに配置する
- フォームの入力フィールド内にラベルテキストを入れるのは,
項目の少ないフォームの場合だけにする - ファイルの読み込みを制御して,
スマートフォン用には大きなファイルを読み込まないようにする - 何かを販売するサイトの場合,
不要なナビゲーションや目移りする要素を表示しない - テストして最適化することを繰り返す
スマートフォンの画面サイズが大きくなったことでレスポンシブWebデザインに問題が生じてきているが,
3. Wireframing, Prototyping, Mockuping ? What's the Difference?http://speckyboy.com/2015/04/20/wireframing-prototyping-mockuping-whats-the-difference/
ワイヤーフレームとプロトタイプとモックアップの違いについて解説した記事です。
- ワイヤーフレーム
- デザイン要素を簡素化して記述
- コミュニケーション,
資料のために使う
- プロトタイプ
- インタラクティビティ
- インタラクティブなユーザーテストとUIデザインの確認のために使う
- モックアップ
- 静的な視覚化,
ブランディング - 関係者からのデザインの了承を得るために使う
- 静的な視覚化,
以前も同じような記事を紹介しましたが,
4. 26 inspirational web design resources to boost your creativity | Econsultancyhttps://econsultancy.com/blog/66356-26-inspirational-web-design-resources-to-boost-your-creativity/
Webデザインの参考になる情報や素材などを掲載しているサイトを紹介しています。
Webサイトのデザインギャラリー,
5. CSS Puns & CSS Jokes ~ Curated by Saijo Georgehttp://saijogeorge.com/css-puns/
CSSのシャレやジョークの数々を楽しめます。CSSのジョークって何なのか想像がつかない人が多いと思うのですが,
CSSが分かる人なら,
そのほか,
- GoogleがGoogle Mapsのいたずら/悪ふざけ対策に着手…やはり人海作戦か | TechCrunch Japan
Googleマップに対するいたずらは世界的に流行っているようですね - ライブ動画の配信画面からチケット購入 ツイキャスがコマース事業に参入 - 週アスPLUS
ライブ配信を見るためのチケットではなく,リアルなライブなどの電子チケットが販売できるということでした - キングジム,
子どもの迷子防止アラーム 「デジタルまいごひも」 発売 - CNET Japan
荷物に付けて置き忘れ防止にも良さそうです
先週の気になるWebサービス
How to Center in CSShttp://howtocenterincss.com/
「How to Center in CSS」
CSSでやろうとするとひっかかることの多い,
Flexboxによる記述にも対応すると,
今週の気になるWebネタ
国内メーカーが「ガラケー」を生産終了へ,Android搭載「ガラホ」に集約 | アプリオhttp://appllio.com/20150424-6401-japan-maker-discontinued-garakei-phone
「ガラケー」
Webサイトやサービスを制作する側の視点だと,
使い勝手がいいからとガラケーを使い続ける人も多いようですが,
バックナンバー
週刊Webテク通信
- 2015年4月第5週号 1位は,レスポンシブデザインの3つの失敗とそれを防ぐ方法,気になるネタは,国内メーカーが「ガラケー」を生産終了へ,Android搭載「ガラホ」に集約
- 2015年4月第4週号 1位は,スタイルタイルでデザインを円滑に進める方法,気になるネタは,女子高生の間で不思議な透明画像「インスタインマイハンド」が流行中
- 2015年4月第3週号 1位は,フラットデザインとマテリアルデザインの違いと良い点・悪い点,気になるネタは,「OS X Yosemite 10.10.3」公開,新しい標準写真ソフト「写真」が登場!
- 2015年4月第2週号 1位は,WebサイトのA/Bテストを始めるためのヒント,気になるネタは,企業はエイプリルフールのジョークを作る(&発表する)べきでない
- 2015年4月第1週号 1位は,Webデザインのトレンドの有効性を考えるヒント,気になるネタは,子供の見守り「ドコッチサービス」4月4日開始
関連記事
- 2022年2月第1週号 1位は,UI/UXデザインのトレンドを16個紹介,気になるネタは,オーディオブック「Audible」,価格据え置きで聴き放題に--村上春樹作品も配信へ
- 2021年11月第3週号 1位は,2022年のWebデザインのトレンド22項目,YouTubeがすべての動画の「低く評価」数を非公開に
- 2021年9月第4週号 1位は,UIデザインにアイコンを使うときに守るべき10のルール,気になるネタは,音楽機器のズーム社,商標権侵害でWeb会議「Zoom」提供のNECグループ会社を提訴
- 2021年9月第1週号 1位は,効果的な会社概要ページをデザインするヒント,気になるネタは,Apple、iCloudでメール非公開とカスタムドメインを可能に
- 2021年7月第1週号 1位は,サインアップ/ログインのUXを良くするヒント,気になるネタは,「Chrome」のサードパーティークッキー廃止が2023年に延期