Belajar Struktur HTML Dasar

Gambar 136. ID: Belajar mengenal strutur HTML untuk dapat membuat website profesional sendiri. | GB: Learn to recognize the structure of HTML to be able to create your own professional website.

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:

 <html>
<head>
<title> Ini adalah title sebuah website </title>

</head>
<body>
    <p>Ini adalah struktur file yang di tulis dalam bentuk tag HTML.<br/>
      Ini adalah baris baru pada sebuah file HTML.</p>
<footer>
<p>Ini adalah konten footer</p>
</footer>
</body>
</html>

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:
 <html>,<head>,<title>,<body> 
  • Ini adalah tag penutup:
 </html>,</head>,</title>,</body> 

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:

<html>
<head>
<title> Belajar Mengenal Struktur HTML Dasar </title>

</head>
<body bgcolor="#FF6600" text="#000">

    <h1>Ini adalah tag h1</h1>
    <p>Ini adalah struktur file yang di tulis dalam bentuk tag HTML.<br/>
    Ini adalah baris baru pada sebuah file HTML.</p>

</body>
<footer>
<p>Ini adalah konten footer</p>
</footer>
</html>

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.

 

Post Terkait
Author

Administrator

12 November 2016

Hey..... Apa kabar? Semua artikel dan layanan yang kami sediakan di sini semata-mata untuk kepentingan pengguna dan klien. Jadi jika Anda merasa membutuhkan pelayanan kami silahkan jangan ragu untuk menghubungi. Kami juga bersedia untuk melayani konsultasi online melalui media sosial, melalui komentar dan melalui halaman testimonial yang telah kami sediakan. Selain itu Anda juga dapat menggunakan kontak form yang tersedia.

Jika apa yang anda dapatkan dari situs ini bermanfaat, silahkan dukung dengan like dan share . Terimakasih telah berkunjung, silahkan kembali kapanpun anda merasa membutuhkan layanan yang kami sediakan.

Ingin berbagi dengan multibisnisindo dan memberikan kontribusi....? Tulis pengalamanmu Di Sini

Terimakasih
Best Regard

Tidak ada komentar terkait posting ini, Ingin memberi komentar?