Basic Web Page

HTML Introduction

HTML is the standard markup language for creating Web pages.

What is HTML?

• HTML stands for Hyper Text Markup Language
• HTML is the standard markup language for creating Web pages
• HTML describes the structure of a Web page
• HTML consists of a series of elements
• HTML elements tell the browser how to display the content
• HTML elements label pieces of content such as «this is a heading», «this is a paragraph», «this is a link», etc.

A Simple HTML Document

Example

My First Heading

My first paragraph.

Example Explained

• The declaration defines that this document is an HTML5 document
• The element is the root element of an HTML page
• The element contains meta information about the HTML page
• The element specifies a title for the HTML page (which is shown in the browser’s title bar or in the page’s tab)
• The element defines the document’s body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
• The element defines a large heading
• The

  element defines a paragraph

What is an HTML Element?

An HTML element is defined by a start tag, some content, and an end tag:

The HTML element is everything from the start tag to the end tag:

Note: Some HTML elements have no content (like the
element). These elements are called empty elements. Empty elements do not have an end tag!

Web Browsers

The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them correctly.

A browser does not display the HTML tags, but uses them to determine how to display the document:

HTML Page Structure

Below is a visualization of an HTML page structure:

This is a heading

This is another paragraph.

Note: The content inside the section will be displayed in a browser. The content inside the element will be shown in the browser’s title bar or in the page’s tab.

HTML History

Since the early days of the World Wide Web, there have been many versions of HTML:

Year	Version
1989	Tim Berners-Lee invented www
1991	Tim Berners-Lee invented HTML
1993	Dave Raggett drafted HTML+
1995	HTML Working Group defined HTML 2.0
1997	W3C Recommendation: HTML 3.2
1999	W3C Recommendation: HTML 4.01
2000	W3C Recommendation: XHTML 1.0
2008	WHATWG HTML5 First Public Draft
2012	WHATWG HTML5 Living Standard
2014	W3C Recommendation: HTML5
2016	W3C Candidate Recommendation: HTML 5.1
2017	W3C Recommendation: HTML5.1 2nd Edition
2017	W3C Recommendation: HTML5.2

This tutorial follows the latest HTML5 standard.

Источник

Изучение HTML: руководства и уроки

Чтобы создавать веб-сайты, вы должны знать о HTML — фундаментальной технологии, которая используется для определения структуры веб-страницы. HTML применяется для того, чтобы определить как должен отображаться ваш контент: в виде абзаца, списка, заголовка, ссылки, изображения, мультимедийного проигрывателя, формы или же в виде одного из множества других доступных элементов, а также возможного нового элемента, который вы сами создадите.

Путь обучения (образовательная траектория)

В идеале вы должны начать своё учебное путешествие с изучения HTML. Начните с прочтения раздела «Введение в HTML». Затем вы можете перейти к изучению более продвинутых тем, таких как:

• «CSS (Каскадные таблицы стилей)», и как их использовать для оформления (стилизации) HTML-документа (например, изменение шрифта и его размера, добавление границы и теней для элементов, разбиение страницы на несколько столбцов, добавление анимации и других визуальных эффектов).
• «JavaScript», и как его использовать для придания динамической функциональности веб-страницам (например, определение вашего местоположения и отображение его на карте, создание элементов, которые будут появляться/исчезать при нажатии на кнопку, сохранение данных пользователей локально на их компьютерах и многое другое).

Прежде чем приступить к этой теме, вы должны иметь хотя бы базовое представление об использовании компьютеров вообще и уметь «пассивно» использовать Интернет (т.е. уметь просматривать веб-страницы, быть потребителем контента). У вас должна быть базовая рабочая среда, описанная в разделе «Установка базового программного обеспечения», а также вы должны понимать, как создавать файлы и управлять ими, что подробно описано в разделе «Работа с файлами» — обе статьи являются частью нашего модуля для новичков — «Начало работы с вебом».

