近年、個人や企業を問わず、HTML5でマークアップされたサイトが数多く登場しています。しかし、HTML5が浸透してから年月が浅いこともあり、有名な大企業のサイトですら、不適切なマークアップが見受けられます。本セッションでは、そのような不適切なマークアップを紹介し、どう直すべきかをみなさんと一緒に考察していきます。
調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。 HTML5入門シリーズ 折りしも東京では先日HTML5カンファレンスというイベントが開催され、webで飛び交う話題もそれについてのものがドンドン増えてきています。このブログでもたびたびHTML5のコーディングにおけるややこしい話題を取り扱っていますが、こういった需要はさらに増えていくのではないかなと思っています。 今回からたびたびHTML5入門と題しまして、HTML5を使ってweb制作をしていく上で避けては通れない基礎的な理解を深める為の文章を書いていきます。webcre8もHTML5は絶賛勉強中で、これはいち制作者としてHTML5によるコーディングをどうするべきかを考えた考察の覚書でもあります。間違いがあればガンガンツッコミをお願いします!知識のある人は単に「間違っている」という指
Document Data Structure in MongoDB Express MongoDB lets you easily store structured and unstructured data in a flexible and dynamic database schema. It supports CRUD operations on complex data objects using JSON as the main data type. Its an open source solution so it may not be as robust or well supported as commercial management tools. However it is easy to deploy and works well for most use cas
お久しぶりです。 カリスマスクレイパーのnogです。こんばんは。 最近仕事で使う言語がPerlに変わったのでRubyを書く量が当社比3分の1以下くらいに減ったんですがRubyネタです。 Rubyでスクレイピングとかやってると非常にお世話になるNokogiriですが、それを別の場所で活用できる方法を紹介します。 ユーザーにHTMLを入力させてそれを出力するような場合、ユーザーがタグの閉じ忘れとかすると面倒ですよね。 ユーザー入力のHTMLの閉じ忘れはNokogiriを利用すれば簡単に修正することができます。 require 'rubygems' gem 'nokogiri' require 'nokogiri' Nokogiri::HTML.fragment("<div><br>").to_s # => "<div><br></div>" Nokogiri::HTML.fragment("<
スクリプトの実行はできない(XSS対策されている)し、tokenは導入されている(CSRF対策されている)のに、tokenを奪取され、不本意な操作をされてしまう例というのを1つ、やってみたいと思います! 実証だニャン! http://d.hatena.ne.jp/kinugawamasanyan/20101012/nyan 原理 こういうフォームがあったら、submitボタンを押下した時にtokenの値がA、Bどっちにポストされるでしょうか。 <form action="A" method="post"> <form action="B" method="post"> <input type="hidden" name="token" value="123123123"> <input type="submit"> </form> 答えはAです。 つまり本来設置されたフォームより前に別のf
1: Web 標準カリキュラムの紹介 Translated by Masataka Yakura · 20 Oct, 2009Published in: curriculum, course, beginner, Web, standards, japaneseThis is a translation of 1: Introduction to The Web Standards Curriculum/Table of Contents, written by Chris Mills. 次の記事: インターネットと Web の歴史、そして Web 標準の進化 カリキュラムの目次へ はじめに 私には、ある夢がありました。 過去8、 9年にわたり、私は教育に関する仕事に力を注いでいました。あるときは技術書を執筆し、人がその技術で何かかっこいいものを作る手助けをしました。勤務先に新しく入って
14: 適切な DOCTYPE の選択 Translated by Masataka Yakura · 15 Jun, 2010Published in: validation, browsers, html, japanese, dtd, doctype, xmlThis is a translation of 14: Choosing the right doctype for your HTML documents, written by Roger Johansson. 前の記事: HTML の <head> 要素 Next article—Marking up textual content in HTML カリキュラムの目次へ はじめに 13 番目の記事 では HTML の head 要素について、要素内にどのようなものがあり、またどんな働きをしているかを解説しました。今回は
どんな時でもXML宣言は入れておくくらいがちょうどいい Posted by ぴろり Posted at 2010/03/15 18:32 Trackbacks 関連記事 (0) Post Comment コメントできます Category UTF-8ならばXML宣言は入れなくてもいい: 世界中の1%の人々へ 悪貨は良貨を駆逐するケースですか。ブクマのコメントでは識者が多いので安心ですが、タイトルだけ読んだら間違いを助長しますよ、これは。なぜ specification において強く推奨されている、という部分をすっ飛ばして、例外的に Such に続く部分に乗っかってしまうのですか。 | | | | XHTML 1.0: The Extensible HyperText Markup Language (Second Edition) An XML declaration is not re
最近になって急に盛り上がってきているZen-Codingをみなさんご存知ですか? Zen-CodingはHTML/CSSをショートカット+スニペットで簡略化してコードを書くことができるライブラリです。 独立したテキストエディタソフトではなく、既存のHTML/CSSエディタにプラグイン的に導入するものです。 Zen-Codingというのもがどういうもので、どんなすごいものなんだ、というのはこちらの動画を見てください。 ※音が出ますのでご注意ください。 Zen Coding v0.5 from Sergey Chikuyonok on Vimeo 一体何がおこわれているのか?という感じだと思われますが、今回の記事ではこのZen-Codingの導入方法と使い方の一例を紹介します。 Zen-Codingに対応しているエディタは色々あるのですが、今回は弊社の開発環境しているAptana Studio
Not your computer? Use a private browsing window to sign in. Learn more
なぜだか分かりませんが、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 ふむ、しかし、ぼく自身が単引用符でくくることはほとんどないし、ほかの人たちのコードを覗いてみても単引用符を使っているの
<input type="text">でEnterを押すとsubmitされてしまうことがある。 これは便利なときもあるが、場合によっては不便になる。 Enterを押すとsubmitされるのは以下の3パターンがある。 1. Opera、Safariで、<input type="text">または<input type="password">がある場合 <form> <input type = "text" name = "text1"> <input type = "text" name = "text2"> </form> 2. IE、Firefoxで、<input type="text">または<input type="password">が1つ以上と、<input type="submit">または<input type="image">が1つ以上ある場合 <form> <input
フォームのテンプレートを作成する際に正しいHTMLのマークアップをしましょうってことで、『How to create perfect form mark up and style it with CSS』というのを見つけたので自分用に覚書。 よく忘れられがちなのが、<fieldset>というタグで無料配布されているCGIやサーバー側で提供しているフォーム、Wordpressなんかでももともとのテンプレートの中に<fieldset>タグを見かけることはほとんどなかったりする。なので、そのままカスタマイズして忘れてしまうタグのひとつがこの<fieldset>タグと<lavel>タグ。 <fieldset>の役割としてはフォームの入力項目をグループ化するためのタグで抜けていてもとくに構文のエラーが出るわけでもないので、結構無視されがち。タグの勉強をしだした頃はしっかり<fieldset>を書くよ
ウノウラボで書いたエントリが被ブクマ400を超える未体験ゾーンに突入。デザインやUI系のネタが受けるのは分かっていたので、狙ってみた部分も正直あるけど、それにしても予想以上の反響です。 そこで書いた「チェックボックスやラジオボタンはfieldset,label要素でくくる」という項目でいろんなご指摘を頂きました。エントリ自体はマークアップよりも、「フォームを使う人にとっての利便性をどう考えるか」が本旨なので、そこばかり注目されるのも本意ではなかったのですが、それだけ気になる部分なのだろうということで、場を改めて検証してみます。DTDはXHTML1.0 Strictを前提に。 ■label要素のマークアップ label要素を使用することで、ラベル部分をクリックすることで関連付けられたフォームコントロールにアクセス出来る、というのが基本的な挙動です。一般に、ラジオボタンやチェックボックスを選択
移転しました http://please-sleep.cou929.nu/20090223.html
「Web標準」や「XHTML+CSS」といった言葉がでてくるWeb制作の本には、必ずといっていいほど「W3C」という言葉が登場します。今回はそのW3CというWeb標準化団体について、またW3Cが策定する仕様がどのように作られているのかをとりあげます。 そもそもW3Cって? W3C(World Wide Web Consortium)とは、Web技術の標準化を行う団体のひとつです。「Webの可能性を最大限に引き出す」ことを目的とし、Webの発明者であるTim Berners-Leeによって1994年に組織されました。W3Cは今日までにHTML(3.2以降)やXML、XHTML、CSSといった、数々の仕様を公開しています。 W3Cには、IT関連企業をはじめとする400近くの会員が参加しています。Apple, Google, Microsoft, Mozilla, Operaといったブラウザベ
正規の規定はW3Cサイトにある英語版であり、この日本語版は参考にすぎません。 邦訳の過程で気づいた原規定の誤りについては原著者に報告し、明らかなタイプミス等についてはerrataに掲載される前であっても修正した訳を掲げる場合があります。 この文書には、翻訳上の誤りがあり得ます。当委員会は翻訳の正確性を保証しません。あくまでご自身の責任でご利用ください。 原著作権をW3Cが保有し、二次著作権をHTML 4仕様書邦訳計画補完委員会が保有します。 HTML 4.01仕様書 1999年12月24日付W3C勧告 この版の原書: http://www.w3.org/TR/1999/REC-html401-19991224 (プレーンテキストファイル [794Kb]、HTMLファイルのtar.gzアーカイブ [371Kb]、HTMLファイルのzipアーカイブ [405Kb]、gzipしたPostScri
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く