Hingga tahap ini, Anda sudah mengerti cara dasar menuliskan tag HTML hingga membukanya di aplikasi peramban. Tutorial ini berjudul “Tutorial HTML – Enter Dan Spasi” dan jujur saja judul tutorial ini terlihat kurang bernilai. Tapi pengalaman pribadi saya menyatakan bagian ini sangat penting karena banyak orang yang mendapatkan kesulitan untuk mencetak enter dan spasi pada kode html.

Tutorial HTML – Enter Dan Spasi – Bagian 5 (Bahasa Indonesia)

Berikut ini adalah contoh tampilan kode latihan kita sebelumnya di Mozilla Firefox:

latihan 5 - 01 - mozilla firefox - result 1

Bila Anda sedikit teliti, Anda akan merasakan sedikit keanehan dibandingkan dengan kode yang diketikkan. Mari kita bandingkan dengan kode HTML yang telah diketikkan.

Cara Melihat Source Code Halaman Website

Kode yang Anda ketikkan juga berfungsi seperti halaman website. Kita dapat melihat source code alias kode HTML yang diterima oleh aplikasi peramban dengan cara berikut ini:

Klik kanan pada halaman hasil tampilan, tepatnya di bagian (2). Kemudian klik “View Page Source”. Selanjutnya akan terbuka sebuah halaman yang berisi kode HTML yang diketikkan, seperti tampilan di bawah ini:

latihan 5 - 02 - mozilla firefox - view source 1

Analisa Tampilan HTML Dibandingkan Kode HTML Latihan

Bila dibandingkan secara langsung seperti pada tampilan berikut ini:

latihan 5 - 03 - mozilla firefox - analyze result 1

Pada tampilan di atas terlihat bahwa “Enter” dan “spasi” di dalam kode tidak tercetak pada tampilan.

HTML akan mencetak Enter(ganti baris) dengan tag br

HTML tidak akan mencetak “Enter” yang terdapat di dalam kode HTML yang kita ketikkan kecuali pada tulisan preformated pada HTML. Pada HTML kita harus menggunakan sebuah tag untuk mengganti baris atau mencetak “Enter” pada tampilan. Tag yang digunakan adalah <br ⁄>. Anda harus menuliskan tag ini untuk menampilkan “Enter” atau mengganti baris.

HTML Tidak Mencetak Spasi Tertentu

Penulisan kode HTML harus cukup cermat karena beberapa cara penulisan “spasi” akan diabaikan dan tidak tercetak pada tampilan. Contohnya pada tampilan di atas. Berikut ini adalah aturan penulisan “spasi” di dalam HTML.
– “spasi” di awal kalimat akan diabaikan.
– “spasi” digunakan sebagai pemisah antar kata.
– “spasi” di antara kata dan lebih dari 1x secara berturut-turut hanya akan dicetak 1x.
– “tab” mempunyai fungsi yang sama dengan “spasi”.

Cara Menulis Spasi lebih dari 1 di HTML

Sering kali kita membutuhkan untuk mencetak “spasi” lebih dari 1x untuk menyusun sebuah kalimat. Hal ini cukup membuat kita kesulitan ketika tidak mengetahui caranya. HTML mempunyai sebuah karakter khusus yang sering digunakan, yaitu non-breaking space. Artinya “spasi” yang tidak berhenti.

Non-breaking space merupakan karakter spesial jadi cara penulisannya menggunakan tata cara karakter spesial. Cara penulisannya adalah “&nbsp;”

Cara Menulis Spasi di awal kalimat pada HTML

Cara penulisan “spasi” di awal kalimat juga sama dengan cara di atas, yaitu menggunakan karakter non-breaking space(&nbsp;). Cara ini cukup mudah bila Anda sudah mengetahuinya.

Cara Penulisan Non Breaking Space yang Efisien

Bila Anda dihadapkan untuk menulis “spasi” sebanyak 10 buah, Anda mungkin berpikir untuk menulis ” ” secara berulang-ulang, seperti di bawah ini:

Anda harus menulis 10 buah   untuk mencetak 10 buah spasi dan total menjadi 60 huruf untuk panjang totalnya. Non-breaking space merupakan sebuah karakter spesial dan dianggap sebagai sebuah huruf di dalam HTML. Oleh karena itu, kita dapat menggunakan “spasi” sebagai pemisah huruf. Jadi kita bisa menuliskan 10 buah “spasi” dengan cara berikut ini:

Setelah kita hitung cara kombinasi antara “&nbsp;” dan “spasi” spasi mampu membuat kode HTML menjadi lebih pendek. Cara kombinasi hanya membutuhkan 35 huruf untuk mencetak 10 buah spasi dibandingkan cara sebelumnya yang membutuhkan 60 huruf.

Semakin banyak Kode HTML akan membuat website semakin lama waktu loading

Semakin efisien kita menulis kode HTML maka akan semakin sedikit kode yang dikirimkan ke komputer pengguna. Hasilnya kecepatan loading website akan semakin tinggi. Namun, pada beberapa bagian tertentu kode HTML tidak bisa dihemat, penulis kode HTML harus menambahkan catatan atau komentar ke dalam kode HTML. Hal ini dilakukan untuk memudahkan penulis untuk mengembangkan kode ke depannya. Untuk mempelajari komentar HTML, silahkan klik tautan berikut ini:
Tutorial HTML – Komentar HTML – Bagian 6 (Bahasa Indonesia)

Penulisan HTML

Selain cara penulisan tag, HTML juga mempunyai standar cara penulisan sebuah file HTML. Sebuah file HTML mempunyai struktur dasar dan kita akan lanjutkan tutorial mengenai struktur dasar file HTML ke tahapan selanjutnya
Tutorial HTML – Kerangka HTML – Bagian 7 (Bahasa Indonesia)