Google Code Archive - Long-term storage for Google Code Project Hosting.Code Archive Skip to content Google About Google Privacy Terms
Dive Into HTML5
by Mark Pilgrim with contributions from the community Dive Into HTML5 elaborates on a hand-picked selection of features from the HTML5 specification and other fine standards. We encourage you to buy the printed work — Mark Pilgrim’s artfully titled “HTML5: Up & Running” — published on paper by O’Reilly, under the Google Press imprint. Your kind and sincere feedback is always welcome, and this work
市販ソフト顔負けの機能を備えるHTMLエディタ「KompoZer」 | OSDN Magazine
ブログやCMSの普及によって、Webサイトの制作時にHTMLを書く機会は減った。しかし、ちょっとしたデザインの変更や内容の手直しには、やはりHTMLを直接編集するのが一番だ。そこで役に立つのがHTMLエディタ・Webオーサリングツールである。今回紹介するのはフリーでありながら豊富な機能を備えるHTMLエディタ・Webオーサリングツール「KompoZer」だ。 KompoZerは、FirefoxやThunderbirdなどで知られるMozillaプロジェクトが開発していたHTMLエディタ「Composer」の後を継いで開発された「Nvu」の派生版で、実質的な後継ツールとなる。その特徴は「IBM ホームページビルダー」や「Adobe Dreamweaver」といった市販ソフト顔負けの高機能ぶりにある。WYSIWYG編集が可能であり、HTMLタグの知識がなくてもワープロソフトを使う感覚でHTML
Zen-Codingで楽々コーディング! + コツ1つ
話題のHTMLやCSSコーディングあしすとツールのzen-codingを触ってみました。すごい楽ちんこ! zen-codingって何？使い方は？という人は以下のページを見てくださいね。 Zen-Codingでできるあんなことこんなこと 知らない人は損してる？コーディングが3倍速くなるZen-Codingを導入してみた ある程度HTML/CSSのコーディングに慣れた人なら、ビジュアルデザインを含んだ文書があれば、それをもとに脳内でHTML構造に置き換えられますよね。デザインから興す人は、Photoshopを触りながら、同時に頭の中でHTMLを組み立ててる人も多いんじゃないでしょうか。 たいていの文書は、小さなパターンと大きなパターンの繰り返しだし、コンテンツに関しての試行錯誤はあっても、HTMLの記述で試行錯誤するってことは無いんですよね。(CSSのブラウザの実装の関係とかこの際忘れよう)
HTMLを小さくするツール「HTML Minification」 | エンタープライズ | マイコミジャーナル
Perfection kills - Exploring Javascript by example WebサイトやWebページの表示パフォーマンスを向上させるためにJavaScriptやCSSのミニファイを実行するというのはよくやる作業だ。JavaScriptやCSSをミニファイするためのツールもいくつも発表されており、ビルドシステムに組み込んで使っているケースも多いだろう。しかしHTMLに関してこうしたミニファイツールはあまり提供されていない。 Juriy Zaytsev氏がPerfection kills ≫ Experimenting with html minifierにおいてHTMLをミニファイするためのオンラインツールHTML minifierを紹介している。jQueryの開発者であるJohn Resig氏が開発したJavaScript HTMLパーサを使って開発されたツール
HTML - meta タグの仕様詳細まとめ :: Drk7jp
前エントリ - Internet Explorer のイメージツールバーを無効化する meta タグ で予告したとおり meta タグについて生まれて初めてまじめに調べてみました。改めて調べてみると知らなかったこと満載です。っていうか Web エンジニアたるもの一度は W3C勧告 くらいは一通り目を通しておかなくてはダメだなと思ったりしました。面倒なくらい分量があるけど。ひとまず meta タグ情報としての自分にとって永久保存版まとめという位置づけです。 まずは参考になったサイトの紹介から。 W3C勧告HTML4.01 :: The global structure of an HTML document W3C勧告HTML4.01 私的日本語訳 :: The global structure of an HTML document(ja) rfc2616.txt Another HTML
横並びのフォームのマークアップ - Webtech Walker
以下のような、よくある横並びのフォームですが、どのようにマークアップするのがいいのか迷います。 今まではよく定義リスト(dl)を使ってマークアップしていまたのですが、他にもいろいろなマークアップがありそうなので書き出して見ました。 labelをうまく使えば余計なタグを入れなくてすみます。今回はposition:absoluteで横並びを実現してます（tableを除く）が、floatを使う方法もあります。僕はもっぱらposition派。 リスト(ul,ol) シンプルで、構造の意味的にもしっくりきます。順序付きリスト(ol)か順序無しリスト(ul)にするかはケースバイケースです。 DEMO <ul id="formItems_1"> <li><label for="commentAuthor_1">名前</label><input type="text" name="author" valu
base要素 | ばけらの HTML リファレンス(未完成)
baseの解説HTML 文書の基準 URI を指定します。href属性に書かれた URL が、この文書の基準 URL とされ、相対参照を解釈する際に利用されます。たとえば、 <base href="http://www.ne.jp/asahi/minazuki/bakera/html/hatomaru.html" /> …… <a href="#top">先頭へ</a> <a href="./">インデックスページへ</a> となっているとき、最初の "#top" は "http://www.ne.jp/asahi/minazuki/bakera/html/hatomaru.html#top" に、"./" は "http://www.ne.jp/asahi/minazuki/bakera/html/" に、それぞれ解釈されます。 base の指定は、他のあらゆる URI の指定よりも前に
Microformats x SwapSkills 個人的まとめ « Study « Forest.Kの徒然日記
Home Study Microformats x SwapSkills 個人的まとめ Microformats x SwapSkills 個人的まとめ April 17, 2008 02:31 forestk Comments(0) TrackBack(2) Microformats x SwapSkills 個人的まとめ #forestk Posted in Study Tags : Microformats マイクロフォーマット アップルストア hAtom hCard SwapSkills: 『Microformats x SwapSkills』アップルストア銀座 に行ってきました。 最近、またなんか Microformats が盛り上がっていたりもするらしいのですが、なかなか日本ではこれと行った情報源がほとんど無いのが現状です。 今回は、microformats.biz の中の人が
技術メモ帳 - Iframe の designMode="on" によるリッチテキストエディット
こんな属性があるのを知らなかった。 実際には、Iframe の属性ではなさそうだが。 どうも、javascript で以下のように指定してあげる事により、 リッチなテキスト編集機能が有効になるようだ。 iframe.contentDocument.designMode = "on"; ちょっとサンプルを作ってみた。 選択範囲の色変えたり、画像貼付けたり出来ます。 http://gomibako.hahaue.com/rth.html (Firefox only) 実際に文字の状態を変化させたりしたい場合は、 同要素の execCommand メソッドを使用すればよい。 たとえば、文字を太字にしたい場合は、 以下のように指定するだけで良い。 iframe.contentDocument.execCommand("bold",false,null); 色を赤くしたければ、 iframe.con
Beautiful Soup: We called him Tortoise because he taught us.
You didn't write that awful page. You're just trying to get some data out of it. Beautiful Soup is here to help. Since 2004, it's been saving programmers hours or days of work on quick-turnaround screen scraping projects. Beautiful Soup is a Python library designed for quick turnaround projects like screen-scraping. Three features make it powerful: Beautiful Soup provides a few simple methods and
2310::blog: Markdown文法の全訳
Markdownは可能な限り簡単に読み書きできるようにしたものです。 Markdownのルールで書かれたテキストはタグなど複雑な要素が用いられていないため 直感的に分かりやすく、HTMLに変換しないままでも配布することが可能です。 MarkdownのルールはSettext、 atx、 Textile、 reStructuredText、 Grutatext、 EtTeといったテキスト文書をHTMLに変換するツールを参考にしています。 しかし、何よりメールで用いられている表現を参考にしています。 最後に、Markdownのルールは、ハイフンやセミコロンといった記号を使用しています。 これらの記号は、それを実際に使用した効果を考え選び抜かれているものです。 例えばMarkdownでも(メールなどと同様)単語を アスタリスク(*)で囲むと*強調*となります (2310注：英文メールではアスタリス
TAKESAKO @ Yet another Cybozu Labs: 続イメージファイト - HTML 2.0 New Browser Detection
Shibuya Perl Mongersテクニカルトーク#8 で発表した「続イメージファイト」の資料を SlideShare で公開しました。 Shibuya.pm#8 続イメージファイト - HTML 2.0 New Browser Detection JavaScriptやCSS Hacksを一切使わずにHTMLでブラウザを判別するハックの紹介です。 HTML 2.0 - Browser detection [3] ブラウザ判別のデモのページにアクセスすると、使っているブラウザの画像が表示されます。 このimgタグのsrc属性はfirefox2.0、firefox1.5、その他のGeckoエンジンを搭載したブラウザ、Safari2、Safari3、Opera、ie、w3m、lynxなどのブラウザの判別に対応しています。 テキストブラウザの判別
HTML - link要素の使い方 - linkとサーチエンジン
HTML のhead要素の中で使われる要素の一つにlinkがありますが、きちんと実装しているブラウザが少なく、入門用の解説書でもほとんど触れられていないので、存在もあまり知られていません（最近ではスタイルシートのために少しずつ使われ始めているような）。ここでは、その基本的な役割と使い方を紹介します。 link要素タイプ リンクタイプ linkとサーチエンジン 順方向リンクと逆方向リンク link要素タイプ アンカー（a）要素は、文書の本文であるbody要素の中で、文書の特定箇所にハイパーリンクの始点や終点を設定し、利用者がそのリンクをたどれるようにする役割を持ちます。これに対し、link要素は文書全体についての情報を記述するhead要素の中に置かれ、HTML文書を前後の文書、スタイルシート、スクリプト、代替文書などの様々なリソースと結びつける働きをします。ブラウザなどのユーザーエージェント
XHTML タグ一覧表示ツール
下に表示されている XHTML タグをクリックすると、その下にある枠内に、 正しいマークアップ 使用可能な子要素（または親要素） 使用可能な属性 が表示されます。XHTML タグを記述する際、「このタグの書き方は？」「このタグの子要素（または親要素）には何が書けるの？」と思ったら使ってください。元データは Another HTML-lint のタグ一覧を利用しています。 クリック表示 マウスオーバー表示 属性表示 XHTML 1.0 Transitional [ 閉じる ] <a> <abbr> <acronym> <address> <applet> <area> <b> <base> <basefont> <bdo> <big> <blockquote> <body> <br> <button> <caption> <center> <cite> <code> <col> <colgr
Tidy
Tidy is a console application for macOS, Linux, Windows, UNIX, and more. It corrects and cleans up HTML and XML documents by fixing markup errors and upgrading legacy code to modern standards. libtidy is a C static and dynamic library that developers can integrate into their applications in order to bring all of Tidy’s power to your favorite tools. libtidy is used today in desktop applications, we
window.onload と <body onLoad> の違い
JavaScript 使いじゃないので，何が違うのかよく分かってなかったのでちょっと調べたメモ． そもそも window と document.body が別の世界の存在だと考えたほうがよさげ． window はブラウザのウインドウそのもので，JavaScript の処理系が生きてる限り存在する (たぶん)． 一方，document.body は html から生成された DOM のオブジェクト． 以上 2 点からも，ページの遷移とかのブラウザの制御のようなことは window.onload に， ページ内に表示する何かは document.body.onload に，という使い分けがあるのだと思われます． body.onload と window.onload を同じように説明しちゃってるところはモグリ，ということで納得しました． 以下，参考になった情報源です． How
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Create a new fiddle - JSFiddle
HTML5.JP - 次世代HTML標準 HTML5情報サイト
はてなブログ | 無料ブログを作成しよう
