タグ

ブックマーク / tech.naver.jp (4)

  • flexboxの旧仕様、改定仕様、現行仕様の一覧 « NAVER Engineers' Blog

    暑さもやわらいできたような気配がしてきました。皆様いかがお過ごしでしょうか。 久しぶりのブログ更新です。UIT 富田です。 今回はCSSでのレイアウトをより柔軟にしてくれるflexboxについて解説します。 flexboxは大幅な仕様の変更が過去に2度もあり、各ブラウザとそのバージョンによって実装している仕様が異なるため、後方互換をきっちり対応しようとすると、gradientと並んで2大考えるのをやめたくなるプロパティとなっております。 しかしflexboxを利用することで、現時点ではCSSだけでの対応が難しかったり、複数のプロパティを複雑に組み合わせる必要があるレイアウト(例えば一番大きい高さに揃えた要素を横に並べたり、子要素を上下左右中央位置したりといったもの)が、容易に利用できるようになるという大きなメリットもあり、使えるならば使っていきたいプロパティでもあります。 にも関わらずf

  • 工数削減!Schema.orgをパーツ化しリッチスニペットを実装する « NAVER Engineers' Blog

    皆様、お久しぶりです。 NHN Japan ウェブサービス部の「キョウ」と申します。 前回の「初心者向けschema.org講座」に引き続き、 今回は「Schema.orgをパーツ化しリッチスニペットを実装する」方法についてお話しようと思います。 「Schema.orgで実装すると時間がかかる!」 「Schema.orgの為に工数はかけられない」 そんな方にお勧めです。 目次 1. 最近のSchema.orgについて(2012年6月) 2. Schema.orgのマークアップ方法について考えてみる 3. [対応案1] <meta>と<link>のみでSchema.orgを定義する(没案) 4. [対応案2] Schema.orgマークアップ専用のTable要素を用意 5. 最速実装する為のワークフロー 6. 今日のまとめ 7. 最後に ※ Naverの業務内容とは直接は関係ござい

  • 初心者向けschema.org講座 « NAVER Engineers' Blog

    NHN Japan ウェブサービス部の「キョウ」と申します。 NAVERサービスのマークアップ等を担当している、「突っ込みづらいキャラ」で有名な男ですw 今回はマークアップエンジニアSEOエンジニアの中で注目を集めている、 schema.orgについてご説明させていただきます。 この記事を読んでいる方の中には「schema.org公式サイト(英)」 「schema.org 日語訳」をご覧になった方も多いと思いますが・・・ 皆様理解できましたか? 正直難易度が高いと思うので、初心者向けに内容を砕いて説明していきます。 目次 1. schema.orgとは? 2. schema.org導入メリットは? 3. schema.org 初心者向けQ&A 4. schema.org実践編 5. 最後に 1. schema.orgとは? 簡単に説明すると、schema.orgの仕様通りにH

  • はじめてのCSSメタ言語はLessがおすすめ! « NAVER Engineers' Blog

    こんにちは、NAVER UIT つしまです。 Less & Sass Advent calendar 2011の8日目です。 これまでのAdvent calendarの記事で、SassやLessの概要、活用法などが見えてきました。 今回は、「Lessは機能不十分そうだし、Sassオシ多いし、Sassを使いはじめようかな・・」と思っている方に向けてはじめてのCSSメタ言語はLessがおすすめというおはなしです。 Lessって? 既にCSSとフレームワークとメタ言語(2日目記事)やLESS初心者向けのナニカ(4日目記事)でも紹介があったとおり、LessはCSSを記述するためのメタ言語です。 ただ後発であるにも関わらず、SassにあるのにLessにない機能は結構あって、例えば、ifやforなどの制御文、extendが使用できなかったり、cssへの出力形式がSassほど選べなかったり・・

  • 1