PADA dunia modern terkadang memiliki situs web sendiri sama pentingnya dengan memiliki nomor telepon atau alamat Surel. Sayangnya, tidak semua orang dapat membuat situs web profesional yang indah sendiri, dan terkadang bahkan kurva tidak berfungsi. Memesan dari programmer juga bukan solusi yang ideal, karena tidak semua orang mampu membelinya.

Bantuan untuk keluar dari situasi ini html gratis Template situs web. Templat situs HTML adalah satu set yang sudah jadi halaman statis untuk situs tertentu. Dengan menggunakan template ini, Anda dapat membuat situs web sederhana hanya dalam beberapa jam, dengan pengetahuan dasar tentang markup HTML. Di bagian HTML, Anda akan mendapatkan pengetahuan ini jika Anda menghabiskan beberapa jam lagi untuk belajar, dan jika Anda tidak meluangkan waktu di bagian CSS, Anda akan dapat sepenuhnya mengontrol desain templat situs HTML dan menyesuaikannya sepenuhnya untuk kebutuhan Anda.

Keuntungan lain yang tak terbantahkan dari templat situs web adalah bahwa dalam banyak kasus mereka ditulis oleh para profesional. Template situs profesional tidak hanya berarti indah dan desain modern, tetapi juga saat kode ditulis. Mesin pencari melihat bagaimana situs Anda ditulis, apakah kodenya dioptimalkan untuk SEO atau tidak, dan atas dasar ini mereka menurunkan atau meningkatkan posisi Anda dalam hasil pencarian. Oleh karena itu, situs yang baik seharusnya tidak hanya indah dan modern, yang penting, tetapi juga ditulis dengan baik dalam hal kode.

Unduh gratis Template HTML situs dan buat proyek Anda dalam waktu sesingkat mungkin.

Judul lengkap - Hyper Text Markup Language. Ini adalah bahasa markup hypertext yang banyak digunakan selama konstruksi halaman web dan dokumen. Perjalanan HTML dimulai di babak pertama 90an. Pada saat itu dia sangat primitif, tetapi sudah membantu membuat halaman sederhana untuk web. Sejak itu, bahasa terus berkembang, dan hari ini telah belajar banyak. Tanpa HTML, seperti yang biasa kita lakukan, situs web tidak akan ada. Hampir semua situs web menggunakan HTML sampai batas tertentu.

Standar saat ini adalah HTML5, yang dirilis secara resmi pada tahun 2014. Ini adalah standar revolusioner yang memungkinkan bahasa mencapai tingkat yang baru.

Inovasi dalam HTML5:

• Algoritme penguraian telah berubah selama pengembangan struktur DOM;
• Tag baru muncul, seperti audio, video, dan lainnya. Omong-omong, sekarang Anda dapat membuat pemutar web hanya dengan menggunakan HTML. Sebelumnya harus menggunakan Adobe Flash pemain;
• Mendefinisikan ulang bagian dari aturan dan semantik menggunakan elemen HTML.

Melihat secara global, HTML5 telah menjadi lebih dari versi berikutnya bahasa, tetapi platform yang lengkap untuk pengembangan aplikasi. Sebelumnya, kemampuannya terbatas pada membangun struktur, hari ini jauh lebih pintar. Dengan rilis standar, ruang lingkup bahasa telah sangat berkembang. Selain arah tradisional pengembangan web, ini digunakan untuk membuat program komputer pada Windows 8 dan yang lebih baru, serta untuk mengembangkan aplikasi untuk ponsel cerdas di semua platform populer.

Semuanya sampai pada fakta bahwa HTML5 mulai diterapkan di dua bidang utama:

• Sebagai versi terbaru dari bahasa HTML;
• Sebagai platform fungsional di mana Anda dapat membangun aplikasi web dengan berbagai kompleksitas. Benar, buat aplikasi lengkap pada HTML5 murni tidak akan berfungsi, JavaScript dan CSS3 masih digunakan untuk ini.

