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

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

今回は、ニュースよりもデザインやプログラミングに関する必読記事中心です。

デザイン関係

【レビュー】10万円で登場した23.8型4K液晶、デル「UP2414Q」を試す – PC Watch

Dell が、PC向けの 4K(3,840×2,160px)ディスプレイを発売しました。
従来、4Kディスプレイは 30〜40万円ほどしていましたが、この製品は Amazon で ¥99,800 で売られる(執筆時点では品切れ) など、かなり割安なモデルとなっています。

4K動画制作などで活躍しそうなのはもちろん、Web制作においてもタブレットの高解像度化などで「PCの解像度がタブレットより低いため制作・確認しづらい」という問題が起きていましたが、4Kディスプレイが手頃に値段になってきたことによりそういった問題が解決されそうですね。

なお、4KディスプレイにそのままPCの画面を表示するとUIや文字などが小さすぎて作業は厳しいですが、Retina ディスプレイモデルの MacBook Pro 2013年モデルは、外部ディスプレイでも Retina(HiDPI)表示をさせることができる ようです。

Windows 8 の場合は高解像度表示(UIなどを縦横2倍で表示)に対応してるらしいですが、いろいろ不具合もある ようです。

話題のPhotoshop新追加機能「Generator」の構想がすごかった件。 | Behind The Design. デザインの本質をひも解く

Photoshop CC の新機能である Generator(画像アセット)機能については 以前このブログでも解説しました が、この記事ではより詳しい解説がされていました。

例えばPhotoshopで作ったものを、iphone画面上で配置の微調整を行えたり、作業ログ記録を作業者のアクティビティにあわせて行えたり、と夢が広がりまくりです。

インストールの説明は省きますが、ユーザー自身がGeneratorプラグインを開発することができます。

とのことで、この記事を書かれた ISHIYAMA さんは Photoshop Generator(生成)のプラグインを自前で開発するための準備まとめ という記事を公開されたり、既に作業ログを JPEG + PSDバックアップで記録していく Generator プラグインなどを公開されています。

参考: タイムラプス風にデザインワークを記録するPhotoshop Generatorプラグイン「ShotThumb」を作った話 | Behind The Design. デザインの本質をひも解く

Advent Calendar 3日目:SVG画像を1バイトでも削るためのコードゴルフ – 聴く耳を持たない(片方しか)

Adobe Illustrator から出力できる SVG 画像はベクター形式なので、Retina 環境や、タブレットなどで拡大しても荒れないというメリットがあります。

しかし、Illustrator から出力した SVG はそのままではファイルサイズが大きいとのことで、どうすればファイルサイズを削減することができるかについてかなり具体的に書かれています。

ファイルサイズの削減を自動でやってくれるツールがあればいいなと思っていたのですが、そういったツールについても紹介されています。

フォントとタイポグラフィ

「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)

「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ) from swwwitch, inc.

2013年11月21日(木)19:00-20:00、アップルストア銀座で開催されたCSS Nite in Ginza, Vol.72のスライドです。221ページもあります。

スライド内で紹介されている、モリサワの A1明朝 かっこいいですね。

「AXIS Font」フォントの魅力 | ykazu.com

数ある和文ゴシック体の中でも、古さ・新しさといった時代の流れを感じさせないエレガンスさ、クールさの両方を持ったフォントといえます。
大胆な まるみ、細くても重心がしっかりとした体形、ひらがなの「と」の書き初めのように、ゴシック体の特徴である直線ではなく人間らしい曲線もみられます。

上のスライドでも紹介されている AXIS Font は、AXIS という雑誌のために作られ、Apple のサイトなどでも使用されているフォントですね。
「AXIS Font」フォントの魅力 | ykazu.com という記事も、AXIS Font をWebフォントとして使用しています。

FONT FREE – 無料で使える日本語フォント投稿サイト

日本語の無料フォントまとめ記事はこれまでもたくさんありましたが、ここは無料フォントをまとめてカテゴリ別に見れるようにしたWebサイトです。
サイトは WordPress でできており、現在 74 のフォントが紹介されているようです。

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

プログラミングとスクリプト言語

