みなさん、こんにちは お元気ですか?僕は元気です。 さて 最近よく、「いいね!」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP (Open Graph Protocol)と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー??とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す
最近ちょっと興味があったZen-Codingがvimでも出来るというプラグインがあったので試してみた。 Zen-Codingってのはプログラマが使うエディタについてるスニペット入力みたいな感じでHTMLがサクサク書けるようになるライブラリ。スニペットのHTML特化版。 CSSセレクタのような記法なので普段からWebの開発に関わってる人なら簡単に体得できると思う。 単体のエディタではなくプラグイン形式になっていて色々なエディタやIDEで使えるというのもいいところ。詳しくは下記サイトを参照。 zen-coding - Set of plugins for HTML and CSS hi-speed coding http://code.google.com/p/zen-coding/ vimプラグインはこっち。 Sparkup http://github.com/rstacruz/sparku
話題のHTMLやCSSコーディングあしすとツールのzen-codingを触ってみました。すごい楽ちんこ! zen-codingって何?使い方は?という人は以下のページを見てくださいね。 Zen-Codingでできるあんなことこんなこと 知らない人は損してる?コーディングが3倍速くなるZen-Codingを導入してみた ある程度HTML/CSSのコーディングに慣れた人なら、ビジュアルデザインを含んだ文書があれば、それをもとに脳内でHTML構造に置き換えられますよね。デザインから興す人は、Photoshopを触りながら、同時に頭の中でHTMLを組み立ててる人も多いんじゃないでしょうか。 たいていの文書は、小さなパターンと大きなパターンの繰り返しだし、コンテンツに関しての試行錯誤はあっても、HTMLの記述で試行錯誤するってことは無いんですよね。(CSSのブラウザの実装の関係とかこの際忘れよう)
Zen Coding refers to a neat way to write markup quickly. The following blogs provide summary and examples: http://www.456bereastreet.com/archive/200909/write_html_and_css_quicker_with_with_zen_coding/http://mondaybynoon.com/2009/08/17/the-art-of-zen-coding-bringing-snippets-to-a-new-level/ (skip the cruft about snippets)EmmetZen Coding has been renamed to Emmet and includes an expanded feature set
HTML文書の文法をチェックし、採点します htmllint.cgi ver1.21 / htmllint.pm ver3.30 文法しか採点しません。内容の良し悪しは採点されません。結果に疑問を感じたら必ず結果の解説を読んでください。満点で慢心しないでください。 チェックしない警告は減点対象外で、満点は 100点です。チェックしても減点されない警告もあります。気に入らないチェック項目は外すことができます。お好みに調整してください。 また、基本的な設定項目だけの簡易ゲートウェイもあります。いちいちオプションなんかどうせ指定しないや、という方はご利用ください。 ダイアルアップはつらいので、ローカル環境でチェックしたいとお考えの方は、ダウンロードのページを参照してください。 チェック方式 チェックしたいHTMLのURLを指定するか、HTMLを下のテキスト領域に直接記述して、[チェック] ボタ
この文書「HTML 5 における HTML 4 からの変更点」は、W3C の HTML ワーキンググループ による「HTML 5 differences from HTML 4 (Working Draft 22 January 2008)」の日本語訳です。 規範的な文書は原文のみとなっています。この日本語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。 原文が勧告 (Recommendation) ではなく、策定途中の草案 (Working Draft) であることにご注意ください。 原文の最新版 は、この日本語訳が参照した版から更新されている可能性があります。また、この日本語訳自身も更新されている可能性があります。日本語訳の最新版は、W3C 仕様書 日本語訳一覧 から参照することができます。 更新日: 2008-09-
Just type or paste an URL in the form above, and click on "check it" to see the magic. If you want to fine tune your validation, click on the "advanced" link. That's it! An Idea: The Social Media Algebra I used to be very good at maths. I really was. Then I started studying computer science stuff (which is normal for a computer scientist) and as time goes by, I forgot many of the coolest stuff I l
HTMLの参考書 スタイルシートの参考書 逆引きHTMLリファレンス はじめに 初心者向けの逆引きできるHTMLリファレンスです。 完全に該当するDTDは存在しませんが、IE4,NN4での使用は可能な実用的HTMLです。 何をしたいかさえハッキリすれば、このリファレンスから必要なタグを割り出すことが可能です。 ダウンロードしてオフラインでのお楽しみも可能ですので、かなり便利かも? 現在もメルマガと共に拡大中ですので、たまにはアクセスしてみて下さいね。 一部、W3Cの勧告するHTML文法に対してメーカが独自に拡張した要素や属性も含まれます。 従って、厳密にはこのリファレンスに該当するDTDは存在しませんので、ご了承下さい。 また、最も近いDTDはHTML3.2ですが、現時点ではHTML4.0への移行が奨められています。 このHTML4.0については、原本に基づいたリファレンスがありますのでご
table要素 <table> ~ </table> 表の大枠を示す要素です。表の大きさや罫線などは、この要素の属性で設定することになります。 tr要素 <tr> ~ </tr> 表の行を示す要素です。例えば、3行の表を作成する場合は、この要素を3つ配置することになります。 td要素 <td> ~ </td> 表のセル(データセル)を示す要素です。例えば、横に3つのセルを並べたい場合は、各行(tr要素)の中にこの要素を3つ配置します。 th要素 <th> ~ </th> 表のセル(見出し用のセル)を示す要素です。td要素の代わりにこの要素を使用すると、そのセルが見出しとして扱われます。 一般的なブラウザでは、この要素内の文字列は太字になり、セル内のセンターに表示されます。 tbody要素について HTML 4.01では、table要素内にtbody要素(行をグループ化する要素)を配置するこ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く