WWW Watch

Windows で游ゴシックが細字になってしまう件は誰が悪いのかについて CSS 仕様から考えてみる

Windows で 「游ゴシック」 フォントを使用すると細字で表示されちゃって困るという話、なんか Twitter で下記の記事が回ってきたので、あぁそういえばそんな問題がありましたよねと思い出したのですが、ちょっと気が向いたのでこれを CSS の仕様を基に考えてみたいと思います。

要するに上記の記事の方が言うように制作者サイドの問題なのか、それとも Windows のレンダリングが悪いのかという話ですが、結論から言えば Windows が悪いってことでいいんじゃないかと思います。あと気になって自分の環境で調べてみたら、少なくとも Windows 10 ではこの問題は起こらないみたいですね。

Continue reading

AMP (Accelerated Mobile Pages) バリデータの Web 版が公開される

AMP (Accelerated Mobile Pages)

AMP (Accelerated Mobile Pages) の文法が妥当かを検証 (バリデーション) する機能としては、#development=1 を付与した上で開発者ツールによる検証を行う機能が当初から AMP フレームワークの標準機能として提供されていましたが (参考記事)、もっと簡単にバリデーションを行うため、Chorme 拡張が今月に入ってリリースされています。

今回は、この AMP バリデータの Web 版が新たに公開されましたよというお話。Web 制作関連の人ならお世話になる 「The W3C Markup Validation Service」 と同様に、AMP HTML が妥当かを簡単にチェックすることが可能です。

Continue reading

jQuery 3.0 が正式リリース、通常の Web サイト制作で利用するなら軽量版 「Slim build (スリムビルド)」 が便利

jQuery

米国時間の 6月 9日付けで、jQuery 公式サイトにてアナウンスされましたが、jQuery 3.0 の正式版がリリースされました。

2014年の 10月に jQuery 公式 Blog に投稿された記事 (参考エントリー) で、次期リリースから現状の jQuery 2.x 系の後継を 「jQuery 3.0」、1.x 系の後継を 「jQuery Compat 3.0」 と名称変更した上で、今までメジャーバージョン番号が異なっていた 2つの jQuery を、jQuery 3.x に統一すると発表されていましたが、それから約 1年半を経て、今回ついに jQuery 3.0 の正式リリースとなりました。

ちなみに 「jQuery Compat 3.0」 については IE8 のサポートが Microsoft によって打ち切られたことで (参考エントリー)、リリース候補版の公開時になかったことになって消滅しています。

Continue reading

Firefox 47 がリリース、CSS Mask Image プロパティへの対応やVP9サポートの有効化など

Firefox

Firefox の最新版、Firefox 47 が正式リリースされ、自動更新も提供開始されました。Android 版も同時公開。

CSS 関連では 「CSS Mask Image プロパティ」 や 「::backdrop 疑似要素」 への対応が行われました。また、「Fullscreen API」 の接頭辞が外れたほか、高スペックなマシンでは VP9 コーデックの利用が可能になり、また、Flash 以外すべてのプラグインが初期設定で 「クリックして有効化」 になるなどの変更が加えられています。

Continue reading

HTML 5.1 が今年 9月の勧告に向けて勧告候補への移行検討段階へ、HTML 5.2 の策定も開始

HTML5

今年 4月6日に 「Working on HTML5.1 - W3C Blog」 というエントリーが W3C 公式 Blog に投稿され、2016年 9月には HTML 5.1 を勧告として公開する計画がアナウンスされましたが、これに関連して先週末、下記の通り、現在最新の HTML 5.1 Working Draft を勧告候補(CR - Candidate Recommendation) に移行する提案(CFC - Call For Consensus)がされた旨、公式 Blog にてアナウンスされました。

Continue reading

AMP HTML でアコーディオンやカルーセル表示などを実装する拡張コンポーネントを使ってみる

以前、AMP (Accelerated Mobile Pages) HTML に関する基本的な記事と、拡張コンポーネントを利用した AMP HTML への Google Analytics 導入方法について記事を書きました(下記リンク参照)。

AMP の拡張コンポーネント (Extended components) には、上記で書いた、amp-analytics コンポーネント以外にも色々と用意されていて、その中には、AMP HTML 内でカルーセルやスライドショー、あるいはアコーディオン式の UI を実装したり、ソーシャルボタンを設置するための拡張コンポーネントが用意されています。そこで、個人的に気になったものをいくつか取り上げて、簡単に解説してみたいと思います。

Continue reading

Surface Pro 3 が 「Surface」 ロゴ表示で固まって起動しなくなった時の対処方法

以前、この Blog でも簡単なレビューを書いた通り、長らく Surface Pro 3 (Windows 10 にアップデート済み) を仕事で持ち歩く PC として使っているんですが、先日タイトルの通りの症状に遭遇したのでメモ。

Surface Pro 3

外出先で時間があったから少し仕事すっかと思って立ち上げようと思ったらこうなったんで、結構イラついたんですけどね(笑) とりあえずスマホで Microsoft さんのヘルプを検索して、解決策を見つけ、無事解決。

ただ、私がハマった症状については今のところ英語でしか情報が提供されていないようですので、同じことで困っている人がいたらということで書いておきます。

Continue reading

CSS で計算(四則計算)が行える calc() 関数を使ってみよう

CSS の calc() 関数は、CSS プロパティに指定する値を計算式で書くことができる仕様です。

ちょっと前に Firefox 48 が、この calc() 関数の入れ子表記に対応した件で下記のような記事を書いたのですが、その時参考にリンクを張ろうとした、過去に calc() 関数についての解説を書いた記事がもう6年も前の記事で、さすがに古すぎるということでリンクを張れなかったんですが、いい機会なのでちょっと書き直してみます。

なお、上記記事でも書いたとおり、calc() 関数は現時点で IE (IE11)や Edge を始め、Firefox、Chrome、Safari など、ほぼすべてのモダンブラウザがサポートしていますので、念のため古いブラウザ向けに最低限のフォールバックとなる記述だけしておいてあげれば問題なく使用できます。

Continue reading

GitHub が新料金プランを発表ということで新旧料金プランを比較してみた

GitHub がアムステルダムで開催したイベント 「GitHub Satellite」 において新しい料金プランを発表したとのこと。

プライベートリポジトリ数が無制限になり、個人ユーザーにとってはうれしい一方で、ユーザー数が多い組織向けアカウントにとっては値上げになる可能性もありと、反応が分かれる料金改定になったようです。

ということで、簡単に新旧料金プランを比較してみました。

Continue reading

Firefox 48 は CSS calc() 関数の入れ子に対応、CSS カスタムプロパティとの併用がより便利に

Firefox

CSS の calc() 関数は、サイズや形状を決定する値の指定を計算式で書くことができる仕様で、現時点では IE (IE11)や Edge を始め、Firefox、Chrome、Safari など、ほぼすべてのモダンブラウザがサポートしています

ちょっとした計算を簡単に書けるので私もよく使用する記述なのですが、現在、Beta リリースの Firefox 48 は、この calc() 関数の入れ子記述に対応しました。後述しますが、CSS Variables (CSS カスタムプロパティ) と組み合わせるときにかなり便利になりました。

Continue reading

Recent Entry

全ての記事一覧を見る

Hot Entry

逆引きおすすめエントリー