米大統領「全ての人よ、プログラミングを!」 | Life is Tech!(ライフイズテック)

だから、私はあなたたちにやってほしい!

新しいゲームを買うだけではなく、つくってみよう!

最新のアプリをダウンロードだけではなく、創造してみよう!

スマホで遊ぶだけではなく、プログラミングしてみよう!

オバマ大統領のメッセージです。

私は、すべてのWeb制作者(デザイナー、コーダーなども含む)はプログラミングの基礎を知っておくべきだと考えていますが、オバマ大統領はそうでない職業の方に対してもプログラミングをすすめているのですね。

Firefox JavaScript実行速度、C++に迫る | マイナビニュース

asm.jsおよびJavaScript実行環境の最適化を進めた結果、発表当時はC++よりも2倍ほど遅かった実行速度が、C++と比較して1.5倍の遅さにまで詰め寄ったことを伝えた。この方法はほかのブラウザのJavaScript実行環境にも適用可能で、今後さらにほかのブラウザでの実行速度が高速になる可能性がある。

この話は、HTML5 Conference 2013 で、Mozilla Japan のでゅなみすさん( @dynamitter )がされていたものですね。

参考: 進化を続ける JavaScript 〜次世代言語のステキな機能と高速化の行方〜

Googleの新言語「Dart」、ECMAが標準化を開始 - Publickey

ECMA InternationalはJavaScriptの標準化を行っている団体でもあり(JavaScriptは正式にはECMAScriptという名称)、DartはGoogle独自の言語から標準化された言語へと最初のステップを踏み出したことになります。

Dart は、Google が JavaScript よりも優れた言語を目指して開発中のWeb向けスクリプト言語ですが、ECMA が標準化を開始したということはこれから普及するのでしょうか?

クライアントサイドJavaScriptのライセンス管理 | GREE Engineers’ Blog

JavaScript ライブラリのソースコードを圧縮(minify)するとライセンス表記のコメントが消えてしまう問題について。

各ライブラリでライセンス部分のコメント形式が異なるのですが、それをいい感じに取得できる grunt task を公開されています。

スムーズなアニメーションを実装するコツと仕組みを説明するよ。CPUとGPUを理解しハードウェアアクセラレーションを駆使するのだ!(Frontrend Advent Calendar 2013 – 06日目) | Ginpen.com

CSS、JavaScript など、Flash を使わず要素をアニメーションさせる方法はいくつもありますが、どうすれば多くのWebブラウザーで滑らかに動くようになるのか、そのために GPU について理解しようという記事。
かなり分かりやすかったです。

HTML5 Conference 2013の資料まとめ | Stocker.jp / diary

このブログの記事ですが、HTML5 Conference 2013 は非常に有意義なセッションが多かったです。
まだご覧になっていない方はぜひどうぞ。

スマートフォン関係

スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法

スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法 from Maboroshi.inc

「ピクセルパーフェクトにこだわらない」というのは重要だと思いますが、そこにこだわるクライアントさんもまだ居そうな気がしますね…

スマホ経由のアクセスはネット利用全体の65%に 食品、服飾、美容などはすでに逆転 – ITmedia ニュース

カテゴリ別に見ると、スマートフォンからの利用が多かったのは「コミュニケーション」「地図、一般旅行情報」「天気」など一般的に相性が良いとされているもののほか、「食品、料理」「服飾、美容」など。逆に、「ポータル、コミュニティ」「オンラインモール」「ビデオと映画」「自動車情報」などはPCからの閲覧が多かった。

「日本ではまだスマフォは普及していない」という方もいますが、スマフォ利用者は既にPC利用者(5380万人)の65%の規模となり、カテゴリーによってはPCよりも利用者が多くなっているようです。

【悲報】パソコンの販売低迷が深刻 出荷台数は「 30% 」減少 – ガジェットライフ速報 -2ちゃんねるまとめ-

ソースはNHKニュースです。本当はNHKのサイトにリンクしたかったのですが、既に記事が消えており、Google キャッシュにも Internet Archive にも無かったため、やむを得ず 2ch まとめにリンクを張りました。

他のニュースでも、PC出荷量の極端な減少は「一時的な問題」と分析されているようですが、私はそうは思っていません。
Web制作などしている方にとっては PC は必需品ですが、一般の方にとってはスマートフォンやタブレットで十分だろうと思っているからです。

スマートフォンは一般的にパケット定額が付いていて、PC用のWebサイトもほぼ見れます。
コミュニケーションを取るときも、従来は「デジカメで写真を撮影→PCに取り込んでメールで送信」だったのが「スマフォで撮影→LINE」で済みますし、わざわざ高いお金を払ってPC一式を購入し、スマフォのパケット代とは別にプロバイダーに月々数千円も払う方は多くないだろうと思っています。

業務利用においても、営業の方はノートPCの代わりにスマフォやタブレットを持ち歩くようになったりと徐々に減少していくため、Web制作などの特定用途以外ではPCは使われなくなっていくのではと思っています。

関連: PCからのWebサービス訪問者、軒並み減少 13年は「スマホへの転換の年」 ニールセン – ITmedia ニュース

PC から Tablet へ向けた急激なシフト : それを示す1枚のチャート | Agile Cat — in the cloud

tablets-and-pcs
画像引用元: Business Insider

黄色がPCの出荷量、青がタブレットの出荷量です。

アプリの売上高で日本がアメリカを抜く。要因はパズドラとLINEの課金か。 – たのしいiPhone! AppBank

App-Revenue-Increased-Japan-1
画像引用元: App Annie

App Annie はゲーム分野での売り上げが日本市場の売上増に繋がったと分析。中でも5つのアプリ開発元が占める割合が高いとしています。

その中で一例として挙げられているのが「パズドラ」で有名なガンホー・オンラインと無料通話アプリで有名な LINE です。

やはりパズドラと LINE が原因のようです。

記事に「機械翻訳で日本語表記に対応するアプリが増えるかもしれないことが気掛かり」とありますが、これは私も気がかりですね…最近「Moves」というアプリが日本語化されましたが、翻訳がひどすぎて思わず iPhone の言語設定を英語に変えてしまいました。

Apple、iOS 7普及率を74%と発表。AppStoreの利用データによる | TechCrunch Japan

ということは、2014年には iOS6 以下は切り捨てられそうですね。

「Ubuntu Touch」OS、初のスマートフォンパートナーを獲得 – CNET Japan

おめでとうございます。

「数量が重要である。われわれは人々が毎日使うものに取り組みたい」と同氏は述べた。同氏は、Ubuntuがモバイル市場の小さなニッチ分野だけで使用されるという状態を望んではいない。

ニッチ分野狙いかとおもいきや、そうではないのですね。

これまで、家庭用として広く普及した OS はどれもビジネス思考のもので、Firefox OS があまり普及しそうに見えないのはビジネス思考ではないからだと思っていたのですが、Ubuntu Touch は前者を目指しているのでしょうか。

WindowsとIE

IE8対応費用に関しまして | 株式会社まぼろし

昨年、「IE6とIE7対応の場合はそれぞれ10%の追加コスト」で話題になった制作会社の株式会社まぼろしさんが、「IE8対応をご希望の場合には10%〜の追加コストをお見積りいたします」と発表しました。
「10%」ではなく「10%〜」というのがミソですね。

Windows 8 でモダンなWebサイトを動作させることは難しいですし、IE8 までしかアップデートができない Windows XP はまもなくサポート終了、Windows Vista と Windows 7 以降は IE9 以降に強制アップデートされるはずなので、そろそろ IE8 はサポート切り捨てる時期なのでしょうね。

【さよならXP】第3回 古いPCにWindows 8をインストール——ダメでした! – ガジェット通信

「CPUがNXビットに対応していなければ、インストールも起動も出来ない」とのこと。
Windows XP などの古いPCからのアップグレードを検討されている方はご注意ください。

セキュリティ

中国「百度」製ソフト、入力の日本語を無断送信 : ニュース : ネット&デジタル : YOMIURI ONLINE(読売新聞)

Twitter などでは既にかなり話題になっているようですが一応。
「バイドゥIME」だけではなく、Android用のIMEである「Simeji」も、ユーザーの入力文字を百度のサーバーに送っていたようです。

ネットエージェントのブログに、具体的に送られていた情報の詳細が書かれていました。

参考: NetAgent Official Blog : 入力情報を送信するIME

メディアの報道だと「すべての文字が送られる」かのように報道されていますが、「Baidu IME , Simejiでは、全角入力の場合のみ情報が送信されています。」とのことで、たとえばIMEをオフにして、パスワードを半角で入力した場合は送信されないようです。
ただし、「ぱすわーど」や「くれじっとかーど」で単語登録しておき、それを入力して半角パスワードやカード番号に変換させた場合は送信されるようです。

Simejiの場合は、クラウド入力OFF、ログ情報を送信がOFFの場合でも送信されます。」とのことで、これが1番の問題ですね。

Simeji は、もともと日本人の方が開発したIMEで、百度が日本人開発者から1億円で買い取ったと聞いた時「無料のIME単体でそんなに儲かるはず無いし、これは数年後に日本人開発者をIME開発から外した後で入力情報をネットで送信させてスパイウェアとして使う気なんじゃないかな」と危惧していたのですが、予想通りすぎて逆にびっくりしてます…

IMEのネット利用 : 続・ユビキタスの街角 という記事によると、「現在(2013/12/21)Simeji開発チームはBaidu IMEの開発に関わっておらず、またSimeji開発者の足立氏は現在Simejiの開発からも離れている」とのことです。

日本人開発者の方の Twitter アカウントでのやりとりを拝見する限り、日本人開発者の方は、いつの間にか Simeji がクラウド入力OFF、ログ情報を送信がOFFの場合でも入力文字列を送信するようになっていたことを全く知らなかったようです。

そして「バイドゥIME」ですが、中国製のIMEを自分の意志で使っている人が200万人もいるわけ無いだろうと思っていたら、どうやら Windows 用のフリーウェアで「標準インストール」を選ぶと勝手にインストールされることがあるようです。

そして、インストールされた後は勝手にデフォルトのIMEになるようです。
また、Lenovo 製PCには標準でインストールされているようです。

Levovoといえば、遠隔操作でPCにアクセスすることが可能なチップが入っているらしいということが話題になったこともありましたね。

参考: 中国企業レノボのPCにハッキング工作か!? 「5カ国の国家機関がレノボ製PCの使用を禁止」と大手紙が報じる | ロケットニュース24

レノボ製 PC の回路には故意の変更が加えられており、遠隔操作で機器にアクセスすることが可能である

「バイドゥIME」は、アンインストール画面が話題になったこともありましたね。
実に日本人ユーザーの心理を分かっていると思います。

選択肢に「知らないうちにパソコンに入らないでほしかった」とありますが、バイドゥ株式会社には、これがアウトという認識はないのですかね?

Simejiが「クラウド入力OFF、ログ情報を送信がOFFの場合でも入力文字列を送信」というのは単なるバグの可能性もありますが、利用規約には書かれることなく、元の日本人開発者に知られることもなくいつの間にか送信するようになっていたとか、そもそもバイドウIMEが「知らないうちにパソコンに入る」とか完全にアウトだと思います…

Windowsで色々なフリーウェアを使っている方は、コントロールパネルからバイドウIMEがインストールされていないか確認されることをおすすめします。

その他

SEOとAuthor Rank|CyberAgent SEO Information (サイバーエージェントSEO情報ブログ)

Author Rankとは、簡単に言ってしまえばコンテンツやウェブサイトの著者の価値のことであり、
今後Googleが検索のランク付けに使用してくると予想される要素です。

このブログも、実は「rel=”author”」設定しているのですが、Google+ のアイコンが人物写真ではなくうさぎのイラストであるためか、検索結果にアイコンが出ないのですよね…

ビデオリサーチ、テレビ番組へのTwitterの反応を測る「Twitter TV指標」提供 -INTERNET Watch

「Twitterによるテレビ視聴への誘引効果」としては、他者に影響を及ぼすという観点では、ツイートの投稿数よりも表示数が適している

Twitter で、特定のTV番組が話題になっていることはよくありますが、それがどれくらい視聴率につながっているか測定するというのは面白そうですね。

最近の記事

Web制作関連動画

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

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