Jakarta, Virenial – Adobe Dreamweaver CC merupakan website builder sekaligus web deploy tool yang populer.
Aplikasi Dreamweaver dianggap sebagai perpaduan yang sempurna antara WYSIWYG dan juga HTML editor yang dimana lebih konvesional.
Pertama kali Dreamweaver dikembangkan oleh Macromedia, tetapi kemudian diakuisisi oleh Adobe Inc pada tahun 2005.
Pada awalnya Dreamweaver ini menawarkan perpetual license, metode pembayaran sekali dalam seumur hidup dalam menjalankan software ini.
Baca juga : Cara Export Filmora 9 Tanpa Watermark
Tetapi saat ini Dreamweaver beralih ke layanan berbasis langganan/subscription dimana menggunakan struktur Adobe Creative Cloud.
Mungkin menggunakan Dreamweaver ini untuk percobaan pertama kali pasti terasa sangat sulit.
Namun, jangan khawatir karena artikel ini kita akan mengulas cara membuat aplikasi berbasis web dengan Dreamweaver oleh karena itu tetap simak ulasan ini hingga akhir.
Cara Membuat Aplikasi Berbasis Web dengan Dreamweaver
1. Membuat Situs Baru
Cara membuat aplikasi berbasis web dengan Dreamweaver dengan membuat situs baru, langkah pertama dengan membuka site “New Site” pada dashboard Adobe Dreameaver CC.
Lalu anda namai website tersebut sesuai keinginan anda dan menyimpannya ke dalam satu folder.
Baca juga : Free VPN For PC
Cara ini dapat membantu anda untuk mengelola file dan mempermudah anda untuk melakukan proses unggah nantinya.
Jika Anda ingin memasukkan gambar ke situs anda tersebut, maka klik “Advanced Settings > Local Info” sehingga folder gambar akan dibuat dalam folder situs.
2. Membuat File Homepage
Selanjutnya cara membuat aplikasi berbasis web dengan Dreamweaver dengan membuat file Homepage.
Anda akan menemukan file situs di bagian panel kanan atas sehingga bisa membuat homepage dari nol.
Langkah pertama, yaitu silahkan anda buka menu “File > New” lalu pilih “New Document” setelah itu pilih “HTML” sebagai tipe dokumen lalu klik “Create“.
Baca juga : Cara Menginstal Software Autocad
Anda akan diarahkan kembali pada lembar kerja dengan beberapa baris kode HTML yang merupakan tampilan website anda secara live.
Lalu simpan file HTML sebagai index.html, dan letakkan dalam folder situs tersebut.
3. Membuat Header
Cara ketiga yaitu cara membuat aplikasi berbasis web dengan Dreamweaver dengan membuat Header.
Biasanya header akan diisi dengan logo dan nama situs anda, klik halaman putih atau pilih bagian tertentu dengan elemen “Body” pada editor.
Baca juga : 7 Aplikasi Download selain IDM Tercepat
Setelah itu tekan “Insert” yang berada di kanan atas panel sehingga akan menampilkan daftar dari elemen HTML umum yang bisa ditambahkan pada halaman anda.
Setelah itu anda bisa mencari elemen Header dengan drag and drop elemen tersebut ke lembar kerja anda sehingga elemen tersebut akan ditambahkan pada website anda beserta kodenya.
4. Menambahkan Navigasi Home
Kemudian cara membuat aplikasi berbasis web dengan Dreamweaver dengan menambahkan Navigasi Home.
Sekarang masuk pada menu “Panel Insert” dan cari elemen “Navigation” sehingga akan muncul jendela lalu tulis “Navigation” sebagai ID dan klik “OK“.
Cara ini akan menambah elemen navigasi ke editor saat anda berada pada elemen konten cari Hyperlink pada panel Insert lalu klik dan isi detailnya.
Jika sudah selesai, klik “OK” lalu klik tombol “Home” memiliki lebih banyak baris kode di editor.
5. Menambahkan Deskripsi Website
Selanjutnya ada juga cara membuat aplikasi berbasis web dengan Dreamweaver dengan menambahkan deskrtipsi website anda.
Anda bisa menambah bullet points dengan menggunakan baris di bawah kode paragraf lalu buka pane Insert dan klik “Unordered List“.
Baca juga : 5 Aplikasi Database Gratis
Lalukan tag pada “<l>” pada editor dan klik “List Item” pada panel Insert, proses ini akan menambahkan tag “<li>” ke dalam tag “<ul>“
Pada list HTML adalah anda harus menambah beberapa tag secara manual sesuai dengan jumlah poinnya.
Jika sudah berhasil membuat struktur dasar homepage, anda juga dapat menambah beberapa konten lain seperti form, video, gambar, dan lainnya.
6. Membuat File CSS
Yang keenam ada cara membuat aplikasi berbasis web dengan Dreamweaver dengan Membuat File CSS.
Cascading Style Sheet (CSS) digunakan untuk memodifikasi elemen pada HTML dan akan selalu digunakan oleh developer ketika membuat website.
Pertama-tama silahkan beri header anda ID dengan arahkan kursor ke kanan bawah dari panel Dreamweaver lalu pilih panel “DOM“.
Lalu tekan “Header” sehingga ditandai dengan ada warna biru bersamaan dengan tanda plus juga label.
Baca juga : 3 Aplikasi Adzan PC
Kemudian klik tanda plus tersebut dan ketikkan “#header” dengan hashtag tersebut memberikan ID kepada elemen tersebut.
Setelah itu tekan return atau enter, pada menu selanjutnya pilih source “Create a New CSS file“.
Jendela baru akan muncul dan pilih Browser cari folder situs anda dengan ketikkan “Style.css” dan lalu klik “Save” dan “OK“.
Anda akan mendapati style.css yang baru muncul di atas live view dan elemen link baru pada code editor.
7. Membuat Judul CSS Selector Untuk Judul Website
Terakhir yakni cara membuat aplikasi berbasis web dengan Dreamweaver dengan membuat judul CSS selector untuk judul website anda.
Langkah pertama yaitu dengan menandai H1 dibawah header dari panel DOM lalu pilih “CSS Designer” dari panel tersebut.
Baca juga : Aplikasi Convert Video PC
Lalu klik tanda plus “+” di belakang Selectors maka secara otomatis nama #header h1 akan muncul, setelah itu tekan “return“.
Itulah selurruh pembahasan kita menegai cara membuat aplikasi web dengan Dreamweaver yang bisa kami jabarkan kepada anda.
Pembahasan ini hanya bersifat informasi semata-mata hanya untuk menambah wawasan anda seputar Dreamweaver.
Jika informasi ini bermanfaat untuk anda, jangan lupa juga untuk dibagikan kepada teman atau kerabat anda.
Demikian informasi yang dapat kami bagikan kepada anda mengenai cara membuat aplikasi berbasis web dengan Dreamweaver pada artikel kali ini. Semoga bermanfaat dan selamat mencoba.
