Thursday, 27 April 2017

Belajar HTML dan CSS

Posted By: Muhamad - April 27, 2017


HTML & CSS - Pernah nonton Film Who Am I : No System Is Safe ? , bagi yang sudah pernah nonton pasti tahu salah satu kata - kata MRX " Aim the impossible " ya sebenarnya itulah sebuah kata yang wajib kita ingat apabila kitang ingin menjadi master komputer. Kebanyakan orang mengira HTML itu hanya di kuasai para master web designer padahal sebenarnya semua orang di dunia ini bisa menjadi seorang web designer, dan hal utama yang membuat kita sering gagal adalah ketakutan kita sendiri untuk mencoba mempelajari sesuatu yang kita anggap sulit.

Ya, anggap saja kata kata di atas sebagai sebuah motivasi bagi kita semua yang ingin menjadi seorang web designer, dan tanpa bosen bosennya admin akn membagikan sebuah postingan, kali ini admin akan membagikan postingan tentang belajar HTML & CSS, admin yakin agan agan semua sudah pada nggak sabar lagi buat belajar oke gan kita langsung saja mulai pembelajarannya.

Persiapan.

Sebelum kita belajar tentang HTML & CSS ada baiknya kita persiapkan dulu alat alat yang akan kita butuhkan nanti pada saat kita belajar agar kita tidak kesuksahan nantinya.

1.Web Browser.

Admin yakin agan agan semua udah pada tau apa yang di maksud dengan web browser, bagi yang belum tau mari sini admin kasih tau, Web browser adalah sebuah software yang akan kita gunakan untuk menampilkan halaman web yang pada dasarnya terbuat dari bahasa HTML & CSS.

Saya juga yakin bahwa di setiap komputer sudah terinstall webb browser secara otomatis pada saat OS itu sendiri di install, tapi kebanyakan orang merasa tidak puas dengan browser bawaan OS mereka dan ada yang memilih untuk memasang web browser yang di unduh dari luar.

Perlu anda ketahui bahwa untuk menampilkan sebuah alaman web semua web browser mempunyai caranya sendiri sendiri dan alhasil tempilan yang akan kita dapatkan juga berbeda dari satu browser dengan browser yang lainnya, bisa jadi di satu browser halaman web kita bagus tapi di browser lain halaman web kita hancur nggak karuan, oleh karena itu admin anjurkan untuk agan agan semua agarm memiliki lebih dari satu buah web browser untuk mengetes halaman web yang berhasil kita buat nanti.

Web browser, baik yang gratis maupun berbayar banyak sekali bertebaran anda hanya tinggal membeli atau mengunduhnya, dan berikut admin akan tampilkan beberapa web browser yang mungkin the best untuk kita gunakan nantinya, Check It Out.

Mozilla Firefox.


Web browser yang satu ini mungkin bisa di katakan sebai web browser yang paling di senangi olrh para developer web karena web browser yang satu ini memiliki banyak sekali add on. Anda dapat mendownloadnya secara gratis di website resminya.

Google Chrome.


Nah kalau yang satu ini merupakan web browser favorite admin karena kecepatannya yang sungguh luar biasa. anda dapat mendownload brower ini secara gratis di website resminya.

Safari.


Bagi agan yang menggunakan Mac agan pasti kenal dengan yang namanya safari karena safari adalah browser bawaan dari apple atau mungkin bagi agan yang ingin menggunakan browser ini tapi agan menggunakan Windows jangan khawatir karena agan dapat mendownloadnya dari situs resminya.








Internet Explorer.




Baik Windows XP, 7, 8 ataupun Windows 10 pasti ada yang namanya Internet Explorer yang merupakan browser bawaan windows yang lumayan cepat untuk browsing, agan juga dapat mendownloadnya secara gratis di situs resminya.


2.Text Editor ( Optional ).

Text editor ini nantinya akan kita gunakan untuk menuliskan kode HTML & CSS kita nantinya. Agan dapat menggunakan Notepad++ mungkin, sebagi text editornya.

3.Dreamweaver ( Optional ).

Memang menggunakan text editor saja sudah jukup tapi ada baiknya kita menggunkan Adobe Dreamweaver untuk memudahkan agan untuk memudahkan agan menuliskan kode kode HTML & CSS nya.

Pengenalan HTML.

Apa itu HTML ?.

HTML adalah kependekan dari Hypertext Markup Language, jadi sekarang sudah jelaskan bahwa opini kita bahwa HTML itu adalah bahasa pemrograman adalah salah karena sejatinya HTML hanyalah bahasa pemformatan Markup Language.

Seperti apa contoh kode HTML ?.

Oke kita akan praktek menginspeksi suatu halaman web dengan web browser kita sendiri.
  1. Klick kanan pada sembarang area, pilih Inspect ( untuk Google chrome ) atau Inspect Element ( untuk Microsoft Edge ) yang lainya tidak jauh dari itu.
  2. Anda akan melihat kumpulan kode yang sangat rumit dan itulah yang di sebut kode HTML, tapi jangan khawatir karena kita di sini akan bersama sama belajar HTML.

Membuat halaman web dalam 1 menit.

Oke sekarang saatnya kita praktek untuk pertama kalinya untuk membuat halaman web kita sendiri, apa saja langkah - langkahnya ? langsung aja dilihat di bawah gan.
  1. Buka Text editor kalian wahai agan agan sekalian atau kalau nggak buka dreamweaver milik kalian.
  2. Buat file baru bagi yang pakai dreamweaver bagi yang pakai text editor langsung aja ketikan kode di bawah ini gan.
  3. Ketikan Kode ini gan. >> Ini adalah Website pertama saya.
  4. Jika sudah save dengan format *.HTML ( Untuk yang pakai text editor) atau save saja ( Bagi yang pkai Dreamweaver.
  5. Agan akan mendapatkan tulisan Ini adalah Website pertama saya pada browser agan.


Oke mungkin sampai di sini aja perjumpaan kita kali ini, karena tangan admin sudah capek ngetik, dan kita berjumpa lagi besok di tutorial yang sama tapi episode selanjunya kita akan membahas tentang Tag HTML, Struktur file HTML, dan juga kita akan membahas bagaimana cara mameasuakn gamabar di HTML.

SEE YA, GOOD BYE.




Terima kasih telah berkunjung ke blog saya yang sangat sederhana ini, jika anda ingin request game, artikel ataupun tutorial jangan sungkan untuk mengirim email ke
takim.gagah7@gmail.com


About Muhamad

Menulis adalah hobi saya, saya akan terus belajar menjadi lebih baik dan lebih bermanfaat dengan cara membegikan apa yang saya tahu melalui blog saya yang sangat sederhana ini.

2 comments:

  1. Klo ane bias pake Sublime text...

    ReplyDelete
    Replies
    1. Pakai Sublime text juga nggak masalah gan tapi kalu pakai dreamweaver kan ada feature live nya mas Wahab, jadi kita bisa langsung melihat file html yang sedang kita buat secara live

      Delete

Copyright © 2016 TAKIM 99

Blogger Templates Designed by Templatezy