SELAMAT DATANG....................... Alvi_Yasin_Martindo Blogspot
MY 1 ST FACEBOOK... ADD MEE. Alvi Yasin MartindoBuat Lencana Anda
MY 2 ND FACEBOOK... ADD MEE TOO.. Alvi Yasin M;Buat Lencana Anda
بِسْــــــــــــــــــــــمِ اﷲِارَّحْمَنِ ارَّحِي Site Meter

Jumat, 05 November 2010

Tutorial Belajar HTML Untuk Pemula


Hypertext Markup Language (HTML) adalah standarisai kode dalam pembangunan website dan menampilkan berbagai informasi di dalam sebuah web browser. Pada dulunya HTML bermula dari SGML (Standart Generalized Markup Language) yang sebelumnya banyak digunakan penerbit dan percetakan.

Versi HTML terakhir pada saat ini adalah HTML 4.01, meskipun lebih cendrung berkembang ke arah XHTML (Extensible Hypertext Markup Language) yang nantinya akan saya bahas di artikel yang lainnya.

Attention!!!

Bagi anda yang masih Newbie atau Pemula usahakan hindari kebiasaan What I See, That's What I Copy (WISTWIC). Maksudnya jangan copy semua code yang saya contohkan kepada anda, tapi cobalah mengetik sendiri dan mulailah untuk menghafalkannya.

Langkah Awal(Pengenalan Kode HTML)

Silahkan buka Notepad, dan cobalah untuk mengetikkan kata - kata di bawah ini :

adalah kode untuk memiringkan sebuah text.
adalah kode untuk menebalkan sebuah text
adalah kode untuk menggaris bawahi sebuah text.
Semua tag - tag atau kode html tersebut haruslah diberi penutup / seperti kode di bawah ini

Hello My name is Kenny, What is your name?


(Ingat diketik jangan Copy Paste). Lalu simpan dengan nama TEST.HTML bukan test.html.text atau test.text.

Cobalah klik 2 kali pada TEST.HTML, maka akan keluar browser dengan tampilan sebagai berikut :

Hampir semua tag html memiliki tag penutup yang harus ditambahkan /, jadi untuk tag penutup maka anda tinggal menambahkan / seperti contoh : , maka tag penutupnya , dan , maka tag penutupnya adalah , ingat hanya menambahkan /.

Standalone Tag
Walau hampir semua tag memiliki tag penutup, akan tetapi ada beberapa tag / kode html yang tidak memiliki tag penutup.Contoh :

yang memberikan baris dan
yang memberikan jarak pada baris. Jika anda ingin mengetahuinya silahkan buka kembali file TEST.HTML
Caranya :

* Klik kanan pada file
* Open with
* Pilih Notepad
* Taruh kode
di bawah kode semula
* Kemudian taruh kode

di bawah kode Hello ,My name is Kenny, What is your name?
anda perhatikan pasti ada bedanya antara yang memakai dengan yang spasi. yang perlu diingat bahwa kode entity selalu di awali dengan (&) dan diakhiri dengan (;) (tidak termasuk kurung).

Atribut HTML
Atribut adalah tambahan dalam tag - tag HTML, baik yang jenis standalone maupun yang biasa.
Contoh 1 kode
Contoh text

sebenarnya hanya
dan
, maka align="center" adalah atribut tambahan. Tampilan
Contoh text

Contoh 2 kode
Contoh....!!!!
Tampilan
Contoh....!!!!

Teks & Paragraph
Di dalam html ada yang namanya tag , tag tersebut berguna untuk menentukan ukuran text secara praktis, dan juga dapat membantu search engine untuk menentukan seberapa penting text dari suatu blog / web. Contoh :

Sebesar Apakah Text Ini?


Sebesar Apakah Text Ini?


Sebesar Apakah Text Ini?


Sebesar Apakah Text Ini?


Sebesar Apakah Text Ini?

Sebesar Apakah Text Ini?


Tampilan

Untuk lebih jelasnya, coba kita buat kode seperti ini dan save dengan nama Budi.html :

Halo, nama saya Budi dan
saya senang bermain bola


Tutorial ini merupakan Pelajaran pertama saya dalam HTML dan saya ingin Memodiifikasi teks dalam HTML agar lebih menarik



Terima kasih




Tampilan


Langkah Kedua (Struktur HTML)

Apakah anda pusing membaca pengenalan diatas?, yah sejujurnya pasti bagi seorang pemula hal tersebut sangat memusingkan, tetapi hal dasar janganlah dilewatkan. Untuk itu sebaiknya anda mengerti baik - baik apa yang saya sampaikan diatas barulah ke tahap selanjutnya.

Struktur HTML



Judul

TEST TEST 1 2 3, ada orang di sini?



Text yang berwarna biru adalah text struktur, sedangkan yang berwarna hitam adalah tambahan. Maka tampilannya seperti di bawah ini


Coba lihat pada kata judul yang saya lingkari dan saya beri tanda panah, hal tersebut terjadi karena saya menambahkan Judul di antara kode dan . Jika anda ingin menggantinya tinggal hapus text judul menjadi judul yang anda inginkan.

Jika anda masih tidak percaya coba anda buat notepad baru dengan nama struktur.html, lalu tes lagi seperti cara - cara sebelumnya.

Perlu diketahui di dalam struktur HTML, semua kode HTML ditulis di dalam tag . Tidak boleh di tulis di dalam tag .

Anda bisa mempraktekkan dengan menulis semua kode HTML yang telah saya ajarkan ke dalam tag tag html anda .

Mengapa hal ini menjadi penting?, karena di dalam mengedit template blog maupun di web, anda akan menggunakan kode - kode html tersebut. Setidaknya anda pelajari konsep - konsep di atas dengan cermat dan teliti, maka saya yakin anda pasti bisa. Nantikan Juga artikel berikutnya yang merupakan lanjutan dari artikel ini

Sumber:http://www.gotbloggers.co.cc/2010/03/tutorial-belajar-html-untuk-pemula.html

Tidak ada komentar:

Posting Komentar

Kasih Komentar Ya (Give Comment)