2014年9月の、これだけは押さえておきたいWeb関連の動き

「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。

デザイン関係

これからはGIFアニメからAPNGの時代に! iOS 8でサポートされたAPNG画像を使いこなそう – ICS LAB

「APNG」とは「アニメーション可能な PNG 画像形式」のことで、PNG と同様に 8bit(256色)や 32bit(アルファチャンネルあり)などがサポートされます。

Can I use… Support tables for HTML5, CSS3, etc を見ると、2014年9月末時点では Firefox、iOS 8 くらいしか対応しておらず「これは当面使えないな…」と思っていたのですが、この記事によると「JavaScriptライブラリのapng-canvas.jsを使用することで擬似的に表示させることができる」そうです。

Canvas はほとんどのWebブラウザーが対応している(参考: Can I use… Support tables for HTML5, CSS3, etc)ので、apng-canvas.js を使用すれば多くのWebブラウザーで表示できるようになりそうです。
(ただし、この記事によると IE11 ではエラーが出たそうです)

さすが、Apple!刷新されたウェブサイトで見つけた3つのこだわりとは? – Rriver

スマートフォン対応されたのは「Androidの台頭によるマーケティングの判断があったから」ではないかとする考察と、今まで画像で表示していた見出しをテキストにし、span タグで囲って letter-spacing でカーニングしていることなどについて触れられています。

この記事では触れられていませんが、おそらく この JavaScript ファイル を使って、本文テキストのうち正規表現で [ぁ-んァ-ンー、。] の範囲(つまり、ひらがな・カタカナ・句読点など)の文字を span タグで囲ってます。

「予約注文のボタンは立体的だった」ということも書かれていますが、やはりグローバルナビゲーションを除く重要なボタンは立体的に装飾したほうがコンバージョン率が高いのでしょうね。

Adobe、ChromebookおよびChrome上で動作するPhotoshopの提供を開始 – TechCrunch

米国内の教育機関向けサブスクリプションに登録している利用者向けに、ネット接続環境で利用できる、ストリーミング版 Photoshop が提供されるそうです。

一般の Creative Cloud 登録者も利用できるようになれば、Windows や Mac に縛られずに、好きな OS を利用して写真編集やWeb制作ができるようになる…はずですが、快適に動作するのか気になりますね。

スマートフォン対応・iOS 8

iPhone 6でのスマートフォンデザイン – to-R

iPhone 6 でも横幅 320px でデザインしても大丈夫な理由、3倍画像(@3x)ではなく2倍画像のままで大丈夫な理由について書かれています。

[iOS 8 ファーストインプレッション] アプリに新たな可能性が与えられたiOS 8 – ケータイ Watch

  • 「共有オプション」と「カスタムアクション」をサードパーティ製アプリが使えるようになった
  • サードパーティー製キーボードが使えるようになった
  • 通知センターのウィジェットも作れるようになった

など。

iOS 8の採用率はリリースから5日後で46%、大方の予想を裏切る高率 – TechCrunch

iOS 7 と同様、かなりの速度で普及していますね。

iPhone 6 Plusの画面は1242×2208を1080×1920に縮小表示する仕様。ドットバイドット表示は不可

iPhone 6 の画面は、大きくレンダリングしたものを縮小表示しているということは知っていたのですが、iPhone 6 Plus もそうだったのですね…

Retina ディスプレイはかなり1つ1つのドットが小さいため普通に使用していれば気づかないことだとは思うのですが、「鮮明な1pxや2pxの線」を表示することはできませんし、1242×2208px で内部レンダリングするなら 1242×2208px のディスプレイにしてほしい気がします…

スマホ大画面時代、親指リーチ範囲が鍵となる新たなインターフェースデザイン : ギズモード・ジャパン

親指でリーチできる範囲
Thumb Zone Templates by Scott Hurff

この記事でちょっと気になったのが、

アップルは、iOS 8から「Reachability」という機能を搭載しました。これは、ホームボタンを2度押しすると画面が下方向にスライドしてくれるものです。

とありますが、実際に使ってれば「ホームボタン2度押し」より、もう一方の手で上の方のボタン押したほうが早いと思うのですよね。

あと、

片手使用の場合
・右手親指でスクリーン操作:67%
・左手親指でスクリーン操作:33%

とあるのですが、iPhone(6を除く)の場合、片手で操作するなら左手で操作したほうが便利だと思うのですよね…

私は右利きですが、iPhone 5 を操作する時は左手です。その方が左上の戻るボタンに指が届きやすいので。