Siapa yang memodernisasi HTML5? Bahasa sedang dikerjakan oleh W3C atau nama lengkap - Konsorsium World Wide Web adalah organisasi internasional yang menjaga independensi dari pengembang tertentu. Ini juga menghasilkan spesifikasi, definisi, dan standar untuk HTML5. Spesifikasi asli dan lengkap tersedia di situs web resmi di tautan ( tersedia dalam bahasa Inggris). Organisasi belum menyelesaikan pekerjaan bahasa, sebaliknya, masih mengembangkannya.

Dukungan Peramban

Penting untuk dipahami bahwa spesifikasi HTML5 dan penerapan teknologi ini di browser tertentu adalah konsep yang berbeda. Banyak browser web dalam pengembangan aktif mulai mengimplementasikan fitur HTML5 secara perlahan bahkan sebelum rilis versi ini. Saat ini, browser terbaru mendukung semua fitur HTML5. Dukungan penuh diberikan oleh: Chrome, IE 11, Firefox, Edge, Opera. Versi yang relatif lebih lama tidak memiliki dukungan untuk standar yang lebih baru, seperti IE 8 dan di bawahnya. Dalam versi IE9 dan 10 standar telah dilaksanakan, tetapi hanya sebagian.

Seringkali browser umumnya bekerja dengan standar baru, tetapi menangani fitur secara berbeda atau hanya menimbulkan kesalahan. Karena itu, ketika mengembangkan lintas-browser, Anda harus memperhitungkan semua fitur browser. Ke saat ini dukungan standar dari browser web sudah pada tingkat yang baik.

Untuk memastikan bahwa versi browser saat ini mendukung HTML5, Anda dapat melakukan sedikit pengujian.

Apa yang Anda butuhkan untuk bekerja?

Apa yang berguna selama pengembangan di bawah HTML5? Alat kuncinya adalah editor teks, di mana kode untuk halaman web yang akan datang akan diketik. Salah satu editor yang paling populer dan serbaguna adalah Notepad++. Ini tersedia di situs web resmi benar-benar gratis. Selain distribusi gratis, ia juga memiliki semua fungsi yang diperlukan, memiliki banyak plugin yang berguna, menyoroti pembukaan dan penutupan tag.

Juga editor yang baik dengan dukungan mayoritas sistem operasi adalah Kode Visual Studio. Hal ini mampu berjalan di MacOS, Windows dan Linux. Menurut kemungkinan, ini perangkat lunak agak lebih unggul dari Notepad++.

Alat penting kedua adalah browser web, berguna untuk menguji kode. Peramban apa pun dari pengembang terkenal akan melakukannya. Jika Anda perlu membuat aplikasi lintas platform, Anda harus menginstal semua browser web populer di sistem.

atau belajar pelajaran HTML secara mandiri dan gratis

Apakah Anda ingin membuat situs web Anda di Internet? - Sangat baik! HTML pelajaran akan membantu Anda dalam hal ini.

HyperText Markup Language atau disingkat HTML- bahasa markup hypertext dokumen, produk konsorsium W3C - mendasari hampir semua halaman web yang ada, yang menempatkannya di tempat pertama dalam hierarki alat untuk membuat situs. Perhatian khusus harus diberikan untuk mempelajari pelajaran di bagian ini.

• Pelajaran HTML Ini adalah tutorial tentang cara membuat halaman web.
• Pelajaran HTML- langkah pertama menuju penguasaan pengembangan situs Internet.
• Pelajaran HTML dan pelajaran desain web adalah konsep yang sama sekali berbeda.

Baru, modern pelajaran HTML didesain khusus untuk pemula.

Sintaksis HTML cukup sederhana dan mudah dipahami, namun bukan berarti proses pembelajaran akan berjalan lancar dan tanpa kesalahan. Tidak perlu takut pada mereka - mereka tidak bisa dihindari. Membuat kesalahan, Anda mendapatkan informasi tentang bagaimana tidak bertindak di masa depan, informasi ini sepadan dengan usaha, waktu, dan karena itu sangat berharga. Ini adalah bagaimana pengetahuan dan pengalaman dikumpulkan.

Saat Anda membuat halaman pertama Anda, Anda akan menikmati pemikiran bahwa Anda menemukan dunia yang tidak Anda ketahui sebelumnya dan mungkin bahkan tidak tahu tentang keberadaannya - dunia kemungkinan lain - dunia Web.

