週刊Webテク通信

2015年1月第1週号 1位は,2014年のWebに関する予測の答え合わせ,気になるネタは,iPadをセカンドディスプレイ化したい人にはOne Designの「Mountie」がおすすめ

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

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

1. 10 Web Predictions for 2014: The Results!http://www.sitepoint.com/10-web-predictions-2014-results/

2014年1月にWebに関する予測を10個まとめており,その答え合わせをした記事です。

  1. スマートフォンの時代になる→当たり
  2. HTML5によるWebアプリが主流となる→外れ
  3. クライアントサイドのFlash,Silverlight,Javaは廃れる→当たり
  4. IE12がリリースされる→外れ
  5. ブラウザ市場はIEとChromeに支配される→半分当たり
  6. Operaの使用率が落ちる→外れ
  7. マイクロソフトはWindows RTをやめるか再定義する→当たり
  8. レスポンシブな画像のスタンダード技術は登場しない→半分当たり
  9. Webページの重さ(総ファイル容量)は変わらないか減る→外れ
  10. 機械がデータフィードを読み取る新しいインターネットの使われ方が広がる→半分当たり

今年の予測の記事も1月5日に公開されていました。

図1 2014年のWebに関する予測の答え合わせ

図1 2014年のWebに関する予測の答え合わせ

2. 25+ Best Free Css3 Shadow Effects Download -Designrazorhttp://www.designrazor.net/css3/best-free-css3-shadow-effects-download/

CSS3によるシャドウエフェクトのサンプルを多数紹介しています。

それほど目新しいものはありませんが,テキストシャドウとボックスシャドウについて,だいたい一通りのパターンはそろっていると思います。

図2 CSS3によるシャドウエフェクトのサンプルいろいろ

図2 CSS3によるシャドウエフェクトのサンプルいろいろ

3. New Free PSD Mockups (26 Mockup Designs) | Freebies | Graphic Design Junctionhttp://graphicdesignjunction.com/2015/01/download-free-psd-mockups/

PSD形式のモックアップ素材をまとめた記事です。

本,名刺,ポスターやスマートフォン,タブレットなど,手持ちの画像を合成して使える素材が多数紹介されています。

デジタルデバイスのモックアップPSD素材を20個紹介した20 Free PSD Electronics Mockups with Perfect Designsという記事もありました。

図3 PSD形式のモックアップ素材のまとめ

図3 PSD形式のモックアップ素材のまとめ

4. A deep dive into creating wordpress themes from scratchhttp://smashinghub.com/a-deep-dive-into-creating-wordpress-themes-from-scratch.htm

WordPressのテーマをゼロから作るためのヒントをまとめた記事です。

以下の3つの項目に分けて,テクニックやツールが紹介されています。

  • WordPressのセットアップ
  • テーマの開発
  • 最終テスト

図4 WordPressのテーマをゼロから作るためのヒント

図4 WordPressのテーマをゼロから作るためのヒント

5. Examples of Full-Screen Background Imageshttp://sixrevisions.com/web_design/full-screen-background-images-examples/

背景全面に画像が使われたWebデザインのギャラリーです。

実際にこういったページを作るためのCSSテクニックを紹介したResponsive Full Background Image Using CSSという記事も紹介されていました。

図5 背景全面に画像が使われたWebデザインのギャラリー

図5 背景全面に画像が使われたWebデザインのギャラリー

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

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

11 Bootstrap UI Editors For Developers | SmashingApps.comhttp://www.smashingapps.com/2015/01/02/11-bootstrap-ui-editors-for-developers.html

Bootstrapのレイアウトやデザインをカスタマイズするためのエディタをまとめた記事を紹介します。

Bootstrap用のカラースキームを画像を元に作るサービスや,Adobe kulerかCOLOURloversと連携して作るサービスもありました。

Bootsnipp.comは,Bootstrapで使えるHTML/CSS/JavaScriptのコード例が大量に集まっているサービスで,とても参考になりそうです。

図6 Bootstrapでのサイト制作に役立つエディタいろいろ

図6 Bootstrapでのサイト制作に役立つエディタいろいろ

今週の気になるWebネタ

iPadをセカンドディスプレイ化したい人にはOne Designの「Mountie」がおすすめ - TechCrunchhttp://jp.techcrunch.com/2015/01/01/20141230ipad-mount-for-macbook/

「iPadをセカンドディスプレイ化したい人には」という記事タイトルを見て,前回紹介した「Duet Display」のようなアプリがまた登場したのかと思ったのですが,そうではなくMacBookとiPadとをジョイントするグッズの紹介でした。

このMountieの商品ページを見ると,iPadやiPhoneで動画を見ながらMacで作業をするといったような用途を想定しているようです。iPad/iPhoneにはいろいろなスタンドも販売されていますが,コンパクトでデザイン性もいいので,MacBookと一緒に持ち歩くのにはよさそうですね。

なお,MacBookだけでなく2012年以降のiMacでも使え,5ミリから9ミリのタブレット/スマートフォンを付けられます。iPadはAirかmini,iPhoneは4以降に対応とのことです。

著者プロフィール

芦之由(あしのよし)

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

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

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

コメント

コメントの記入