.png "Dasar HTML")
Untuk membuat sebuah website beberapa tools atau alat yang harus di install didalam sistem operasi sebagai berikut :
Text Editor
Text Editor adalah sebuah software yang digunakan oleh seorang programer dalam mengerjakan suatu code, adapun beberapa contoh text editor yang biasa digunakan dalam mengerjakan suatu project web adalah :
Notepad ++ : Sebuah software text editor dengan banyak bahasa pemograman yang dapat dikerjakan didalamnya, software dengan lisensi free/gratis ini sangat membantu karena tampilannya yang baik dan struktur tata letak codenya pun rapi.
Sublime : Sama halnya fungsinya dengan notepad ++ sublime juga mendukung banyak code didalamnya tidak terkecuali HTML, namun perbedaan lisensi dari software ini tidak gratis, akan tetapi masih dapat digunakan dengan lisensi Unregistered tanpa mengurangi feature didalamnya, keunggulan dari Sublime adalah tampilan User Interface yang bagus dan software ini berukuran kecil.
Adobe Dreamweaver : Software ini adalah software yang paling banyak digunakan dikalangan programmer khususnya web, dikarenakan banyaknya tools yang mempermudah dalam menyusun code dari suatu web HTML, PHP, CSS dan autocorrect yang lengkap didalam library software ini, Adobe Dreamwaever adalah software keluaran perusahaan adobe dimana lisensi dari software ini tidaklah gratis dan ukurannya pun sangat besar sekitar 1 GB lebih.
Macromedia Dreamweaver : Software ini memiliki persamaan dengan Adobe Dreamweaver akan tetapi ukuran dari software ini lebih kecil sekitar 500 MB adapun lisensi dari software ini sama halnya dengan Adobe Dreamweaver yaitu tidak tersedia gratis.
Notepad : Notepad adalah software bawaan dari sistem operasi windows dimana notepad juga dapat digunakan sebagai text editor, akan tetapi notepad tidak dilengkapi dengan autocorrect seperti halnya software - software diatas.
Web Browser
Web browser adalah sebuah software yang digunakan untuk melihat tampilan dari code html yang telah disusun didalam text editor sehingga susunan - susunan code tersebut dapat dilihat sebagaimana konten sebuah informasi didalam suatu website, adapun beberapa software yang direkomendasikan sebagai berikut :
Google chrome : Browser buatan google ini adalah browser yang paling banyak digunakan, selain tampilan yang bersih, google chrome cukup ringan dalam pengoperasian namun cukup banyak memakan memori suatu komputer.
Mozilla Firefox : Browser satu ini adalah pesaing dari Google Chrome, dari segi tampilan kedua memiliki beberapa kemiripan akan tetapi keunggulan dari Mozilla Firefox adalah feature debuggnya dalam mendeteksi kesalahan code program lanjut.
Safari : Safari adalah web browser bawaan dari Machintosh/Mac/Apple product dan juga dapat digunakan di sistem operasi lain seperti Windows, dll. Safari adalah web browser yang memiliki User Interface paling menarik, dengan tampilan yang bagus dan modern web browser ini banyak digunakan akan tetapi kepopulerannya masih dibawah Google Chrome dan Mozilla Firefox.
Jika hal - hal diatas sudah terinstall selanjutnya mari meng-coding web HTML dasar, langkah - langkah nya adalah :
- Bukalah software text editor yang sudah di install di dalam sistem operasi lalu ketik potongan code dibawah ini :
- Save potongan code diatas dengan format [namafile].html ex: dasar.html.
- klik file dasar.html dan lihat hasilnya di browser masing - masing.
Penjelasan :
- Tag <!DOCTYPE html> adalah tag yang menandakan bahwa code html yang disusun adalah html versi 5
- Tag <html> .... </html> adalah tag pembuka untuk memasukan tag - tag elemen html lainnya.
- Tag <head> .... </head> adalah tag yang berfungsi mengatur bagian atas dan file file ekstensi lain seperti css atau judul pada web.
- Tag <title> .... </title> adalah tag yang berfungsi memberikan judul pada tab web.
- Tag <body> .... </body> adalah tag yang berfungsi sebagai tag yang mengatur bagian konten atau isi dari halaman web yang dibuat.
- Tag <h1> .... </h1> adalah tag yang berfungsi memberikan ukuran judul/header pada konten dimana ukuran dari tag h/header itu sendiri terdiri dari h1,h2,h3,h4,h5,h6.
- Tag <p> .... </p> adalah tag yang berfungsi membuat suatu paragraf pada halaman web sehinggal lebih tersusun rapi.
Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon