Belajar HTML

Daftar Isi:

Belajar HTML
Belajar HTML
Anonim

Dalam artikel ini, Anda akan mempelajari cara menggunakan HTML untuk menulis situs web pertama Anda! Artikel ini akan memberikan contoh ilustrasi untuk pemahaman yang lebih baik. Ayo segera reservasi bahwa artikel ini awalnya dirancang untuk mereka yang baru mulai belajar HTML. Selain itu, kami berjanji bahwa pada akhir membaca artikel ini, Anda dijamin akan membuat situs web pertama Anda.

HTML adalah singkatan dari HyperText Markup Language, yaitu bahasa untuk mengatur teks.

Tidak seperti bahasa pemrograman (JavaScript, PHP, dll) yang menggunakan skrip untuk melakukan tindakan di situs web, bahasa pengurutan (HTML) menggunakan tag untuk menandai konten situs web.

Mari mulai belajar HTML dari awal

Sama seperti bahasa Inggris yang terdiri dari huruf A, B, C, dll., HTML juga terdiri dari "huruf" yang khas:,,

dll. "Huruf" aneh dari bahasa HTML ini disebut tag oleh webmaster.

Berikut adalah contoh tag HTML.


Tags Buat garis bawah di sekitar tepi teks ini.

Tag HTML yang dipasangkan dengan gaya bahasa CSS memungkinkan Anda membuat situs web dengan cepat dan efisien.

Tempat HTML di antara bahasa lain

Seperti yang Anda tahu, situs web yang bagusdibangun dalam setidaknya 5 bahasa.

Situs web modern dibuat dalam bahasa:

  1. HTML (struktur dan urutan).
  2. CSS (konten gaya).
  3. JavaScript (tindakan browser).
  4. PHP (tindakan server).
  5. SQL (penyimpanan data).

HTML adalah bahasa dasar utama yang menjadi dasar bahasa lain. Oleh karena itu, mempelajari HTML harus menjadi langkah awal bagi siapa pun yang mempelajari cara membuat situs web di web.

Tag

Bahasa HTML telah berubah selama bertahun-tahun sejak awal. Saat ini, sebagian besar situs Internet pindah ke versi bahasa terbaru - HTML5. Tetapi bahkan di HTML5, dasar-dasar bahasa tetap tidak berubah.

Struktur halaman HTML seperti sandwich. Sama seperti sandwich yang memiliki dua potong roti, dokumen HTML memiliki tag HTML pembuka dan penutup.

Tag ini, seperti roti dalam sandwich, mengelilingi semua yang ada di dalamnya.


Tag

Saat Anda terus belajar HTML, Anda pasti sudah terbiasa dengan tag tersebut. Langsung di dalam tag induk adalah semua konten situs, termasuk tag. Tag ini diperlukan dan berisi semua pengaturan halaman situs yang ditulis. Pengaturan ini tidak terlihat oleh pengunjung situs, hanya browser (Google Chrome, Mozilla Firefox, dll.) yang melihatnya.

Blok pengaturan halaman web berisi semua elemen "tidak dirender" yang membantu browser menampilkan situs Anda dengan benar di web.


Semua opsi itudapat dikonfigurasi di dalam tag, kita akan melihatnya, tetapi nanti - ketika saatnya tiba.

Tag

Tag, seperti tag, ada di dalam tag.

Tag ini diperlukan untuk menampilkan di situs Anda semua informasi yang ingin Anda tampilkan.

Tajuk, paragraf, tabel, gambar, dan tautan hanyalah sebagian kecil dari elemen yang dapat dimuat di dalam tag.

Struktur dasar dokumen HTML:


… …

Situs pertama Anda

Sekarang Anda tahu bahwa Anda dapat membuat situs web menggunakan HTML dan tag dasar digunakan untuk ini:

  • . Menguraikan batas-batas halaman web.
  • . Berisi pengaturan untuk menampilkan halaman web di browser.
  • . Berisi semua elemen halaman web (gambar, video, teks, dan sebagainya) yang ingin Anda tampilkan kepada pengunjung situs.

