How To Make A Website With Html

How To Make A Website With Html – Hari ini kita akan membuat situs web tentang hewan favorit Anda. Kami akan menggunakan Mozilla Thimble, dan kami akan menulis situs web kami dalam HTML, CSS, dan JavaScript. Tidak diperlukan pengalaman sebelumnya dalam desain web atau HTML. Mari kita mulai!

HTML (Hypertext Markup Language) adalah bahasa yang akan kita gunakan untuk menambahkan informasi ke halaman kita seperti judul, paragraf, daftar, dll. CSS (Cascading Style Sheets) adalah apa yang kami gunakan untuk membuat halaman kami terlihat berbeda. melakukan hal-hal seperti mengubah warna, pusat dan konten, dll. Kita akan melihat kode CSS yang kita tulis sebelumnya, tetapi hari ini kita akan menulis kode dalam HTML.

How To Make A Website With Html

Sebelum kita mulai membuat kode situs web kita, penting untuk mempelajari dasar-dasar HTML: tag. Ada empat hal penting yang perlu diketahui tentang tag.

How To Create An Html Contact Form

Setiap simbol ada hubungannya dengan itu. Misalnya, “h1” adalah judul, “p” adalah paragraf, dan “ul” adalah daftar tanpa judul (daftar dengan poin-poin). Anda akan mempelajari lebih lanjut tentang tag ini saat kami mendaftarkan situs web kami hari ini, dan Anda dapat menemukan lebih banyak tag di w3schools.com. Saat membuat kode situs web Anda hari ini, pastikan bahwa semuanya (judul, judul, paragraf, daftar, dll.) memiliki tag akhir yang cocok, jika tidak, halaman web Anda mungkin tidak terlihat seperti seharusnya. .

Untuk menjalankan situs web kami, kami harus mengikuti langkah-langkah di bawah ini untuk menyiapkan editor kode.

Anda akan dapat melihat editor kode di sebelah kiri dan pratinjau situs web di sebelah kanan seperti yang ditunjukkan di bawah ini. Mozilla Thimble menyediakan situs web yang sangat mendasar untuk memulai, dan menyertakan dua halaman yang ditampilkan di bilah kiri. Halaman pertama adalah “index.html”, yang selalu merupakan halaman beranda, dan “style.css”, yang merupakan style sheet kita.

Anda perlu memberi nama proyek tentang hewan favorit Anda, jadi klik “Proyek Tak Terbatas” di sudut kiri atas bilah hijau, dan ketikkan judul sebagai “Hewan Favorit Sarah.” Kemudian klik “Simpan”. Setelah Anda mengganti nama proyek Anda, kami perlu melakukan satu hal lagi sebelum memulai pengkodean situs web kami. Klik ikon roda gigi ⚙ di bagian atas privasi dan nonaktifkan “Pemberian tag otomatis” dan “Kode otomatis”.

How To Create School Website In Html And Css With Source Code

Saat Anda terus menambahkan kode ke situs web, Anda mungkin melihat beberapa kode berubah menjadi merah muda. Jika itu terjadi itu berarti Anda membuat kesalahan sintaks. Kesalahan ejaan berarti Anda salah mengetik. Misalnya, Anda dapat memasukkan simbol pembuka tetapi lupa memasukkan simbol penutup. Atau mungkin Anda mengetik simbol akhir, tetapi lupa garis miring di awal. Tetap awasi teks merah muda, dan jika Anda melihat sesuatu, coba temukan kesalahannya dan perbaiki sebelum melanjutkan. Sekarang kita siap untuk memulai coding!

Setiap situs web membutuhkan halaman beranda, dan dapat memiliki halaman lain juga. Kami akan membuat dua halaman: halaman beranda dan halaman cerita lucu yang akan menampilkan fakta tak terduga tentang hewan Anda. Kita akan mulai dengan membuat halaman pertama. Ingatlah bahwa kami mengatakan “index.html” selalu di rumah, jadi halaman kami akan diindeks terlebih dahulu. Pastikan “index.html” dicentang di sebelah kiri yang menunjukkan bahwa “index.html” adalah halaman yang ditampilkan.

Hal pertama yang perlu kita lakukan adalah mengubah nama situs web, dan seperti yang kami katakan sebelumnya,

Adalah tag yang membuat teks lebih besar dari judul. Yah, mereka sudah punya

Steps On How To Create A Webpage Using Html Using An Android Phone.

Tag dan nama di dalamnya, jadi yang perlu kita lakukan adalah mengubah teksnya. Pilih nama yang bermakna untuk hewan favorit Anda. Saat Anda mengklik, Anda akan melihat perubahan nama di sisi kanan layar tempat tampilan situs web berada. Jika Anda tidak melihat perubahan ini, klik tombol hapus ⟳ di bagian atas tampilan situs web, dan hasil edit Anda akan muncul.

Tandai lebih banyak. Ikon ini menjadi teks yang masuk ke viewport browser. Kami tidak ingin Anda mengatakan “Make a Thimble.” Kami ingin mengatakan sesuatu yang lebih bermanfaat, mungkin satu hal yang Anda masukkan ke dalam nama situs web Anda.

