Memulai dengan situs web Anda bisa menjadi tugas yang menakutkan. Ini terutama benar jika Anda memiliki pengalaman terbatas dalam membangun situs web. Untuk memulai, Dynadot menyediakan hosting satu halaman gratis dengan setiap pembelian domain. Hosting satu halaman kami menampilkan "wizard" untuk membantu orang yang tidak tahu HTML dalam membangun situs web mereka. Namun, wizard kami tidak memungkinkan Anda melakukan sebanyak itu untuk situs Anda seperti HTML, jadi berikut adalah beberapa dasar untuk memulai*:

<b>bold</b>
<i>italics</i>
<u>underline</u>

Ukuran Font
Cara termudah untuk mengubah ukuran font adalah dengan menggunakan tag ini:

<big>meningkatkan ukuran font satu tingkat</big>
<small>mengurangi ukuran font satu tingkat</small>

Jika Anda perlu membuat font lebih besar atau lebih kecil, Anda dapat menggunakan tag yang lebih spesifik ini:

<font size="+2">meningkatkan ukuran font dengan angka dalam tanda kutip</font>
<font size="-2">menurunkan ukuran font dengan angka dalam tanda kutip</font>

Anda juga bisa lebih spesifik dengan ukuran font Anda dengan menentukan angka 1-7 sebagai ukuran font dengan 1 sebagai ukuran terkecil dan 7 sebagai ukuran terbesar:

<font size="1">font terkecil 8 pt</font>
<font size="7">font terbesar 36 pt</font>

Opsi lain dengan ukuran font adalah menggunakan tag header 1-6, yang juga memberikan spasi di sekitar teks:

 

 

<h1>header terbesar</h1>

 

 

<h6>header terkecil</h6>

Warna Font
Selain mengubah ukuran font Anda, Anda juga dapat menyesuaikan warnanya.

<font color="blue">biru</font>
<font color="red">merah</font>

Jika Anda ingin menggunakan warna merah atau biru yang berbeda, Anda dapat memasukkan angka heksadesimal enam digit alih-alih kata "red" atau "blue." Semua warna terdiri dari merah, biru, dan hijau dan setiap warna memiliki "code." Dua angka pertama (atau terkadang huruf) dari kode mewakili merah, kemudian dua berikutnya mewakili hijau, dan dua terakhir mewakili biru. Anda dapat mengunduh Warna Salin untuk PC atau Pengukur Warna Digital untuk Mac dan gunakan produk ini untuk mengarahkan kursor ke warna apa pun di layar Anda dan itu akan memberi Anda kode yang Anda butuhkan. Misalnya, jika Anda menggunakan kode untuk warna biru yang Anda lihat di atas, itu akan terlihat seperti ini:

<font color="#0000FF">warna biru yang sama</font>
<font color="#3DC6EA">dan ini adalah contoh warna biru lain yang dapat Anda pilih menggunakan kode</font>

Jenis Huruf
Terakhir, Anda dapat mengubah jenis huruf font Anda. Anda dapat menggunakan Microsoft Word jika memerlukan ide.

<font face="arial">font arial</font>
<font face="comic sans ms">font comic sans ms</font>
<font face="lucida handwriting">lucida handwriting</font>

Sekarang Anda perlu menyatukan semuanya. Untuk apa pun dengan kata "font", Anda cukup memasukkan semua informasi dalam satu tag. Jika Anda ingin menggunakan tag header atau menambahkan tebal, miring, atau garis bawah, Anda dapat menambahkannya di tag mereka sendiri.

<font size="4" color="376E1E" face="calibri">Anda dapat menggabungkan semuanya</font>

<b><font size="4" color="376E1E" face="calibri">Anda dapat menebalkan semuanya</font></b>

<font size="4" color="376E1E" face="calibri">atau Anda bisa menebalkan <b>part</b> dari itu</font>

Spasi
Sekarang Anda bisa menyesuaikan font Anda, Anda ingin membuat paragraf, jeda baris, dan dalam beberapa kasus Anda mungkin perlu menambahkan spasi secara manual:

<p>menggunakan tag paragraf menempatkan teks Anda di paragrafnya sendiri...</p>

<p>...dan di baris berikutnya</p>

Menggunakan jeda baris seperti...<br>
...menekan enter untuk pindah ke baris berikutnya dan tidak seperti yang lain di halaman ini, itu tidak memerlukan tag penutup (ini adalah tag penutup </p>). Anda cukup memasukkannya lagi...<br>
...untuk pindah ke baris berikutnya lagi.

Anda tidak perlu menggunakan kode untuk spasi antara teks (seperti dari spasi) kecuali Anda ingin menambahkan spasi tambahan karena HTML hanya akan mengenali satu bahkan jika Anda memasukkan lebih dari satu dengan spasi Anda. Untuk memberi Anda spasi antara teks, Anda dapat menggunakan kode: &nbsp;

