Jumat, 13 Maret 2015

Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk menulis halaman web. HTML merupakan pengembangan dari standar pemformatan dokumen teks yaitu Standard Generalized Markup Language (SGML). HTML sebenarnya adalah dokumen ASCII atau teks biasa, yang dirancang untuk tidak tergantung pada suatu sistem operasi tertentu.

HTML dibuat oleh Tim Berners-Lee ketika masih bekerja untuk CERN dan dipopulerkan pertama kali oleh browser Mosaic. Selama awal tahun 1990 HTML mengalami perkembangan yang sangat pesat. Setiap pengembangan HTML pasti akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi sebelumnya. Namun perkembangan resmi dikeluarkan pada bulan November 1995 oleh IETF (Internet Engineering Task Force). HTML 2.0 ini merupakan penyempurnaan dari HTML+ (1993).

HTML 3.0 (1995) memberikan kemampuan lebih daripada versi sebelumnya. Sebuah usaha dari World Wide Web Consortium’s (W3C) HTML Working Group pada tahun 1996 menghasilkan HTML 3.2. HTML versi ini secara resmi diterbitkan pada bulan Januari 1997. HTML versi terbaru adalah HTML 4.01 yang dikeluarkan secara resmi oleh W3C pada tanggal 24 April 1998. HTML merupakan perbaikan dari HTML 4.0 yang lebih dulu diterbitkan. (18 Desember 1997).

Dasar-Dasar HTML
Mendesain HTML berarti melakukan suatu tindakan pemrograman. Namun HTML bukanlah sebuah bahasa pemrograman. Namun HTML hanyalah berisi perintah-perintah yang telah terstruktur berupa tag-tag penyusun. Menuliskan tag-tag HTML tidaklah sebatas hanya memasukkan perintah-perintah tertentu agar HTML kita dapat di akses oleh browser. Mendesain HTML adalah adalah sebuah seni tersendiri. Homepage yang merupakan implementasi dari HTML adalah refleksi dari orang yang membuatnya. Untuk itu kita perlu mendesainnya dengan baik agar para pengunjung homepage yang kita buat merasa senang dan bermanfaat.

Mendesain HTML dapat dilakukan dengan dua cara:
1. Menggunakan HTML Editor, seperti Microsoft FrontPage, Adobe Dreamweaver, dan lain-lain. Dapatkan editor HTML lainnya disini.
2. Dengan cara menuliskan sendiri secara manual satu persatu tag-tag HTML ke dalam dokumen HTML.

Ada kelebihan dan kekurangan dari dua cara di atas. Cara pertama kelebihannya adalah HTML Editor merupakan sebuah program yang khusus didesain untuk membuat, melakukan editing bahkan mem-publish ke internet. Dengan kemampuannya menggabungkan kemudahan dan kecanggihan teknologi internet ke dalam dokumen HTML maka cara ini sangat disukai oleh para pemula dan desainer yang tidak ingin belajar lebih mendalam mengenai HTML. Sedangkan cara kedua adalah menuliskan secara manual satu persatu tag-tag HTML. Hal ini sangat disarakan sulit dikarenakan akan memakan tenaga dan waktu ekstra untuk melakukannya, ditambah lagi Anda harus melakukan cara-cara konvensional untuk melihat hasilnya pada web browser. Namun pada cara kedua adalah dasar dari segala bentuk HTML yang akan Anda pelajari, karena dengan cara itulah Anda akan lebih paham mengenai cara kerja dan berbagai perintah yang biasa dipakai pada bahasa HTML.

Belajar html dasar ( Tips bisnis online )

http://bisnisonlinetop1.blogspot.com/2011/05/belajar-html-dasar-i.html?m=1

Menjadi webdesigner handal


Banyak orang beranggapan menjadi seorang web designer itu mudah, hanya bermodalkan bisa mendesain di photoshop dan bisa sedikit HTML sudah bisa melenggang menjadi seorang webdesigner :) sebenarnya tidak sepenuhnya benar dan tidak sepenuhnya salah. Tapi yang ingin saya tekankan disini adalah bagaimana caranya agar menjadi seorang webdesigner handal dan disegani *halah