Hati-hati! Anda mungkin menjadi kecanduan aktivitas baru.

Pelajaran HTML Baru | contoh kode HTML

Pertimbangkan elemennya:

Tag yang menentukan awal dan akhir dokumen.

bagian layanan. Berikut adalah perintah untuk browser, instruksi untuk robot pencarian, tautan ke file jarak jauh, skrip.

Tag yang menentukan judul utama dokumen.

Bagian ini berisi seluruh bagian halaman web yang terlihat.

Di browser kita akan melihat Hello World! :

Untuk belajar HTML Notepad diperlukan. Di dalamnya, kita akan mengetikkan kode secara manual. Mungkin itu saja ... Terlibat dalam interpretasi kode perangkat lunak untuk penjelajahan web, yaitu Internet Explorer, Firefox, Opera, Chrome, dan peramban lainnya.

Dalam pelajaran kursus ini akan disajikan HTML 5, XHTML dan penyertaan CSS. Kombinasi ini optimal untuk pembelajaran dan memungkinkan Anda untuk mempercepat pengembangan materi secara signifikan.

Saat ini, spesifikasinya sudah tersedia di situs resmi konsorsium W3C HTML 5. Pengembangan versi kelima dimulai pada tahun 2007, didasarkan pada XML dan pada kenyataannya, dilengkapi dengan elemen dan atribut baru, XHTML-makan. Versi kelima HTML menawarkan lebih banyak fungsionalitas dan menyederhanakan proses pembuatan situs interaktif dan aplikasi web. Di samping itu, HTML 5 berisi elemen tambahan yang menyediakan penempatan konten multimedia di dalam halaman web.

Baru HTML belum menerima status rekomendasi, dan tagnya, pada tahap ini, hanya dikenali oleh beberapa browser. Namun terlepas dari ini, pelajaran HTML 5 tersedia saat ini.

Post Scriptum: Internet terdiri dari halaman dalam jumlah tak terbatas yang dihubungkan oleh hyperlink melalui "Hypertext Transfer Protocol" - HyperText Transfer Protocol atau disingkat HTTP - protokol untuk mentransfer data dalam bentuk dokumen hypertext. Apa HTML? HTML - Hyper Text Markup Language atau dokumen bahasa markup hypertext.

Artikel ini tidak mengklaim sebagai panduan lengkap dalam bahasa markup dokumen HTML. Ini menjelaskan dasar-dasar HTML - prinsip dasar, konsep dan definisi teknologi ini, setelah menguasai yang mana, Anda dapat dengan mudah melanjutkan belajar coding HTML.

dingin

Sematkan

Untuk mempelajari pelajaran, unduh arsip dengan file yang diperlukan.

HTML adalah bahasa markup dokumen. Pengucapan yang benar - HTML.

Pernahkah Anda bekerja di editor dokumen Word atau sejenisnya? aplikasi kantor? Anda mungkin tahu itu spesies ini editor memiliki fitur yang kaya untuk mengedit teks, mengatur elemen, menyisipkan gambar, dll.

Mengapa, Anda bertanya, menulis dalam artikel tentang HTML tentang pengolah kata? Tapi kenapa. Jika Anda mengetahui apa itu editor kantor? Ini adalah aplikasi untuk mengedit dan menampilkan dokumen.

Kata kuncinya di sini adalah dokumen . Artinya, kami membuat, mengedit, dan melihat dokumen di beberapa program, di kasus ini- di editor kantor. Jika kita membuka dokumen seperti itu di editor teks sederhana, seperti Notepad, kita akan melihat banyak simbol dan tanda aneh. Kekacauan simbol ini tidak dapat dipahami oleh manusia, tetapi dapat dipahami oleh komputer. Berkat bahasa batin ini, dokumen kata mengambil struktur dan penampilan tertentu di editor itu sendiri, dan dokumen itu muncul di hadapan kita dengan segala kemuliaannya dengan teks dan gambar yang diformat sebagai gantinya.