Tautan
Satu hal yang mungkin ingin Anda tambahkan ke situs web Anda adalah tautan ke halaman lain di situs web Anda atau bahkan situs web lain. Tautan mudah ditambahkan menggunakan kode ini:

<a href="http://www.dynadot.com">ini menautkan ke beranda Dynadot</a>

Anda mungkin memperhatikan bahwa jika Anda mengklik tautan di atas, tautan tersebut terbuka di tab atau jendela terpisah di browser Anda, tergantung pada pengaturan browser Anda. Ini adalah hal yang mudah untuk ditambahkan dan direkomendasikan jika Anda menautkan ke luar dari situs web Anda atau tidak ingin kehilangan pengunjung di halaman tertentu (seperti blog) karena itu menjaga halaman tersebut tetap terbuka bagi pelanggan Anda untuk kembali tanpa harus mengklik tombol kembali di browser mereka. Yang perlu Anda lakukan hanyalah menambahkan target="_blank" setelah tautan Anda:

<a href="http://www.dynadot.com" target="_blank">ini menautkan ke beranda Dynadot</a>

Gambar
Terakhir, Anda mungkin ingin menambahkan gambar ke situs Anda. Untuk menambahkan gambar dengan HTML, Anda perlu menghostingnya di suatu tempat. Jika Anda tidak memiliki tempat untuk menghosting gambar sendiri, Anda dapat menggunakan layanan seperti Tiny Pic.com yang memungkinkan Anda mengunggah gambar Anda secara gratis dan menghasilkan tag HTML untuk Anda. Jika Anda tidak ingin membuat akun, Anda bisa menyimpan HTML yang dihasilkannya (hanya jangan menyimpannya di Microsoft Word karena Word terkadang menambahkan hal-hal yang membuat kode tidak berfungsi lagi). Perlu diingat bahwa beberapa gambar sangat besar dan Anda mungkin ingin mengoptimalkannya agar memakan lebih sedikit ruang. Ada beberapa pengoptimal gambar gratis yang dapat Anda gunakan untuk mengurangi ukuran file gambar Anda seperti Image Optimizer.net. Berikut adalah contoh tag gambar dasar:
<img src="https://i45.tinypic.com/9bkglk.jpg"> yang terlihat seperti ini:

Anda juga dapat menambahkan bingkai ke gambar Anda, mengubah ukurannya, dan menambahkan spasi di sekitarnya:

<img src="https://i45.tinypic.com/9bkglk.jpg" border="2" width="100" height="30" vspace="10" hspace="20" align="left">

Seperti yang dapat Anda lihat, gambar memiliki border, lebih lebar dan lebih pendek, dan telah diberi jarak di sekitar atas dan bawah serta kanan dan kiri. Gambar juga disejajarkan ke kiri, sehingga teks sekarang muncul di samping gambar.

Anda juga dapat menambahkan tautan ke gambar Anda. Anda hanya perlu menempatkan tag tautan di sekitar tag gambar seperti ini:

<a href="http://www.dynadot.com" target="_blank"><img src="https://i45.tinypic.com/9bkglk.jpg" border="0"></a>
Sekarang Anda dapat mengklik gambar ini dan itu membawa Anda ke beranda kami:

Ini terkadang menambahkan border di sekitar gambar dalam warna biru yang Anda lihat pada tautan teks. Untuk menghapusnya, cukup tambahkan border="0" ke tag gambar Anda. Anda mungkin juga memperhatikan bahwa HTML yang dihasilkan oleh Tiny Pic.com memiliki alt="Image and video hosting by Tiny Pic" dalam tag gambar. Anda dapat menggunakan ini untuk menempatkan teks dengan gambar Anda jika gambar tidak ditampilkan dengan benar di browser seseorang. Menambahkan teks alternatif juga dapat membantu dengan Optimisasi Mesin Pencari (SEO).

Sekarang semoga Anda merasa lebih baik tentang HTML, Anda dapat menguji keterampilan Anda di situs web Anda. Tetapi sebelum Anda menyimpan dengan HTML yang mungkin tidak sempurna, kami menyarankan untuk menguji HTML Anda dengan layanan gratis seperti onlinehtmleditor.net. Bahkan ada beberapa tombol HTML mudah di atas untuk membantu Anda. Sekarang Anda hanya perlu mendapatkan domain Anda jika Anda belum memilikinya dan mulailah dengan situs web Anda hari ini!

*Harap dicatat bahwa tag font sudah tidak digunakan lagi dan mungkin tidak ditampilkan dengan benar di semua browser. Sebaiknya tentukan gaya font di CSS, yang akan kita bahas di posting blog selanjutnya.

Posting oleh Robyn Norgan