首页 > 其他分享 >HTML元素的head、title

HTML元素的head、title

时间:2024-08-31 18:23:51浏览次数:11  
标签:head 包含 title 元素 示例 标题 HTML 文档 页面

<head>

Html文档的头部,包含机器可读的文档相关信息,如文档的标题脚本样式表

<head> 主要保存供机器处理的信息,而非人类可读信息。对于人类可见的信息,如顶级标题和列出的作者,请参见 <header> 元素。

示例1:

<!doctype html>

<html lang="zh-CN">

  <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width" />

    <title>文档标题</title>

  </head>

</html>

 

可用于head元素内部的元素:

<title>

<title> 元素 定义文档的标题,显示在浏览器的标题栏或标签页上。它只应该包含文本,若是包含有标签,则它包含的任何标签都将被忽略。

示例:

<title>这里写标题</title>

 

注意:只能放在<head>元素中使用,一个 <head> 元素只能包含一个 <title> 元素。

页面标题和SEO

页面标题的内容可能对搜索引擎优化(SEO)具有重要意义。通常,较长的描述性标题要比简短或一般性标题更好。标题的内容是搜索引擎算法用来确定在搜索结果中列出页面顺序的组件之一。同样,标题是初始的“挂钩”,你可以通过它吸引浏览浏览结果页面的读者的注意力。

撰写好标题的一些准则和技巧:

·        避免使用一两个单词的标题。对于词汇表或参考样式的页面,请使用描述性短语或术语 - 定义对。

·        搜索引擎通常显示页面标题的前 55 至 60 个字符。超出此范围的文本可能会丢失,因此请尽量不要使标题更长。如果你必须使用较长的标题,请确保重要的部分出现在前面,并且标题中可能要删除的部分中没有关键内容。

·        不要使用“关键字集合”。如果标题只是单词列表,则算法通常会降低页面在搜索结果中的位置。

·        尝试确保你的标题在你自己的网站中尽可能唯一。标题重复(或几乎重复)可能会导致搜索结果不准确。

 

示例2:

<title>菜单 – 海底捞火锅 - FoodYum:今日可送达的在线外卖!</title>

 

标签:head,包含,title,元素,示例,标题,HTML,文档,页面
From: https://blog.51cto.com/u_16830897/11883499

相关文章

  • HTML5新特性速查手册:新增标签与属性一览
    前言:网页的相关概念:网址:我们在浏览器中输入的地址。网页:浏览器所呈现的每一个页面。网站:多个网页构成了一个网站。网页的标准:结构:HTML表现:CSS行为:JavaScript一、什么是HTML?HTML(是HyperTextMarkupLanguage的缩写)中文译名:超文本标记语言。各部分理解:......
  • 在HTML中Form标签中常用的属性
    一.target属性:窗口的打开方式    1._self:在原窗口打开<div><ahref="https://www.baidu.com/"target="_self">点击跳转到百度</a></div>这是它运行的结果:点击图中的文字就会实现跳转并在原窗口打开 2. _blank:打开一个新的窗口<div>......
  • 【React】React事件和HTML事件的区别
    React写法<buttononClick={handleClick}>测试</button>HTML写法<buttononclick="handleClick()">测试</button>区别ReactHTML原生事件绑定方式小驼峰命名法,事件处理函数通过JSX语法直接绑定全小写形式定义事件处理函数函数引用内联的字符串表达式事件对象基于Ev......
  • vue使用html2canvas将页面dom生成图片,解决页面中带有图片导出
    安装npm installhtml2canvas引入importhtml2canvas from 'html2canvas'使用this.$refs.canvasToPic是div的dom,只要在这个div中的区域都可以生成图片1this.$nextTick(()=>{2html2canvas(this.$refs.canvasToPic,{useCORS:true,logging:true}).......
  • html之form标签的四大护法
    form表单下面的标签记住下面这几个就可以了,常用的也就这么多。1.input--用户名输入框<inputtype="text"name="username"placeholder="用户名">--密码输入框<inputtype="password"name="password"placeholder="密码">--复选框<in......
  • 【ajax】 html js jquery ajax上传文件【一眼就会】【实用】
    先看效果:代码:<formid="fileUpload"action=""method="post"enctype="multipart/form-data"><inputtype="file"name="file"id="file"><buttontype="submit"......
  • html之select标签
    1.select标签用于做下拉选择框2.select元素中的option标签定义了列表中的可用选项3.selected表示默认,一般用在option标签里Select对象属性属性描述W3Cdisabled设置或返回是否应禁用下拉列表Yesform返回对包含下拉列表的表单的引用Yeslength返回下拉......
  • 在线人民币大小写转换工具html代码
    该工具旨在帮助用户方便地将人民币金额从小写转换为大写,只需输入金额,点击转换按钮,即可快速获得准确的大写表示。工具界面简洁友好,支持输入各种格式的大写金额,如“1356.78元”。经常报账的小伙伴可以用到,减少手动转换的错误。点击查看代码<!DOCTYPEhtml><htmllang="zh-CN">......
  • gyp GET https://nodejs.org/download/release/v20.15.0/node-v20.15.0-headers.tar.g
    如图我执行yarn关于node会报错:gyphttpGEThttps://nodejs.org/download/release/v20.15.0/node-v20.15.0-headers.tar.gzgyphttpfetchGEThttps://nodejs.org/download/release/v20.15.0/node-v20.15.0-headers.tar.gzattempt1failedwithETIMEDOUTgypWARNins......
  • Day50.head内常用标签
    1.head内常用标签_titile标签_style标签_body标签用法2.head内常用标签_script标签内用来写js代码3.head内常用标签_script标签导入其他js文件显示4.head内常用标签_link标签导入其他css文件显示5.head内常用标签_meta标签定义两秒后跳转到指定标签6.head内常用标签_告诉IE以最......