HTML adalah bahasa markup untuk peramban. Word "ini adalah browsernya, dan dokumennya adalah halaman HTML. Ini adalah dasarnya teknologi HTML, pemahaman yang diperlukan agar tidak membingungkan bahasa markup dokumen web dengan bahasa pemrograman. Nama berbicara untuk dirinya sendiri menggunakan HTML kami menaikkan, di mana elemen, gambar, atau teks akan ditampilkan pada halaman, dan dalam urutan apa mereka akan muncul di samping satu sama lain.

Ya, pengetikan sederhana dan pemformatan teks di aplikasi perkantoran tidak ada hubungannya dengan pemrograman. Tapi pembaca yang jeli akan memperhatikan detail penting- dalam pengolah kata kita mengetik, mengedit dan memformat teks dan gambar menggunakan tombol visual dan menu, tapi mengapa kode HTML ditulis dengan tangan? Mengapa mempelajari begitu banyak detail teknis penulisan markup untuk dokumen?

Faktanya, ada banyak editor yang dapat digunakan untuk membuat dan mengedit halaman HTML dengan analogi dengan Word. Artinya, kode HTML sumber disembunyikan untuk kami dan kami tidak naik ke dalamnya.

Semacam Word untuk HTML. Seperti editor visual disebut:

WYSIWYG editor - W topi kamu ou S ee Saya s W topi kamu ou G et. Artinya, jika diterjemahkan ke dalam bahasa Rusia: apa yang kita lihat adalah apa yang kita dapatkan.

Saya menyebut mereka "orang gila". Meskipun ini tidak benar secara fonetis, ini dengan jelas menunjukkan kesia-siaan penemuan ini. Pemula sangat sering menggunakan editor semacam itu untuk membuat situs pertama mereka. Tentu saja, ini nyaman - tidak perlu mempelajari tag, gaya desain, dan lainnya, pada pandangan pertama, hal-hal yang tidak menyenangkan dan kompleks. Editor itu sendiri akan secara otomatis mengubah tindakan kita menjadi kode HTML.

Tapi, seperti yang mereka katakan, tidak ada yang terjadi begitu saja. Lebih khusus lagi, pendekatan ini memiliki kelemahan yang sangat serius. Apa yang mencegah semua orang berturut-turut menggunakan editor visual untuk mendesain halaman HTML? Faktanya adalah halaman yang dibentuk dengan cara ini biasanya memiliki banyak kode tambahan, banyak kesalahan dari sudut pandang semantik. Sekarang, tentu saja, tidak ada masalah dengan Internet berkecepatan tinggi koneksi dan perbedaan ukuran halaman 400 kb dan 100 kb tidak signifikan untuk kecepatan, namun, kode HTML yang dioptimalkan dan ditulis dengan benar menghilangkan banyak masalah dan memberikan banyak keuntungan, yaitu:

• Kode HTML yang kompeten memiliki efek positif pada Optimisasi Mesin Pencari, kecepatan perayapan situs oleh robot pencari. Kilobyte kode yang dihasilkan di sini tidak dapat diterima dan bahkan berbahaya;
• Kode HTML yang dihasilkan oleh editor WYSIWYG memiliki banyak kesalahan semantik. Artinya, tag yang dihasilkan oleh editor semacam itu digunakan untuk tujuan lain, di mana perlu untuk menggunakan, misalnya, daftar
  , editor akan membuat tag lain yang tidak kita perlukan. Itu tergantung, tentu saja, pada editor, tetapi di sini yang kami maksud adalah solusi kompleks untuk membuat situs, dan bukan pengeditan teks sederhana di area teks menggunakan alat WYSIWYG.
  • Banyak tag yang tidak perlu dihasilkan dan struktur dokumen membengkak. Katakanlah Anda memindahkan elemen dalam program seperti itu, pertama ke kanan, lalu ke kiri, lalu ke tengah - setiap tindakan meninggalkan jejak dalam kode HTML sumber. Editor adalah sebuah program dan dia tidak tahu persis apa yang ingin Anda dapatkan sebagai hasilnya, dia menghasilkan banyak kode, dengan mempertimbangkan semua pilihan perilaku dokumen di browser.
  • Sebagai aturan, editor untuk desain visual kode HTML dengan cepat menjadi usang. Dan karena kurangnya minat dari pihak profesional, mereka umumnya kehilangan dukungan dan berhenti dalam pengembangan. Dan HTML berkembang. Semuanya berkembang, kecuali vuzivugi. Oleh karena itu, mereka tidak dapat menghasilkan kode yang benar dan terkini, di mana fitur dan solusi baru akan dilibatkan.
  • Mendukung dan mengembangkan proyek semacam itu adalah hukuman surgawi. Tentang menggunakan pola dan penggunaan kembali tidak boleh ada kode bicara sama sekali.

  Jadi, kita akan menulis HTML hanya dengan pena. Alat yang memadai untuk pengeditan visual HTML belum ditemukan, dan sepertinya tidak akan muncul. Bahasa markup HTML mudah dipelajari dan dipahami, dan ada banyak alat otomatisasi untuk menulis kode HTML, tetapi lebih banyak tentang itu di pelajaran lain.

  Setelah mengutak-atik editor WYSIWYG sebentar, guru HTML muda meninggalkan tugas yang sia-sia ini dan melanjutkan.

  struktur dokumen HTML

  Saya sarankan mengunduh dan menginstal editor Sublime Text untuk kelas. Saya sangat tidak menyarankan menggunakan Notepad bawaan Windows untuk tata letak HTML jika Anda tidak ingin merusak jiwa Anda pada tahap awal belajar HTML.

  Kami memutuskan bahwa kami akan menulis kode dokumen HTML secara manual, yaitu mengeset. Tata letak HTML- proses membuat HTML dokumen. Di kalangan orang biasa dan kalangan berpengetahuan - tata letak saja. Setiap dokumen memiliki struktur dan aturan konstruksi tertentu. Elemen apa yang terdiri dari kode, apa struktur HTML?

  Mari kita buat template awal di komputer - file index.html, buka dengan editor dan rekatkan kode berikut ke dalamnya:

  Badan Dokumen Perhatikan bahwa dokumen HTML memiliki ekstensi .html.

  Jadi, dalam urutan dari contoh.

  - jenis dokumen (doctype)

  Konstruksi ini selalu ditunjukkan di awal dokumen agar browser "memahami" dengan benar yang versi HTML digunakan saat membuat dokumen.

  Karena fakta bahwa HTML terus berkembang, ia memiliki beberapa versi, seperti produk perangkat lunak lainnya. Versi sekarang HTML - kelima dan diberikan dalam contoh doctype terbaru.

  Pada prinsipnya, tidak ada gunanya mempelajari jenis dokumen, karena dengan dirilisnya HTML5, desain ini telah menjadi standar. Cukup tempel di awal dokumen setiap kali Anda mulai menyusun tata letak situs.

  - awal dokumen

  Tag pertama yang kita lihat setelah doctype adalah .

  tag HTML- unit struktural markup dokumen HTML. Kode HTML terdiri dari blok bangunan yang disebut tag. Setiap tag memiliki fungsinya sendiri, dan mempelajari bahasa markup HTML pada akhirnya adalah tentang mempelajari tag dan propertinya dalam dokumen.

  Saya ingin mencatat bahwa mempelajari HTML bukanlah tugas yang sulit seperti yang terlihat pada pandangan pertama. Mempelajari tag yang digunakan dalam markup dokumen bukanlah beban besar di otak.

  Jadi, markup dokumen dimulai dengan tag dan diakhiri dengan tag penutup. Setiap tag yang berisi tag atau elemen lain harus ditutup tag penutup. Sebagai contoh, , ,

  , dll.

  Menandai diperlukan karena berisi seluruh struktur dokumen dan membungkus elemen lainnya.

  Menandai

  Selanjutnya, kita lihat menandai , yang berisi elemen lain yang belum jelas bagi kami. Berisi elemen lain - ini berarti elemen atau tag berada di antara tag pembuka dan penutup konstruk:

  <тег>konten atau tag lainnya

  Menandai dirancang untuk menyimpan meta-informasi dari dokumen HTML, yaitu, informasi yang tidak ditampilkan dalam dokumen itu sendiri, tetapi penting dan sangat menentukan bagaimana dokumen akan terlihat dan berperilaku.
  Tag ini diperlukan dalam dokumen.

  Menandai

  tajuk