HTML：它是什么，它对网络有多重要。
- 王林原创
- 2024-08-15 06:02:321013浏览
当您进入新闻网站、社交网络、银行系统等时，我们在屏幕上提供了几个支持用户交互的元素。
但是你有没有停下来思考过这一切是如何建造的？
负责构建网站的专业人员之一是前端开发人员，他使用Figma将UX/UI设计团队制作的布局转换为代码。
从技术上讲，构建网站是通过多种技术完成的，其中之一就是 HTML。
在本文中，您将了解 HTML 是什么、它的用途以及如何使用它。
什么是 HTML？
由于它是一种用于开发网站的技术，因此人们通常认为我们是用 HTML 进行编程的。需要注意的是，HTML 不是一种编程语言，而是一种标记语言。
编程语言用于创建算法、操作变量和数据结构。 HTML 是超文本标记语言的英文缩写，用于构建和格式化网页内容。
为了能够使用此技术构建项目，您需要一个格式为“.html”的文件，以便您可以在浏览器中打开它，浏览器将解释源代码以在屏幕上显示元素。
HTML 文件剖析
HTML 文件的结构可以解释为一棵树。
我们有根，即元素，从那里我们可以声明可以解释为子元素的新元素（就像分支），因此也可以创建父元素。此外，共享同一行原点的元素可以称为兄弟元素。
HTML 元素的剖析
HTML 元素的结构是通过打开尖括号包围的标签来构造的。
例如段落标签
后面是要显示的内容，最后由一个与开始标签相同的标签关闭，但在元素名称之前有一个斜杠：
。最终结果是这样的：
例如
e388a4556c0f65e1904146cc1a846bee O nome do meu cão é Retovem. 94b3e26ee717c64999d7867364b1b4a3
我们可以用 HTML 创建什么？
使用 HTML，我们可以创建各种元素来构建具有您选择的主题的网页：博客、在线商店、新闻页面等。
我们可以创建的一些主要元素是：
- 标题和段落
- 链接和按钮
- 图片
- 列表和表格
- 表格
- 视频和音频
这种标记语言为我们提供了广泛的资源，这里只提到了其中的一小部分，可以根据项目的需要来使用。
HTML 的演变
Tim Berners-Lee 在 CERN（欧洲核研究组织）使用 NeXTSTEP 开发环境开发了 HTML。最初，它是一组用于管理搜索和之间通信的工具。
随着互联网的发展，该解决方案获得了全世界的关注。第一个版本很灵活，这有助于该领域的初学者。
随着时间的推移，结构变得更加严格，但即使在今天，浏览器也可以通过向后兼容性解释以旧方式创建的网页。
该规范是在 20 世纪 90 年代定义的，然后 HTML 开始发展，创建了一个 HTML 工作组，并于 1995 年发布了 HTML 2.0 版本。
1997年底，HTML 3.5版本发布，随之W3C工作组在2000年开始重点关注XHTML的开发，终于到了2014年，HTML发布了，一直使用到今天。
我们看到 HTML 的多个版本被发布，直到我们今天使用的版本，但是 HTML 和 HTML5 之间有什么区别？
HTML 和 HTML5 之间的差异
在旧版本中，内容结构主要由通用元素完成，例如
和 .在 HTML5 中，我们有语义标签来引用元素的用途，包括页眉、页脚、分隔部分等。
此外，今天有了 HTML5，我们对音频有了原生支持，我们可以将它们直接嵌入到页面上。
表单还可以涵盖该版本中更多类型的字段：我们现在提供电子邮件、号码、日期和规范字段，可以对元素生成本机验证。
但是，重要的是要知道 HTML 是静态版本。时至今日它仍在开发和改进中，不时添加功能和功能。
HTML vs XML: Quais são suas diferenças?
Tanto o XML (Extensible Markup Language) quanto o HTML são linguagens de marcação utilizadas na web, mas apesar disso, possuem propósitos e estrutura diferentes.
O XML é projetado para representar informações hierárquicas e legíveis para humanos e máquinas. Não se preocupa com a apresentação visual e não possui estrutura pré-definida. Em vez disso, descreve a estrutura dos dados de forma consistente e portátil.
No Brasil, é o formato mais utilizado na emissão de notas fiscais.
O HTML, é usado para criar e exibir conteúdo em páginas web, é limitado devido à sua estrutura e elementos pré-definidos, focando na apresentação visual e exibição dos elementos no navegador. Ele é comumente utilizado na construção de sites.
Podemos considerar que as principais diferenças são: enquanto o XML é usado para armazenar e transportar dados, o HTML é utilizado para criar páginas web com conteúdo formatado e que possibilita a interação.
Como funciona o HTML?
Como falamos anteriormente, o HTML é utilizado para estruturar e formatar o conteúdo de páginas web através de tags, que são interpretadas pelo navegador.
Para que seja possível essa interpretação, é importante declarar qual a versão do HTML será usada.
Essa declaração é feita através do 8b05045a5be5764f313ed5b9168a17e6, garantindo que o navegador interprete corretamente o código.
É importante observar que isso não é uma tag HTML, e sim uma instrução para o navegador que deve ser colocada no início do documento sem espaços entre ela.
Dom
A representação estruturada do conteúdo HTML de uma página web é feita através do DOM (Document Object Modal), que é uma interface de programação que permite o acesso e manipulação dos elementos.
É o DOM que faz a estruturação em forma de árvore dos elementos, em que cada um deles é representado por um nó organizado hierarquicamente de acordo com a estrutura do documento.
Podemos analisar um exemplo de código em HTML para a exibição de uma frase na tela:
<span class="cp"><!DOCTYPE html>
<html>
<head>
<title>Aprendendo HTML</title>
</head>
<body>
<h1>Olá, mundo!</h1>
<p>Este é o meu primeiro projeto HTML</p>
</body>
</html>
A estrutura do DOM seria a seguinte:
- : É o elemento raiz da página, de maneira hierárquica, está acima de todos.
- : Se refere à “cabeça” da página, onde é possível inserir configurações que auxiliam na renderização, assim como o título da página. Ele está dentro do elemento , portanto ele é um elemento filho dele.
- : Define o título da página, aquele que ficará visível na aba do navegador. É uma ramificação do , sendo um elemento filho.
- : É o “corpo” da página, onde serão inseridos os elementos visuais que deverão aparecer, como os textos. Ele também está hierarquicamente inserido dentro do , portanto, é filho dele.
: Refere-se ao título principal que ficará visível no corpo da página. Como está dentro do , consequentemente pode ser considerado como filho.
-
: Constrói um parágrafo de texto de acordo com o conteúdo inserido dentro dele. Também está dentro do body, portanto é filho dele e irmão do
Assim, podemos visualizar que o DOM é uma representação em forma de árvore do conteúdo inserido no HTML e que, ao criar um nó para cada elemento, permite que eles sejam acessados por meio do JavaScript.
HTML semântico
O HTML semântico é uma abordagem no desenvolvimento web que enfatiza o uso correto e significativo dos elementos, escolhendo aqueles que melhor descrevem o conteúdo que está sendo apresentado.
Em vez de usar uma
genérico para todo o conteúdo, podemos usar elementos mais específicos, como , , , , , , entre outros, de acordo com a estrutura e a natureza do conteúdo. isso é utilizado para melhorar o SEO ( Search Engine Optimization).Uma das principais características dessas abordagem é a importância dos cabeçalhos, que são representados pelos elementos
a , sendo essenciais para indicar a hierarquia do conteúdo.
Os sites de pesquisas dão importância aos cabeçalhos, por isso é um ponto de foco.
O texto alternativo em imagens é crucial tanto para a acessibilidade quanto para o SEO. Tendo o cuidado de inserir o atributo “alt” nas tags de imagem, fornecendo um texto descritivo, isso permite que leitores de tela leiam o texto e que sites de pesquisas considerem esse texto ao classificar as páginas.
仍然考虑语义上下文中的文本，重要的是使用描述性链接而不是通用链接。例如，不要构建“单击此处”链接，而是编写使该链接的目的地清晰可见的文本。
通过应用这些实践，您可以创建对搜索引擎（例如 Google）友好且所有用户都可以访问的页面。结果是：
- 更好的用户体验
- 扩大受众范围
- 包含更多网页。
HTML、CSS 和 JavaScript 之间有什么关系？
前端开发人员在开发网站时会使用各种技术，但无论使用框架还是库，基础始终是相同的：HTML、CSS 和 JavaScript。
正如我们在本文中看到的，HTML 是一种用于构建和组织页面内容的标记语言。但仅使用 HTML 无法设置元素样式或构建复杂的交互。
就像建筑物的结构一样，提供墙壁、门和窗户。但是 HTML 语言和 CSS 语言有什么区别呢？
HTML 和 CSS 之间的区别
与 HTML 不同，CSS（层叠样式表）是一种样式语言，定义网页上 HTML 元素的外观和布局。
有了它，我们可以在元素上放置颜色、字体、边距、大小、位置和其他属性。
就像对建筑物进行粉刷、装饰和室内设计一样，使其美观、令人赏心悦目。
HTML 用于哪些领域？
虽然HTML一般用于Web开发领域，但也可以在其他编程领域使用它，例如：
- 电子邮件营销的发展
- 移动开发
- 在游戏开发中
- 桌面应用程序开发
需要注意的是，HTML 通常与其他技术（例如 CSS 和 JavaScript）相结合，以创建这些和其他体验。
结论
在本文中，您了解了 HTML、它的历史、它的工作原理以及如何通过标签和元素使用它。除了了解 HTML 可以应用在哪里以及 HTML、CSS 和 JavaScript 之间的关系。
HTML 是一种标记语言，而不是一种编程语言。它用于创建元素和构建网页。它是前端开发人员使用的技术，通常与 CSS 和 JavaScript 结合使用。
如果您喜欢本内容，请在评论中留下您的意见，分享出去，让更多人看到并喜欢。
再见！
以上是HTML：它是什么，它对网络有多重要。的详细内容。更多信息请关注PHP中文网其他相关文章！