Menulis artikel menggunakan berbagai macam tanda baca (special characters) mungkin terlihat sangat merepotkan. Minimal kita harus membuka charmap untuk membantu menuliskannya. Hal-hal semacam inilah yang — mungkin — membuat kita enggan untuk menggunakannya.
Bagaimanapun juga penggunaan tanda baca — yang baik & benar — sangat penting dalam menulis artikel. Bayangkan jika kita membaca sepuluh paragraf tanpa titik atau koma, akan sangat membingungkan bukan? Apalagi ketika kita hanya bisa mendengar dan dibacakan.
Tidak hanya untuk mendukung keterbacaan (legibility) penggunaan tanda baca yang benar sangat berpengaruh terhadap kualitas tipografi artikel tersebut. Beberapa contoh tanda baca yang sering digunakan — tetapi tidak umum seperti titik, koma, tanda seru & tanda tanya — dalam menulis blog antara lain:
“Smart” Curly Quotes
Dalam menulis tanda kutip, kita terbiasa menggunakan double straight quotes (") yang secara generik terdapat pada papan ketik. Tetapi, pengutipan yang baik adalah menggunakan double curly quotes (“ ”). Selain itu terdapat juga single curly quote (‘ ’) yang berfungsi untuk menulis kutipan di dalam kutipan. Closing single curly quote (’) digunakan sebagai apostrof. Kita dapat melihat perbedaanya:
"Tadi ibu berkata, 'Tolong ambilkan air' kepada saya".
“Tadi ibu berkata, ‘Tolong ambilkan air’ kepada saya”.
Bedakan penggunaan “quotes” dengan “prime” (′ ″). Prime biasanya khusus digunakan untuk menuliskan satuan waktu (menit & detik).
11′ 34″ (Sebelas menit tigapuluh empat detik).
Ampersand (&)
Terkadang kita terlalu banyak menggunakan kata “dan” sehingga kalimat menjadi kurang nyaman dibaca. Kita dapat menggunakan ampersand (&) untuk mengatasinya. Selain itu, ampersand dapat kita atur sedemikian rupa sehingga tampil lebih bergaya. Mungkin kecil, tetapi memberi nilai lebih pada kualitas tipografi.
Perlu diingat bahwa untuk menuliskan ampersand sebaiknya ditulis dalam bentuk entitas HTML karena dapat mengganggu validitas dokumen. Styling pada ampersand pernah saya tulis di blogspot dengan judul Sedikit Sentuhan Pada Ampersand.
Dashses
Sesuai namanya, tanda pisah (dashes) digunakan untuk memisahkan suatu kata atau kalimant. Terdapat berbagai macam tanda pisah antara lain:
- a. Em dash (—)
-
Tanda dash yang memiliki panjang setara huruf “M”. Digunakan untuk membatasi penyisipan kata atau kalimat yang memberi penjelasan di luarbangun kalimat. contoh:
Penggunaan garis bawah dinilai tidak perlu — hey, ini jaman komputer, bukan mesin ketik — selain itu membingungkan karena dapat dikira sebuah pranala.
- b. En dash (–)
-
Tanda pisah yang memiliki panjang setera huruf “N”. Digunakan di antara dua bilangan dengan arti “sampai dengan”. Contohnya sebagai berikut:
Penggunaan bandwith antara 10–20GB per bulan.
- c. Hyphen (-)
-
Hyphen adalah tanda pisah yang terdapat secara generik pada papan ketik “qwerty”. Hyphen digunakan sebagai konjungsi dua kata dan untuk memenggal kata yang tidak selesai ketika berganti baris.
Gunakan tanda pisah sesuai dengan fungsinya masing-masing. Untuk tanda em dash, penulisan yang ideal adalah dengan menyisipkan spasi tipis — hair space,  . Hal ini akan sangat merepotkan — selain itu tidak kompatibel bagi IE6. Untuk mengatasinya, kita dapat memilih dengan menggunakan spasi atau tidak samasekali.
Perkalian (×) & Pembagian (÷)
Seringkali kita harus menulis simbol matematika seperti perkalian dan pembagian. Kasus yang paling sering terjadi adalah penggunaan huruf “x” (lowercase) untuk mengganti “×”. Contoh di bawah ini mungkin dapat menjelaskan bahwa mengganti “×” dengan huruf “x” sangat tidak efektif.
Resolusi layar WSVGA adalah 1024 × 600px.
Resolusi layar WSVGA adalah 1024 x 600px.
Ellipses
Ellipsis adalah tanda baca berbentuk tiga titik (…). Digunakan untuk menandai kalimat yang belum selesai — kita sering menjumpainya teritama pada fasilitas “Read more”. Mungkin tidak begitu kelihatan bedanya tetapi kata “ellipsis” sepertinya jauh lebih baik daripada “dot dot dot(s)”.
Daftar Tanda Baca
| Nama | Simbol | HTML | Numerik |
|---|---|---|---|
| Left Single Curly Quote | ‘ | ‘ | ‘ |
| Right Single Curly Quote | ’ | ’ | ’ |
| Left Double Curly Quote | “ | “ | “ |
| Right Double Curly Quote | ” | ” | ” |
| Minute | ′ | ′ | ′ |
| Second | ″ | ″ | ″ |
| Ampersand | & | & | & |
| Em dash | — | & | — |
| En dash | – | &ndash | – |
| Hyphen | - | - | |
| Multiplication | × | × | × |
| Division | ÷ | ÷ | ÷ |
| Ellipses | … | … | … |
| Hair space |   |
Simpulan
Mungkin kita kurang mempedulikan penggunaan tanda baca tersebut. Memang cukup merepotkan jika kita mengimplementasikan pada tiap artikel blog, tetapi itulah seni dalam tipografi. Tidak ada salahnya berusaha tampil “sempurna” dalam artian kita menggunakan kaidah-kaidah penulisan secara benar.
Saat ini teknologi mesin blog semakin canggih. Wordpress misalnya, secara otomatis mengkonversi straight quote menjadi curly quote — yang justru menimbulkan masalah dalam penulisan kode. Selain itu telah terdapat plugin-plugin seperti WP-Typography atau Typogrify untuk Textpattern. Kita bisa menggunakannya untuk mendukung kualitas tipografi pada web/blog yang kita kelola.
Daftar Bacaan
Berikut ini beberapa bacaan yang dapat bermanfaat untuk meningkatkan kualitas tipografi web/blog anda.
- Tanda Baca (Wikipedia)
- Typography quick tips (CSS Wizardry)
- HTML Symbol Entities (W3School)
- Punctuation on the Web (Safalra)
- Opera Lebih Strict (Dani Iswara)