HTML5.1、5.2での仕様変更点をメモ。
先日Twitterにこんな投稿をしたら地味に伸びたので、私も含めて案外みんな2014年に勧告された後のHTML5の仕様変更は追ってないのかなと思い、自分のための備忘録も兼ねて主な変更点をメモしておきます。 なお自分はマークアッパーなので、仕様変更点全てを網羅するのではなく、あくまでHTMLマークアップに関連する部分のみピックアップすることとします。全ての変更点を確認したい人はW3Cの仕様書をあたってください。 2016年HTML5.1勧告時の仕様変更 HTML5.1勧告時の注意すべき仕様変更点は以下の通り。 【追加】 ・picture要素とsrcset属性の追加 ・details要素とsummary要素の追加 【削除】 ・ネストされたセクション要素の見出しに全てh1を置くこと ・tfoot要素をtbody要素の前に置くこと 【変更】 ・セクション要素の中のheader/footer要素は入
http-equiv とはなにか - ぜんぶなんとかなる
http-equiv = "HTTP (Header) Equivalent" <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> これは HTTP ヘッダで以下のように指定したのと同じ意味。 Content-Type: text/html; charset=Shift_JIS IE 系の互換モード指定も <meta http-equiv="x-ua-compatible" content="IE=Edge"> これと同じ意味。同じ名前のヘッダは上書きされます。 X-UA-Compatible: IE=Edge 「おまじない」として紹介されがちなこいつも同じです。 <meta http-equiv="refresh" content="1;URL=http://google.com"> ただし すこ
最新のSEO事情！schema.orgで構造化マークアップせよ！ - Qiita
schema.orgとは schema.orgの仕様通りにHTMLにマークアップする事で、Google,Yahoo!,Microsoftなどの検索エンジンに正確な情報を収集してもらい、ユーザーに最適な検索結果を提供するというものです。 例えば本について書かれたHTMLがあったとします。その情報に対し「ここには本の題名が書いてあります」「ここには本の出版日が書いてあります」「ここには著者の名前が書いてあります」などの、HTMLでは伝えきることができない、より詳しい情報をクローラーに伝えることを目的としたものです schema.orgのメリット 1. 検索エンジンでリッチスニペットが表示される schema.orgではmicrodataという方式でマークアップすることで、クローラーがページの内容を解析しやすくなります。その結果、検索エンジンにリッチスニペットを表示することができます。 リッチス
コーディング中のクラス名で迷いたくない！よく見るコンポーネントの名前17選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 コーディングをしていて、クラス名に迷うことってありませんか？ ボタンや見出しといった、比較的単純なコンポーネントなら「.button」「.headline」など、すぐに思いつくかもしれません。 しかし、それが複雑なコンポーネントだったりすると、なかなか思いつかないものです。 そんな悩みを解消したいと思いまして、いろいろなサイトのソースコードを見て、開発者がどんなクラス名をつけているのか調査してみました。 今回は、その中からよく使われていたクラス名と、「これはナイスネーミング！」と思ったクラス名をピックアップしたいと思います。 thumbnail サムネイル画像。 アイキャッチ画像やギャラリーページの画像一覧などで用いられます。 avatar ユーザのアバター画像。 Webサービスのユーザ情報ページや、ブ
HTML 5.2: 4.13. Common idioms without dedicated elements
Table of contents 1 Introduction2 Common infrastructure3 Semantics, structure, and APIs of HTML documents4 The elements of HTML5 Microdata6 User interaction7 Loading web pages8 Web application APIs9 Communication10 Web workers11 Worklets12 Web storage13 The HTML syntax14 The XML syntax15 Rendering16 Obsolete features17 IANA considerationsIndexReferencesAcknowledgmentsIntellectual property rights F
World Wide Web Consortium (W3C)
The World Wide Web Consortium (W3C) develops standards and guidelines to help everyone build a web based on the principles of accessibility, internationalization, privacy and security. Working with stakeholders of the Web A range of organizations join the World Wide Web Consortium as Members to work with us to drive the direction of core web technologies and exchange ideas with industry and resear
とほほの HTMLリファレンス
HTMLリファレンス トップ > HTMLリファレンス [HTML概要] [フレーム版] [逆引き] [用途順] x は廃止されているものを示します。 A <a> <abbr> <acronym> x <address> <applet> x <area> <article> <aside> <audio> B <b> <base> <basefont> x <bdi> <bdo> <bgsound> x <big> x <blink> x <blockquote> <body> <br> <button> C <canvas> <caption> <center> x <cite> <code> <col> <colgroup> <command> x <comment> x D <data> <datalist> <dd> <del> <details> <dfn> <dialog>
HTMLリファレンス 総合インデックス
最近ではWebページの作成には，Webオーサリング・ツールを利用するなど，グラフィカルな環境で作成できます。しかし，Webページの作成で利用されるHTML（Hyper Text Markup Language）を知っておくことはコンテンツの作成に役立ちます。例えば，HTMLソースを閲覧し，Webページ作成のの参考にしたり，Webページが乱れてしまった場合に，該当の箇所のソースからどこかおかしいか調べるといったことに利用できます。また，ブログなどといったWebブラウザ上でWebページを作成する場合において，HTMLのタグを書き込む場合もあります。 そこで本リファレンスでは、HTMLの各タグについて解説します。また、サンプル・ソースにて実際のHTMLの利用例を紹介しています。 機能順 HTML構造 <body> - 本文 <head> - ヘッダ <html> - HTML文書 <meta>
HTMLコードを解析して問題箇所と理由を知らせてくれるブックマークレット・HTML_CodeSniffer
HTMLの構文チェックをその場で できるブックマークレットです。 問題箇所の数や、問題箇所もお しえてくれます。割と便利そう だったのでご紹介してみます。 HTMLのlintです。ブックマークレットを起動させてその場で解析、問題箇所も教えてくれます。 OSSとしてGithubでも公開されてますので日本語に直しての利用も出来ますね。 ↑ 起動させるとすぐに解析してくれます。 ↑ 表示されたボックス下部のView Reportに進むと個別箇所が一覧で表示され、それぞれの問題箇所を上図のようにアイコンで教えてくれます。 errorとwarningの表示/非表示のスイッチも出来ます。なかなか便利ですね。 HTML_CodeSniffer
H34: インラインでテキストの方向を混在させるために、Unicode の right-to-left mark (RLM) 又は left-to-right mark (LRM) を使用する | WCAG 2.0 達成方法集
この達成方法の目的は、HTML の双方向性アルゴリズムが望ましくない結果を生じるとき時に、それを無効にするために Unicode 制御文字の right-to-left mark と left-to-right mark を用いることである。たとえば、スペース又は句読点のようなニュートラルな文字が異なる方向性のテキストの間に置かれている時に必要となることがある。この達成方法で用いられているコンセプトは、W3C 文書の「What you need to know about the bidi algorithm and inline markup」に書かれている。 訳注: 上記の「What you need to know about the bidi algorithm and inline markup」は、「Inline markup and bidirectional text in
preタグ内での改行(br)を無効にする：地方で活動するweb制作者の日々を綴るblog
2009年01月15日03:42 カテゴリ技術 preタグ内での改行(br)を無効にする Livedoorをはじめとしたブログツールでは、基本的に本文を入力するフォーム内に改行をすると、htmlソースとしてはその部分に改行タグである<br>が入ることになる。 通常はこの仕様で問題ないが、<pre>タグを使ってソースコードを記述したいときなどに<br>が入ってしまうと、変に行間が空いてしまいてしまう。 それを解決するためにはスタイルシートにちょっと一工夫を加えてpre br { display: none; } としてあげると良い。 Livedoorなら カスタマイズ/管理＞デザインのカスタマイズ で表示される「スタイルシート」の入力フォームの一番下に追加すればOK。 via もじゃの日記: プログラミングコードの貼り付け（2） 「技術」カテゴリの最新記事 タグ ：#html#pre#css
県コード at softelメモ
日本の47都道府県のコードです。 各都道府県に概ね北から南へ、01 から 47 までの数字が割り振られています。このコードは、ISOの地域コード ISO 3166-2 にもそのまま使われています (ISO 3166-2:JP) 。 いろんな形で記載しておきます。 phpの配列形式 地域別に改行 縦一列 横一列 $prefs = array( 1 => '北海道', 2 => '青森県', 3 => '岩手県', 4 => '宮城県', 5 => '秋田県', 6 => '山形県', 7 => '福島県', 8 => '茨城県', 9 => '栃木県', 10 => '群馬県', 11 => '埼玉県', 12 => '千葉県', 13 => '東京都', 14 => '神奈川県', 15 => '新潟県', 16 => '富山県', 17 => '石川県', 18 => '福井県', 19
type=”file”のクリア - Mars Diary
question:1193930047 より <script type="text/javascript"> function sample(oId){ var obj = document.getElementById(oId); var stO = obj.innerHTML; obj.innerHTML = stO; } </script> <span id="XYZ"><input type="file" name="file" size="10"></span> <input type="button" value="←" onclick="sample('XYZ')">一見、無意味な書き戻しをしているようだが、 <input type="file"> の場合、valueへのアクセスが禁じられているのでvalue=""と同じ効果が得られる。 DOMで削除した後、生成するというのも
携帯端末でPNG画像が表示されない at softelメモ
問題 携帯のブラウザで、PNG画像が表示されないんだけど、何が悪いのだ？ 答え サーバー側から送出されるヘッダの中の「Content-Type」が「image/x-png」だと、表示できない端末があった。 サーバー設定なり、プログラムから出力している画像ならプログラム側でヘッダを調整するなりして、 Content-Type: image/png のヘッダが出るようにすれば、ちゃんと表示された。 通常のPCのブラウザは大丈夫だけど、携帯のブラウザはimage/x-pngが表示できないことがあるらしい。
HTML5リファレンス（旧仕様）
<p> …… ひとつの段落（パラグラフ）であることを表す <hr> …… テーマや話題の区切りを表す <pre> …… 半角スペースや改行をそのまま表示する <blockquote> …… 引用・転載セクションであることを表す <ol> …… 順序のあるリストを表示する <ul> …… 順序のないリストを表示する <li> …… リストの項目を記述する <dl> …… 定義・説明リストを表す <dt> …… 定義・説明される言葉を表す <dd> …… 定義用語や言葉の説明をする <figure> …… 図表であることを示す <figcaption> …… 図表のキャプションを示す <div> ……ひとかたまりの範囲として定義する <main> …… メインコンテンツであることを示す <a> …… ハイパーリンクを指定する <em> …… 強勢する（アクセントを付ける）箇所を表す <stro
)
MySQL/5.x/5.4.2-betaのインストール - PukiWiki
オンラインカジノで遊んでいると、各サイトに「プロバイダー」とやらのロゴが 並んでいることに気がついたことがある人も、多いことでしょう。本記事ではそのゲームプロバイダーについて、人気の会社も含めてご紹介します。 オンラインカジノのゲームプロバイダーとは？ オンラインカジノで遊ぶことに慣れてくると、気になってくるのが「ゲームプロバイダー」の存在です。ゲームプロバイダーとは、オンラインカジノで遊べるようなデジタルゲームを開発している会社のことです。「ゲーム配信会社」、または、単純に「プロバイダー」とも呼ばれます。 ゲームの特色や内容はやはり、このプロバイダーによりかなり左右されます。以下にご紹介しているプロバイダーの大半が、alohashark.comのようなサイトにゲームを提供しています。 […]
HTMLの特殊文字 ： IT用語辞典
▼ ご意見やご指摘、追加希望用語などはこちらからお送りください (個別にお返事はできかねますのであらかじめご了承ください) 当サイト「IT用語辞典 e-Wordsイーワーズ」はIT（Information Technology：情報技術）用語のオンライン辞典です。コンピュータ・情報・通信などを中心とする各分野の用語について、キーワード検索や五十音索引から調べることができます。用語の意味や定義、概要や要約、略語や別表記、英語表記や綴り、フルスペル、読み方や発音、仕組みや役割、歴史や由来、語源、構造や構成、要素、特徴、機能や性能、諸元、規格や仕様、標準、原因や要因、手法や方法、方式、種類や分類、利点やメリット、欠点やデメリット、問題点、対義語や類義語との違い、用例や事例、具体例、画像や図表、関連用語、外部資料や別の辞典による解説へのリンクなどを掲載しています。 当サイトは株式会社インセプトが制
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
letter-spacingで字間を開けたときに最後の字の後ろまで開いてしまう問題への対処法 - Qiita
html5resetcss - Project Hosting on Google Code
教えて！Ziddyちゃん - headタグのprofile属性の意味