Konsep Dasar HTML

HTML: Bahasa Web Browser

“HTML” adalah singkatan dari “HyperText Markup Language”. Pada dasarnya, HTML adalah bahasa yang digunakan untuk mengatur agar teks menjadi memiliki tampilan yang berbeda – beda, seperti bold atau italic, namun tidak terbatas pada hal itu saja.

HTML adalah bahasa dasar yang dipahami oleh web browser. Kita menggunakan banyak bahasa pemrograman di sisi server, seperti PHP, Perl, Ruby, dan lain – lain, namun pada akhirnya, semua bahasa server tersebut akan mengeluarkan hasil akhir berupa HTML (atau Javascript dan CSS). Browser anda akan memproses HTML dan membuatnya menjadi halaman web yang dapat dibaca manusia dengan mudah sesuai bagaimana programmer membuatnya.

Seperti yang sering saya jelaskan di post sebelumnya, HTML adalah bahasa pemrograman di sisi client, sehingga tidak dapat melakukan pemrosesan server seperti melakukan perhitungan matematis, logika if, mengambil data dari database, menerima request, dan lain – lain.

Mari sekarang kita belajar untuk menulis di HTML.

HTML Membungkus Teks Biasa

HTML adalah bahasa markup, jadi sebagian besar HTML hanyalah teks biasa. Contoh, di bawah ini adalah kode HTML :

Halo, saya adalah HTML. Ashiap. Mantap.

Tapi tunggu dulu, kalimat di atas tidak seperti bahasa komputer. Terlihat seperti teks biasa saja.

Yes, HTML memang merupakan teks yang dapat dibaca. Contoh di atas adalah wujud paling mendasar dari HTML.

 

Belajar dari Pengalaman Word Processor

Tentu saja kita ingin lebih dari sekedar text biasa. Contohnya,  huruf miring atau italics.

Kita mengetahui bahwa untuk membuat huruf menjadi italic di program word processor (seperti Microsoft Word, atau LibreOffice), kita hanya perlu menekan tombol I.

Semua kata – kata yang kita ketik setelahnya akan menjadi italics. Kita bisa mengetiknya sampai beberapa halaman. Untuk mengakhirinya, kita hanya perlu sekali lagi menekan tombol I tersebut, sehingga font yang kita ketik setelahnya akan menjadi normal kembali.

Jika kita kembali ke pertengahan kalimat yang telah kita ketik secara italic, ketika kita mengetik teks baru, juga akan menjadi italic. Ada semacam titik awal dan titik akhir dimana kata – kata yang kita ketik akan menjadi italics.

 

HTML Menggunakan “Tags”

HTML juga menggunakan penanda awal dan akhir dari setiap jenis font yang kita buat. Perbedaannya adalah, di HTML, kita dapat melihat penanda tersebut. Bahkan kita dapat mengetiknya langsung. Penanda tersebut disebut dengan Tag HTML.

Sebagai contoh, Anda ingin membuat kode HTML seperti contoh yang saya sebutkan sebelumnya. Anda ingin membuat tulisan “Ashiap” menjadi huruf miring atau italic. Maka Anda perlu mengetik :

<i>Ashiap</i>

Kode lengkap seperti di bawah ini

Halo, saya adalah HTML. <i>Ashiap</i>. Mantap.

Lalu Anda perlu menyimpannya di editor teks, menaruhnya file tersebut di server, kemudian menjalankannya pada browser. Ketika browser menampilkannya, kode tersebut akan terlihat seperti ini :

Halo, saya adalah HTML. Ashiap. Mantap.

Tidak seperti Microsoft Word, Anda tidak melihat kode <i> pada tampilan di browser. Anda mengetikkan kode tersebut, kemudian browser membuat semua huruf yang ada di dalamnya menjadi italic.

 

Jangan Lupa Menutup Tag HTML

Menutup tag HTML sangat penting untuk dilakukan. Jika Anda lupa mengetik penutup tag :

</i>

seperti ini :

Halo, saya adalah HTML. <i>Ashiap. Mantap.

Ini sama saja Anda lupa klik tombol I pada Microsoft Word. Anda akan mendapatkan hasil seperti ini :

Halo, saya adalah HTML. Ashiap. Mantap.

Satu kesalahan pada penutup tag HTML, seluruh kode Anda bisa menjadi berantakan.

 

Selanjutnya, Pelajari Tags HTML

Selamat, Anda telah mempelajari konsep dasar HTML.

HTML kurang lebih adalah teks biasa yang dibuka dan ditutup dengan tag HTML.

Selanjutnya, mari pelajari tag – tag dasar HTMl yang sering digunakan. Saya akan menguploadnya di post berbeda setelah ini.

