Rumah > hujung hadapan web > html tutorial > Lima Belas Amalan Terbaik untuk HTML Beginners_HTML/Xhtml_Web Page Production

Lima Belas Amalan Terbaik untuk HTML Beginners_HTML/Xhtml_Web Page Production

WBOY
Lepaskan: 2016-05-16 16:36:10
asal
1628 orang telah melayarinya

Berikut ialah tiga puluh amalan terbaik untuk pemula HTML, dikongsi dengan semua orang untuk rujukan anda, kandungan khusus adalah seperti berikut

1. Pastikan label ditutup

Pada masa lalu, saya sering melihat kod yang serupa dengan yang berikut (Anotasi: Berapa lama dahulu ini...):

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <li>Sesetengah teks di sini.
  2. <li>Sesetengah teks baharu di sini. <
  3. li>Anda mendapat idea Perhatikan bahawa label UL/OL pada pakej luar tiada (siapa tahu sama ada ia disengajakan atau tidak disengajakan), dan label LI juga terlupa untuk ditutup. Mengikut piawaian hari ini, ini jelas merupakan amalan buruk dan harus 100% dielakkan. Apa-apa pun, pastikan tag ditutup. Jika tidak, anda mungkin menghadapi masalah semasa mengesahkan tag html.
Cara yang lebih baik

Kod XML/HTML

Salin kandungan ke papan keratan
<
    ul
  1. >  <
  2. li>Sesetengah teks di sini li>  <
  3. li>Sesetengah teks baharu di sini li>  <
  4. li>Anda mendapat idea itu 🎜>li>  ul
  5. >
  6.   2. Istiharkan jenis dokumen yang betul
  7. Pengarang telah menyertai banyak forum CSS sebelum ini Setiap kali pengguna menghadapi masalah, kami akan menasihatinya untuk melakukan dua perkara dahulu:
1. Sahkan fail CSS untuk memastikan tiada ralat.

2. Sahkan bahawa doctype yang betul telah ditambahkan DOCTYPE muncul sebelum teg HTML Ia memberitahu penyemak imbas sama ada halaman itu mengandungi HTML, XHTML atau campuran kedua-duanya, supaya penyemak imbas boleh menghuraikannya dengan betul.

Secara amnya terdapat empat jenis dokumen untuk dipilih:

Kod XML/HTML

Salin kandungan ke papan keratan

  1. >  
  2.   
  3.   
  4. >  
  5.   
  6.   
  7. >  
  8.   
  9.   
  10. >  
  11.   

关于该使用什么样的文档类型声明,一直有不同的说法。通常认为使用最有不同的说法。通常认为使用最最使用這,但研究表明,大部分浏览器会使用普通的方式解析这种声明,所以很多人选择使用HTML4.01标准。选择声明的底线是,它是不是真的适合你,所以你萑明的底线是。你得项目的声明。

3.永远不要使用内联样式

🎜

Kod XML/HTML
复制内容到剪贴板
  1. <p gaya="warna: merah;" >Saya akan menjadikan teks ini merah supaya  benar-benar menyerlah dan membuat orang memerhatikan ! p>     
这样看起来即方便又没有问题。然而,这在你的编码实践中是个错误。

在你写代码时,在内容结构完成之前最好不要加入样式代码。

这样的编码方式就像打游击,是一种很山寨的做法。——Chris Coyier

更好的做法是,完成标签部分后,再把这个P的样式定义在外部样式表文>。建议

Kod XML/HTML
复制内容到剪贴板
    #someElement 
  1. > p {        warna: merah;     
  2. }  
4.将所有外部css文件放入head标签内

理论上讲,你可以在任何位置引入CSS样式表,但HTML规范建议在网页的head,在网页的head,在网页的head标记念中页面的渲染速度。

雅虎的开发过程中,我们发现,在head标签中引入样式表,会加快网页加载快网页加载快了了页面逐步渲染。 —— ySlow团队

Kod XML/HTML
复制内容到剪贴板
  1. <kepala>     
  2. <tajuk>Jenis Jagung Kegemaran Sayatajuk>     
  3. <pautan rel="stylesheet"  taip="teks/css" media ="skrin" href="path/to/file.css" />     
  4. <pautan rel="stylesheet"  taip="teks/css" media ="skrin" href="path/to/anotherFile.css" />     
  5. kepala>    

5.javascript文件放在底部

要记住一个原则,就是让页面以最快的速度呈现在用户面前。当加轄一个载一个轄载,直到脚本完全载入并执行完成。因此会浪费用户更多的时间。

如果你的JS文件只是要实现某些功能,(比如点击按钮事件),那就放心心的女对是最佳的方法。

建议

Kod JavaScript复制内容到剪贴板
  1. Dan kini anda tahu jenis jagung kegemaran saya. 

         
  2. "text/javascript" src="path/to/file.js">     
  3. "text/javascript" src="path/to/anotherFile.js">     
  4.      
  5.     

6.永远不要使用内联javascript。现在不是1996年了!

