Schema.org - Schema.org
Note: you are viewing the development version of Schema.org. See How we work for more details. Welcome to Schema.org Schema.org is a collaborative, community activity with a mission to create, maintain, and promote schemas for structured data on the Internet, on web pages, in email messages, and beyond. Schema.org vocabulary can be used with many different encodings, including RDFa, Microdata and
犯してはいけないHTMLタグの過ち10個
【追記】 HTML5ではインラインとブロックの要素分類がなくなり、代わりに、メタデータ、フロー、セクション、ヘッディング、フレージング、エンベッディッド、インタラクティブというコンテンツの種類が定義されています。 2. 画像に代替テキストのalt属性が入っていない <img src="sample.gif" /> alt属性は、Webページに表示されるすべての画像に必須の要素ですので、必ず使用する必要があります。 <img src="sample.gif" alt="サンプル" /> 必須の要素ですので、特にテキストで表示する必要がない場合でも、alt=""としておく必要があります。 【追記】 HTML5では「Images whose contents are not known(どのような内容かわからない画像)」に限り、alt属性を省略することができます。写真共有サイトにユーザーが画像を
HTML5+CSS3で実装された、さまざまなUIエレメントのコレクション
パラグラフ・リスト・見出しなど [ad#ad-2] UIパーツの使い方 下記の3つのステップで、これらのUIを自分のページで利用できます。 IEへの対応 IEにHTML5を理解させるために、2つの重要なファイルを使用します。 <!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]--> CSSのインクルード スタイルシートファイルをインクルードしてください。もし使用するエレメントが限られているのであれば、その箇所のみで大丈夫です。 <link rel="stylesheet" href="reset.css"
JavaScript HTMLテンプレートエンジン SNBinder 公開
先日予告したSNBinderのオープンソース化、GitHubに簡単なREADME付きでアップロードしたのでご覧いただきたい。 https://github.com/snakajima/SNBinder SNBinderは、ひと言で言えば「ブラウザー上でView(テンプレート)とData（JSON）を結合して HTML を生成するテンプレートエンジン」である。 ９０年の半ばから急速に広まったインターネット。サーバー側でダイナミックに生成したHTMLページをブラウザーで閲覧するだけ、というシンプルでエレガントなアーキテクチャゆえの成功だ。しかし、ブラウザーの高機能化に伴い、JavaScriptを駆使して使いやすさを向上しようという試みが色々なウェブサイトで行われている。GMail、Google Docs、Facebookなどは良い例だ。 その方向性を究極にまで突き詰めると、サーバー側は（MVC
TwitterやFacebookのURLには、なぜ#!が含まれるのか (SEOとAjaxのおいしい関係) - kazuhoのメモ置き場
Ajaxを使うためにはページ内リンク (hash fragment=URLの#以降) を使うのが一般的*1 hash fragmentはサーバに送信されないから、JavaScript非対応のブラウザだと動作しない 特にサーチエンジンのクローラ等で問題になる*2 そこで Google は、#! が含まれる URL を hash を含まないものに読み替える仕組みを提唱している。例えば「www.example.com/ajax.html#!key=value」のサーチエンジン用URLは「www.example.com/ajax.html?_escaped_fragment_=key=value」になる。 TwitterやFacebookはこの仕様に従うことで、Ajax な UI と SEO を同時に実現している、というわけ。ということを調べたなう。 参照: Getting Started |
HTML、CSSのリファレンス集·CodeBurner MOONGIFT
CodeBurnerはFirefox/Adobe AIR/Mac OSX用のフリーウェア。Webデザイナー、プログラマーであれば開発中にリファレンスが見たくなることが多いはずだ。都度Webサイトを検索しても良いが、手軽に使えるリファレンスが手元にあると便利だ。 HTMLタグの検索 特にブラウザ間の誤差があるプロパティなのか否かといった情報は重要だ。そうした情報をつかんでおけばデザインが開発がスムーズになる。多様なプラットフォームに対応しているのがCodeBurnerだ。 CodeBurnerはHTML/CSSのリファレンスを多数のプラットフォームを使って提供している。FirefoxとFirebug向けをはじめ、Adobe AIR、OSX Dashboard、Operaが現在提供されており、今後Dreamweaver版が提供予定になっている。 ソースをクリックすると説明が出る 2ペインの画面
ページの属性ごとに見出しの構造を変更するチュートリアル
The heading structure for your blog 下記は各ポイントを意訳したものです。 はじめに HTMLの見出しの5つの基本原則 トップページのための見出し構造 記事ページやシングルページのための見出し構造 カテゴリやタグの一覧ページのための見出し構造 見出しとHTML5 はじめに ページの見出し構造はSEOの非常に重要な要因の一つです。見出しはコンテンツのどの箇所が重要であるか、そしてそれらがどのように相互に結びつけられているかを定義するものです。 トップページ、あるいは記事ページ、カテゴリページなどそれぞれに適した見出しの構造があり、ここではそれを得るために基本的なポイントを説明します。 HTMLの見出しの5つの基本原則 構造の前に、見出しについて基本原則をまとめます。 ページに関する最も重要な見出しは「h1」であるべきです。 どんなページでも通常、たった一つの
iPhone向けサイト構築 基礎文法最速マスター - EC studio デザインブログ
弊社代表の著書、「iPhoneとツイッターで会社は儲かる」の出版記念と、巷で話題の「基礎文法最速マスター」ブームに便乗して、iPhone（iPod Touch）向けサイト構築における基礎とプラス応用のネタと、参考になるリンク集をまとめました。 2010/11/18追記： iPhone向けサイト制作の書籍を執筆しました！ 既存のデスクトップ向けサイトをモデルにした iPhoneに最適化したサンプルサイトの紹介と コードの解説をしています。 iPhone向けサイト制作の入門書に最適です。 「HTML5＋CSS3で作る 魅せるiPhoneサイト」 基礎編 対象ブラウザはMobileSafariです レンダリングエンジンはSafariと同じwebkitですが、MobileSafariの方にはiPhone向けの一部独自拡張（CSS）があります。検証の際は、通常のSafariのウィンドウサイズを狭くし
Aptana/NetBeans/TextMate/Codaと連携するHTML/CSS補完ツール·Zen-coding MOONGIFT
CSSやJavaScriptが多用されるようになり、一般的なオーサリングツールでは求めるデザインが容易にはうまくいかなくなっている。そのため技術者の場合は手打ちでHTMLを描く人も多いはずだ。だが、面倒なのは確かだ。 各種エディタで利用可能 もっとシンプルにタグ入力を行いたい、そう考える方に使ってみて欲しいのがZen-codingだ。 今回紹介するオープンソース・ソフトウェアはZen-coding、各種エディタと連携するHTML/CSS補完ライブラリだ。 Zen-codingは単なる入力補完ではない。その書き方が変わっていて、div#headerと書けば、<div id="header"></div>に展開される。もちろんクラスの場合はドットでつなげば良い。複数のクラス指定も可能になっている。詳しくは下記のチュートリアル動画を参考にされたい。なおTextMateで試したところ、一部うまくい
(X)HTMLにおいて属性値をダブルクオテーションでくくる習慣はどこから来たの？ - Trans
なぜだか分かりませんが、WordPressのいくつかのテンプレートタグでは、属性値をシングルクオテーション（単引用符）でくくって出力します。例えば、こんな感じ。 <link rel='index' title='NPtech.jp' href='http://www.nptech.jp' /> 「これ、なんかキモイ！」と思っていたのですが、仕様では特に問題ありません。 デフォルトでは、SGML規定はすべての属性値を二重引用符(ASCII十進34)または単引用符(ASCII十進39)のどちらかを用いて 囲うよう求めている。 http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/intro/sgmltut.html#h-3.2.2 ふむ、しかし、ぼく自身が単引用符でくくることはほとんどないし、ほかの人たちのコードを覗いてみても単引用符を使っているの
HTML5, きちんと。
This document describes how to configure Spring Security for authentication and authorization in a web application. It defines a WebSecurityConfig class that configures HTTP security with roles like OWNER and MANAGER for access control. It also defines a UserDetailsManager service for loading users and a User entity class implementing UserDetails. Tests are shown for security configuration, login,
xhtmlを中心にモバイルサイト構築ノウハウまとめ - 適当な日々
フリーランスでwebの仕事をしながらwebサービスとかを作ったり作らなかったり、成長と挫折の記録・・・かもしれない仕事で某ポータルサイトのモバイルページを構築するようになって1年近く。 ノウハウがある程度溜まってきたのでxhtmlのことを中心に色々とまとめてみる。 目次 雑多なこと ヘッダー divタグ spanタグ brタグ hrタグ imgタグ aタグ サンプル 雑多なこと 出力は基本Shift_JISで（ドコモ基準） 静的ページを作るときは拡張子を.xhtmlにしないとドコモ端末がxhtmlをhtmlと認識してしまう。 （というか静的ページは絵文字とかヘッダー周りで色々不便なので、止めといた方がいい） 動的ページを作るときはapplication/xhtmlをヘッダとして送信してやらないとドコモ端末がhtmlと認識してしまう。phpだと出力前にこんな感じの処理。 header("C
美しいHTMLの条件を綺麗にまとめた一枚の画像 - IDEA*IDEA ～ 百式管理人のライフハックブログ
ドットインストール代表のライフハックブログ
Another HTML-lint gateway
HTML文書の文法をチェックし、採点します htmllint.cgi ver1.21 / htmllint.pm ver3.30 文法しか採点しません。内容の良し悪しは採点されません。結果に疑問を感じたら必ず結果の解説を読んでください。満点で慢心しないでください。 チェックしない警告は減点対象外で、満点は 100点です。チェックしても減点されない警告もあります。気に入らないチェック項目は外すことができます。お好みに調整してください。 また、基本的な設定項目だけの簡易ゲートウェイもあります。いちいちオプションなんかどうせ指定しないや、という方はご利用ください。 ダイアルアップはつらいので、ローカル環境でチェックしたいとお考えの方は、ダウンロードのページを参照してください。 チェック方式 チェックしたいHTMLのURLを指定するか、HTMLを下のテキスト領域に直接記述して、[チェック] ボタ
HTML5 を学ぶための情報源まとめ
ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日本語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。 やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日本語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちなみに、XHTML 好きな私としては、XHTML5 で次のサイトリニューアルとか
Web標準化Tips - Web標準普及プロジェクト
特定のWebブラウザの独自拡張仕様を使っていたり、 特定のWebブラウザの表示が間違っていたために、 Mozillaによって実際に問題が発生した事例の修正方法を紹介しています。 また、ここで紹介する修正案は全てWeb標準仕様に基づいた内容となっています。
携帯サイト（html）の制作に入る前に確認しておきたいチェック項目 │ これからゆっくり考L +α
「デザインは素敵なんだけど、携帯でこれはちょっとできないなー」とか、「無理ではないけどできれば避けておいた方がいいよなー」っていうデザインがあがってくることが多い今日この頃。 モバイルコーディングをやり慣れている人じゃないとモバイルでできることできないこと、cssを使わないと実現できないこと、table使わないと実現できないこと、などが分かりにくいと思うので当然だとは思うのですが。 ですが、知っているのと知らないのとでは工数がかなり違ってきます。 一旦デザインして、コーダーにそれを見せて「ココとココとココは実現不可能。やり直してください。」で差し戻され、デザインをやり直してってなると、デザインも2度手間、デザインをチェックして無理な項目を洗い出すコーダーにも余計な手間がかかります。 今回洗いだした項目は、なんせ自分がコーダーなので、コーダーがデザインファイルをもらった時にバーッと見てチェッ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML+CSS templating
今風のウェブを作る際に使えるCSS/HTML/JSのテンプレ『Easy Front-End Framework』 - 100SHIKI 〜 世界のアイデアを日替わりで
サービス終了のお知らせ