Belajar Struktur HTML Dasar

Mengenal Struktur tag HTML Dasar

Ini adalah materi dasar tentang tag HTML untuk mendukung dalam belajar membuat website,dimana pada artikel sebelumnya saya juga telah membuat sebuah tutorial bagaimana cara membuat website sendiri. Diantaranya yang palin populer sampai saat ini adalah dengan menggunakan sebuah CMS(content management system). Karena memang dengan CMS seorang pengelola website atau seorang webmaster dengan team cs-nya lebih mudah berinteraksi dengan para klien dan pengguna atau pengunjung website tersebut.
Namun bukan berati dengan CMS lalu serta-merta semuanya menjadi mudah,melainkan tetap dibutuhkan keahlian atau ketrampilan khusus bagi seorang developer atau perancang website untuk menciptakan website tersebut. Beberapa keahlian atau keterampilan tersebut diantaranya adalah: Mengerti HTML,CSS,JS,JQUERY,PHP,MYSQL,dan lain sebagainya.
Lalu apa sih yang dimaksudkan dengan sebutan HTML,CSS,JS,JQUERY,PHP,dan MYSQL itu sebenarnya?

Baik sekarang mari kita mulai materi ini.

Hypertext Markup Language merupakan sebuah bahasa markup,adalah sebuah cara untuk memberitahu web browser tentang fungsi sebuah text dan bagaimana menampilkanya. Apakah text atau konten tersebut ditulis sebagai sebuah paragraf,baris baru,list,atau sebagai ancor(teks yang diberi link url)? Pada sebuah file atau struktur HTML, pemberian fungsi ini disebut dengan istilah tag.

Tag merupakan teks khusus yang di sebut 'markup' dimana teks tersebut berupa dua karakter yaitu '<' dan '>' teks tersebut merupakan cara atau tanda untuk memberitahu web browser bagaimana suatu text harus ditampilkan.
Sebuah tag di dalam file HTML ditulis secara berpasangan,yang disebut dengan 'tag pembuka' dan 'tag penutup', konten apapun(teks,gambar,atau link url) yang berada di antara tag pembuka dan tag penutup disebut dengan 'element'.

Contoh struktur tag HTML:

 

 Ini adalah title sebuah website 



        Ini adalah struktur file yang di tulis dalam bentuk tag HTML.

           Ini adalah baris baru pada sebuah file HTML.

Ini adalah konten footer

Untuk melihat hasilnya silahkan salin script diatas dan tempel pada HTML editor multibisnisindo.

Perhatikan struktur penulisan tag HTML diatas,dimana terdiri dari 'tag pembuka','tag penutup','element',dan 'atribut'.

Ini adalah tag pembuka:

 ,,,<body> 
</code></pre>
<ul>
<li>Ini adalah tag penutup:</li>
</ul>
<pre class="line-numbers  language-markup"><code> </html>,</head>,,

Ini adalah element berupa kalimat: 'Belajar Struktur HTML Dasar',' Ini adalah struktur tag HTML',dan 'Ini adalah baris baru'. Yang membedakan 'tag pembuka' dan 'tag penutup' adalah: pada tag pembuka di tulis tanpa '/' atau slash setelah tanda '<', sedangkan pada tag penutup menggunakan tanda '/' setelah tanda '<'. Sedangkan element selalu berada antara 'tag pembuka' dan 'tag penutup'. Selain 'tag' dan 'element' dalam struktur file HTML juga ada 'atribut',dimana fungsi atribut ini beraneka ragam,dan bertujuan memberi perintah web browser untuk menambahkan fungsi tersebut yang diantaranya adalah fungsi warna dan ukuran. Berikut adalah contoh penggunaan atribut dalam sebuah file HTML:



 Belajar Mengenal Struktur HTML Dasar 




        Ini adalah tag h1
        Ini adalah struktur file yang di tulis dalam bentuk tag HTML.

        Ini adalah baris baru pada sebuah file HTML.



Ini adalah konten footer

Coba anda salin struktur tag HTML diatas dan simpan dengan ekstensi html,misalnya :index.html

Silahkan pilih nama sendiri untuk menyimpanya yang terpenting dengan ekstensi html(.html). Setelah anda simpan dengan ekstensi .html sekarang silahkan anda buka dengan dua kali klik.

Atau silahkan salin script diatas dan tempel pada HTML editor multibisnisindo. Sekarang perhatikan pada contoh struktur file HTML di atas, maka anda dapat melihat yang namanya atribut, yaitu sebagai berikut:

Contoh atribut: bgcolor="#FF6600" text="#000" Atribut diatas akan memberikan perintah kepada web browser, sehingga web browser akan menampilkan halaman dengan latar belakang atau background berwarna kuning dan teks berwarna hitam. Tutorial ini adalah tutorial dasar untuk mengenal struktur file atau penulisan tag HTML. Karena dalam file HTML juga terintegrasi file dalam bentuk atau bahasa pemrograman lainya. Namun secara garis besar adalah seperti yang telah kita uraikan diatas.

Mudah-mudahan tutorial tentang HTML ini dapat berguna bagi anda, terimakasih.