🎜册中非常常见。本质上讲,一个“onclick”事件是附加在 标签上的,其效果等同于一些JS代码。不需要讨论太多,非常不应该使用这样的方式,方式,方式一个外部JS文件中,然后使用“ addEventListener / attachEvent ”加入事件监听器。或者使用jquery等框架,只需要使用“klik”方法。

Kod JavaScript复制内容到剪贴板
  1. $('a#moreCornInfoLink').klik(fungsi() { 
  2. makluman('Ingin mengetahui lebih lanjut tentang jagung?');
  3. });
7. Sahkan semasa membangunkan

Jika anda baru mula melibatkan diri dalam pengeluaran halaman web, amat disyorkan anda memuat turun Bar Alat Pembangun Web (pengguna krom sila cari di gedung aplikasi sendiri, iaitu pengguna mungkin tidak dapat menggunakannya), dan gunakan "Pengesahan Standard HTML" pada bila-bila masa semasa proses pengekodan dan "Pengesahan Piawaian CSS". Jika anda fikir CSS adalah bahasa yang sangat mudah untuk dipelajari, ia akan membunuh anda. Kod longgar anda akan menjadikan halaman anda penuh dengan kelemahan dan menyebabkan masalah berterusan Cara yang baik adalah dengan mengesahkan, mengesahkan dan mengesahkan semula.

8. Muat turun firebug

Firebug sudah pasti merupakan pemalam terbaik untuk pembangunan web. Ia bukan sahaja boleh menyahpepijat JavaScript, tetapi juga membolehkan anda memahami sifat dan kedudukan teg halaman secara intuitif. Tanpa berlengah lagi, muat turunnya!

9. Gunakan pepijat api

Menurut pemerhatian penulis, kebanyakan pengguna hanya menggunakan 20% daripada fungsi Firebug, yang benar-benar membazir anda mungkin juga menghabiskan beberapa jam untuk mempelajari alat ini secara sistematik, saya percaya ia akan memberi anda dua kali ganda hasil dengan separuh usaha itu.

10. Simpan nama tag dalam huruf kecil

Secara teorinya, html tidak sensitif huruf, anda boleh menulis apa sahaja yang anda mahu, contohnya:

Kod XML/HTML
Salin kandungan ke papan keratan
  1. <DIV> 
  2. <P>Inilah fakta menarik tentang jagung < /P> 
  3. DIV>
Tetapi sebaiknya jangan menulis seperti ini Tidak ada gunanya memasukkan huruf yang lebih besar dan ia akan menjadikan kod itu hodoh.

Cadangan

Kod XML/HTML
Salin kandungan ke papan keratan
  1. <div> 
  2.  
  3. <p>Berikut ialah fakta menarik tentang jagung. /p> 
  4. div> 
11. Gunakan tag H1-H6

Adalah disyorkan agar anda menggunakan kesemua enam teg dalam halaman web anda Walaupun kebanyakan orang hanya akan menggunakan empat yang pertama, H yang paling banyak digunakan akan mempunyai banyak faedah, seperti kemesraan peranti, kemesraan enjin carian, dll. Anda juga boleh meletakkan Ganti semua tag P anda dengan H6.

Kod XML/HTML

Salin kandungan ke papan keratan
<
  1. h1>Ini fakta jagung yang sangat penting h1>  <
  2. h6>Fakta jagung yang kecil tetapi masih ketara berlaku di sini h6>

    12.Gunakan senarai tidak tertib (UL) untuk membalut menu navigasi

    Biasanya tapak web akan mempunyai menu navigasi, anda boleh mentakrifkannya dengan cara ini:

    Kod XML/HTMLSalin kandungan ke papan keratan
    1. <div id="nav" > 
    2. <a href="#" >Rumah a> >
    3. <a href="#" >Mengenai a> >
    4. <
    5. a href="#" >Hubungi a> >
    6. div
    7. > Jika anda ingin menulis kod yang cantik, sebaiknya jangan gunakan kaedah ini. Mengapa menggunakan menu navigasi reka letak UL? ——Oleh kerana UL dilahirkan untuk senarai definisi
    Sebaik-baiknya mentakrifkannya seperti ini:

    Kod XML/HTML

    Salin kandungan ke papan keratan

    <
    ul
    1. id="nav" >  <
    2. li
    3. ><a href="#">Rumah a>li>  <
    4. li
    5. ><a href="#">Mengenai a>li>  <
    6. li
    7. ><a href="#">Hubungi a>li> 
    8. ul
    9. > 

      15. Ketahui cara berurusan dengan IE

      IE sentiasa menjadi mimpi ngeri bagi pembangun bahagian hadapan!

      Jika helaian gaya CSS anda pada dasarnya telah dimuktamadkan, anda boleh membuat helaian gaya berasingan untuk IE, dan kemudian ini hanya akan berkuat kuasa pada IE:

      Kod CSSSalin kandungan ke papan keratan
      1.  

      Maksud kod ini ialah: kod ini hanya akan berkuat kuasa jika pelayar pengguna ialah IE6 dan ke bawah. Jika anda ingin memasukkan IE7, tukar "[jika lt IE 7]" kepada "[jika lte IE 7]".

      Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu kajian semua orang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan