Skip to main content

Bagaimana dan Kapan Menggunakan Tanda Penekanan dalam HTML

Beginning Graphic Design: Layout & Composition (April 2025)

Beginning Graphic Design: Layout & Composition (April 2025)
Anonim

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).

dan

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. Hanya 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 penyemak imbas akan memaparkannya sebagai miring.

Teks ini sangat ditekankan dan kebanyakan penyemak imbas akan memaparkannya sebagai jenis tebal.

Dalam kedua-dua contoh ini, kita tidak menentukan rupa visual dengan HTML. Ya, penampilan lalai dari tag akan menjadi miring dan akan berani, tetapi kelihatannya dengan mudah boleh 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 mahu itu teks bukan sahaja berani, tetapi juga merah, anda boleh menambah ini 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;}

Kini anda akan tetapi dijamin untuk memiliki halaman dengan teks berani (dan merah) di mana sahaja 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 kedua-duanya berani dan beralkali teks 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 - manakala yang berani () dan huruf miring () tags tidak lagi disyorkan untuk digunakan sebagai elemen penekanan, terdapat beberapa pereka web yang menggunakan tag ini untuk melayari bidang teks secara teratur. Pada dasarnya, mereka menggunakannya seperti a 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.