iPhone 5・5s を使っている方で「指が届きづらい」という方に話を聞くと、大抵の方が右手で操作しようとして、左上の戻るボタンに手が届かないと言っているようです。

この記事の結論では「端末サイズが変われば、持ち方自体が変わっていきます」とありますが、果たして iPhone 6 や大画面 Android に機種変更した方は、持ち方を変えるのかなぁ…と私は半ば懐疑的です。

Webコーディングスクール 体験レッスン受付中

WebGL(Webでの3D表現)

McDonald’s 40th Anniversary

マクドナルドの、WebGL を活用したキャンペーンサイトです。
Windows版・Mac版 Chrome や Firefox などの、WebGL を使用できるWebブラウザーでは WebGL で、そうでないブラウザーや Mac版 Safari では(WebGL をオンにしていても)WebGL でない方法で表示されます。

大企業が WebGL を活用するのはまだ先かと思っていたのですが、意外と早かったですね。

WebGL が切り開く Web の未来

WebGLが切り開くWebの未来

9月27日の 3DCG Meetup #04 でのプレゼン資料です。

PCで、カーソルキー[→]で次のページを表示できます。
47ページ目から、企業サイトでの WebGL 活用事例や、WebGL を使用したサービスが見れます。

このスライドを発表された @h_doxas さんは、11月の毎週火曜 19:30〜 より、Stocker.jp /Space にて WebGL の講座を開催されます。
詳しくは下記ページをご覧ください。
基礎から始める本格 WebGL スクールの受講生を募集します! – WebGL 総本山

SEO

Google、著者情報プログラムを完全廃止 | 海外SEO情報ブログ

セキュリティ

「bash」シェルに重大な脆弱性、主要Linuxでパッチが公開 – ITmedia エンタープライズ

Linux サーバーを利用している企業(一般のレンタルサーバーのことではなく、自分でサーバー管理をしている場合)は、お早めに bash のアップデートを行ったほうがよいかと思います。

OS X も、この問題を修正したアップデートをリリースしています。

WordPressに複数のセキュリティ脆弱性 | マイナビニュース

セキュリティ脆弱性が修正されたプロダクトおよびバージョンは次のとおり。

  • WordPress 3.9.2
  • WordPress 3.8.4
  • WordPress 3.7.4
  • Mac用アンチウイルスソフト18種類のウイルス検出率をテスト、最も検出率が高かったのは? – GIGAZINE

    Bitdefender・G Data・eScan(MicroWorld)・Normanのアンチウイルスソフトの検出率が100%
    (中略)
    一方でTrend Microのアンチウイルスソフトは2つのテストを通して平均38.5%の検出率で、McAfeeは26.5%

    ウイルスバスター(トレンドマイクロ)は Windows だけでなく Mac も…

    その他

    文系脳向けネット入門に「アカマイ 知られざるインターネットの巨人」をオススメする理由 – あざなえるなわのごとし

    インターネットのトラフィックの15〜30%を支える「Akamai」とは?ということについて書かれた本です。

    Kindle版が450円だったので買ってみましたが、なかなか面白い本でした。

    Ustream Asia Inc.|お知らせ

    Ustream で、アーカイブ映像の保存期間が30日になるそうです。
    「これまでに保存されてから既に30日間経過しているアーカイブ映像も、2014年10月10日以降に削除されます」とのことで、勉強会を Ustream でされたことのある方は、早めに別の動画サイトにコピーされたほうがよいかと思います。

    モジラの3500円スマホ、インドで販売絶好調 – WSJ

    約3500円のスマートフォン(Firefox OS)が好調のようです。

    Google も Android One という1万円くらいの低価格版を出すので、ひょっとしたら日本でもSIMフリー版が量販店で安売りされる日が来るかもしれないなぁ、などと思っています。

    MacのCTO(カスタマイズ)モデルを安く買う方法まとめ

    Apple Store でも値引きはできるし、PCデポでカスタマイズモデルを買う方法もあるのですね。

    最近の記事

    Web制作関連動画

    メルマガ会員向けの「コーダーにも役立つ補完AI『Codeium』の使い方」の動画を期間限定で公開しています。
    CodeiumはGitHub Copilotと似ていますが、CSSなども補完できて、今登録すれば無料で使えます。

    メルマガでは、Web制作者のためのAI活用やWordPress関連の動画など、さまざまな特典があります。ご興味ある方は、ぜひメルマガにご登録ください。
    Index