Tampilkan postingan dengan label HTML. Tampilkan semua postingan

Text editor untuk Coding(Penulisan Kode) HTML dan CSS.

Juli 07, 2017 Add Comment

Text Editor
Untuk membuat halaman Web anda memerlukan sebuah text editor. Jika anda mempunyai Adobe Dreamweaver, saya sarankan untuk tidak menggunakannya, Mengingat anda masih dalam tahap belajar.
Text editor yang akan kita gunakan adalah text editor ringan namun penuh dengan fitur yang sangat membantu dalam proses Coding(Penulisan Kode) HTML dan CSS.

Notepad++
Tersedia untuk Windows, Notepad++ memiliki beragam fitur yang sangat mendukung para programmer. Kemampuannya untuk memperkaya diri dengan pluginpun menjadi kelebihan lainnya dengan text editor sejenisnya.
Anda dapat mendownload Notepad++ di http://notepad-plus-plus.org

Gambar notepad ++

Sublime Text

Text editor yang terbilang masih baru yang sangat mudah digunakan, penampilan simple namun enak dipandang. Sublime text adalah aplikasi berbayar tapi anda dapat mendownload versi demo-nya (meskipun versi demo tapi tidak ada batasan dalam penggunaannya).

Sublime text tersedia untuk sistem Operasi Windows, Linux dan Mac, download di alamat berikut http://www.sublimetext.com/2

Gambar Sublime Text

Gedit

Anda pengguna Linux? Khususnya Linux dengan desktop Gnome sudah memiliki text editor bawaan, GEdit. GEdit bisa digunakan untuk menuliskan berbagai macam bahasa pemrograman.

Anda pengguna Windows-pun dapat mendownload GEdit versi windows di situs resminya http://projects.gnome.org.

Gambar Gedit

Firebug

Firebug akan kita gunakan untuk memeriksa kode HTML dari setiap halaman web, melihat CSS yang digunakan dan untuk menguji script javascript. Anda dapat menginstallnya pada browser Firefox. Untuk menginstallnya cukup masuk ke halaman Add-on dan cari add-on firebug

Gambar Tampilan Firebug pada firefox

Jika anda menggunakan Google Chrome atau Safari, tidak usah menginstall firebug karena kedua browser dengan engine webkit ini sudah memiliki tool serupa yang dinamai dengan Developer Tool.

Gambar Developer Tools pada Google Chrome

Web Developer Tools

Add-on ini digunakan untuk menguji halaman web dan melakukan beberapa perubahan/perbaikan sementara terhadap halaman web. Anda dapat menginstallnya dari add-on firefox atau dari Chrome Web Store.

Gambar Web Developer Tools memiliki sejumlah tools yang sangat membantu

Itulah aplikasi-aplikasi yang diperlukan untuk mempelajari HTML dan CSS, tapi yang terpenting adalah kehadiran Web Browser dan Text editor, sisanya adalah optional yang keberadannya hanya mendukung aktifitas kita dalam pembangunan halaman web. Seperti Firebug dan Developer tools memang penting namun anda tidak harus menginstall keduanya. Keberadaan kedua tools tersebut sangat membantu untuk menguji dan memperbaiki kesalahan yang ditimbulkan baik kesalahan dalam pengetikan kode atau lainnya.

HTML5 Tutorial

HTML

April 02, 2017 Add Comment

HTML5 Tutorial

Dengan HTML Anda dapat membuat situs Web Anda sendiri.

Tutorial ini mengajarkan Anda segala sesuatu tentang HTML.

HTML mudah dipelajari - Anda akan menikmatinya.

Contoh di Setiap Bab

tutorial HTML ini berisi ratusan contoh HTML.

Dengan editor HTML online kami, Anda dapat mengedit HTML, dan klik pada tombol untuk melihat hasilnya.

Contoh

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

Cobalah sendiri "

Contoh HTML

Pada akhir tutorial HTML, Anda dapat menemukan lebih dari 200 contoh.

Dengan editor online kami, Anda dapat mengedit dan menguji setiap contoh sendiri.

HTML Contoh Dasar

Jangan khawatir jika contoh-contoh ini menggunakan tag Anda belum belajar.

Anda akan belajar tentang mereka dalam bab-bab berikutnya.

Tags HTML

HTML

April 02, 2017 Add Comment

Tags HTML

tag HTML adalah nama elemen dikelilingi oleh sudut kurung:

<Tagname> konten di sini ... </ tagname>

Tag HTML biasanya datang dalam pasangan seperti <p> dan </ p>
Tag pertama dalam pasangan adalah tag awal, tag kedua adalah tag akhir
Tag akhir ditulis seperti tag awal, tetapi dengan garis miring dimasukkan sebelum nama tag

Tip: Awal tag juga disebut tag pembuka, dan tag akhir tag penutup.

Browser web

Tujuan dari web browser (Chrome, IE, Firefox, Safari) adalah untuk membaca dokumen HTML dan menampilkannya.
Browser tidak menampilkan tag HTML, tetapi menggunakan mereka untuk menentukan bagaimana menampilkan dokumen:
Lihat di Browser

Struktur HTML Halaman

Di bawah ini adalah visualisasi dari struktur halaman HTML:

<Html>

<Head>

<Title> judul halaman </ title>

</ Head>

<Body>

<H1> Ini adalah heading </ h1>

<P> Ini adalah sebuah paragraf. </ P>

<P> Ini adalah paragraf lain. </ P>

</ Body>

</ Html>

Catatan: Hanya isi di dalam <body> bagian (area putih di atas) ditampilkan dalam browser.

The <! DOCTYPE> Deklarasi

The <! DOCTYPE> deklarasi mewakili jenis dokumen, dan membantu browser untuk menampilkan halaman web dengan benar.
Ini harus hanya muncul sekali, di bagian atas halaman (sebelum tag HTML).
The <! DOCTYPE> deklarasi tidak sensitif huruf.
The <! DOCTYPE> deklarasi HTML adalah:

<!DOCTYPE html>

Versi HTML

Sejak hari-hari awal web, ada banyak versi HTML:

Version	Year
HTML	1991
HTML 2.0	1995
HTML 3.2	1997
HTML 4.01	1999
XHTML	2000
HTML5	2014

HTML Pendahuluan

HTML

April 02, 2017 Add Comment

HTML Pendahuluan

Apa itu HTML?

HTML adalah bahasa markup standar untuk membuat halaman Web.

HTML singkatan dari Hyper Text Markup Language
HTML menggambarkan struktur halaman Web menggunakan markup
elemen HTML adalah blok bangunan dari halaman HTML
elemen HTML diwakili oleh tag
HTML tag label potongan konten seperti "judul", "ayat", "table", dan seterusnya
Browser tidak menampilkan tag HTML, tetapi menggunakan mereka untuk membuat isi halaman