Membuat halaman html di notepad: klarifikasi untuk boneka. Tajuk Rata Tengah

Tugas 1: Membuat File HTML Dasar

Untuk membuat file HTML Anda, lakukan hal berikut:

    Buat folder HTML, di mana kita akan menyimpan halaman Web yang dibuat.

    Luncurkan program Notepad standar.

    Ketik di jendela editor teks paling sederhana dari file HTML:

Pelatihan file HTML

jadwal kelas selasa

    Simpan file sebagai RASP.HTM.

    Untuk melihat halaman Web yang dibuat, unduh browser Microsoft Internet Explorer.

    Buka di menu browser Mengajukan(Mengajukan), Membuka(membuka), Melihat(Ringkasan- Jelajahi) dan temukan file RASP.HTM di folder KURS dan unggah. Pastikan nama halaman Web (Tutorial HTML) ditampilkan di bilah status atas browser.

Tugas 2.Mengontrol tata letak teks di layar

Informasi.

Saat menampilkan dokumen HTML, browser secara otomatis meletakkan teks di layar, tanpa mengambil memperhitungkan jeda baris dan spasi berurutan yang muncul dalam file.

    Jika perlu, ikuti hal. 5-6 tugas 1.

    Buka sumber asli halaman Web - di menu browser Melihat(Melihat), Sumber (sebagaiHTML) sebuah jendela akan terbuka dengan program Notepad standar, di mana halaman Web Anda disajikan dalam perintah HTML.

    Ubah teks dalam file HTML dengan menempatkan kata "Jadwal", "kelas", "Selasa" pada baris yang berbeda:

Pelatihan file HTML

Jadwal

kelas

pada hari Selasa

    Simpan perubahan Anda ke file RASP.HTM menggunakan perintah Mengajukan(Mengajukan), Menyimpan(Menyimpan). Tutup Notepad.

    Gunakan Microsoft Internet Explorer untuk melihat halaman Web yang baru diambil menggunakan tombol F5 atau menggunakan perintah Melihat(Melihat), Menyegarkan (menyegarkan). Apakah gambar teks di layar berubah?

Catatan

Di masa mendatang, setelah membuat perubahan pada halaman Web, selalu ikuti langkah 4-5.

Tugas 3. Tag pemisah baris dan paragraf

Informasi.

Ada perintah khusus yang melakukan jeda baris dan mengatur awal paragraf baru. Selain itu, ada perintah yang mencegah program browser mengubah pemformatan teks dengan cara apa pun dan memungkinkan Anda untuk secara akurat mereproduksi fragmen tertentu dari file teks di layar.

Tag umpan baris
memisahkan baris dari teks atau grafik berikutnya. tag paragraf

Juga memisahkan baris, tetapi juga menambahkan baris kosong, yang secara visual menyoroti paragraf. Kedua tag tunggal.

    Buat perubahan pada teks file HTML:

Pelatihan file HTML

Jadwal

kelas

pada hari Selasa

    4. Simpan perubahan Anda ke file RASP.HTM.

    Gunakan Microsoft Internet Explorer untuk melihat halaman Web yang baru diterima Bagaimana teks di layar berubah?

Tugas 4. Memilih fragmen teks

Informasi.

Tag pemilihan teks memungkinkan Anda untuk mengontrol tampilan karakter individu dan kata-kata. Ada tiga tag pemilihan teks:

… untuk menyoroti berani,

… untuk menyoroti dalam huruf miring

… untuk menyoroti garis bawah.

Pelatihan file HTML

Jadwal kelas pada hari Selasa

2. Lihat halaman Web yang baru diterima.

Dimungkinkan untuk menggunakan font gabungan:

Jadwal kelas pada hari Selasa

Tetapi pada saat yang sama, Anda harus mengingat aturan berikut untuk menulis tag gabungan:

<Тэг-1> <Тэг-2> … Tag-2>

entri yang salah

Tugas 5: Menggunakan gaya heading

Informasi.

Ada dua cara untuk mengontrol ukuran teks yang ditampilkan oleh browser:

    menggunakan gaya heading,

    mengatur ukuran dokumen utama atau ukuran font saat ini.

Ada enam tag heading (H1 hingga H6). Setiap tag memiliki gaya tertentu yang ditentukan dalam pengaturan browser. Gaya H1 adalah yang terbesar.

    Buat perubahan pada file RASP.HTM:

Pelatihan file HTML

Jadwal

kelas pada hari Selasa

    Lihat halaman Web yang baru diterima.

Tugas 5. Mengatur ukuran font saat ini.

Informasi.

