Web入門者必見のHTMLコード作成の30の軍規(2)
3525 ワード
11、H 1－H 6ラベルを使用する
筆者はあなたがホームページの中でその中のすべての6種類のマークを使うことを提案して、大部分の人は前の4つしか使いませんが、最も多いHを使うと多くのメリットがあります.例えば、設備が友好的で、検索エンジンが友好的で、あなたのPラベルをH 6に置き換えてもいいです.
12、ブログならH 1をタイトルに残す
今日筆者はTwitterで、H 1をLOGOに定義すべきか、文章のタイトルに定義すべきかを議論し、80%の人が後者を選んだ.
もちろん具体的にどのように使うかはあなたのニーズ次第ですが、ブログを作るときに、文章のテーマをH 1にすることをお勧めします.これは検索エンジンの最適化(seo)に非常にメリットがあります.
13、ダウンロードySlow
ここ数年、ヤフーのチームは先端開発分野で多くの偉大な仕事をしました.先日、ySlowというFirebug拡張子が発表されました.それはあなたの<ページを分析し、「成績表」を返します.このページの各方面を細かく分析し、改善すべき点を提出しました.それは少し厳しいですが、絶対にあなたに役に立ちます.強くお勧めします.ySlow(http://developer.yahoo.com/yslow/)!
14.ULリストレイアウトナビゲーションメニューを使用する
通常、Webサイトにはナビゲーションメニューがあります.このように定義できます.
美しいコードを書きたいなら、このような方法を使わないほうがいいです.
どうしてULレイアウトナビゲーションメニューを使うのですか.--ULは生まれながらにして定義リストのために準備されているからだ.
次のように定義します.
15、IEの扱い方を覚える
IEはこれまで先端開発者の悪夢だった!
CSSスタイルシートが基本的に定型化されている場合は、IEのスタイルシートを個別に作成し、IEのみを有効にすることができます.
これらのコードは、ユーザーブラウザがIE 6以下であれば、このコードが有効になります.IE 7も含めたい場合は、「[if lt IE 7]」を「[if lte IE 7]」に変更します.
16、良いコードエディタを使う
WindowsユーザーであれMacユーザーであれ、ここには優れたエディタがたくさんあります.
Macユーザー:
1、Coda(http://www.panic.com/coda/)
2、Espresso(http://macrabbit.com/espresso/)
3、TextMate(http://macromates.com/)
4、Aptana(http://www.aptana.com/)
5、DreamWeaver CS4(http://www.adobe.com/products/dreamweaver.html)
PCユーザー:
1、InType(http://intype.info/home/index.php)
2、E-Text Editor(http://www.e-texteditor.com/)
3、Notepad++(http://notepad-plus.sourceforge.net/uk/site.htm)
4、Aptana(http://www.aptana.com/)
5、DreamWeaver CS4(http://www.adobe.com/products/dreamweaver.html)
17、フロントエンドコードを圧縮!
Javascript圧縮サービス:
1、Javascript Compressor(http://javascriptcompressor.com/)
2、JS Compressor(http://www.xmlforasp.net/JSCompressor.aspx)
CSS Compression Services:
1、CSS Optimiser(http://www.cssoptimiser.com/)
2、CSS Compressor(http://www.cssdrive.com/index.php/main/csscompressor/)
3、Clean CSS(http://www.cleancss.com/)
18、縮小する
多くの人が書いた最初のページを振り返ると、深刻な「DIV癖」(divitis)が発見されます.通常、初心者の本能は段落をDIVで包み、位置をコントロールするためにより多くのDIVをつけることです.--実はこれは低効率で有害なやり方です.
ページを書き終わったら、必ず何度も振り返ってチェックし、できるだけ要素の数を減らします.ULレイアウトができるリストは、個々のDIVでレイアウトしないでください.
文章を書く鍵が「縮小、縮小、縮小」であるように、ページを書くのもこの基準に従わなければならない.
19、すべての画像にAlt属性を付ける
画像にalt属性を加えるメリットは言うまでもありません.これにより、画像を無効にしたり、特殊なデバイスを使用したりするユーザーがあなたのおじいさんの情報を理解したり、画像検索エンジンに友好的になることができます.
Firefoxは表示画像Alt属性をサポートしていません.title属性を追加できます.
20、徹夜を覚える
私はいつも知らず知らずのうちに夜明けまで勉強しています.これはいい状況だと思います.
私の「あ～は!」時間(「AH-HA」moments、柳暗花明または豁然とした明るい時を指す)は通常深夜に発生します.例えば、JavaScriptの「閉パッケージ」の概念を徹底的に理解しているのは、このような状況です.もしあなたがまだこのような奇妙な时間を感じたことがないならば、すぐに試してみましょう!
PS:ブログは引っ越しました.これからCSDNの更新はありません.最新のブログアドレス:http://www.cnblogs.com/yjzhu/
筆者はあなたがホームページの中でその中のすべての6種類のマークを使うことを提案して、大部分の人は前の4つしか使いませんが、最も多いHを使うと多くのメリットがあります.例えば、設備が友好的で、検索エンジンが友好的で、あなたのPラベルをH 6に置き換えてもいいです.
12、ブログならH 1をタイトルに残す
今日筆者はTwitterで、H 1をLOGOに定義すべきか、文章のタイトルに定義すべきかを議論し、80%の人が後者を選んだ.
もちろん具体的にどのように使うかはあなたのニーズ次第ですが、ブログを作るときに、文章のテーマをH 1にすることをお勧めします.これは検索エンジンの最適化(seo)に非常にメリットがあります.
13、ダウンロードySlow
ここ数年、ヤフーのチームは先端開発分野で多くの偉大な仕事をしました.先日、ySlowというFirebug拡張子が発表されました.それはあなたの<ページを分析し、「成績表」を返します.このページの各方面を細かく分析し、改善すべき点を提出しました.それは少し厳しいですが、絶対にあなたに役に立ちます.強くお勧めします.ySlow(http://developer.yahoo.com/yslow/)!
14.ULリストレイアウトナビゲーションメニューを使用する
通常、Webサイトにはナビゲーションメニューがあります.このように定義できます.
<div id="nav">
<a href="#">Home </a>
<a href="#">About </a>
<a href="#">Contact </a>
</div>美しいコードを書きたいなら、このような方法を使わないほうがいいです.
どうしてULレイアウトナビゲーションメニューを使うのですか.--ULは生まれながらにして定義リストのために準備されているからだ.
次のように定義します.
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>15、IEの扱い方を覚える
IEはこれまで先端開発者の悪夢だった!
CSSスタイルシートが基本的に定型化されている場合は、IEのスタイルシートを個別に作成し、IEのみを有効にすることができます.
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="screen" href="path/to/ie.css" />
<![endif]-->これらのコードは、ユーザーブラウザがIE 6以下であれば、このコードが有効になります.IE 7も含めたい場合は、「[if lt IE 7]」を「[if lte IE 7]」に変更します.
16、良いコードエディタを使う
WindowsユーザーであれMacユーザーであれ、ここには優れたエディタがたくさんあります.
Macユーザー:
1、Coda(http://www.panic.com/coda/)
2、Espresso(http://macrabbit.com/espresso/)
3、TextMate(http://macromates.com/)
4、Aptana(http://www.aptana.com/)
5、DreamWeaver CS4(http://www.adobe.com/products/dreamweaver.html)
PCユーザー:
1、InType(http://intype.info/home/index.php)
2、E-Text Editor(http://www.e-texteditor.com/)
3、Notepad++(http://notepad-plus.sourceforge.net/uk/site.htm)
4、Aptana(http://www.aptana.com/)
5、DreamWeaver CS4(http://www.adobe.com/products/dreamweaver.html)
17、フロントエンドコードを圧縮!
Javascript圧縮サービス:
1、Javascript Compressor(http://javascriptcompressor.com/)
2、JS Compressor(http://www.xmlforasp.net/JSCompressor.aspx)
CSS Compression Services:
1、CSS Optimiser(http://www.cssoptimiser.com/)
2、CSS Compressor(http://www.cssdrive.com/index.php/main/csscompressor/)
3、Clean CSS(http://www.cleancss.com/)
18、縮小する
多くの人が書いた最初のページを振り返ると、深刻な「DIV癖」(divitis)が発見されます.通常、初心者の本能は段落をDIVで包み、位置をコントロールするためにより多くのDIVをつけることです.--実はこれは低効率で有害なやり方です.
ページを書き終わったら、必ず何度も振り返ってチェックし、できるだけ要素の数を減らします.ULレイアウトができるリストは、個々のDIVでレイアウトしないでください.
文章を書く鍵が「縮小、縮小、縮小」であるように、ページを書くのもこの基準に従わなければならない.
19、すべての画像にAlt属性を付ける
画像にalt属性を加えるメリットは言うまでもありません.これにより、画像を無効にしたり、特殊なデバイスを使用したりするユーザーがあなたのおじいさんの情報を理解したり、画像検索エンジンに友好的になることができます.
Firefoxは表示画像Alt属性をサポートしていません.title属性を追加できます.
<img src="cornImage.jpg" alt=" " title=" " />20、徹夜を覚える
私はいつも知らず知らずのうちに夜明けまで勉強しています.これはいい状況だと思います.
私の「あ～は!」時間(「AH-HA」moments、柳暗花明または豁然とした明るい時を指す)は通常深夜に発生します.例えば、JavaScriptの「閉パッケージ」の概念を徹底的に理解しているのは、このような状況です.もしあなたがまだこのような奇妙な时間を感じたことがないならば、すぐに試してみましょう!
PS:ブログは引っ越しました.これからCSDNの更新はありません.最新のブログアドレス:http://www.cnblogs.com/yjzhu/