Banyak langkah-langkah yang harus ditempuh untuk mejadi seorang webdesigner, seperti layaknya kera sakti yang banyak cobaan dan godaan ketika pergi kebarat mengambil kitab suci :D begitupun jika memilih menjadi seorang webdesigner. Banyak pertanyaan yang mampir ke saya “bagaimana sih untuk menjadi seorang webdesigner?” apakah harus bisa desain? apakah harus bisa photoshop? apakah harus bisa coding? dll.

Nah dari pengalaman yang saya jalani selama ini ada beberapa langkah yang harus Anda lalui untuk menjadi seorang webdesigner.

Niat!

Anda harus punya niat yang ikhlas untuk menjadi seorang webdesigner, jangan setengah-setengah :D dalam artian Anda sudah punya tekat yang kuat.

Olah gambar

Dalam tahap ini Anda harus belajar menggunakan software untuk membuat desain, seperti Photoshop, Illustrator, fireworks dan sebagainya, ya mungkin bisa dimulai dengan membuat lingkaran :D maksudnya cari tutorial-tutorial yang berhubungan dengan webdesain, seperti bagaimana membuat text yang bisa kelihatan 3D dan lain sebagainya.

Inspirasi

Dalam hal ini Anda dituntut untuk mencari inspirasi untuk mengasah imajinasi Anda, lihatlah contoh-contoh tampilan website yang keren misalnya http://zulsdesign.com :P lihat secara “detail” maksudnya lihat setiap elemen-elemen yang ada diwebsite tsb secara teliti dan men-detail Biasanya untuk para pemula melihat detail ini tidak dihiraukan, baiklah saya kasih ilustrasi gambar cara melihat detail ini :

Anda lihat gambar diatas bagaimana bentuk elemen yang bagus sama yang jelek :D

Baca buku tentang webdesain, banyak buku-buku tentang webdesain ditoko buku kesayangan Anda atau jika mau materi yang bagus saya rekomendasikan buku dari sitepoint.com atau smashingmagazine.com

XHTML, CSS, Javascript

Pelajari yang namanya HTML, CSS, dan Javascript (WAJIB!!!) yup sebenarnya ini adalah titik penting untuk menjadi seorang webdesigner. karena menurut saya seorang webdesigner itu adalah yang bisa membuat desain diphotoshop dan merubahnya ke bentuk HTML/CSS, kalau cuma bisa desain di photoshop aja mah bukan seorang webdesigner, tapi seorang grafik desainer :D

Nah, kemampuan dalam XHTML, CSS dan Javascript ini usahakan sangat-sangat-sangat menguasai, kan repot misalkan seorang webdesainer dibuat kelabakan karena desain yang dia buat amburadul jika dilihat di IE6 dan tidak bisa memperbaikinya :D

IE6 masih menjadi sahabat setia seorang webdesigner. LOL!

Usahakan Anda mengoleksi tutorial-tutorial tentang XHTML, CSS dan Javascript.

Koding

ini hanya opsi saja kok, tapi agak penting juga, ya harus mengerti sedikit lah bagaimana kode bahasa pemprograman itu bekerja.

Yup! begitulah cerita bagaimana menjadi seorang webdesigner, jika ada yang kurang, harap tambahkan di komentar :)

Tags
contoh html keren,contoh script html,contoh script html web,web bagus,cara menjadi web designer,contoh html yang bagus,desain web keren,contoh skrip html,design web keren,script html keren,web html keren,contoh web html keren,contoh html web keren,menjadi web designer,contoh web bagus,html keren,contoh web yang bagus,contoh desain web dengan css,contoh website yang baik,website bagus
November 7, 201026 Replies
pure-css-yahoo
Pure, CSS Module dari Yahoo!
Baru-baru ini Yahoo! meluncurkan Pure CSS yaitu sebuah CSS Module yang bisa dipakai untuk project website kita, ya seperti Bootstrap lah tapi Pure CSS lebih kecil gak sekomplek Bootstrap, meskipun tidak sekomplek bootstrap tapi keren juga dipakai pada project website kita selanjutnya.

