Bagaimana Menambah dan Memformat Teks di Dreamweaver - dummies

Banyak orang terkejut dengan betapa mudahnya mereka dapat membuat halaman web dasar dengan teks dan gambar di Dreamweaver. Anda bisa melakukan pemformatan teks dasar dengan menggunakan opsi pemformatan HTML Dreamweaver, termasuk tag judul dan paragraf. Mulailah dengan tag HTML dasar ini untuk menjaga hal-hal sederhana pada awalnya.

Cara menambahkan teks ke halaman web di Dreamweaver

Untuk menambahkan teks pada halaman, Anda cukup mengklik untuk memasukkan kursor Anda di bagian atas halaman dan mengetik. Jika Anda ingin menambahkan teks yang Anda miliki di tempat lain, seperti di file yang dibuat di Microsoft Word, Anda dapat menyalin dan menempelkan teks ke Dreamweaver alih-alih mengetik ulangnya.

Dreamweaver menawarkan banyak cara untuk menjaga format saat Anda menyalin dan menempelkan teks dari program lain. Fitur ini sangat penting saat Anda menyalin teks dari Microsoft Word karena jika Anda hanya menyisipkan teks sebagaimana adanya, Anda berisiko memasukkan banyak kode tambahan yang unik ke Microsoft Word dan dapat menyebabkan masalah pada halaman web Anda.

Anda dapat mengubah default cara menangani format Dreamweaver ketika Anda memilih Edit → Paste dengan mengubah Preferences dalam kategori Copy / Paste. Anda juga dapat memilih Edit → Paste Special untuk menampilkan pilihan ini setiap kali Anda menempelkan konten baru.

Berikut adalah empat pilihan utama Anda untuk memasukkan teks saat Anda memilih Edit → Paste Special serta tiga cara untuk memperbaiki pilihan Anda:

Text Only: Dreamweaver strip format dan sisipan apapun teks biasa
Teks dengan Struktur: Dreamweaver mencakup paragraf, daftar, tabel, dan opsi pemformatan struktural lainnya.
Teks dengan Struktur Plus Format Dasar: Dreamweaver mencakup pemformatan struktur serta format dasar, seperti huruf tebal dan miring.
Teks dengan Struktur Plus Full Formatting: Selain opsi sebelumnya, Dreamweaver menyertakan format yang dibuat oleh style sheet pada program seperti Microsoft Word.
Pertahankan Line Breaks: Istirahat baris dipertahankan, bahkan jika Anda tidak menyimpan opsi pemformatan lainnya. Pilihan ini tidak tersedia jika Anda memilih Hanya Teks.
Clean Up Word Paragraph Spacing: Pilihan ini menghapus kode pemformatan khusus yang unik untuk Microsoft Word dan tidak perlu (dan tidak disarankan) untuk teks di web.
Mengkonversi Kutipan Pintar ke Penawaran Lurus: Tanda kutip cerdas - nama umum untuk kutipan keriting mewah yang disukai oleh para perancang dalam dokumen cetak - memerlukan karakter khusus untuk ditampilkan dengan benar di web, dan karakter spesial itu tidak bekerja di semua web browser.Untuk menghindari masalah potensial ini, pilih kotak ini dan ubah semua kutipan cerdas Anda menjadi yang lurus.

Cara memformat teks dengan tag judul di Dreamweaver

Salah satu opsi pemformatan terbaik untuk tajuk utama adalah kumpulan tag judul. Dalam HTML, menggunakan tag judul (

,

, dan sebagainya) untuk memformat teks yang berfungsi sebagai judul atau judul menawarkan banyak keuntungan. Tag judul dirancang untuk ditampilkan dalam ukuran relatif, dengan

yang terbesar,

lebih kecil,

lebih kecil lagi, dan seterusnya melalui

.

Jadi tidak peduli apa ukuran teks default halaman web (dan ukuran teks dapat bervariasi karena pengaturan browser dan platform komputer), teks yang diformat dengan tag

selalu lebih besar dari teks yang diformat dengan

.

Keyakinan populer adalah bahwa banyak mesin pencari memprioritaskan kata kunci dalam teks yang diformat dengan tag

karena teks yang paling penting pada halaman umumnya termasuk dalam judul utama ukuran terbesar. Demikian pula, pakar mesin telusur akan memberi tahu Anda bahwa Anda harus menggunakan tag

hanya sekali per halaman.

Untuk memformat teks dengan tag judul, ikuti langkah-langkah ini:

Sorot teks yang ingin Anda format.

Di Property inspector, di bagian bawah ruang kerja, pastikan tombol HTML di sebelah kiri inspektur dipilih.

Gunakan daftar drop-down Format untuk memilih opsi judul.

Saat judul tag diterapkan, teks secara otomatis berubah menjadi besar dan tebal dalam tampilan Desain.

Kredit: Foto oleh Casey Stoll

Secara umum, inspektur Properti adalah cara termudah untuk menerapkan format dasar, namun Anda dapat menemukan opsi pemformatan HTML ini juga dengan memilih Format → Paragraph Format dan kemudian memilih opsi heading dari submenu yang muncul

Cara menambahkan paragraf dan jeda baris di Dreamweaver

Saat membuat desain halaman untuk web, Anda harus bekerja dalam banyak keterbatasan yang mungkin tampak membingungkan pada awalnya. Desain web dan desain cetak pada dasarnya berbeda, dan itu bisa membuat tugas yang tampaknya sederhana lebih rumit daripada yang Anda duga. Bagaimana Anda membuat paragraf dan jeda baris adalah contoh yang bagus.

Jika Anda bekerja di Design view di Dreamweaver dan tekan tombol Enter (Windows) atau tombol Return (Mac), Dreamweaver memasukkan tag paragraf, atau

, dalam kode, yang membuat jeda baris diikuti dengan garis kosong

Jika Anda menginginkan jeda baris tanpa baris kosong tambahan, tahan tombol Shift saat Anda menekan Enter (atau Kembali) untuk memberi tahu Dreamweaver untuk memasukkan tag

ke dalam kode, membuat jeda baris tunggal.

Praktik terbaik adalah menghindari penggunaan beberapa paragraf atau tag pemutusan untuk membuat ruang ekstra di halaman web (dan tidak semua browser akan mempertahankan ruang kosong jika Anda membuatnya seperti itu). Jika Anda ingin menambahkan banyak ruang antara paragraf atau elemen lain pada halaman, pilihan terbaik Anda adalah menggunakan CSS.

Jika Anda bekerja dalam tampilan Kode dan menambahkan spasi menggunakan tombol Enter atau Return, Anda menambahkan ruang kosong di dalam kode. Ruang ekstra dalam kode HTML bisa bermanfaat karena ruang ekstra dapat membuat kode lebih mudah dibaca, namun secara umum, hal itu tidak mempengaruhi tampilan halaman dalam tampilan Design atau di browser web.