HTMLの文字コードをどうするべきか、あるいはHTMLとは何かという話 | なすびブログ
HTML文書は文字エンコーディングUTF-8でなければなりませんという記事があり、混乱があるようなのでHTMLについてHTML5とHTML Living Standard（以下HTML LSと省略）について、そしてHTMLファイルの文字コードをどうするかについて、まとめておきます。 TL;DR HTMLファイルの文字コードはHTML Living Standardに従ってUTF-8にする 古いSJISやEUC-JPのHTMLファイルをUTF-8に変換する必要はない What is "HTML" ? 一般にHTMLと呼ばれる規格には複数あります。 HTML4.01を含むそれ以前のHTML (W3C) XHTML1.1 (W3C) HTML5.1 (W3C) HTML Living Standard (WHATWG) まず一旦古い話は置いておいて、HTML5とHTML LSについて考えることに
W3Cが「HTML 5.1」を勧告として公開
ウェブで利用される技術の標準化を進める団体・W3CのWeb Platform Working Group(ウェブプラットフォーム作業部会)が「HTML 5.1」をW3C勧告として公開しました。これは、2016年4月に2016年9月の勧告を目指して作業が進められていたものです。 HTML 5.1 is a W3C Recommendation | W3C News https://www.w3.org/blog/news/archives/5932 W3CがHTML 5を勧告として公開したのは2014年10月28日のこと。新たな勧告の公開は1999年の「HTML 4.01」以来15年ぶりのことで、HTML 4.01のころはまだウェブアプリケーションのことなどが想定されておらず「ウェブページを記述するためのフォーマット」だったため、全面的な規格の刷新となりました。 今回勧告となったHTML 5
HTML の q タグが日本語のサイトではカギ括弧を出すようになってた
HTML に q という要素がありますね。 Quotation の Q ですか。 <q> について 文書内で引用をしたいとき、 ブロック要素を含むような場合には <blockquote> ですが 一言とか一行とかそれくらいのときには <q> を使うのがいいみたいです。 q 自体がデフォルトでインライン要素だしね。 こんなぐあい。 <q>ここは引用ですよー。</q> 多くのブラウザでは、この <q> で括った部分が ダブルクォーテーションで挟まれて表示されます。 上記の例だとこう。 “ここは引用ですよー。” カギ括弧になってた 「表示されます」って書いたんだけど、 本当は「と思ってました」でした。 こないだふと気づいたら、 日本語のページではこれがこうなってました。 「ここは引用ですよー。」 クォーテーションマークじゃなくてカギ括弧になってる。 知らんかった。いつの間に。 <q> を初めて使
Web標準化の関係者たちが語る、標準化の現実と前進のための処方箋（前編）。HTML5 Conference 2013
Web標準化の関係者たちが語る、標準化の現実と前進のための処方箋（前編）。HTML5 Conference 2013 ふだん私たちが接しているWeb技術は、W3CやIETFといった国際的な標準化団体でさまざまな議論が行われた上で決定された仕様に基づいている。 その標準化団体とはどういうもので、標準化作業に伴う苦労はどのようなものなのか。実際に標準化を行っている、もしくはそれに関連した人たちが議論をするセッション「Spec EditorとContributorが語るWeb標準化と開発者への期待」が、11月30日に都内で開催された「HTML5 Conference 2013」で行われました。 ディスカッションの内容を、前編と後編の2本で紹介します。 Spec EditorとContributorが語るWeb標準化と開発者への期待 Googleの及川です。こんな地味なセッションで立ち見が出るのは
DTPの方向け web（HTML+CSS）の考え方（2/2） | ホームページ制作手帖
当初作っていたロングバージョンの方です。 先程の実際に使ったスライドは、作ったあとで、リハーサルして、削ったり足したり入れ替えたりしての完成型なのですが、こちらはとりあえずがががっと作ってみた、って段階のものなので、誤字とかちょいちょいありますし、解りにくい説明や順番だったりします。 試作ということでご了承くださいませ。 続きを読む
10分くらいで分かるXHTML+CSS
このブログをお読みの方には既に不必要かもしれませんが、XHTML 1.0 と CSS 2.1 の入門記事です。 社会人のためのWebデザインスクール 用に作成したプレゼン資料をもとに記事にしています。 授業の時は、先にこの話をしてから XHTML を書いてもらうのではなく、先に HTML/XHTML&スタイルシートレッスンブック―ステップバイステップ形式でマスターできる を読みながら XHTML と CSS で簡単なページを作成してからこの話をしています。 その理由としては、HTML や XHTML を1度も書いたことがない方に「ブロックレベル要素」や「インライン要素」、CSS の「セレクタ」等の話をしても何のことか分かりにくいだろうと考えているからです。 ※この記事は2012年に執筆したものです。現在の 社会人のためのWebデザインスクール では、HTML・CSS コーディングについては
HTMLで文字詰めするタイポグラフィー用JS | fladdict
HTMLのテキストに対して、文字詰めを行えるスクリプト FLAutoKerningクラスを作ってみた。サンプルはこちら。zipも。 スクリプト内に任意のカーニングペアを定義することによって、ブログのタイトル等のテキストに字詰めを行ってくれるスクリプトです。なんか探しても見つからなかったので自分でやってみた。いちおう朗文堂の新宿私塾に行ったわけだし、僕もなんか成果物作らんとなぁ。。。的に。 実行はとても簡単。jQueryと一緒にhtmlにロードして、 FLAutoKerning.process($(‘h1′)); FLAutoKerning.process($(‘h2′)); FLAutoKerning.process($(‘h3′)); といった具合に、適用したhtml要素を一括していしてやるだけ。カーニング情報の定義も、FLAutoKerningクラスの頭に、下のようにem単位で定義する
Firefoxでルビ - yanok.net
以前から、Firefoxでルビを表示させるのに、XHTML Ruby Supportというアドオンを使っていました。Firefoxはそのままではルビに対応していないのです。 ただ、アドオンの問題も分かっていました。このアドオンでは、ルビを振られる文字列がCJK統合漢字拡張Bから始まっていると、その漢字が化けてしまうのです。例えば「𣖔木作(ほうのきざく)」という具合にルビを振ると、先頭の「𣖔」が正しく表示されないということです。 この問題は開発者に報告した方がいいなあと思いつつ、なんとなく有耶無耶にしてしまっていました。BMP外の文字を含むときはルビタグを使うのを避けるという変な習慣もついてしまいました。 そうこうするうち、Firefox 4が出ましたが、このアドオンは新しいFirefoxのバージョンに対応していません。その一方で、HTML Rubyというルビのための新しいアドオンが出て
Let's begin XHTML -- Introduction
Section 1：XHTML とは Section 2：XHTML の基本 Section 3：XHTML の形式 Section 4：XHTML の編集 Section 5：基本的な文書構造 Section 6：ハイパーリンク Section 7：画像の挿入(1) Section 8：画像の挿入(2) Section 9：箇条書き Section 10：文書中の部分の役割 Section 11：表(1) Section 12：表(2) Section 13：表(3) Section 14：文書情報 Section 15：スタイルシートの利用(1) Section 16：スタイルシートの利用(2) Section 17：ルビ Section 18：その他のマークアップ Section 19：WWW ページを作るにあたって Appendix A：文字エンコーディング Appendix B：
XHTMLとCSSでHタグのテキストを非表示にするSEO
Webサイト作成の専門家がSEOのソリューションを紹介します。 初心者の方でも出来るよう、スパムにならない正しい検索エンジン対策を分かりやすく解説。 このブログで実際に行われているSeesaa blogのSEOカスタマイズ方法もお届けします。 今日はちょっとテクニカルなSEOです。 見出しについては、通常、Hタグを使って強調します。 Hタグで囲まれていることで、検索エンジンからは重要なキーワードとして評価されます。 ところが、ブログはさておき、企業サイトなどでは、見出しの内容を画像で表示し、ちょっとリッチにしたいケースが多々あります。 昔（HTMLのころ）は、「IMGタグにALT属性をちゃんとつけること」で対応されていましたが、IMGタグのALT属性より、Hタグの方が評価が高いはずです。 では、Hタグを使って画像を表示する方法を解説します。 XHTML側では、通常通り、 <H1 id="
初心者のためのホームページ作り-Web for beginner ホームページ作成支援
Lecture for beginner ■ HTML基礎講座 HTML4.01の概略 / HTML制作の準備 WEBとHTML / Webの作法 / HTMLの作成 論理構造 / 要素の親子関係 / ヘッダ情報 見出し / 段落 / リンク / フォント ボックスの概念 / 色の作法 / 画像の扱い リストの作成 / テーブルの作成 / 配置 フレーム / フォーム / 動画コンテンツ イメージマップ / スタイルシートの概念 Webページのタブー ■ HTML応用編 HTML4.01 / ヘッダ情報 / CSS応用 テキスト / アンカー / 文字実体参照 色の基礎知識 / FTPファイル転送 枠線表示の応用 / アクセシビリティ Lecture for senior ■ 初めてのXHTML講座 XHTML基礎講座 / XHTML概要 / XHTML基本 XHTML DTD / HTM
TOP - HTMLリファレンス
HTML入門記事 タグリファレンス CSSリファレンス などです。 Perlリファレンス JavaScriptリファレンス もあります。 [PR] WEB素材配布室 このサイトで使用しているWikiシステムの配布元です。 他にもCGIやJavaScriptなどを配布しています。 Webディレクトリ 自動登録リンク集サイトです。Webサイトの宣伝にどうぞ。 BIG-BONUS.NET パチスロ関連の情報サイトです。 パチスロ関連の情報やツールがあります。
CSS3とHTML5でどう違う？ WebKit最新開発版で試す「ルビ」 - builder by ZDNet Japan
HTML5のルビとXHTML 1.1のルビ 本連載のテーマであるEPUBは、規格の成立経緯と仕様の両面において、ウェブと切り離しては考えにくい性質を持っています。基本的にはXHTMLとCSSでコンテンツを記述するため、iOSに搭載のEPUBビューワ「iBooks」のように、エンジン部分をウェブブラウザと共有している例も少なくありません。ウェブの仕様およびその実装であるウェブブラウザとEPUBは不可分の関係、ということもできるでしょう。 そしてウェブの仕様は、現在「HTML5」へと歩を進めつつあります。正式な規格化（W3Cによる勧告）は2012年頃と先の話ではありますが、すでに最終草案（ラストコール）への工程表が提出されていますから、仕様としてはほぼ固まっていると見ることができます。その流れを見越し、主要なウェブブラウザがHTML5の実装を開始していることは、ご存じと思います。 振り仮名とし
CSS (Cascading Style Sheet)の使い方
CSS (Cascading Style Sheet)の使い方や書き方を入門者向けに解説しています。 CSSとは プロパティ セレクタ 擬似要素 ルール CSS framework Bootstrap Bulma Materialize Milligram Pure.css Semantic UI Skeleton Tachyons Tailwind CSS UIkit Zurb Foundation Syntax highliter Google code-prettify CSSとは CSS (Cascading Style Sheet)とは、HTMLに代わって文書の視覚的効果を表すもので、HTML と組み合わせて使用します。従来、HTML は文章の構造（タイトルやヘッダーなど）と視覚的効果（フォントや色など）をタグやその属性で表してきました。 しかし、文章の構造とその表現方法は明確に
text-align – インライン要素の揃え方を指定するCSSプロパティ
left text-align プロパティに left を指定すると、テキストが左に寄せられて、行頭が揃えられる。日本語の横書きや英語では、テキストは左寄せにするのが一般的である。一般的な体裁であるため、初期値となっている。 <p style="text-align: left"> In a hole in the ground there lived a hobbit. Not a nasty, dirty, wet hole, filled with the ends of worms and an oozy smell, not yet a dry, bare, sandy hole with nothing in it to site down on or to eat: it was a hobbit-hole, and that means comfort. </p> In a
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.xml.vc/
monkeyish studio - Lifestream
【HTMLタグの簡単検索】TAG index - ホームページ作成情報
HTMLクイックリファレンス
HTML入門