[related_posts]

Seperti CSS Framework lainnya, Pure CSS juga menyajikan beberapa elemen seperti Layout yang bisa responsive, Menu, Form, tombol, Grid Base, Tabel.


Contoh Design Website Keren yang dibuat dengan HTML 5

Assalamu'alaikum...

Mungkin sebagian besar blogger sudah tidak asing lagi mendengar istilah HTML 5. Terutama bagi blogger yang memakai template valid HTML 5. Termasuk Template blog Fian Syauqi ini juga salah satu template web valid HTML 5. Namun saya tidak menemukan sesuatu yang lebih dari template-template blogspot Valid HTML 5 yang saya cari di internet. Hingga pada akhirnya saya coba googling mencari contoh-contoh Design Website Keren yang dibuat dengan HTML 5.

Sebelumnya akan dijelaskan Tujuan dan Fitur dari HTML 5.
Berikut tujuan dibuatnya HTML5 :
Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
Mengurangi kebutuhan untuk plugin eksternal ( Seperti Flash )
Penanagan kesalahan yang lebih baik
Lebih markup untuk menggantikan scripting
HTML5 merupakan perangkat mandiri
Proses pembangunan dapat terlihat untuk umum
Fitur baru dalam HTML5 :
Unsur kanvas untuk menggambar
Video dan elemen audio untuk media pemutaran
Dukungan yang lebih baik untuk penyimpanan secara offline
Elemen konten yang lebih spesifik, seperti artikel, footer, header, nav, section
Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.
Beberapa browser sudah mendukung HTML5 seperti safari, chrome, firefox, dan opera. Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5.

Nah berikut ini beberapa Contoh Design Website Keren yang dibuat dengan HTML 5 yang kreatif, dinamis, dan sadisss !!


Brandongenerator


brandon generator


Thebeast

 thebeast


Fridzo Keys | The Rational Keyboard

Ini Website Keren banget, jika ditekan tuts nya maka akan muncul suara piano. Jadi kita bisa main piano disini.

 fridzo keys

Unfinished Business

 unfinished business

Hari ini saya akan membagikan sedikit tentang bagaimana membuat html/web. ini adalah contoh sederhana yang saya buat. dalam membuat html ini kita bisa memulainya dengan menggunakan Notepad/Notepad ++ baiklah langsung saja kita bahas di bawah ini.

Rumus :

<html>
<head>
<title> jagad alam semesta</title>
</head>
<body background="god.jpg"><b><H1><font color="orange">SANG PEMILIK ALAM</font></H1></b><hr size="2">
<br>
<table border=1>
<img src ="a.jpg"
</table>
<br>
<a href="katzuar@yahoo.com"> klik disini & </a>
<a href="hairul-atzuar.blogspot.com"> kunjungi alamat blog saya </a>
<br>
<br><font color="white">Kita,hidup di dunia hanya sementara.
Bagaikan hanya sekejap mata
Ku ingin semua ini bertahan lama.
Dan tak akan pernah usai.

<font color="yellow"><u>Tuhan pemilik alam semesta,
Inikah akhir dunia mu ?</u></font>
Kulalai kan perintah mu,
Dari yang terkecil hingga tak terhitung lagi.

<b>Kau teramat pemaaf dan pengasih
Kau maha agung dan maha besar
Biarkan lah kami songsong sang surya
Dan jelajahi duniamu ini.</b>

Tetapi kami akan selalu bersyukur
Atas karuniamu
Cinta kami pada mu
Tak akan pudar hingga akhir hayat ku.
<font color="yellow"><u><p>Siapa yang Menciptakan Alam Semesta dari Ketiadaan?</u></font><br>
Dengan kemenangan Dentuman Besar, tesis "alam semesta tanpa batas", yang membentuk basis bagi dogma materialis, dibuang ke tumpukan sampah sejarah.
Namun bagi materialis, muncul pula dua pertanyaan yang tidak mengenakkan:<br>
Apa yang sudah ada sebelum Dentuman Besar? Dan kekuatan apa yang telah menyebabkan Dentuman Besar sehingga memunculkan alam
 semesta yang tidak ada sebelumnya?
