週刊Webテク通信

2013年9月第4週号 1位は,モバイルブラウザに向けた最適化のノウハウ,気になるネタは,Apple「iOS 7」が遂にリリース

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

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

1. モバイルブラウザでもサクサクに動作する最適化6つのノウハウ | HTML5Experts.jphttp://html5experts.jp/sou/2413/

モバイルブラウザに向けた最適化について解説した記事です。

JavaScriptがらみの話題が多いのですが,それほどスクリプトをいじったりしないという人でも,ざっくりとでも目を通しておくとためになるところがあるはずです。

ボトルネックを取り除く上で注意する,以下の3点は特に重要そうです。

  • JavaScriptファイルの取り扱いに注意する
  • ブラウザキャッシュを有効に機能させる
  • HTTPのリクエスト数を削減する

図1 モバイルブラウザに向けた最適化について解説した記事

図1 モバイルブラウザに向けた最適化について解説した記事

2. ズルいデザインテクニック2013 + セミフラット version // Speaker Deckhttps://speakerdeck.com/ken_c_lo/zuruidezaintekunituku2013-plus-semihuratuto-version

「ズルいデザインテクニック」を啓蒙しているデザイナーの方によるスライドです。

ズルいデザインテクニックとは,少ない手間で簡単に,ちょっといい感じのデザインに見せるためのテクニックで,主にプログラマなど非デザイナー向けの内容となっています。とはいえ,多くのデザイナーにとっても参考になると思います。

このスライドは,ズルいデザインテクニックの総集編的な内容に加え,フラットデザインの要素を取り入れたものになっています。

図2 ズルいデザインテクニックのスライド

図2 ズルいデザインテクニックのスライド

3. 50+ fantastic free tools for designers | Webdesigner Depothttp://www.webdesignerdepot.com/2013/09/50-fantastic-free-tools-for-designers/

Webデザインに役立つツール類をまとめて紹介しています。

アイコン,フォント,PSDやベクターデータのデザイン素材,パターン,UIキットなどが掲載されていました。

図3 Webデザインに役立つツール類

図3 Webデザインに役立つツール類

4. iOS 7 Vs Androidhttps://tapfame.com/ios7vsandroid/

同じアプリの画面を,iOS 7版とAndroid版とで比較した記事です。もともとGoogleの方がフラットデザインを先に取り入れていたので,Android版アプリにもその傾向が見られますね。

iOS 6版とiOS 7版とのアプリのデザインをまとめた,iOS 6 時代と並べるとわかる,各アプリの「フラット化」ラッシュ : ギズモード・ジャパンという記事もありました。

図4 iOS 7版とAndroid版とのアプリの画面比較

図4 iOS 7版とAndroid版とのアプリの画面比較

5. 30 Best Adobe Illustrator Tutorials | Resourceshttp://www.designerledger.com/best-adobe-illustrator-tutorials/

Adobe Illustratorのチュートリアル記事を大量に紹介しています。

リアルなイラスト作成に関するものが中心でした。

図5 Illustratorのチュートリアル記事いろいろ

図5 Illustratorのチュートリアル記事いろいろ

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

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

生まれ変わった Evernote Web クリッパー 6 for Chrome | Evernote日本語版ブログhttp://blog.evernote.com/jp/2013/09/13/14980

今回は,Webサービス紹介とはちょっと違いますが,⁠Evernote Web クリッパー 6 for Chrome」を取り上げたいと思います。

「Evernote Web クリッパー」は,閲覧中のWebページをEvernoteへクリッピングするためのブラウザ機能拡張です。各種ブラウザ用のものがあるのですが,今回紹介するChrome用最新版は,かなり機能強化されています。

今回のバージョンで,別途ブラウザ機能拡張として提供されていたEvernote Clearlyと,デスクトップアプリのSkitchの機能が搭載されました。特に,単独の画像加工アプリだったSkitchの機能がブラウザ上で使えるようになったのには驚きました。

Clearlyの機能を統合した「簡易版の記事」は,Webページ上から余分な要素や装飾を排除して表示する機能です。Safariの「リーダー」表示機能と同様のものです。

そして,Skitchアプリの機能が統合されたことにより,閲覧中のページのスクリーンショットを撮り,図形や矢印,テキストなどを描き込めるようになったのがうれしい機能強化です。モザイクもかけられますし,かなり重宝すると思います。

図6 EvernoteサイトでのWeb クリッパー 6 for Chromeの紹介記事

図6 EvernoteサイトでのWeb クリッパー 6 for Chromeの紹介記事

今週の気になるWebネタ

Apple「iOS 7」 ~マルチタスキングに対応し,フラットデザイン採用の新OSが遂にリリース! - PC Watchhttp://pc.watch.impress.co.jp/docs/column/nishikawa/20130920_616076.html

ついに,iOS 7がリリースされました。わたしはとりあえずiPhoneではなくiPadをアップデートしてみました。

このiPad,最近は子供(小学2年生)のパズドラマシーンと化しています。ロック解除画面で戸惑ったり,マルチタスク画面でアプリを終了できなかった以外は,特に問題なく使っていたようです。さすがに違いは分かるようで,⁠新しくなったね」と言っていました。

ところで世間ではこのiOS 7をフラットデザインだと言っていますが,純粋なフラットデザインとは違いますね。グラデーションやドロップシャドウを完全には排除していませんし,半透明やテクスチャを使っているのもフラットデザインとは違ったところです。

最近のGoogleのデザインも,フラットデザインの要素を多く取り入れつつも,必要に応じてグラデーションやドロップシャドウをわずかに利用しています。このアプローチを「Almost flat design(ほぼフラットデザイン)⁠と呼んでいた記事があったので,iOS 7のデザインも「ほぼフラットデザイン」と呼べばいいんじゃないでしょうか。略して「ほぼフラ」ですね。

著者プロフィール

芦之由(あしのよし)

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

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

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

コメント

コメントの記入