ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2015年6月15日～6月21日の間に見つけた記事のベスト5です。

1. A Practical Guide to SVGs on the webhttps://svgontheweb.com/

SVGファイルをWebで利用するための実践的なガイドです。SVGを使う上で気をつける点やテクニックなどをサンプルとともに解説しています。

Webページ上に表示するためのObjectタグ、Inlineタグなどの指定方法や比較、色を付けたりアニメーションさせる効果などが紹介されていました。

2. 3 essential rules for effective navigation design | Webdesigner Depothttp://www.webdesignerdepot.com/2015/06/3-essential-rules-for-effective-navigation-design/

効果的なナビゲーションデザインのための3つのルールを紹介しています。

1. 情報アーキテクチャーを最初に完成させる
2. シンプルさを保つ（時によっては）
3. 注意深く方向性を決める

2つ目の項目では、一見シンプルに見えて深い項目にまでたどり着けるような情報アーキテクチャの設計が必要ということが解説されています。シンプルさが重要というのは共通認識ですが、必ずしも常にそれだけではないということですね。一見シンプルな4項目のメニューながら、メガメニューになっていて深い階層まで選べるマイクロソフトのサイトが例として取り上げられていました。

3. A Detailed Guide To WordPress Custom Page Templateshttp://www.smashingmagazine.com/2015/06/19/wordpress-custom-page-templates/

WordPressでの固定ページ用テンプレートについて詳しく解説した記事です。

固定ページ用テンプレートの活用法として5つのアイデアが載っていました。

1. 横幅一杯まで使った1カラムのテンプレート
2. ダイナミックな404エラーページ
3. カスタム投稿タイプ用のテンプレート
4. プロフィール写真付きの投稿者ページ
5. カスタマイズされたアーカイブページ

4. Useful Flexbox Technique: Alignment Shifting Wrapping | CSS-Trickshttps://css-tricks.com/useful-flexbox-technique-alignment-shifting-wrapping/

CSSのFlexboxを使ったテクニックのサンプルです。

見出し＆小見出しを横に並べて小見出しは右添えにし、ウィンドウサイズが小さいときには2行で並ぶようにしています。メディアクエリを使わずに、Flexboxのテクニックで実現しているのがポイントですね。

5. 15 Websites that Use Typography Correctlyhttp://www.1stwebdesigner.com/15-websites-that-use-typography-correctly/

タイポグラフィを正しく使ったWebサイトを15個紹介した記事です。

各サイトで利用されているフォントについての説明のあと、MyFontsサイトのフォントページへのリンクも用意されています。

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

• 写真素材サービスAdobe Stockも：Bootstrap、Emmet、レスポンシブWebデザイン対応を強化したDreamweaver CC 2015を使ってみた (1/2) - ＠IT
  DreamweaverがBootstrap、Emmetに対応したそうです
• 違法BGM利用店舗は46万件：「合法的に店で音楽を流せる⁠」⁠ USENとレコチョクがiPad向けに店舗用BGM配信アプリ「OTORAKU」を提供 - ITmedia LifeStyle
  月額3780円で合法的に店舗でBGMを流せるとのこと
• 7月に出荷開始：「新しいMacBook」で使える“⁠Type-C⁠”対応USBメモリがサンディスクから登場 - ITmedia PC USER
  USB Type-C端子とUSB 3.0 Type-A端子を切り替えて使えます

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

4 Greatest Online Collaboration and Project Management Toolshttp://smallbiztrends.com/2015/06/online-collaboration-and-project-management-tools.html

今回はオンラインのコラボレーションとプロジェクトマネージメントのためのWebサービスを4つ取り上げた記事を紹介します。Basecamp以外は知らないサービスでしたが、どれも有名なもののようです。

Redboothはチームでプロジェクトマネージメントをするためのツールで、チャットやファイルの共有をはじめ、スケジュールやタスク管理ができます。多くの言語に対応しており、日本語も対応言語に含まれています。

Huddleはセキュアなファイルの共有を実現するコラボレーションツールです。10万以上の企業や180以上の政府機関で使われており、アメリカ政府、イギリス政府でも使われているとのことでした。