Salah satu tag yang akan anda pelajari awal dalam pendidikan reka bentuk web anda adalah sepasang tag yang dikenali sebagai "tag penekanan." Mari kita lihat apa tag ini dan bagaimana ia digunakan dalam reka bentuk web hari ini.
Kembali ke XHTML
Jika anda belajar HTML tahun lalu, sebelum kebangkitan HTML5, anda mungkin menggunakan kedua-dua tag berani dan italik. Seperti yang anda harapkan, tag ini mengubah elemen menjadi teks tebal atau teks bertaip. Masalah dengan tag ini, dan mengapa mereka diketepikan memihak kepada unsur-unsur baru (yang akan kita lihat tidak lama), adalah bahawa mereka bukan unsur semantik. Ini kerana mereka mendefinisikan bagaimana teks harus kelihatan daripada maklumat mengenai teks itu. Ingat, HTML (yang mana tag ini akan ditulis) adalah tentang struktur, bukan gaya visual! Visual yang dikendalikan oleh CSS dan amalan terbaik reka bentuk web telah lama diadakan bahawa anda sepatutnya mempunyai pemisahan gaya dan struktur yang jelas di halaman web anda. Ini bermakna tidak menggunakan unsur-unsur yang bukan semantik dan rupa yang terperinci daripada struktur. Inilah sebabnya mengapa teg berani dan italik biasanya diganti dengan kuat (untuk berani) dan penekanan (untuk huruf miring).
& lt; kuat & gt; dan & lt; em & gt;
Unsur-unsur yang kuat dan penekanan menambah maklumat pada teks anda, memperinci kandungan yang harus diperlakukan secara berbeza dan ditekankan apabila kandungan itu dituturkan. Anda menggunakan elemen-elemen ini dengan cara yang sama seperti yang anda akan gunakan dengan huruf tebal dan miring pada masa lalu. Cukup mengelilingi teks anda dengan tag pembukaan dan penutupan ( dan untuk penekanan dan dan untuk penekanan yang kuat) dan teks yang tertutup akan ditekankan.
Anda boleh sarang tag ini dan tidak kira mana tag eksternal. Berikut adalah beberapa contoh.
Teks ini ditekankan dan kebanyakan pelayar akan memaparkannya sebagai miring. Teks ini sangat ditekankan dan kebanyakan pelayar akan memaparkannya sebagai jenis tebal.Dalam kedua-dua contoh ini, kita tidak menentukan rupa visual dengan HTML. Ya, penampilan lalai akan menjadi huruf miring dan akan berani, tetapi penampilan yang mudah diubah dalam CSS. Ini adalah yang terbaik dari kedua-dua dunia. Anda boleh memanfaatkan gaya penyemak imbas lalai untuk mendapatkan teks berurat atau tebal dalam dokumen anda tanpa menyeberangi garis dan struktur dan gaya pencampuran. Katakan anda mahukan teks tidak hanya berani, tetapi juga merah, anda boleh menambahkannya ke CSS
kuat {
warna: merah;
}
Dalam contoh ini, anda tidak perlu menambah harta untuk font-weight yang tebal kerana itu adalah lalai. Sekiranya anda tidak mahu meninggalkannya secara kebetulan, bagaimanapun, anda sentiasa boleh menambahkannya dalam:
kuat {
font-weight: bold;
warna: merah;
}
Sekarang anda akan tetapi dijamin untuk memiliki halaman dengan teks tebal (dan merah) di mana pun tag digunakan.
Double Up on Emphasis
Satu perkara yang saya perhatikan sepanjang tahun adalah apa yang berlaku jika anda cuba menggandakan penekanan. Sebagai contoh:
Teks ini sepatutnya mempunyai teks tebal dan mencantumkan di dalamnya.Anda akan berfikir bahawa baris ini akan menghasilkan kawasan yang mempunyai teks yang tebal dan miring. Kadang-kadang ini memang berlaku, tetapi saya telah melihat beberapa pelayar hanya menghormati kedua gaya penekanan kedua, yang paling dekat dengan teks sebenar yang dipersoalkan, dan hanya memaparkannya sebagai miring. Inilah salah satu sebab mengapa saya tidak menggandakan tag penekanan.
Satu lagi sebab untuk mengelakkan "menggandakan" ini adalah untuk tujuan gaya. Salah satu bentuk penekanan jika biasanya cukup untuk menyampaikan nada yang anda ingin tetapkan. Anda tidak perlu berani, menceret, warna, membesarkan, dan menggariskan teks untuk menonjolkannya. Teks itu, akan semua penekanan yang berbeza, akan menjadi baik. Oleh itu, berhati-hatilah apabila menggunakan tanda penekanan atau gaya CSS untuk memberi penekanan dan jangan keterlaluan.
Nota mengenai Bold dan Italik
Satu pemikiran terakhir - sementara tanda-tanda berani () dan huruf miring () tidak lagi disyorkan untuk digunakan sebagai elemen penekanan, terdapat beberapa pereka web yang menggunakan tag ini untuk menuruti bidang teks sebaris. Pada dasarnya, mereka menggunakannya seperti elemen . Ini bagus kerana teg terlalu pendek, tetapi menggunakan unsur-unsur ini dengan cara ini tidak disyorkan secara umum. Saya menyebutkan dalam kes anda melihatnya di sana di sesetengah laman web yang digunakan untuk tidak membuat teks berani atau berurat, tetapi untuk membuat cangkuk CSS untuk beberapa gaya visual yang lain.
Artikel asal oleh Jennifer Krynin. Disunting oleh Jeremy Girard pada 12/2/16.