週刊Webテク通信

2013年11月第3週号 1位は,レスポンシブWebデザインに関する素材や情報源のまとめ,気になるネタは,「Pinterest」日本語版サービス開始,カテゴリーを日本向けに拡充

この記事を読むのに必要な時間:およそ 2.5 分

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から,Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は,2013年11月11日~11月17日の間に見つけた記事のベスト5です。

1. Ultimate Resources to Responsive Designhttp://www.9kdesigns.com/resources/ultimate-resources-to-responsive-design

レスポンシブWebデザインに関する素材や情報源をまとめて紹介した記事です。

以下の項目に分けて多数のサイトが掲載されています。

  • CSSフレームワーク
  • プラグイン(JavaScript,WordPress)
  • レスポンシブなナビゲーション
  • レスポンシブな画像(スクリプトとテクニック)
  • レスポンシブデザイン用のツール

図1 レスポンシブWebデザインに関する素材や情報源のまとめ

図1 レスポンシブWebデザインに関する素材や情報源のまとめ

2. Contact Pages - Good vs Bad - The Usabilla Bloghttp://blog.usabilla.com/good-vs-bad-contact-pages/

問い合わせページの良い例と悪い例とを解説した記事です。

良い問い合わせページ
  • 人間味がある
  • 見やすい
  • 探しやすく使いやすい
  • 信頼できる
悪い問い合わせページ
  • 人間味がない
  • 混乱させられる
  • 信頼できない

悪い例として,有名企業のサイトが取り上げられていますね。

図1 問い合わせページの良い例と悪い例

図1 問い合わせページの良い例と悪い例

3. Best Online Resources for Learning Web Design & Development | WebDesignerHub.comhttp://www.webdesignerhub.com/best-online-resources-learning-web-design-development/

Webデザインや開発に関して学べるサイトを多数紹介しています。

チュートリアルやテクニックがまとまったサイトや,有料のオンライン学習サービスなどが掲載されていました。

図3 Webデザインに関して学べるサイトいろいろ

図3 Webデザインに関して学べるサイトいろいろ

4. 20 Web Designs with Subtle Grain Texture Backgroundshttp://line25.com/articles/20-web-designs-with-subtle-grain-texture-backgrounds

背景に布や紙のようなテクスチャを使ったWebデザインのギャラリーです。フラットデザインでは排除されるテクスチャ類ですが,フラットデザイン全盛の中では逆に目立つのかもしれません。

Subtle(わずかな)⁠Grainテクスチャということですが,Grainには(木材・石材・なめし皮・布などの)きめ,木目,石目などの意味があるようです。

図4 布や紙のようなテクスチャを使ったWebデザインのギャラリー

図4 布や紙のようなテクスチャを使ったWebデザインのギャラリー

5. Icons in web design - attention-getting, memorable and user-friendly | EntheosWebhttp://blog.entheosweb.com/ideas/web-design-ideas-using-icons

アイコンを使ったWebデザインのギャラリーです。

注目を集めやすい,記憶に残りやすい,操作がわかりやすいといったメリットがあると解説されています。

図5 アイコンを使ったWebデザインのギャラリー

図5 アイコンを使ったWebデザインのギャラリー

そのほか,最近の記事の中から,気になるニュース記事を3つ紹介します。

先週の気になるWebサービス

TweetDeck by Twitter - TweetDeckhttp://tweetdeck.com/

ツイッターが公式のツイートまとめ機能を発表しましたが,その「Custom timelines」はTweetDeckの機能として提供されています。ということで,今回はTweetDeckのCustom timelines機能を紹介します。

TweetDeckはMac/Windowsのデスクトップアプリとしても提供されていますが,今回紹介するのはWebサービス版です。左メニューの下の方にあるCustom timelinesボタンを押すと一列カラムが増えて,そこにツイートを追加できます。

ツイートはドラッグ&ドロップで追加していけます。しかし,追加した後での並べ替えはできず,常に最後に追加したものが一番上に来る仕様のようです。検索結果からドラッグすることもできないので,検索結果を「Add Column」でカラムに追加してから必要なツイートを登録する必要があります。

Custom timelinesをちょっと使ってみた感じでは,TogetterやNAVERまとめ,storifyなどに比べると機能は少ないようです。しかし,公式ツールという安心感もありますし,今後の機能強化に期待したいと思います。

図6 ツイートをまとめるCustom timelines機能が追加されたTweetDeck

図6 ツイートをまとめるCustom timelines機能が追加されたTweetDeck

今週の気になるWebネタ

「Pinterest」日本語版サービス開始,カテゴリーを日本向けに拡充 -INTERNET Watchhttp://internet.watch.impress.co.jp/docs/news/20131112_623124.html

Pinterestがついに日本語化され,日本語による検索もできるようになりました。2012年5月に楽天が出資してから随分経ちましたが,楽天とは関係なく日本法人がスタートしたようです。

日本語化されてなくても十分使えるサービスでしたが,これで万人に勧められるようになりました。検索やカテゴリが日本語化されたので,初心者も使いやすくなったはずです。

しかし,日本語化により日本のユーザー同士でばかり交流するようになってしまうのが予想されるのが,ちょっと残念です。説明文やボード名に英語を使っていると,見ず知らずの海外の人にリピンされたり,同じ名前のボードを作っている海外の人にフォローされたりすることが結構あります。そんな色んな国の人と交流気分が味わえるところがPinterestの面白さの一つだと思うので,Pinterestを人に勧める場合はその辺のことも伝えて行けたらいいなと考えています。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/

コメント

コメントの記入