Tag lain seperti,,, akan segera kita bicarakan.

Alangkah baiknya jika pembaca tidak hanya membaca artikel ini, tetapi juga langsung berlari untuk mengasah kemampuannya. Untuk mengasah keterampilan HTML Anda, Anda perlu membuat situs web pertama Anda, yang akan berfungsi sebagai tempat pengujian untuk keterampilan baru Anda.

Sudah diketahui bahwa operator seluler ("MTS", "MegaFon" dan seterusnya) menyediakan layanan seluler kepada kami. Dengan cara yang sama, layanan untuk pembuatan dan pengelolaan situs diberikan kepada kami oleh operator hosting. Untuk membuat situs web Anda, buka situs operator hosting gratis.

Penyedia hosting terverifikasi termasuk BEGET ataureg, misalnya. Anda dapat memilih siapa saja.

Setelah pendaftaran singkat, setelah 24 jam, situs web pertama Anda di Internet akan dibuat secara otomatis, yang akan terlihat oleh seluruh dunia, dan Anda dapat mulai berlatih!

Struktur situs modern

Sekarang setelah Anda memiliki situs, periksa tag apa yang berisi tag dan bagaimana tag tersebut mengatur informasi di situs.

Struktur situs modern
Struktur situs modern

Gambar di atas adalah representasi skematis dari struktur yang disertakan dengan versi terbaru bahasa HTML - HTML5. Seiring dengan HTML5 datang tidak hanya tag baru, tetapi juga arti membangun situs web. Semua tag yang Anda lihat dalam gambar terkandung di dalam tag utama. Tag ini membantu Anda "menguraikan" struktur situs Anda dan memberinya makna.

Misalnya, di dalam tag … lebih mudah untuk menempatkan judul situs (tag) dan deskripsi situs (tag).

Lebih mudah untuk menempatkan menu (tautan) situs (tag) di dalam tag.

Lebih mudah untuk menempatkan blok besar informasi terkait makna di dalam tag. Bisa beberapa artikel yang masing-masing "dibungkus" dengan tag, atau foto (tag), atau tabel (tag

) dan banyak lagi.

Lebih mudah untuk menempatkan informasi apa pun di dalam tag yang tidak sesuai dengan arti.

Di dalam tag, biasanya untuk menempatkan informasi tambahan seperti informasi kontak, bagian tambahan dari situs, dan sebagainya.

Jadi sekarang Anda sedikit lebih mahir dalam membuat situs web modern. Mari kita ambil contoh untukgejolak di kepalaku digantikan oleh kekaguman dari wawasan.

Jadi, ketika Anda membuka pengelola file di situs operator hosting Anda dan menemukan dokumen bernama index.php, jangan ragu untuk menulis di dalamnya, seolah-olah dari awal, struktur situs Anda.

Situs web pertama saya

Judul halaman

Deskripsi halaman

Tautan 1 | Tautan 2 | Tautan 3

Judul dari beberapa artikel

Ini adalah blok yang berisi informasi apa pun, dan dengan bantuan CSS Anda dapat mewarnai blok ini, dan seluruh situs dengan semua kontennya, seperti yang Anda inginkan. © Semua hak dilindungi undang-undang

Ingat kami mengatakan bahwa ada pengaturan yang berbeda untuk situs? Nah, ini dia:

  1. Menggunakan browser kami menunjukkan bahwa situs tersebut dapat berisi karakter Rusia dan Inggris (jika tidak, ketika Anda membuka situs, Anda akan melihat krakozyabry yang mengerikan).
  2. digunakan untuk menunjukkan nama halaman, yang akan ditampilkan di tab browser dan di mesin pencari ("Yandex", Google dan sejenisnya).

Tentu saja, tanpa gaya CSS, situs Anda akan terlihat pelit (huruf hitam dengan latar belakang putih), tetapi pastikan untuk mencoba menulis halaman pertama Anda dalam HTML terlebih dahulu.

Selamat! Anda baru saja membuat halaman web pertama Anda di situs web Anda sendiri! Ini akan lebih menarik!

Direkomendasikan: