普通のHTMLの書き方
保守しやすく、規模に依存しないHTML文書のために 一般 DOCTYPEで始める 置き換えられるべきまたは旧式のDOCTYPEを使わない XML宣言を使用しない 文字参照はできる限り使わない &と<、>、"、'は名前文字参照を使ってエスケープする 制御文字や不可視文字は数値文字参照を使う コメントではその内容の前後へ空白文字を置く 終了タグを省略しない 空要素の書き方を混ぜない タグや属性値の前後へ空白文字を置かない 大文字・小文字を混ぜない 引用符を混ぜない 属性を2文字以上の空白文字で区切らない 真偽値を取る属性の値は省略する 名前空間は省略する XML属性は使わない data-*とMicrodata、RDFa Lite用の属性と通常の属性を混ぜない デフォルトの暗黙のARIAセマンティックスを尊重する 文書要素 lang属性を追加する lang属性の値はできる限り短くする できる限り
今どきの入力フォームはこう書く！ HTMLコーダーがおさえるべきinputタグの書き方まとめ - ICS MEDIA
みなさん、入力フォームを制作する際、どのような施策をおこなっていますか？ 入力項目を見直したり、入力ステップを明確にしたりなど、入力フォーム最適化をおこなっていると思います。そのことで、コンバージョン率があがったり、ユーザーがストレスを感じないようになるでしょう。入力フォーム最適化はEFO対策 = Entry Form Optimizationとも呼ばれます。 サイトの設計段階で検討すべきことが多いですが、コーディングでも考慮すべき事が多々あります。今回はHTMLコーダーがエントリーフォームを制作する際に考慮すべき点について紹介します。 ※本記事では最近のブラウザに適したHTMLコーディング方法の紹介を目的としています。そのため、デザインとアクシビリティーでのベストプラクティスを紹介したものではありませんのでご了承ください。 自動入力機能に対応しよう Google Chrome（デスクトッ
HTMLの提案書を書こう | Takazudo Clipping*
HTMLなんかどこに頼んだってかわんねーよ！というわけじゃない。 ちょっと前に、会社がコンペに参加するとかでHTMLの提案書を書いた。要件は、もう設計とか完了していて、ワイヤーフレームとかチャートとか用意しちゃっている気合いの入ったクライアントで、デザインとCMSに組み込むためのHTMLテンプレート（とガイドライン）を作ってーというもので、自分が書いたのはHTMLのところ。 まー、最初は自分が全体書いてて、ユーザーありきで設計してデザインしてコーディングしてってやってるんですーという、ワークフローな感じのことを書いたのだけれども、社内のWeb仙人に駄目だしされ、もっと特化したものを書け！大体、デザイン以降が要件なんだから、前半まったく意味ねーよ！ってことで自分の書いたものはフルボツになり、自分はHTMLのとこだっけ書くことになりました。 しかしまぁ、前からこんな、HTMLで何がいいわけ？み
ソフトバンク旧型機で注意したい事 - 携帯電話向けコンテンツの書き方
この記事は情報として旧くなり過ぎて価値を喪失したものと判断されるため、保存扱い(obsolete)となっております。理由：ソフトバンクの旧型機は平成22年 3月限りで利用出来なくなるため。 要注意点の多いソフトバンク旧型機向けHTML。 ソフトバンク旧型機に実装されているHTMLには注意すべき事が多数あります。 ここではそれらの中から主なものを纏めておきます。 当サイトで解説していない要素などについても解説しておきます。 尚、実際には現行機及び旧ジェイフォン時代の初期端末を除くパケット機では以下の制限はURIの制限を除いて適用されません。 ですから、事実上URIの制限を除いて非パケット機のみの制限と見なしても殆ど問題は無いでしょう。 文書作成上の問題。 数値文字参照は使えません。 旧型機では、現行のパケット機を除いて数値文字参照が使えません。 数値文字参照は、旧型機では記述した通りの表示に
Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download!
by Alessandro Fulciniti In November 2005 I presented on pro.html.it a three-part article on creating CSS layouts using techniques like negative margins, any order columns and in some case opposite floats. The main goal of the article was getting the maximum number of layouts based on the same markup, each with valid CSS and HTML, without hacks nor workaround and a good cross-browser compatibility.
実践アクセシブルHTML - altはつけるだけじゃなくて
画像にalt属性を よく「画像にはalt属性をつけましょう」というフレーズを耳にするかと思いますが、これはサイトのアクセシビリティ改善における対応のうち、もっともメジャーなものであるといえます。WAIのアクセシビリティガイドラインであるWCAG1.0には「テーブルをレイアウトに使ってはいけません」というような内容の項目もありますが、これに対して「よっしゃ、テーブルを使うのをやめよう」とあっさりと決断してサックリとそのように作り変えることなど、ほとんどのサイトにおいて無茶な話でしょう。しかし「すべての画像にalt属性をつけよう」というのはアクセシビリティの対応要件に必ずといって良いほど含まれます。これなら、たとえ数千ページある規模のサイトであっても、とりあえず機械的な処理であるとか、人海戦術であるとかでも何とかなりそうだから……と思うからかもしれません。 たまにalt属性のことをaltタグと
displaymode check sample
displaymode check sample サンプル一覧 幅・高さの計算 幅・高さの計算 (XML 宣言なし) 幅・高さの計算 (DOCTYPE宣言無し) text-align でブロック要素を揃える text-align でブロック要素を揃える (XML 宣言無し) text-align でブロック要素を揃える (DOCTYPE 宣言無し) 左右に auto のマージン 左右に auto のマージン (XML 宣言無し) 左右に auto のマージン (DOCTYPE 宣言無し) 標準のフォントサイズ 標準のフォントサイズ (XML 宣言無し) 標準のフォントサイズ (DOCTYPE 宣言無し) 非置換インライン要素に幅と高さを指定 非置換インライン要素に幅と高さを指定 (XML 宣言無し) 非置換インライン要素に幅と高さを指定 (DOCTYPE 宣言無し) 属性値の大文字・小文字
つくるぶ -デベロッパー応援プロジェクト
つくるぶをご利用いただきありがとうございます。 つくるぶは2008年9月30日をもって閉鎖いたしました。 誠に残念ではありますが、サイトオープン以来、多くの皆さまに支えていただきましたこと、心より御礼を申し上げます。 つくるぶをご訪問頂いた皆さま、ご自分のサイトを登録してくださった皆さま、つくるぶをご利用いただきありがとうございました。 大変申し訳ありませんが、会員情報および投稿していただいた情報は全て破棄させていただきました。 また、つくるぶの閉鎖に伴いブログパーツ「サイトスカウター」もサービスを終了させていただきます。 皆さまの今後のご活躍を応援しています。
3カラムレイアウトで中央カラムを（X）HTMLの最初に記述する
配布テンプレートの3カラムレイアウトで、中央カラムを（X）HTMLマークアップの前方に配置するカスタマイズです。 コンテンツの主要な内容が記述されている中央カラムがマークアップの前方にあると SEO で有利と言われています。ただしスタイルシートが若干複雑になるため、当サイトのテンプレートではその方式を採用しておりません。*1 テンプレートのカスタマイズに慣れてきた方、SEOに興味のある方は本エントリーのカスタマイズを行ってみてはいかがでしょうか。 配布テンプレートは、どのブログツール・ブログサービスのものでも適用可能です（多分）。 表示は Windows XP + IE6/IF7/Firefox2/Opera9 で確認しています。IE7 はスタンドアローン版を使用しているので、正式版と表示が異なるようでしたらすいません。 １．概要 配布時は「左→中央→右」という順番で（X）HTMLマークア
フィーチャフォン向け HTML の考え方 - 携帯電話向けコンテンツの書き方
フィーチャフォン向けに HTML 文書を作成するに当たってご留意願いたい事として、文字コード, 携帯電話独自の機能及びフィーチャフォンで使えないか使うべきでない機能について解説します。 実際にマークアップするには。 文字コードについて。 文字コードとしては、シフト JIS コードまたは UTF-8 を用いて下さい。 かつては UTF-8 だと KDDI/沖縄セルラーの端末に問題がありましたが、令和 4年に同グループのフィーチャフォンが停波したため問題はなくなりました。 その他、マークアップに当たって心掛けたい事。 例え携帯電話向けといえども、HTML で記述する以上、PC で閲覧される恐れもあります。 PC での閲覧に問題が生じないように、しっかり基本となる要素などで論理的にマークアップしましょう。 詳しくは実際の携帯電話向けコンテンツ作成で解説します。 フィーチャフォンならではの HTM
CSSだけでフレームを作るテクニック:phpspot開発日誌
CSS Frames v2, full-height | 456 Berea Street Way back in August of 2003 I wrote a short article called CSS Frames, in which I described a technique to emulate the visual appearance of HTML frames with CSS. CSSだけでフレームを作るテクニック。 通常、フレームというとframeタグを使って実現しますが、検索クローラーに対して不利などの理由から最近ではあまり見かけなくなってしまいました。 フレーム風のインタフェースをＣＳＳだけで実現するテクニック。 常にヘッダー、フッターのナビゲーションが固定されているのでフレームの使いやすさはそのままで、かつクリーンなHTMLによってフレームを実現でき
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ashikunep.org
KataPad.com is for sale | HugeDomains
CSS Layouts: Grid and CSS Layouts
3カラムレイアウトで、中央を可変にする（リキッドレイアウト） | CSS-EBLOG
モバイルでのXHTMLとCSS