Materialis seperti Arthur Eddington menyadari bahwa jawaban untuk pertanyaan-pertanyaan ini dapat mengarah pada keberadaan
pencipta agung dan itu tidak mereka sukai. Filsuf ateis, Anthony Flew, mengomentari masalah ini:
Jelas sekali, pengakuan itu baik bagi jiwa.</p>
<b><h4 align="center"><u>Tanda-Tanda Al Quran</u></h4></b>
 <s>Ini</s> telah dinyatakan dalam kitab-kitab suci yang telah berfungsi sebagai penunjuk jalan bagi manusia selama ribuan tahun.
 Dalam semua kitab suci seperti Perjanjian Lama, Perjanjian Baru, dan Al Quran, dinyatakan bahwa alam semesta dan segala isinya
 diciptakan dari ketiadaan oleh Allah.
Dalam satu-satunya kitab yang diturunkan Allah yang telah bertahan sepenuhnya utuh, Al Quran, ada pernyataan
 tentang penciptaan alam semesta dari ketiadaan, di samping bagaimana kemunculannya sesuai dengan ilmu pengetahuan abad ke-20,
 meskipun diungkapkan 14 abad yang lalu.
Pertama, penciptaan alam semesta dari ketiadaan diungkapkan dalam Al Quran sebagai berikut:<br>
<h4 align ="center"><i>"Dia pencipta langit dan bumi. Bagaimana Dia mempunyai anak padahal Dia tidak mempunyai istri.<br>
Dia menciptakan segala sesuatu dan Dia mengetahui segala sesuatu." (QS. Al An'aam, 6: 101)<br>
"Dan apakah orang-orang kafir tidak mengetahui bahwasanya langit dan bumi itu keduanya dahulu adalah suatu yang padu,<br>
kemudian Kami pisahkan antara keduanya. Dan daripada air Kami jadikan segala sesuatu yang hidup." (QS. Al Anbiyaa', 21: 30)</font></i></h4>
</body>

gambar ini memakai rumus di bawah...

<table border=1>
<tr>
<td valign="top">Komentar</td>
<td><textarea name="komentar" rows="5"
cols="25"></textarea></td>
</tr>
</table>
<br>
First name:
<input type="text" name="firstname" />
<br /><br>

Last name:
<input type="text" name="lastname"/>
</form>
<form name="input" action="html_form_submit.asp" method="get"><br>
Username:
<input type="text" name="user" />
<input type="submit" value="Submit" />
</form>
</html>






Kamis, 12 Maret 2015

Belajat HTML . cara membuat kode



Belajar HTML . Pengetahuan HTML sebernarnya tidak hanya diperlukan kalau kita ingin terjun di dunia bisnis online. Untuk memperindah tampilan blog, sedikit banyak akan menuntut kemampuan kita dalam mengedit kode - kode HTML. Walaupun kita menggunakan blog engine seperti Wordpress yang mempunyai plugin - plugin yang lengkap, namun sering ditemui kita harus mengedit sidebar atau bagian lainnya, menempatkan kode HTML, mengedit kode warna HTML, menempatkan tabel dan banyak kasus lainnya yang mengharuskan kita menguasai dasar - dasar kode atau script HTML.
Untuk belajar HTML anda tidak perlu membeli modul khusus cara membuat kode HTML, juga tidak perlu berguru pada penyedia jasa SEO atau jasa SEO terbaik sekalipun. Dengan membaca artikel berikut ini saja anda sudah bisa belajar HTML sesuai keperluan anda untuk mengedit website anda. Pengertian HTML secara awam seperti saya adalah serangkaian kode - kode bahasa pemrograman yang digunakan untuk membangun website yang akan membentuk halaman - halaman situs setelah dionlinekan ke internet.
Untuk mempermudah pengertian anda dalam belajar HTML, di sini juga akan saya berikan contoh penerapan kode atau script HTML sehingga anda dapat mengikutinya dengan praktek pula. Bagi anda yang masih pemula, langsung saja kita lihat pembahasan kode HTML berikut ini :

Struktur kode HTML yang harus selalu ada di setiap halaman situs adalah:
<html>
<head>
<title>Tulis Judul Anda di Sini</title>
<meta name="description" content="tulis deskripsi/penjelasan singkat situs anda di sini">
<meta name="keyword" content="tulis kata kunci halaman anda di sini">
</head>
<body>
Di sini adalah konten / isi halaman anda
</body>
</html>

Latihan 1. Belajar membuat halaman sederhana dengan kode HTML
Sebagai bahan untuk belajar HTML, sekarang buka program Notepad anda. Caranya klik " start " pilih program, cari program Notepad, jika sudah anda buka kemudian tuliskan kode - kode HTML di bawah ini :
<html>
<head>
<title>Modul Belajar HTML</title>
<meta name="description" content="Modul belajar HTML untuk pemula">
<meta name="keyword" content="modul html,belajar html">
</head>
<body>
Modul HTML ini berisi latihan - latihan sederhana untuk beljar membuat sebuah halaman website agar dapat online di internet. Bagi anda yang masih pemula sebaiknya mengikutinya dengan memparaktekkan secara langsung agar lebih mudah dalam memahami setiap variasi kode - kode HTML.
</body>
</html>

Setelah selesai menuliskan kode - kode HTML di atas kemudian anda simpan. Caranya : klik " file " kemudian pilih " save as " tentukan lokasi penyimpanan, misalnya pada folder " latihan " di " my document " , pada " file name " tulis nama file misalnya " latihan1.html " pada save as type isikan " all file " kemudian klik " save ".
Untuk mengetahui hasilnya pada browser, caranya sebagai berikut :
Cari file " latihan1.html " yang anda simpan pada folder " latihan " di " my document " , setelah ketemu kemudian klik kanan, pilih " open with " lalu pilih browsernya misalnya " internet explorer " maka hasilnya akan tampak seperti gambar di bawah ini :
belajar membuat halaman situs dengan kode html
DENGAN LANGKAH - LANGKAH SEPERTI DI ATAS COBA ANDA PRAKTEKKAN LATIHAN - LATIHAN SELANJUTNYA
Latihan 2. Belajar membuat link atau tautan dengan kode HTML :
misalnya : kata yang terlihat dalam link ( ancor text ) adalah "cara membuat website"
sedangkan alamat/URL dari halaman yang dituju tersebut adalah http://edyutomo.com/internet-dan-komputer/cara-membuat-website
maka kode HTML nya adalah :
<a href="http://edyutomo.com/internet-dan-komputer/cara-membuat-website">cara membuat website</a>
hasilnya adalah cara membuat website

Latihan 3. Belajar kode warna HTML untuk mengedit warna teks :
<font color="red">kata yang diedit</font>, ini akan mengubah warna teks menjadi merah.
Lihat contoh berikut ini :
<font color="red">Modul HTML</font> ini berisi latihan - latihan.....
hasilnya akan tampak sebagai berikut :
belajar membuat halaman situs dengan kode html

Latihan 4. Kombinasi kode warna HTML, paragraf baru, ukuran huruf dan jenis huruf :
<p align="left"><font face="arial" size="6" color="red">kata yang diedit</font></p>
ini akan membuat paragraf menjadi rata kiri, dengan jenis huruf arial, ukuran 6 dan warna teks menjadi merah.
Lalu bagaimana untuk membuat warna menjadi warna campuran, ah... itu gampang. Caranya anda buka photoshop, lihat gambar di bawah :
belajar HTML
klik kotak merah yang saya lingkari, kemudian akan muncul kotak dialog color picker, lalu cari warna yang anda inginkan, lalu copy code warna yang ada di bawah ( saya tandai ), setelah itu anda paste pada kode warna HTML untuk mengedit warna.
Contoh : color="#ed260b"
mudah - mudahan jelas ya.