Перед тем, как начать эту тему, рекомендуется пройтись по разделу «Начало работы с вебом», однако это необязательно; многое из того, что описано в статье «Основы HTML», также рассматривается и во «Введении в HTML», причём даже более подробно.

Модули

Данный раздел содержит модули, которые расположены в порядке, наиболее оптимальном для их изучения. Вам определённо следует начать с первого модуля.

Этот модуль даёт основу, которая позволит вам использовать важные понятия и синтаксис, вы рассмотрите применение HTML к тексту, узнаете как создать гиперссылки и как использовать HTML для структурирования веб-страницы.

В этом модуле рассматривается использование HTML для подключения мультимедиа-контента к вашим веб-страницам, включая различные способы встраивания изображений, видео и аудио и даже других веб-страниц.

Представление табличных данных на веб-странице в понятном, доступном образе, может стать проблемой. Этот модуль описывает основы табличной разметки, а также более сложные функции, такие как реализация подписок и резюме.

Формы — очень важная часть интернета, они обеспечивают большую часть функциональных возможностей, необходимых для взаимодействия с веб-сайтом, например, регистрация и вход в систему, отправка отзывов, покупка продуктов и многое другое. В этом модуле вы начнёте с создания частей форм на стороне клиента.

Решение общих HTML задач

Использование HTML для решения общих задач содержит ссылки на разделы контента, объясняющего, как использовать HTML для решения очень распространённых проблем при создании веб-страницы: работа с заголовками, добавление изображений или видео, выделение содержимого, создание базовой формы и т.д.

Смотрите также

Отправная точка HTML документации на MDN, там вы сможете найти как подробное описание основных элементов и их атрибутов, так и более продвинутые уроки по языку, это отличное место для старта.

Found a content problem with this page?

This page was last modified on 15 июл. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Источник

HTML Tutorial

In this HTML tutorial, whether you’re a beginner or a professional, this tutorial covers everything you need to know to learn HTML, from the basics to advanced. Providing step-by-step instructions for easy learning, it will help you become proficient in HTML.

HTML stands for HyperText Markup Language. It is used to design the web pages. With the help of HTML, you can create a complete website structure. HTML is the combination of Hypertext and Markup language. Hypertext defines the link between the web pages and markup language defines the text document within the tag that define the structure of web pages.

Why HTML is used?

HTML is used to create the structure of web pages and website that are displayed on the Internet. HTML basically contains Tags and Attributes that are used to design the web pages. Also, we can link multiple pages using Hyperlinks.

HTML Basic Structure of Web Page

The basic structure of an HTML page is laid out below. It contains the essential building-block elements (i.e. doctype declaration, HTML, head, title, and body elements) upon which all web pages are created.

HTML Basic Tags

Example: This is the basic example of HTML that display the heading and paragraph content.

HTML

         
Welcome to GeeksforGeeks
 
A computer science portal for geeks
   

Complete References

HTML Interview Questions

HTML Practice Quiz Sets

HTML Cheat Sheet

HTML Cheat Sheet is a simple, and quick reference list of basic HTML elements and attributes. The purpose of this Cheat Sheet is to provide you with some quick accurate ready-to-use code snippets and necessary HTML tags and attributes.

HTML Examples

HTML examples contains a wide collection of HTML programming examples. The HTML examples are categorized based on the topics including hyperlinks, forms, tables, frames, and many more.

Learn more about HTML

• Introduction
• HTML5 Introduction
• HTML Hex Color Codes
• HTML Charsets
• HTML URL Encoding
• Most commonly used HTML tags
• Structure of HTML Document
• HTML Form Design
• Design your First Website in Just 1 Week
• Simple Portfolio Website Design
• Design a Portfolio Gallery
• Design a web page
• Top 10 Projects For Beginners
• 10 Best HTML Coding Practices You Must Know
• Design a Login Form to an Image using HTML and CSS

Источник