label huruf memungkinkan Anda untuk mengatur ukuran font saat ini di masing-masing tempat teks. Rentang pengaturan font saat ini adalah dari 1 hingga 7.

    Buat perubahan pada file RASP.HTM:

Pelatihan file HTML

Jadwal

kelas untuk hari selasa

    Ubah ukuran font untuk teks "kelas pada hari Selasa" sendiri menggunakan tag .

    Memodifikasi teks dokumen HTML menggunakan tag pemilihan teks dan tag pemisah baris dan paragraf.

Tugas 6. Jenis huruf dan warna font

Informasi.

Menandai Memberikan kontrol atas ukuran, gaya, dan warna teks. Mengubah jenis huruf dilakukan hanya dengan menambahkan tag atribut WAJAH. Misalnya, untuk menampilkan teks dalam font Arial, Anda akan menulis .

Untuk mengubah warna font tag atribut dapat digunakan WARNA = "X".

Alih-alih X, Anda harus mengganti nama warna (dalam tanda kutip) atau nilai heksadesimalnya. Saat menentukan warna dengan angka heksadesimal, Anda dapat mewakili warna ini yang didekomposisi menjadi tiga komponen:

merah (R), hijau (G), biru (B), yang masing-masing memiliki nilai dari 0 hingga FF.

Contoh perekaman warna dalam format RGB ditunjukkan pada tabel:

Tabel 1

Warna

Warna

Ungu

cokelat

jeruk

pirus

    Buat perubahan pada file RASP.HTM:

Pelatihan file HTML

Jadwal >

kelas untuk hari selasa

    Ubah sendiri ukuran, warna, jenis huruf, gaya teks dokumen.

Tugas 7. Menyejajarkan teks secara horizontal

Informasi.

Tag HTML mengontrol perataan horizontal teks. Jika Anda tidak menentukan metode perataan, semua elemen dalam dokumen akan rata kiri dan memiliki margin kanan bergerigi (lihat Gambar 2).

Browser modern menggunakan atribut perataan teks rata =, yang disematkan dalam tag paragraf atau heading.

    Buat perubahan pada file RASP.HTM:

Pelatihan file HTML

Jadwal>

kelas untuk hari selasa

Tugas 8. Mengatur latar belakang dan warna teks

Informasi.

Saat menampilkan latar belakang, teks, browser menggunakan warna yang disetel secara default - warna tersebut disetel oleh pengaturan browser. Warna-warna ini diatur di awal file HTML di tag . Entri warna mirip dengan warna font (lihat Tabel 1, paragraf 12). Atribut BGCOLOR= menetapkan warna latar belakang halaman, TEXT= menentukan warna teks untuk seluruh halaman, LINK= dan VLINK= masing-masing menentukan warna tautan yang belum dikunjungi dan yang dikunjungi (dua parameter terakhir akan dibahas nanti).

    Buat perubahan pada file RASP.HTM:

Pelatihan file HTML

BGCOLOR="#FFFFCC" TEXT="#330066">

Jadwal>

kelas untuk hari selasa

Tugas 9.

    Bereksperimenlah dengan dokumen yang dibuat. Saat Anda mengubah ukuran jendela, lihat bagaimana browser merender teks dengan jeda baris yang dipaksakan. Apa yang terjadi ketika jendela menyusut sedemikian rupa sehingga bahkan satu kata pun tidak muat di dalamnya?

    Buat sendiri dokumen HTML Anda. Biarkan itu menjadi cerita pendek tentang diri Anda dan hobi Anda.

Halo pembaca blog yang terkasih! Kami melanjutkan bagian "Membuat situs dari awal", dan khususnya topik tag ... Dan hari ini kami akan mempertimbangkan tag yang ada di halaman web mana pun - , dan . Ada satu tag lagi yang harus ada di setiap dokumen HTML dan yang sudah saya tulis di salah satu artikel sebelumnya - jadi kami tidak akan menyentuhnya.

Pada artikel kolom sebelumnya, saya menulis tentang membuat file kosong dalam format html. Bahkan, itu digunakan dalam artikel pro (di situlah tag judul diterapkan). Sekarang kita akan langsung mengedit file ini dengan deskripsi lengkap.

Dan mari kita mulai artikel dengan mengedit file yang dibuat. Secara pribadi, saya menamakannya index.html, tetapi namanya bisa apa saja. Buka dengan editor teks apa pun (lebih baik menggunakan Notepad ++, karena memiliki penyorotan kode dan gadget berguna lainnya). Dan segera tambahkan tag ke dalamnya , dan persis dalam urutan di mana mereka ditulis. Jangan lupa untuk menutupnya seperti yang ditunjukkan pada tangkapan layar. Dokumen akan terlihat seperti ini:

Sekarang pertimbangkan arti dari setiap tag secara terpisah. Tidak heran mereka ada di semua orang. dokumen HTML.

Fungsi Tag

Jadi tagnya adalah wadah(). Di dalamnya ada semua konten halaman web yang terlihat dan tidak terlihat (termasuk tag dan ). Tag pembuka datang segera setelah deklarasi Doctype, dan penutupan ada di akhir dokumen. Dengan demikian, jelas bagi browser di mana harus mulai memproses dokumen dan di mana harus mengakhirinya.

Secara teoritis, dia sendiri bisa mengerti apa dan bagaimana. Lagipula ? Ini adalah penerjemah bahasa HTML dan tidak mungkin dia akan mulai memproses dari tengah dokumen dan menyelesaikannya sebelum mencapai akhir. Pertanyaannya, tentu saja, bisa diperdebatkan, tetapi saya selalu berpikir (dan sekarang saya tidak menyerah dengan pendapat saya) bahwa menulis tag ini adalah wajib.

Bahkan mengingat fungsi tag ini hanya di membatasi konten, ia memiliki atributnya sendiri (yang sekarang tidak digunakan sama sekali, atau sangat jarang digunakan). Sumber yang berbeda menunjukkan atribut yang berbeda satu sama lain, jadi saya tidak berani mengemukakan versi yang benar.

Satu-satunya hal yang dapat saya katakan dengan pasti adalah bahwa sebagian besar atribut tidak didukung oleh HTML 4.01 atau tidak diinginkan. Saya akan memberi Anda satu contoh. - tooltip di mana saja dalam dokumen. Misalnya, saat Anda mengarahkan mouse ke gambar, Anda mungkin melihat teks popup. Juga dalam kasus tag ini:

Dan inilah yang akan Anda lihat saat mengarahkan kursor ke dokumen dengan konten ini:

Lebih baik menggunakan atribut judul bukan dalam tag , tetapi di area halaman tertentu lainnya. Pertama, nyaman, dan kedua, mesin pencari akan memperlakukan situs Anda lebih baik. Tag ini tidak secara langsung memengaruhi pengoptimalan sumber daya. Kami pergi lebih jauh.

Fungsi tanda

Dan baris berikutnya adalah menandai . Ini berisi semua informasi teknis tentang halaman, yang berfungsi untuk membantu browser dan mesin pencari. Tag adalah tag wadah dan segera mengikuti setelahnya , hanya tidak seperti yang terakhir, tag penutup tidak muncul di akhir dokumen, tetapi sebelum tag pembuka .

Informasi apa yang dapat ditemukan di ? Tapi tidak ada. Segala sesuatu dalam tag ini hanya dapat diakses oleh mata manusia dengan melihat kode sumber halaman. Semua konten dalam tag ini adalah untuk mesin pencari dan browser. Satu-satunya hal yang entah bagaimana bisa Anda lihat adalah tagnya , yang bertanggung jawab atas judul jendela halaman web. Berikut ini contohnya:</p> <p><img src='https://i1.wp.com/monetavinternete.ru/wp-content/uploads/2013/01/Title-v-tege-head.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>Teks setelah ikon adalah isi dari tag <title>. Sekarang mari kita lihat isinya. <head>, yang tidak dapat kita lihat, tetapi merupakan bagian yang sangat penting <b>pembuatan dan promosi situs.</b> Pertama-tama, ini adalah garisnya</p><p> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </p><p>Ini adalah tag meta untuk <b>jenis konten halaman</b>(Jenis konten). Dalam hal ini, ini adalah kode html dalam penyandian UTF-8 (content="text/html; charset=UTF-8"). Berikutnya adalah tag judul yang dijelaskan di atas. Kemudian datang baris yang dimulai dengan tag <link>. Ini menunjukkan tautan ke dokumen eksternal. Misalnya, garis</p><p> <link href="http://сайт/.../style.css" rel="stylesheet" media="screen" type="text/css" /> </p><p>menunjukkan bahwa file (rel="stylesheet") dengan (type="text/css") terhubung, yang terletak di alamat ini dan itu (untuk mengurangi panjang baris, saya mengganti setengah dari alamat dengan titik) . Setelah memproses string ini oleh browser, itu akan menentukan di mana mendapatkan <b>lembar gaya berjenjang</b>.</p> <p>Secara umum, ada banyak informasi di tag kepala yang dapat dibicarakan tanpa batas. Hal terakhir yang perlu diperhatikan (khususnya dalam kasus ) adalah adanya tag deskripsi, kata kunci, dan kanonik. saya menggunakan <b>plugin Semua dalam Satu Paket SEO</b>, jadi mereka hadir di dalam <head>.</p> <p>Seperti yang Anda tahu, segala sesuatu yang besar selalu dimulai dari yang kecil. Jika Anda tertarik dengan jawaban atas pertanyaan tentang cara membuat situs web melalui notepad, maka Anda pasti pernah mendengar tentang kemungkinan ini di suatu tempat. Ini memang mungkin. Tetapi perlu segera disebutkan bahwa kemungkinan besar tidak ada yang akan membuat situs interaktif dinamis modern melalui notepad saat ini, karena ada program khusus untuk ini yang sangat mempercepat dan menyederhanakan proses pengembangan. Tetapi sangat mungkin untuk membuat halaman web yang lengkap.</p><b>Cara membuat website di notepad</b><br>Untuk mulai dengan, sedikit keakraban dengan teori dan istilah umum diperlukan. Sebagian besar halaman situs web adalah dokumen teks biasa, yang dirancang dengan cara khusus - bahasa markup hypertext, disingkat HTML. Beberapa mengklasifikasikan markup HTML sebagai bahasa pemrograman, tetapi ini tidak benar. <p>HTML hanyalah cara standarisasi markup dokumen yang ditafsirkan secara unik oleh browser untuk ditampilkan di layar komputer dalam bentuk yang mudah digunakan. Alat utama bahasa HTML adalah elemen struktural khusus, yang dengannya dokumen dibuat. Mereka disebut deskriptor atau tag.</p><p>Secara umum, tag adalah konstruksi dari bentuk <table>Jadi tag dimulai dengan< после которого следует название тега table и вся конструкция завершается знаком >. Tag datang berpasangan seperti membuat teks menjadi tebal <b>dan</b> dan tidak berpasangan sebagai baris baru <br>. Dalam hal menggunakan tag berpasangan, itu harus digunakan sebagai tag pembuka <b>, dan penutup</b>. Tag penutup adalah deskriptor dengan garis miring /.</p><p>Pertimbangkan jenis utama tag dan tujuannya.</p><ul><li><span><i>Elemen <b><!DOCTYPE html> </b>. </i> Atur ke awal halaman dan berfungsi untuk memberi tahu browser cara menafsirkan dokumen ini. Ini opsional, tetapi sangat diinginkan pada halaman untuk menghindari kemungkinan masalah dengan tampilannya. <br></span></li><li><span><i>Menandai <b><html> </b>. </i> Ini adalah tag pasangan dan terdiri dari dua bagian <html>dan</html>. Setiap halaman di situs dimulai dengan tag ini dan diakhiri dengan tag ini. <br></span></li><li><span><i>Menandai <b><head> </b>. </i> Ini juga merupakan tag pasangan dan terdiri dari dua bagian <head>dan</head>. Tag ini berisi berbagai informasi penting tentang halaman: judulnya, tautan ke gaya desain yang digunakan, skrip yang disertakan, metadata khusus. <br></span></li><li><span><i>Menandai <b><title> </b>. </i> <title>dan dan terletak di dalam tag . Tag ini mendefinisikan judul halaman yang akan terlihat di browser.

  • Menandai . Ini adalah tag pasangan, terdiri dari dua bagian dan dan mengikuti tag Di halaman. Itu ada di tag <body> yang berisi semua informasi yang ditampilkan pada halaman di browser.
  • Menandai . Sendiri. Digunakan untuk menunjukkan jeda baris dalam dokumen.
  • Menandai . Mengacu pada tag berpasangan, ditulis dalam bentuk yang sedikit berbeda dari tag lain dan digunakan untuk membuat tautan. Ini adalah elemen penting dari keseluruhan konsep bahasa HTML, serta Internet secara keseluruhan.
  • Menandai

    . Mengacu pada tag berpasangan dan terdiri dari dua bagian. Dengan bantuannya, sebuah paragraf teks dibuat.

  • tag

    ,

    ,

    ,

    ,
    ,
    . Mereka termasuk tag berpasangan, karena terdiri dari dua tag, misalnya

    dan

    . Tag ini berfungsi untuk membuat enam tingkat subpos dan pada saat yang sama menunjukkan pentingnya teks yang terkandung di dalamnya dalam kaitannya dengan keseluruhan dokumen.

  • Menandai . Ini juga merupakan tag berpasangan, terdiri dari dua bagian dan dan atur gaya font menjadi tebal.
    • Secara total, ada sekitar seratus tag, tetapi sepuluh yang dianggap sudah cukup untuk mendesain halaman situs paling sederhana di buku catatan. Tag dokumen dasar , , , <body>didistribusikan dalam urutan yang ketat. Di dalam tag <body>sisa deskriptor mungkin dalam urutan yang berbeda dalam standar bahasa HTML. Cara termudah untuk memahami ini adalah dengan membuat halaman web sederhana. <ol><li><span>Luncurkan Notepad dan di baris pertama atur elemennya<!DOCTYPE html>, yang memberi tahu browser cara menafsirkan dokumen Anda. <p> <!DOCTYPE html></p></span></li><li><span>Buat baris baru dan tambahkan tag pasangan <html>. Terjemahkan tag penutup</html> dua baris ke bawah. <p> <!DOCTYPE html><br><html></p></span></li><li><span>Tambahkan tag pasangan <head>sejalan di antara tag <html>dan terjemahkan tag penutup</head> dua baris ke bawah. <p> <!DOCTYPE html><br><html><br><head></p><p></head><br></html></p></span></li><li><span>On line antara tag <head>dan</head> tulis tag pasangan <title> dalam satu baris.






  • Masukkan judul halaman web Anda di antara tag dan. Contohnya seperti ini.




    Halaman situs web pertama saya

  • Posisikan kursor pada baris setelah tag penutup dan melakukan umpan baris. Masukkan tag pasangan di baris kosong yang muncul .




    Halaman situs web pertama saya


  • Buat terjemahan ganda di antara tag di dalam dan. Pada baris yang muncul, masukkan tag judul berpasangan

    . Ketik di dalam tag

    sub judul halaman.




    Halaman situs web pertama saya


    Tentang saya



  • Setelah tag judul penutuplakukan jeda baris dan atur tag paragraf berpasangan pada baris baru. Sisipkan teks di antara mereka. Misalnya, ya.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya Ivanov Ivan. Saya sedang membuat situs web saya.



  • Cantumkan nama depan dan belakang dalam tag berpasangan untuk membuat mereka berani.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya adalah Ivanov Ivan. Saya sedang membuat situs web saya.



  • Setelah tag paragraf penutup

    lakukan umpan baris dan masukkan tag pasangan di baris baru

    . Masukkan beberapa teks di antara tag.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya adalah Ivanov Ivan. Saya sedang membuat situs web saya.


    Kemajuanku



  • Setelah tag subtitle penutupbuat jeda baris lagi, masukkan tag paragraf berpasangan dan tulis teks arbitrer di antara tag ini.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya adalah Ivanov Ivan. Saya sedang membuat situs web saya.


    Kemajuanku




  • Dari tag yang tercantum dalam artikel, dua masih belum dijelajahi - umpan baris
    dan tag pembuatan tautan yang paling penting     . Mari kita terapkan. Sebelum tag penutup terakhir, masukkan deskriptor
    , dan antara
    dan

    konstruksi tipe. Anda harus mendapatkan yang berikut ini.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya adalah Ivanov Ivan. Saya sedang membuat situs web saya.


    Kemajuanku


    Sintaks dasar HTML telah dikuasai dan halaman pertama situs masa depan telah dibuat.
    Dalam proses pelatihan, materi situs situs digunakan



  • Antara kutipan dalam tag masukkan alamat halaman yang akan Anda tautkan. Sebelum tag Anda dapat memasukkan kata Tautan, dan di antara tag dan masukkan teks yang akan ditampilkan pada halaman.




    Halaman situs web pertama saya


    Tentang saya


    Nama saya adalah Ivanov Ivan. Saya sedang membuat situs web saya.


    Kemajuanku


    Sintaks dasar HTML telah dikuasai dan halaman pertama situs masa depan telah dibuat.
    Dalam proses pelatihan, materi situs situs digunakan

    Tautan: lokasi



  • Pada ini, pembuatan halaman paling sederhana untuk situs dapat diselesaikan. Pada prinsipnya bisa saja selesai bahkan di poin 9, tetapi jika Anda serius belajar bahasa HTML, maka latihan tambahan tidak akan berlebihan. Simpan halaman dengan ekstensi *.html dan Anda dapat membukanya di browser apa pun untuk melihat hasil pekerjaan Anda. Jika semuanya dilakukan dengan benar, maka Anda akan melihat sesuatu seperti berikut ini.
    • Jika, setelah membaca artikel ini, tekad Anda untuk membuat situs web belum mengering, maka pastikan untuk membiasakan diri Anda dengan sintaks lengkap bahasa HTML, dan juga pelajari cara menggunakan gaya cascading CSS untuk desain halaman.

    Mengembangkan Situs Web Menggunakan HTML Hypertext Markup Language

    kelas 8

    Pelajaran 1 Struktur halaman web.

    Konsep situs web

    Informasi di World Wide Web
    disimpan dalam bentuk website.
    Situs web ini memiliki struktur yang mirip dengan
    majalah tentang suatu topik atau
    masalah. Bagaimana sebuah majalah dibuat?
    halaman tercetak, dan situs Web terdiri dari:
    dari halaman web komputer.
    Halaman web dihubungkan oleh hyperlink.

    Jenis situs web

    resmi (pemerintah,
    Duma, sekolah ...)
    Komersial
    Pribadi

    Keuntungan halaman web:

    Volume informasi kecil
    ("paru-paru")
    Cocok untuk melihat di berbeda
    OS.
    Dinamis.
    Interaktif.

    Langkah-langkah pembuatan situs web:

    1.
    2.
    3.
    Bangun situs web secara lokal
    komputer.
    tes (periksa
    operasi yang benar).
    Posting daring -
    pilih server hosting
    (berbayar atau gratis).

    Program untuk membuat situs:

    1) editor teks paling sederhana (tanpa
    pemformatan teks):
    Buku catatan
    2) browser untuk melihat halaman:
    Internet Explorer
    3) Program pemrosesan gambar:
    photoshop

    Editor web visual

    Membangun situs web dalam HTML sangat
    melelahkan, istimewa
    pengetahuan.
    Ada editor web visual
    (program) untuk membuat situs web.
    Bekerja berdasarkan prinsip WYSIWYG
    (apa yang Anda lihat adalah apa yang Anda dapatkan).

    Struktur halaman web

    10. Tag

    Tampilan halaman Web diatur oleh administrator
    perintah - tag, yaitu
    kurung sudut< >
    Tag bisa tunggal (tidak berulang) atau
    dipasangkan (wadah): sebelum ditutup
    tag container ditulis dengan garis miring (/)

    Tag ditulis dalam huruf Inggris (kapital,
    huruf kecil).

    11. Struktur halaman web

    Seluruh kode HTML halaman
    ditempatkan di dalam utama
    wadah:
    .
    Halaman web dibagi menjadi
    2 bagian logis:
    judul (KEPALA)
    konten (BODY).

    12. Judul halaman web

    Judul halaman web dibungkus dalam wadah.
    Berisi judul dokumen dan informasi bantuan tentang halaman
    (misalnya, jenis penyandian) yang digunakan browser untuk
    tampilan yang benar.
    Judul halaman web terkandung dalam wadah<ТITLE> dan
    ditampilkan di baris atas jendela browser saat dilihat
    halaman.

    <ТITLЕ>Komputer

    13. Menulis Template Halaman Web



    <ТITLЕ>Komputer

    14. Konten utama halaman web

    Konten utama halaman ditempatkan di
    wadah .
    Mungkin berisi: teks, tabel, lari
    string, gambar, link, file suara...
    Mari kita letakkan teks "Semua tentang komputer" di halaman:
    Semua tentang komputer

    15. Templat Halaman Web



    <ТITLЕ>Komputer


    Semua tentang komputer

    16.

    17. Bagaimana cara menyimpan halaman web

    1. Buat folder khusus untuk situs dan
    simpan semua file situs di folder ini.
    2. Simpan halaman web sebagai file dengan
    bernama index.html adalah halaman judul
    situs (pertama dimuat ke browser)
    Ekstensi file halaman web - .htm
    or.html

    18. Kami membuat situs web kami….

    Penting untuk membedakan antara nama file index.html - di bawah
    mana halaman Web disimpan dalam file
    sistem, dan nama sebenarnya dari halaman Web
    "Komputer" - ditampilkan di baris teratas
    jendela browser dan diurai terlebih dahulu
    mesin pencari.
    Nama halaman Web harus maksimal
    tingkat relevansi dengan isinya.
    1. Masukkan kode HTML untuk halaman Web ke Notepad.
    2. Simpan file sebagai index.html dalam folder
    lokasi. Pilih jenis file - "Semua file".
    3. Buka file ini di browser untuk dilihat.

    19.

    20. PELAJARAN #2

    21. Pelajaran 2: Memformat Teks di Halaman Web

    22. Pemformatan Teks

    Meskipun halamannya tidak terlalu menarik: tulisan kecil dan teks hitam menyala
    latar belakang putih. Tetapi dengan bantuan tag, Anda dapat menghias teks.
    1. Judul: tag dari<Н1>(terbesar) ke<Н6>(Terkecil).
    <Н1>Semua tentang komputer
    2. Huruf (FONT). Beberapa tag memiliki atribut - nama properti, mungkin
    mengambil nilai-nilai tertentu.
    FONT face="Arial" - font face
    ukuran = 4
    - ukuran
    warna="merah" - warna
    3. Penjajaran (alignment). Teks biasanya rata kiri
    halaman, bagaimanapun, adalah kebiasaan untuk menempatkan judul di tengah.
    ALIGN="kiri",
    ALIGN = "kanan",
    <Н1 ALIGN="center">Segala sesuatu tentang komputer
    ALIGN="tengah"

    23. Warna font

    Nilai atribut COLOR dapat diatur dengan 2 cara:
    a) nama warna (misalnya, "merah", "hijau", "biru", dan seterusnya),
    b) nilai heksadesimal RGB-nya "#RRGGBB", di mana
    dua digit heksadesimal pertama mengatur intensitas
    merah (merah), dua berikutnya adalah intensitas hijau (hijau) dan
    dua yang terakhir adalah intensitas warna biru (biru).
    Intensitas warna minimum ditentukan dalam heksadesimal
    angka 00, dan maksimal FF. Warna biru = "#0000FF".
    Dengan demikian, Anda dapat mengatur warna biru judul dengan tag FONT dengan
    Atribut WARNA:
    <Н1 ALIGN="center">Segala sesuatu tentang komputer

    24.

    25. Pemformatan Teks

    4. Garis horizontal akan terpisah
    judul dari sisa konten
    halaman dengan satu tag
    .
    5. Paragraf:<Р>. Jika dilihat di
    paragraf dipisahkan satu sama lain di browser
    interval lainnya. Untuk setiap paragraf
    Anda dapat mengatur jenis tertentu
    penyelarasan.

    26. Kerja Praktek 3.8 Tempat Pelatihan "Komputer"

    Format teks awal
    halaman:
    1) Membuat dan menyelaraskan 2 paragraf (tugas 3)
    2) Sorot judul halaman dengan warna dan
    pisahkan dengan bilah horizontal
    (tugas 4)

    27.

    28. PELAJARAN 3

    29. Pelajaran 3: Memasukkan Gambar ke Halaman Web

    30. Sisipkan gambar

    Halaman web dapat berisi file grafik dari 3 format -
    GIF, JPG, dan PNG. Jika gambar disimpan dalam format yang berbeda, maka
    pertama-tama harus dikonversi ke salah satu dari ini
    format.
    Tag digunakan untuk menyisipkan gambar. dengan atribut
    SRC, yang menunjukkan di mana file tersebut disimpan
    komputer lokal atau di Internet.
    1) gambar di komputer lokal di folder dengan situs:

    2) gambar ada di folder lain di komputer lokal:

    3) gambar terletak di server jarak jauh di Internet:

    31. Teks eksplanasi. Lokasi gambar dalam teks.

    Ilustrasi pada halaman Web telah menjadi penting
    elemen desain. Namun, pengguna untuk
    hemat waktu terkadang nonaktifkan unduhan browser
    gambar grafis dan hanya membaca teks.
    Karena itu, agar tidak kehilangan makna halaman, alih-alih menggambar
    teks penjelasan harus ditampilkan dengan atribut ALT

    Posisi gambar dalam teks - mendefinisikan atribut ALIGN
    menandai : THOR, TENGAH, BAWAH, KIRI, KANAN.
    ALIGN="kanan">

    32. Tampilan situs yang sudah jadi

    33. Kode halaman situs web


    Komputer


    Semua tentang komputer




    Di situs ini Anda bisa mendapatkan berbagai informasi tentang
    komputer, perangkat lunaknya, dan harga komputer
    aksesoris.


    Kamus terminologi akan memperkenalkan Anda ke komputer
    persyaratan, dan Anda juga dapat mengisi kuesioner.



    34. Pelajaran 4

    35. Tes kerja No. 3

    1.
    2.
    3.
    4.
    5.
    6.
    7.
    8.
    9.
    10.
    Apa itu situs Web?
    Jenis situs.
    Bagaimana halaman web digabungkan menjadi situs web?
    Apa itu tag? wadah label? Tulis wadah utama
    Halaman web.
    Apa struktur logis dari halaman web?
    Daftar 5 tag pemformatan halaman.
    Apa itu atribut tag?
    Apa saja cara untuk mengatur warna pada halaman web?
    Tag apa yang digunakan untuk memasukkan judul? Memformat
    huruf? Memasuki paragraf?
    Tag dan atribut apa yang digunakan untuk menyisipkan gambar?

    36. Pelajaran 4. Hyperlink di halaman Web

    37.

    Hyperlink memungkinkan Anda untuk mengunduh
    browser halaman web lain yang terkait
    dari yang sebelumnya.
    Sebuah hyperlink terdiri dari 2 bagian: alamat
    dan penunjuk referensi.
    Hyperlink disetel ke universal
    menandai dengan atribut HREF (he
    menentukan file mana yang disimpan
    halaman web yang diinginkan):
    penunjuk tautan

    38. Jenis hyperlink

    1) dalaman:
    penunjuk
    link
    2) eksternal:
    filename.html"> Penunjuk Tautan

    39. Penunjuk Hyperlink

    Pointer - bagian yang terlihat
    hyperlink: teks atau gambar

    40. Alamat bagian dari hyperlink

    Buka halaman web lain:
    penunjuk tautan
    Buka gambar di browser:
    Gambar
    Dengarkan suaranya (meluncurkan browser bawaan
    pemain):
    Suara
    Simpan file (meluncurkan browser bawaan
    pengelola unduhan file):
    Unduh berkas

    41. Email hyperlink

    Jenis hyperlink ini adalah
    wadah khusus


    ">Email kami

    42. Tampilan halaman situs yang telah selesai

    43. Kode halaman situs web


    Komputer


    Semua tentang komputer




    Di situs ini Anda bisa mendapatkan berbagai informasi tentang komputer, perangkat lunaknya
    pengadaan dan harga komponen komputer.


    Kamus terminologi akan memperkenalkan Anda pada istilah komputer, serta Anda
    anda dapat mengisi formulir.


    [Program]  
    [Kamus]  
    [Aksesoris] 
    [Daftar pertanyaan]



    ">Email:


    44. Pelajaran 5

    45. Pelajaran 5: Daftar di halaman Web

    46. ​​Jenis daftar

    Bernomor
    berlabel
    Daftar istilah (seperti dalam kamus)
    Daftar Bersarang

    47. Daftar Bernomor

    Daftar - dalam wadah
    Daftar item - tag

  • Atribut TYPE adalah tipe penomoran (Arab
    nomor; saya - Romawi; a - latin
    huruf kecil)

    1. Program sistem
    2. Program aplikasi
    3. Sistem pemrograman

    48. Daftar Berpoin

    Daftar - dalam wadah
    Daftar item - tag

  • Atribut TYPE adalah jenis penanda ("disc" adalah disk,
    "persegi" - kotak, "lingkaran" - lingkaran)

    • Editor teks
    • editor grafis
    • Spreadsheet
    • Sistem manajemen basis data

    49. Daftar istilah

    Daftar - dalam wadah

    Daftar item - tag

    Istilahnya ditulis dulu, lalu
    definisinya (seperti dalam kamus)

    50. Pelajaran 6

    51. Pelajaran 6: Formulir Interaktif di Halaman Web

    52. Konsep bentuk interaktif

    Untuk berkomunikasi dengan pengunjung situs web
    pembuat di tempat halaman web
    bentuk interaktif.
    Formulir mengandung berbagai elemen
    kontrol:
    bidang teks
    daftar dropdown
    bendera
    saklar...

    53. Bidang teks

    wadah utama

    Bidang teks - untuk memasukkan teks dari keyboard: tag
    dengan atribut:
    TYPE="teks" – tipe konten (teks)
    NAMA="____" – nama bidang
    SIZE="40" – panjang kolom input (dalam karakter)

    - pemisah garis (pindahkan kursor ke yang baru
    garis)

    54. Sakelar (tombol radio)

    Tombol bulat untuk memilih salah satu dari beberapa
    pilihan jawaban:
    JENIS = "radio"
    Semua anggota grup ini harus memiliki
    nama yang sama: NAMA="grup"
    VALUE atribut berisi pilihan
    tanggapan: VALUE="siswa"

    55. Bendera

    Kotak persegi untuk memilih beberapa jawaban dari
    opsi yang disarankan:
    JENIS = "kotak centang"
    Setiap elemen dari grup ini harus memiliki namanya sendiri:
    NAMA="kotak1", NAMA="kotak2",
    …..
    VALUE atribut berisi opsi untuk memilih jawaban:
    NILAI=“WWW”, NILAI=“email”, ….
    Setiap VALUE memiliki jawabannya sendiri.
    www

    56. Daftar kotak

    Untuk membuat daftar tarik-turun
    gunakan wadah

    Di dalamnya, setiap elemen dari daftar
    diberikan oleh tag

    • ARTIKEL TERKAIT