Kode HTML lainnya :
<p>isi paragraf</p> , untuk membuat paragraf baru
<br>isi kalimat</br> , untuk membuat baris baru
<b>kata/kalimat</b> , untuk membuat teks tebal
<i>kata/kalimat</i> , untuk membuat kata miring
<u>kata/kalimat</u> , untuk membuat garis bawah

Latihan 5. Belajar cara menyisipkan gambar dengan kode HTML :
Sebelum kita menyisipkan gambar, terlebih dahulu kita harus mengupload foto atau gambar untuk mendapatkan link dari gambar tersebut untuk keperluan menyisipkan gambar yang telah kita tentukan. Lihat cara upload foto atau gambar.
sebagai contoh saya telah mengupload gambar pada situs image hosting http://photobucket.com, sehingga saya mendapatkan url link gambar seperti berikut ini :
http://i1095.photobucket.com/albums/i480/satujambi/contoh1.gif

Sebagai contoh, lihat ilustrasi contoh penerapan kode HTML di bawah ini :
<p>di bawah ini adalah contoh gambar :</p>
<img src="http://i1095.photobucket.com/albums/i480/satujambi/contoh1.gif">

hasil dari penullisan kode HTML adalah sebagai berikut :

belajar html
Latihan 6. Belajar kode HTML untuk menyisipkan link pada gambar
Sebagai contoh, berdasarkan gambar di atas, kita akan menyisipkan link menuju halaman http://edyutomo.com/anak-dan-balita/kumpulan-puisi-anak, maka kode HTML yang perlu dibuat adalah sebagai berikut :
<a href="http://edyutomo.com/anak-dan-balita/kumpulan-puisi-anak"><img src="http://i1095.photobucket.com/albums/i480/satujambi/contoh1.gif"></a>
Hasilnya akan menjadi sebagai berikut :


Coba anda klik gambar di atas, pasti akan terbuka halaman yang dituju. Selamat anda sudah dapat membuat link pada gambar.

Artikel lainnya tentang be

Belajar html . Cara Membuat Kode



Belajar HTML . Pengetahuan HTML sebernarnya tidak hanya diperlukan kalau kita ingin terjun di dunia bisnis online. Untuk memperindah tampilan blog, sedikit banyak akan menuntut kemampuan kita dalam mengedit kode - kode HTML. Walaupun kita menggunakan blog engine seperti Wordpress yang mempunyai plugin - plugin yang lengkap, namun sering ditemui kita harus mengedit sidebar atau bagian lainnya, menempatkan kode HTML, mengedit kode warna HTML, menempatkan tabel dan banyak kasus lainnya yang mengharuskan kita menguasai dasar - dasar kode atau script HTML.
Untuk belajar HTML anda tidak perlu membeli modul khusus cara membuat kode HTML, juga tidak perlu berguru pada penyedia jasa SEO atau jasa SEO terbaik sekalipun. Dengan membaca artikel berikut ini saja anda sudah bisa belajar HTML sesuai keperluan anda untuk mengedit website anda. Pengertian HTML secara awam seperti saya adalah serangkaian kode - kode bahasa pemrograman yang digunakan untuk membangun website yang akan membentuk halaman - halaman situs setelah dionlinekan ke internet.
Untuk mempermudah pengertian anda dalam belajar HTML, di sini juga akan saya berikan contoh penerapan kode atau script HTML sehingga anda dapat mengikutinya dengan praktek pula. Bagi anda yang masih pemula, langsung saja kita lihat pem

Rabu, 11 Maret 2015

Materi HTML

HTML

MATERI HTML

Hypertext Markup Language merupkan standard bahasa yang di gunakan untuk menampilkan document web, yang bisa anda lakukan dengan HTML yaitu:
¾ Mengontrol tampilan dari web page dan contentnya.
¾ Mempublikasikan document secara online sehingga bisa di akses dari seluruh dunia.
¾ Membuat online form yang bisa di gunakan untuk menangani pendaftaran, transaksi secara online.
¾ Menambahkan object-object seperti image, audi, video dan juga java applet dalam document HTML. .