jdash 2000 site

DTP・Web制作・CSS・マーケティング・スマートフォン・印刷などの色んなものに四苦八苦しながら次なる営業展開を考える営業部所属の人のブログ



20150120-X-UA-Compatible-Chrome-Frame-01

サイトのCMSを入れ替え行いつつも、過去制作したサイトを見直してみると、今になって「コレは必要なのか?」みたいなものがあります。


以下のページは、はてなブックマークも1200位付いているすごいページですが、公開当時このページを参考にされていた方も多いのではないでしょうか? 私も参考にしてサイト作りには反映していました。


IE対策では以下の様に説明されています。

IE対策

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

IEで閲覧している場合、Google Chrome Frameで表示します。

Google Chrome Frameがインストールされていない場合は、IEの利用可能な最新のレンダリングエンジンで表示します。

Google Chrome Frame(GCF)とは、IEでGoogle Chrome相当のレンダリングエンジンを利用可能にするIEのプラグインです。 インストールすると、IE8以下でもCanvas、CSS3、HTML5、高速なJavaScriptエンジンが利用できるようになります。

【HTML】最近のPCサイトに見るテンプレ要素まとめ | istis

Google Chrome Frame! 懐かしい! これが普及していたらInternet Explorer対策ももっと簡単だったろうに…と思ったり(=モダンな技術を搭載したブラウザーに移行されていれば制作はもっと楽だったはず)。


記事の続きを読む




Googleはモバイルファーストを強力に薦めている証拠かもしれません。

Googleのウェブマスターツールから「モバイル ユーザビリティ上の問題が検出されました」と題した警告とも受け取れるメッセージが届きました。(今見ているこのブログページの話ではないです)

20150116-Google-ウェブマスターツール-モバイルフレンドリーではない-01

Google のシステムは、貴サイトの 848 ページをテストし、そのうちの 100% に重大なモバイル ユーザビリティ上の問題を検出しました。この 848 ページの問題の影響で、モバイル ユーザーは貴サイトを十分に表示して楽しむことができません。これらのページは Google 検索でモバイル フレンドリーとは見なされないため、スマートフォン ユーザーにはそのように表示、ランク付けされます。

「重大な問題」だそうです。

記事の続きを読む



●メニューのアイコンって分かりづらくないですか?

20150113-スマフォサイトのメニューボタン周りのデザイン-00

スマートフォンサイトの構築というものは今やマスト、しなければならないことのひとつとなってきました。

このスマートフォンサイトのデザインというのも、私はほとんど(Twitterの)Bootstrapを使っていて、ほとんどコレで事足りる気がします。

しかし、メニューのアイコンについて、これで本当に訪問者は分かってくれるのだろうか?と感じることもしばしば。なので、もっと良いアイデアはないかなと思って、私がよく行くサイトを見てみることにしてみました。


見てみるサイトは以下の通りです。

  • Bootstrap
  • Response(自動車)
  • モスバーガー(外食)
  • 朝日新聞(メディア)
  • AllAbout(情報サイト)
  • ユニクロ(アパレル)


記事の続きを読む



★ざっくり言うと

  • YouTubeでは動画の速度を2倍まで速くできる
  • FirefoxではFlashプレイヤーでの再生になっているとオプションで出てこない
  • Flashプレイヤーの再生から変更するのはHTML5動画プレイヤーのページで行う



●YouTube動画を時短で見ましょう

ということでDTP TransitでYouTube動画を時短で見ようという記事がアップされていましたが、Chrome以外はダメとのこと。

私の環境(OS X Mavericks)では、Google Chromeのみサポートされているようで、FirefoxやSafariでは実現できませんでした。

YouTubeが「早聞き再生」をサポート - DTP Transit(Mac OS X, OS X Mavericks, 動画)

え? Firefoxで以前からできていますが…と思って調べてみたら、Firefoxでは設定次第で変わってくるようです。



●Firefoxで倍速再生できない状態のYouTube動画再生

FirefoxでYouTube動画を見る時に「歯車アイコン」をクリックし、再生速度を変更しようと思っても、設定項目が出てきません。自動再生とアノテーションと画質のみ。

20150108-Youtube-倍速再生-05

画像出典:瀬戸弘司が選んだ!2014年 本当に買ってよかったものランキング 5位→1位(YouTube)


その場合、動画上で右クリックすると、こんな感じになりませんか?

「Adobe Flash Player 16.x.x.xについて」

つまりYouTube動画はFlashのプラグインで再生されているわけです。

20150108-Youtube-倍速再生-06

記事の続きを読む



●Noto Sans Japaneseの指定方法はDTP Transitを

新潟グラム × DTP Boosterの懇親会の時に、スピーカーの鷹野さんに「Noto Sansってウェブフォントの指定の仕方が分からないんですよ〜」と質問したら「あ、それならDTP Transitのサイトソースを見てみて」と言われました。って、今さらって感じですが、その内容について書きかけだったので、書き終えて年末を終わろうかと。


実際、DTP Transitのサイトソースを見たら指定の方法は分かりました。

  • DTP Transit

  • でも、この指定の方法って正式なモノなのか?って思ってしまいました。

    (見たい人は http://www.dtp-transit.jp/css/styles.css の中で「Noto」を検索してね)

    念のため正式な指定の方法をGoogle Fontsのページで確認しておくことは制作者として正しいことかなと。



    ●正式ドキュメントを探してみる

    なぜかって?

    「Noto Sans」で検索して、検索結果で出てきた最初のページを見てみます。

    20141225-Google-FontsからNoto-Sans-Japaneseのダウンロード-01

    画像出典:google font noto sans(Google 検索)



    以下のページが出てきます。

    なんかごちゃごちゃ書いてありますけど、右上に「Open Noto Sans in Google Fonts」って書いてあるのでクリック!

    20141225-Google-FontsからNoto-Sans-Japaneseのダウンロード-02

    画像出典:Noto Sans(Google Fonts)



    するとGoogle FontsのNoto Sansのページが出てきます。「勝ったッ! 第3部完!」って思うじゃないですか。

    20141225-Google-FontsからNoto-Sans-Japaneseのダウンロード-05

    画像出典:Google Fonts


    記事の続きを読む




    ブログ著者

    名前:(Google+のプロフィール)

    ケータイ好き。ガジェットが好きでiPhoneやらAndroidなどを所有。Surface Pro 2も持っている。

    お仕事は印刷会社で営業・広報活動・DTPオペなどをしています。要は何でも屋さんです。最近は印刷関連より、自社のウェブサイトを制作するお仕事がほとんど。使用しているCMSはMovable Type。

    ブログ著者について

    サイト内検索