Anda tidak akan melihat perubahan apa pun, tetapi tab di browser web Anda akan terlihat seperti tab yang ditampilkan di bawah ini setelah Anda membuat situs web.

, dan Thimble membuat sebuah episode. Kami tidak ingin Anda mengatakan “Lakukan sesuatu yang luar biasa di web!”, jadi tutup semua teks Anda di antara paragraf pembuka.

How To Create A Website Using Html On Notepad

. Kemudian tulislah sebuah paragraf yang menggambarkan hewan favorit Anda. Pastikan paragraf Anda berada di antara tanda paragraf pembuka dan penutup (

Sekarang, Anda telah mengedit semua template yang disediakan oleh Thimble, jadi mari kita mulai menambahkan template kita sendiri! Kami memiliki nama dan deskripsi untuk hewan kami, tetapi kami tidak tahu seperti apa hewan itu. Kita akan menambahkan gambar hewan peliharaan kita sebelum paragraf, jadi beri tanda koma di antara nama dan paragraf. Masukkan kode di bawah ini dan itu akan dilakukan setelah itu.

Perhatikan bahwa tidak ada tag penutup di tag gambar pembuka, yang melanggar aturan kami bahwa setiap elemen HTML harus memiliki spasi di tag penutup. Ini adalah salah satu hal yang bertentangan dengan hukum.

. Sumber gambar adalah tempat ditemukannya gambar, biasanya berupa URL, atau

How To Create Header/footer (using Html) In Each Page

. Kami akan menempatkan URL gambar dalam tanda kutip untuk menunjukkan sumber gambar.

Sekarang kita perlu menemukan gambar hewan peliharaan kita, jadi buka Gambar Google dan temukan gambar hewan peliharaan Anda dengan mengetikkan nama hewan peliharaan Anda atau yang serupa. Setelah Anda menemukan gambar yang Anda sukai, klik gambar tersebut dan itu akan diperbesar. Klik kanan pada gambar dan pilih “Salin alamat gambar.”

Menyalin alamat gambar akan menyalin tautan yang menunjuk ke gambar (sumber gambar). Sekarang kembali ke Thimble dan rekatkan tautan di antara tanda kutip ke dalam ikon gambar. Untuk menempel di Mac, klik

Gambar Anda sekarang akan muncul di layar Anda, tetapi jika tidak, kemungkinan besar gambar yang sama tidak dapat diunggah ke situs web. Jika gambar Anda tidak muncul, hapus tautan yang Anda masukkan ke dalam tag gambar, kembali ke Gambar Google, cari gambar lain, salin alamat tautan gambar, dan tempelkan ke tag gambar Anda.

How To Design Amazing Web Pages Using Basic Html « Forward Computing :: Wonderhowto

Seperti yang Anda lihat, gambar Anda bisa terlalu besar atau terlalu kecil. Untungnya, kami dapat mengubah gambar menjadi apa pun yang kami inginkan! Sebelum menutup tikungan

200 mengacu pada ukuran gambar dalam piksel. Piksel adalah titik-titik kecil berwarna di komputer Anda, dan banyak dari titik-titik kecil ini membentuk gambar dan semua hal lain yang muncul di layar Anda. Anda dapat mengubah jumlah 200 ke jumlah piksel yang berbeda hingga Anda mendapatkan ukuran gambar yang Anda inginkan.

Karena kami tidak punya waktu untuk menulis semua informasi tentang hewan kami di situs web kami, alangkah baiknya menambahkan tautan ke halaman lain dengan lebih banyak informasi tentang hewan kami. Mari kita mulai dengan menulis kalimat yang akan membantu pengguna situs web Anda mengetahui ke mana harus mencari informasi lebih lanjut tentang hewan peliharaan Anda. Tambahkan baris baru ke kalimat ini karena paragraf yang Anda tulis mendeskripsikan hewan Anda. Kemudian tulis kode di bawah ini pada baris baru, kosongkan nama hewan peliharaan Anda.

, tetapi yang paling penting untuk diketahui adalah karakter di dalam tag “a”. Elemen “href” adalah singkatan dari hypertext, dan seperti “src” pada gambar kita, hypertext ini mengarahkan pengguna ke sebuah link ketika mereka mengetikkan kata-kata di dalam tag “a”. Dengan kata lain, itu akan membawa mereka ke halaman web, jadi kita perlu menemukan tautan untuk mengisi tanda kutip setelah “href”.

Some Tools To Convert Your WordPress Site To Html

Buka tab lain di browser web Anda dan cari “[hewan peliharaan Anda] Wikipedia.” Dalam kebanyakan kasus, halaman Wikipedia hewan peliharaan Anda akan menjadi tautan pertama yang muncul. Klik tautannya, sorot URL di sudut kiri atas browser, dan salin. Untuk menyalin di Mac, klik

Kemudian kembali ke Thimble dan rekatkan URL di antara tanda kutip dan simbol “a”. Ingat,

How to make form, how to make application, how to make a website with html, how to make website using html and css, how to make coffee, how to make website html and css, make a website with html and css, how to make your own website, how to make free website, how to make a simple website using html, how to make a business website, how to make html

Leave a Reply

Your email address will not be published. Required fields are marked *