はてなブックマーク

先日Twitterにこんな投稿をしたら地味に伸びたので、私も含めて案外みんな2014年に勧告された後のHTML5の仕様変更は追ってないのかなと思い、自分のための備忘録も兼ねて主な変更点をメモしておきます。 なお自分はマークアッパーなので、仕様変更点全てを網羅するのではなく、あくまでHTMLマークアップに関連する部分のみピックアップすることとします。全ての変更点を確認したい人はW3Cの仕様書をあたってください。 2016年HTML5.1勧告時の仕様変更 HTML5.1勧告時の注意すべき仕様変更点は以下の通り。 【追加】 ・picture要素とsrcset属性の追加 ・details要素とsummary要素の追加 【削除】 ・ネストされたセクション要素の見出しに全てh1を置くこと ・tfoot要素をtbody要素の前に置くこと 【変更】 ・セクション要素の中のheader/footer要素は入

2016年11月1日付でW3CがHTML5.1を勧告しました。 HTML5からの変更差分はこちらにまとめられていますので、詳細はこちらを見ていただくとして、 今回はその中で「removed」つまり削除された仕様の一覧の中にあった次の項目に注目したいと思います。 ・The use of nested section elements each with an h1 to create an outline. （・アウトラインを生成するためにそれぞれh1を持つネストされたセクションを使用すること） HTML5でのアウトラインと見出しのルール 2014年勧告のHTML5では、「セクショニング・コンテンツの入れ子によって正しく階層構造がマークアップされている場合、その中で使用される見出しレベルは問わない」という仕様がありました。 このことはHTML4.01からHTML5になったときの大きな仕様変更

先日Photoshop CC 2015がリリースされ、画像の書き出し関連がまた変更になりましたね。 Webデザイナー＆コーダーの皆さんは、普段画像の書き出しにどの機能を使っているでしょうか？ CS6・CC・CC2014・CC2015の各バージョンで少しずつ搭載されている機能に違いはありますが、現在PhotoshopからWeb用画像素材を書き出す方法としては下記の4つの方法が考えられるかと思います。 スライス→Web用に保存（CS6〜） Generator機能→画像アセットの生成（CC〜） アセットの抽出（CC 2014） 「新」書き出し機能（CC 2015） 私は長らく1の「スライス→Web用に保存」を愛用してきましたが、昨年あたりからもっぱら2の「Generator機能による画像アセットの生成」を使うようになりました。 ▼「画像アセット」 まず「Web用に保存」と比較した場合の「画像アセ

iOS8からはzoomが効かない 今から2〜3年前、スマホサイトのRetinaディスプレイ対応をしなければならなくなった時に、予算とかスケジュールの都合で簡易対応として以下のようなコードで強制的に全部のimg画像を1/2表示にして作っていた時期がありました。 img{zoom:0.5;} この方法だと、img要素にいちいち1/2サイズを指定しなくても勝手に1/2サイズで表示してくれるので、レスポンシブではないスマホ専用サイトでリキッドレイアウトにする時非常に重宝していたのですが、、どうやらiOS8でzoomがサポートされなくなったてしまったようです。（涙） zoom:0.5が効かなくなったiOS8では、原寸で320pxを超えるサイズの画像があると、こんな感じで画面からはみ出して表示されてしまいます。 iOS8がリリースされて立て続けに３件ほど、これが原因の修正依頼が入ってしまい、ちょっと慌