タグ

htmlに関するahmokのブックマーク (12)

  • HTML5やCSS3を使った次世代表現を学ぶのに役立つコードサンプル

    わずか280行程度のJavaScriptで作られ... / JavaScriptで作るいろいろな物理シミュレ... / JavaScriptによる波の物理シミュレーショ...他...全14件

    HTML5やCSS3を使った次世代表現を学ぶのに役立つコードサンプル
    ahmok
    ahmok 2013/04/10
    なんかすごい
  • これはすごい! フォーム最適化に役立つグーグル提案のautocomplete新仕様 | 初代編集長ブログ―安田英久

    ※2012-04-07 セキュリティ面の問題に関して追記しました。 今日は、ウェブページの入力フォームでユーザーが楽にしかも正確に入力できるようにできる(可能性を秘めた)、新しいHTMLの仕様についての情報を。autocomplete属性に関する新しい仕様です。 グーグルは、入力フォームに自動入力する仕組みに関して、新しい仕様を提案しました。HTMLの仕様を拡張することで、ブラウザでフォームに自動入力する仕組みを使いやすくするものです。 これがうまく動作すると、フォーム入力が非常に楽になり、ミスもほぼなくなります。 どれぐらいすごいかというと、ちゃんと設定したブラウザを使うと、フォームで3クリックするだけで、一般的な項目が一気に入力されるのです。 たとえば、この状態から、 名前や住所などの標準的な項目が、一気に自動入力されます。 どうでしょう。こうした機能をサイトに設けられたら、フォームの

    これはすごい! フォーム最適化に役立つグーグル提案のautocomplete新仕様 | 初代編集長ブログ―安田英久
  • 築地本願寺のHTMLソースわろたw

    築地願寺のHTMLソースわろたw

    築地本願寺のHTMLソースわろたw
    ahmok
    ahmok 2011/02/27
    見えない(見せない)ところもこだわるっていいなあ
  • 1分でわかる「X-ナントカ」HTTPレスポンスヘッダ - 葉っぱ日記

    最近のモダンなWebブラウザがサポートしている、セキュリティに関連しそうな X- なHTTPレスポンスヘッダをまとめてみました。それ以外にもあったら教えてください。 X-XSS-Protection 0:XSSフィルタを無効にする。 1:XSSフィルタを有効にする。 XSSフィルタを有効にすることでエンドユーザがXSSの被害にあう可能性が低減するが、まれに誤検知することで画面の表示が乱れることもある。IE8+、Safari、Chrome(多分) で有効。IEでは「X-XSS-Protection: 1; mode=block」という指定も可能。 2008/7/2 - IE8 Security Part IV: The XSS FilterBug 27312 – [XSSAuditor] Add support for header X-XSS-Protection X-Content-Ty

    1分でわかる「X-ナントカ」HTTPレスポンスヘッダ - 葉っぱ日記
    ahmok
    ahmok 2011/01/08
    タンポポをのせるのが楽しいサイトです。
  • HTML5で進化したフォーム機能 ここが違う!サンプルで見るHTML5(5)

    はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回:HTML5が注目を浴びる理由とは? 第2回:HTML4から変化したHTML5のマークアップ 第3回:HTML5で再定義された要素と属性 第4回:HTML5で実現できるマルチメディア系機能 新たに導入されたフォームコントロール これまでウェブにおける入力フォームコントロールは、非常に限られたものしかありませんでした。皆さんがよくご存じのテキスト(パスワード)入力フィールド、ラジオボタン、チェックボックス、セレクトメニュー、テキストエリア、ファイル選択です。お問い合わせフォームであれば、ほとんどのシーンで十分といえるでしょうが、ウェブアプリケーションにおいては、不足してい

    ahmok
    ahmok 2010/12/26
    jsやphpでやってたことがhtmlで書ける時代なのかあ
  • 見ておくべきHTML5サイト集:phpspot開発日誌

    5 Must See HTML5 Sites 見ておくべき、かどうかは分かりませんが、HTML5の可能性について知ることができるサイト集です。 ビデオ、キャンバス、ドラッグ&ドロップ、ストレージ等HTML5のデモ集。 サポートブラウザの対応もアイコン付でわかりやすいサイト。 CanvasでWindowsのPaintを実現した凄いサイト HTML5で書かれたサイトのギャラリーサイト。 といった感じでHTML5について学べるサイト集。暇なときに眺めるだけでも予習になりそうですね。 関連エントリ 無茶苦茶カッコいいHTML5ビデオプレイヤー「SublimeVideo」 最近公開のHTML5関連の参考サイト色々まとめ

    ahmok
    ahmok 2010/05/23
  • HTML5で作られた画像加工サイト「Mugtug Darkroom」がすごすぎる*二十歳街道まっしぐら(FC2ブログ時代)

    「Darkroom」はHTML5で作られたオンライン画像加工サイトです。 ちょこっと加工するくらいなら十分なくらいの機能をもっています。 HTML5で作られたってとこがすごいですねー。 IE8では動きませんでした。 以下に使ってみた様子を載せておきます。(※Chrome dev 6使用) まず「Darkroom」にアクセスします。 うお、めちゃくちゃ高機能っぽそう!これがHTML5!? 以下に各機能をざっと紹介します。 トリミングや反転、赤目補正などがあります。 カラーバランスや露出の調整。 こちらはエフェクト。用意されている10ほどのエフェクトから選びます。 IE8ではご覧の通り、エラーで動いてくれません。 一見Flashでも使ってるのかなと思っちゃうくらいリッチですね。 動作もサクサクしていて実用的! (記事で紹介したサイト:Darkroom)

    ahmok
    ahmok 2010/05/23
  • HTMLで図まで描ける!進化した「HTML5」ってどんなもの? - はてなニュース

    HTML言語の最新バージョンとして、現在標準化作業が進められている「HTML5」。はてなブックマークでもこのキーワードを目にする機会が増え、「HTML5って何?」と疑問に思っている人も多いのではないでしょうか。今回は、「HTML5って何?どんなことができるの?」という疑問にお答えしたいと思います。 ■HTML5でできること まずは、HTML5を使うと具体的にどんなことができるのかを見ていきましょう。 <具体的に何ができるの?> ▽HTML5.JP - 次世代HTML標準 HTML5情報サイト ▽HTML5とは?変わるWebと注目の新要素 HTML5.0の情報サイト ▽大幅に進化した次世代 HTML 規格「HTML5」とは? - japan.internet.com Webビジネス ▽HTML5, きちんと。 ▽めざましTech - HTML5 についての Q&A ▽2010年に勧告される「

    HTMLで図まで描ける!進化した「HTML5」ってどんなもの? - はてなニュース
    ahmok
    ahmok 2010/02/04
  • HTMLDocument の動的な作成: Days on the Moon

    ブラウザ上で、JavaScript を使って HTML のソースから HTML 文書を生成するのに、どんな方法があるのか調べました。なお、以下のスクリプトは HTML 文書上で実行することが前提です。 表の見方 XSLT の HTML 出力 createHTMLDocument メソッド createDocument メソッド createDocument メソッドと名前空間の指定 createDocument メソッドと文書型宣言の指定 createDocument メソッドと文書型宣言及び名前空間の指定 cloneNode メソッド iframe 要素 ActiveXObject CID からの作成 まとめ 表の見方 以下の表において、各項目の意味は次の通りです。 doc HTML 文書を作成できれば○、XML 文書を作成できれば△、それ以外なら×です。HTML 文書かどうかは、cre

    ahmok
    ahmok 2009/10/30
  • hxxk.jp - DOCTYPE スイッチについてのまとめと一覧表 (HTML 5 や IE 8 Beta 2 のモードスイッチなどの情報も含んだ 2008 年版 )

    DOCTYPE スイッチについて再度まとめ 以前 DOCTYPE スイッチについての検証とまとめと一覧表という記事で DOCTYPE スイッチについてまとめましたが、あれから 2 年弱が経過したので、改めてまとめてみようと思います。 まとめるまでの話がけっこう長いので、一覧表だけ参照したい ! という場合は DOCTYPE スイッチの一覧表をご覧ください。 DOCTYPE スイッチとは何か そもそも DOCTYPE スイッチとは何か、というのがまず書くべきところですが、これは私が書かずとも良質のリソースが各種ありますのでそのリンクのみまとめておきます。 !DOCTYPE スイッチ 各UAのDOCTYPEスイッチについて - CSS Dencitie Mozilla's DOCTYPE sniffing - MDC Mozilla's DOCTYPE sniffing - MDC ( 日

    ahmok
    ahmok 2008/09/29
  • HTML 5では「article」タグでページの「本文」が取れる - モジログ

    次世代HTMLの「HTML 5」について、そのウワサは以前から耳にしながらも、中身については知らなかった。 仕様や解説記事(末尾にまとめた)をいくつか流し読みしてみて、驚いた。これこそ、私の求めていたものだ。 私は以前より、Webページの「文」がどこからどこまでなのか、ソフトウェアで判定できる標準的な方法があればいいとずっと思っていた(「フィードをアイテム単位に区切れば、セマンティック・ウェブが一気に現実化する」)。HTML 5では、いくつか導入される新しい要素(タグ)の中に「article」というものがあり、これがまさに「記事」の範囲を示すものなのだ。 これさえあれば、プログラム的にWebページを取得して、その「article」タグの部分だけ抽出すれば「文」になる。あらゆるWebページにこの「article」タグが入ってくれば、もうフィードに頼る必要もなく、どんなページの「文」でも

    ahmok
    ahmok 2008/08/11
    CSSはプログラミング言語化しそうだけど、HTMLはより分かりやすくなるみたいだな / header,nav,aside,article(section),footer
  • Bluefish Editor : Home

    About Bluefish Bluefish is a powerful editor targeted towards programmers and webdevelopers, with many options to write websites, scripts and programming code. Bluefish supports many programming and markup languages. See features for an extensive overview, take a look at the screenshots, or download it right away. Bluefish is an open source development project, released under the GNU GPL licence.

    ahmok
    ahmok 2008/05/28
  • 1