ダミー

埋め込みGoogleカレンダーのカスタマイズ

Googleカレンダーはとても便利。
私はもう10年くらい使っています。

もちろんWebサイトにも埋め込めますし、
実際埋め込んでるページも見かけますが
カスタマイズはできないの?と
これまた、ずーっと思っていました。

さすがに今どきのことだからツールあるだろう、と
探してみたら gcalendar-wrapper.php というスクリプトが
公開されていました。これは便利!

Easy Color Customization for Embedded Google Calendars

そして、レスポンシブ対応は簡単。

<iframe src="https:~省略~" style="border-width:0" width="500" height="500" frameborder="0" scrolling="no"></iframe>

の width=”500″ の部分をwidth=”100%”とすると、iframeの幅が親要素の100%になります。
%の無い数字はpxを表しています。

(ちゃんと「フィーチャーフォン」と書きましたよ!)
ウェブ制作者やマスターのみなさまは、サイトがどのような環境で見られているかとても気になります。

中でも、かつて構築したPC用とケータイ用を.htaccessで振り分けたサイト…

「もうケータイ(フィーチャーフォン)用ページは要らないよなぁ、IE8対応もしなくてもいい」
「今どきフィーチャーフォンのアクセスなんてそんなにないはず」
「レスポンシブにしたいけど予算出ないし、うーん」

などなどの思い。

まずはクライアント様に「レスポンシブとは何か、なぜレスポンシブにしなければいけないか」を
説得しなければなりません。
そのためにはフィーチャーフォン用ページへのアクセスがいかに少ないかを数値で示すのがいいでしょう。

あ!フィーチャーフォン用ページってGoogle Analyticsでトラッキングできてないわ(泣)

気を取り直して今日からでもトラッキングしましょう。

ただ、フィーチャーフォンはjavascriptをサポートしてない機種もあり
「いつものアレ」を埋め込んでもトラッキングできません。

javascriptをサポートしてない機種はタグとして埋め込めるHit Builderを使うと便利です。

使い方はTips note by TAM さんが参考になります。

さて、フィーチャーフォンでどれくらい見られてるか、はたまた見られてないか明日以降が楽しみですね。
来年度の予算が取れますように。

こちらにアクセスして、その色が好きか好きじゃないかをクリックするだけで
好みの配色が作れるツールです。とっても便利!
http://www.palettable.io/

新年あけましておめでとうございます。

近年、日本語のクラウドフォントが充実して利用しているサイトも増えています。
中でも無料&アカウント登録なしで即使えるGoogleのNotoは人気です。

今年最初にオフィスに着くと数人で「クライアントさんにNoto Sans で提案してるけど、上手く表示できないからフォント本体をサーバに置いて…」とミーティング中。

え!?フォント本体って、ちょっとちょっと、それじゃクラウドじゃなくなってしまうでしょ。

私「HTMLのheadにこれ1行追加して。<link href=”//fonts.googleapis.com/earlyaccess/notosansjapanese.css” rel=”stylesheettype=”text/css“>」

「…」

「解決しました」

「えー、でもネットで調べたらどこ見てもcssに@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);を追加するように書いてるんですけど」

確かにそうですが、実績としてcssに書くと表示されず、HTMLに書くと問題なく表示さます。
根本的な解決になっていないような気がします?

とりあえず急いでるならHTMLに記述しましょう。

最近制作したイベントサイト制作時に起こったこといろいろ覚書です。

jQueryでID,classの競合

複数のjQueryを実装しているうちに何かが競合。
javascript内で指定しているIDとオリジナルで使用しているIDや付属cssで定義しているクラスとオリジナルcssのクラスなど。
jQueryとcssがセットになっている場合は特に注意。

httpsのページでのjQuery読み込み

「httpsでエラー出る~なんかもう、わけわからん」とならないように1つのjQueryのみ//で読み込み。

Webフォント

Webフォントは独自に「高さ」を持っているので、cssで意図したようにならない場合がある。
ScrollPaneと併用する場合ブラウザによって下まで見えない。

縦書き

cssで縦書き指定が出来るようになったり、調整のためのjQueryが公開されていたりして、
確かに実装はできるが、クロスブラウザの調整にはかなり労力がかかる。(とくに火狐)
現時点ではお勧めできない。

動画のコーデック

最初の動画と再納品された動画のコーデックが違ってた!!(動画製作者様マター)