互联网技术之一 Markup

5 篇文章 0 订阅
1 篇文章 0 订阅

● Markup (标记语言) 侧重于文本的结构和显示,适用于静态内容。
● Scheme Markup 在 Scheme 语言中是一种抽象化的数据或程序结构表示
schema markup渲染成果示例

Markup是什么

在技术领域,尤其是网页设计和搜索引擎优化(SEO)中,"Markup"通常指的是用来增强内容和结构标记(schema markup)的代码,以便搜索引擎更好地理解和显示网页内容。
具体地说,markup在编程中指标记语言,用来处理、定义和呈现文本。标记语言是一种使得文档内容和文档结构分离的方法,通过特定的标记符号来定义文本的布局、样式、链接等属性。常见的标记语言是 HTML 和 XML。
不同于传统的编程语言,标记语言不是用来编写程序,而是用来标记文档中的内容,以便由浏览器或其他解析软件呈现。通过标记语言,可以将文档分为不同的部分、定义各种元素、设定样式和布局,并为这些元素提供属性和值。这使得计算机可以根据这些标记语言的撰写方式和规则来正确地解释和呈现文档。

标记语言的历史

标记语言的发展始于1960年代,最早由查尔斯·戈德法布(Charles Goldfarb)发明的SGML(标准通用标记语言)开始。SGML作为一种非常通用的标记语言,奠定了后来HTML和XML等更专业标记语言的基础。
随着互联网的飞速发展,HTML很快成为了网络世界默认的内容呈现语言,而XML则因其出色的数据表示能力在各种数据交换场景中得到应用。

常见的Markup语言

● HTML(超文本标记语言),作为最广泛使用的标记语言之一,用于创建和设计网页内容。它包含了一系列的标签,这些标签可以告诉浏览器如何展示文本和图像等元素。
● XML(可扩展标记语言)更注重数据的存储和传输,其灵活性和扩展性使它成为多种应用程序和服务间交换数据的理想选择。
● Markdown是一种轻量级的Markup语言,用于简化排版和写作。它常用于撰写文档、博客和README文件。
● LaTeX是一种专业的Markup语言,主要用于科学、技术和数学领域的文档排版。它提供了丰富的数学公式和图表排版功能。

Markup测试

Markup测试通常指的是对HTML或XML文档中的标记(markup)进行验证和检查,以确保它们遵循相应的标准和规范。这种测试有助于确保网页或应用程序能够正确显示和交互。

Scheme Markup

Schema markup, sometimes referred to as structured data, is code you add to your webpages to help search engines better understand your content.

Schema markup is code you add to your webpage that tells a search engine what your content is about.

schema markup is a language that machines understand without any interpretation required.

Scheme Markup 一般指在 Scheme 编程语言中用于描述数据或文档结构的方式。Schema Markup是一种结构化数据标记语言,也被称为Schema.org或Schema,中文为结构标记代码。schema markup 是一种声明内容是什么、为谁服务、谁从所发布的内容中受益的方法。Scheme Markup的核心是效率。schema markup 传递一组键值对,使搜索引擎能够明确理解,无需解释和自然语言处理(NLP),用来如何定义和区分事物的。
schema.org由Google,Microsoft,Yahoo和Yandex等搜索引擎共同开发,其中包含了各种用于描述网站上各种内容的类别和属性,例如产品,组织,事件,文章等。这些结构化数据可以帮助搜索引擎更好地理解和组织信息,并在搜索结果中显示更富有信息和相关的结果。
schema markup可以用这些表示:JSON-LD code,Microdata,RDFa。

JSON-LD code 例子

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Article",
  "headline": "My First Article",
  "author": {
    "@type": "Person","name": "John Doe"
  },
  "datePublished": "2023-11-11",
  "image": "image.jpg"
}
</script>

Microdata 例子

“ < div >”表示“ Article”模式的范围
“ itemprom”属性标记标题、图像、作者和发布日期

<html>
<head>
  <title>My First Article</title>
</head>
<body>
  <div itemscope itemtype="http://schema.org/Article">
    <h1 itemprop="headline">My First Article</h1>
    <img itemprop="image" src="image.jpg" alt="featured image">
    <p>Written by: <span itemprop="author">John Doe</span></p>
    <p>Published on: <time itemprop="datePublished" datetime="2023-11-11">November 11, 2023</time></p>
  </div>
</body>
</html>

RDFa 例子

“ < div >”表示“ Article”模式的范围。
“ property”属性标记特定的属性,如标题、图像、作者和发布日期

<html>
<head>
  <title>My First Article</title>
</head>
<body>
  <div vocab="http://schema.org/" typeof="Article">
    <h1 property="headline">My First Article</h1>
    <img property="image" src="image.jpg" alt="featured image">
    <p>Written by: <span property="author" typeof="Person">John Doe</span></p>
    <p>Published on: <time property="datePublished" datetime="2023-11-11">November 11, 2023</time></p>
  </div>
</body>
</html>

schema markup的例子以及对实体的定义看这篇文章:Schema Markup 101: Boost Your SEO & Improve Search (backlinko.com)

补充:SEO

SEO指search engine optimization。简单来说,SEO就是提升你的网站,以便在人们搜索时提高它在谷歌、微软必应和其他搜索引擎上的可见度。
更多介绍见:What Is SEO - Search Engine Optimization? (searchengineland.com)

参考

https://worktile.com/kb/p/1983451
https://w1cyber.com.au/%E4%BB%80%E4%B9%88%E6%98%AFschema-markup/
https://www.semrush.com/blog/schema-markup/
结构化和非结构化数据 https://backlinko.com/schema-markup-guide
https://developers.google.com/search/docs/appearance/structured-data?hl=zh-cn
Technical SEO: The Definitive Guide [2024] (backlinko.com)
What Is SEO - Search Engine Optimization? (searchengineland.com)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值