15.788 comments

  1. zhong li cosplay

    Find out exactly how to obtain your hands on the first-ever personality attire, making their launching in Genshin Influence 1.6 update.

  2. how to buy an engagement ring

    You need to take part in a contest for one of the best
    sites online. I most certainly will highly recommend this site!

  3. 마사지방법

    Good replies in return of this query with genuine arguments and
    telling the whole thing about that.

  4. https://ct1anghiado.net/

    Oh my goodness! Awesome article dude! Thank you so much, However I am having difficulties with
    your RSS. I don’t understand why I am unable to subscribe to it.
    Is there anyone else having the same RSS issues?
    Anyone that knows the answer will you kindly respond?
    Thanks!! https://ct1anghiado.net/uu-diem-son-ngoai-that

  5. 유흥룸

    Hey there! I just wanted to ask if you ever have any problems with hackers?
    My last blog (wordpress) was hacked and I ended up losing a few months of hard work due to
    no backup. Do you have any methods to prevent hackers?

  6. crockor.net

    Hi there just wanted to give you a brief heads up
    and let you know a few of the pictures aren’t loading correctly.
    I’m not sure why but I think its a linking issue. I’ve tried it in two
    different internet browsers and both show the same outcome.

  7. minecraft tekkit servers

    Hi there this is kinda of off topic but I was wondering if blogs use WYSIWYG editors or if
    you have tto manually code with HTML. I’m starting a blog
    soon but have no coding experience so I wanted to get advice from someone wigh experience.

    Any help would be enormously appreciated!

  8. https://www.tasknight.com

    I have to convey my affection for your kindness giving
    support to those people that really want help with in this issue.
    Your personal dedication to passing the solution across
    turned out to be surprisingly good and has consistently permitted girls just like me to attain their goals.
    Your personal warm and helpful information implies a lot to me and additionally to my colleagues.

    Warm regards; from everyone of us.

    my website – https://www.tasknight.com

  9. maidstonepistolclub.co.uk

    Hi there! Someone in my Facebook group shared this site with us so I came to look it over.
    I’m definitely enjoying the information. I’m bookmarking and will
    be tweeting this to my followers! Terrific blog and great design.

    Here is my blog – maidstonepistolclub.co.uk

  10. minecraft anarchy servers

    Hello! Do you know if tey maske any pljgins to safeguard against hackers?
    I’m kinda paranoid about losing everythingg I’ve worked hard on. Any recommendations?

  11. Libido Boost Male Enhancement Reviews

    Hey there would you mind sharing which blog platform you’re working with?
    I’m looking to start my own blog in the near future but I’m having a hard time making a decision between BlogEngine/Wordpress/B2evolution and Drupal.
    The reason I ask is because your design and style seems different then most blogs and I’m looking for something
    completely unique. P.S Sorry for getting off-topic but I had to ask!

    My blog – Libido Boost Male Enhancement Reviews

  12. zhongli god outfit

    Genshin Effect Qin Cosplay Costume Swimsuit Clothes Halloween Carnival Suit, Costumes.

  13. Situs Judi

    Very energetic article, I loved that a lot.
    Will there be a part 2?

  14. crash

    Every weekend i used to visit this site, for the reason that
    i want enjoyment, as this this web site conations
    genuinely nice funny material too.

  15. Wawza Gummies

    A motivating discussion is worth comment. There’s no
    doubt that that you should write more about this
    issue, it might not be a taboo subject but usually folks don’t speak
    about such issues. To the next! Best wishes!!

    Here is my page: Wawza Gummies

  16. vape Kit

    Excellent beat ! I wish to apprentice even as you amend your website, how could i subscribe for a log
    website? The account helped me a acceptable deal. I have been tiny bit familiar
    of this your broadcast providded bright clear idea

  17. Stan

    You actually make it seem so easy with your presentation but I find this matter to
    be actually something which I think I would never understand.

    It seems too complicated and very broad for me.

    I am looking forward for your next post, I’ll try to get the hang of it!

  18. agen slot online

    If some one needs to be updated with hottest technologies then he must be
    visit this web page and be up to date all the time.

  19. chơi Blackjack trực tuyến

    Greetings from Los angeles! I’m bored to tears at work so I decided to browse your site on my iphone during
    lunch break. I enjoy the knowledge you present here and can’t wait to take a look when I get home.
    I’m surprised at how fast your blog loaded on my phone ..
    I’m not even using WIFI, just 3G .. Anyways, fantastic site!

  20. Paddy Power

    hello there and thank you for your information – I’ve certainly picked up anything
    new from right here. I did however expertise a few technical issues using
    this website, since I experienced to reload the web
    site a lot of times previous to I could get it to load properly.
    I had been wondering if your hosting is OK? Not
    that I’m complaining, but sluggish loading instances
    times will often affect your placement in google and can damage your quality score if ads and marketing with Adwords.
    Anyway I’m adding this RSS to my email and could look out for a lot
    more of your respective fascinating content. Make sure you update this again soon.

  21. t shirt printing

    Hеllo vety nice web site!! Maan .. Beautiful ..
    Ꮃonderfսl .. I’ll Ьookmark your ѕite and take the feeds also?
    I amm satisfied to seek oout a lot of helpful info here within the publish, we want ᴡoprk out extra
    techniques in this regard, thank you for shɑring.
    . . . . .

    My web page; t shirt printing

  22. game sâm lốc

    I am in fact glad to read this blog posts which consists of plenty of helpful information, thanks for
    providing these information.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *