短视频时代不可忽视的幕后功臣竟然是它!

码界极光
• 阅读 13301

当我们在超市购物时,如果有第一次购买的商品,我们往往会在同类商品中选择包装更好看的那一款。这是因为从图片中获得的第一印象,影响了我们的潜意识,进而影响了我们的购买决定。在互联网上,制作精良、信息丰富的缩略图也会更容易引起大家的兴趣,就像商品包装一样。

这对于用户而言,缩略图可以看作是一个“预告片”,可以帮助用户预览内容,更快更方便地找到自己想看的东西。那要如何制作缩略图要呢?我们从了解缩略图开始讲起。

短视频时代不可忽视的幕后功臣竟然是它!

什么是缩略图?

缩略图(简称 “thumb”)是用作占位符的原始压缩预览图像,其中通常会包含指向完整大小的图片的超链接。缩略图通常用于在 Web 浏览器中更加迅速地载入图片较多的网页。因其小巧,加载速度非常快,故用于快速浏览。相当于图片视频文件的预览及目录的作用。根据平台的不同,缩略图分别有对应的尺寸,且尺寸并不统一:

  • 百度搜索中的图片:图片比例最好尽量符合121:75,有利于百度抓取。
  • B 站视频封面:B 站投稿视频封面的尺寸是不小于 1146 x 717 像素。
  • Google 的图片搜索:如果需要为 Google 的图片搜索创建桌面版缩略图,建议大小为 177 像素。也可以使用较小的缩略图。
  • YouTube:YouTube 上的桌面缩略图在起始页上的大小为 210 x 118 像素。属于常见的 16:9 图像格式。

为什么要使用缩略图?

与原始图像相比,缩略图的最大优点是减小了文件大小。如果网站的图像和视频内容优先通过缩略图的形式显示,网站的加载时间也会明显加快。用户可以通过缩略图来决定要查看哪些内容,然后通过点击缩略图去加载实际的原始图像或内容。这样既节省了流量,也增强了用户体验。

短视频时代不可忽视的幕后功臣竟然是它!

缩略图的小巧精致让网站设计者可以在不增加页面加载时间的情况下,立即为访问者提供大量的内容。其他优势还包括:

  • 节省空间:在同样面积的网页中,缩略图可以呈现出更多不同内容的概述。
  • 用户友好性:图像的巨大优势是可以非常直观地捕获信息;通过缩略图,用户可以快速浏览并找到自己想要的内容。
  • 交互性:通过点击缩略图增加用户与网站的互动。

网站的缩略图通常由搜索引擎、图像编辑程序及图像管理程序自动生成。对于移动端,缩略图的作用尤为突出。

什么时候使用缩略图?

缩略图在互联网上的任何地方都可以找到。例如视频网站,或一些图片搜索网站。电商网站还会使用缩略图在店铺页面上同时展示大量的商品。如果我们点击了某个商品,则会跳到新窗口并显示原始图像,以及产品的详细信息。

视频网站中的缩略图

视频网站上使用的缩略图必须在几秒钟内吸引观众的注意力并激励他们点击视频。视频网站上的观看次数很重要,因此缩略图起着重要作用。对于观看视频的用户来说,有吸引力的预览图片是获得点击次数、观看次数和增加订阅的最佳方式。

短视频时代不可忽视的幕后功臣竟然是它!

Google 图片搜索中的缩略图

谷歌在图像搜索中使用的是缩略图,而不是全尺寸的图像。这意味着用户可以同时看到大量不同的图像。通过单击其中一个缩略图,可以请求到更多信息。如果有需求,用户将被直接转发到源网页。

短视频时代不可忽视的幕后功臣竟然是它!

在线商店中的缩略图

在线商店中,缩略图用于在一个页面上显示多个产品,而不会降低加载速度。类别概览也经常以缩略图的形式显示。再次单击感兴趣的产品缩略图,打开产品的原始图像,从而可以查看有关产品的更多信息。

短视频时代不可忽视的幕后功臣竟然是它!

如何设计缩略图?

吸引用户点击视频或图像的频率通常取决于缩略图的设计。根据自身网站或产品的不同,创建缩略图时应注意不同的情况。与图片相比,视频的缩略图通常更复杂,一部分原因是由于视频传输的内容更多。而缩略图应与内容相匹配并能诱惑查看者点击。例如:

  • 应使用和内容主题相匹配且有意义的图片和颜色
  • 人脸是与观看者建立联系的一种简单方式
  • 使用动作镜头来吸引注意力
  • 如果内容不明显,可以为图片添加标题或关键字
  • 使用 Logo 等增加内容识别价值(品牌推广)

以下是精心设计的缩略图示例:

短视频时代不可忽视的幕后功臣竟然是它!

视频缩略图始终遵循相同的结构。预览图像清晰简单,并为观看者提供了有关视频的信息。图片来源:

另外,使用的缩略图要注意避免出现版权问题。同时为了防止被他人盗用,我们也可以在合适的位置添加水印,注明该图像的作者,或添加独特的 Logo。

又拍云图片处理

如果不会使用作图软件,有没有什么办法快速制作有水印又独特的缩略图呢?可以来试试又拍云图片处理功能,支持缩小、放大、裁剪、图片水印、文字水印、锐化、高斯模糊等 40+ 功能。同时还支持创建缩略图版本,可以搭配作图参数混合使用。

短视频时代不可忽视的幕后功臣竟然是它!

又拍云图片处理作图方式简单便捷,通过“图片 URL + 间隔标识符 + 参数或缩略图版本”在线处理,实时显示。另外,作为业界首家支持 WebP、动态 WebP 的厂商,解决多项 WebP 处理难题,图片瘦身平均可节省大小 70%。

推荐阅读

来试下不一样的图片加载方式

MySQL 中存储时间的最佳实践

点赞
收藏
评论区
推荐文章
blmius blmius
4年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
Wesley13 Wesley13
4年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
Jacquelyn38 Jacquelyn38
4年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Easter79 Easter79
4年前
Twitter的分布式自增ID算法snowflake (Java版)
概述分布式系统中,有一些需要使用全局唯一ID的场景,这种时候为了防止ID冲突可以使用36位的UUID,但是UUID有一些缺点,首先他相对比较长,另外UUID一般是无序的。有些时候我们希望能使用一种简单一些的ID,并且希望ID能够按照时间有序生成。而twitter的snowflake解决了这种需求,最初Twitter把存储系统从MySQL迁移
Wesley13 Wesley13
4年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
4年前
00:Java简单了解
浅谈Java之概述Java是SUN(StanfordUniversityNetwork),斯坦福大学网络公司)1995年推出的一门高级编程语言。Java是一种面向Internet的编程语言。随着Java技术在web方面的不断成熟,已经成为Web应用程序的首选开发语言。Java是简单易学,完全面向对象,安全可靠,与平台无关的编程语言。
Stella981 Stella981
4年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
暗箭伤人 暗箭伤人
2年前
【www.ithunter.club】 20230922下午
不容易的2023年,我们一起努力【www.ithunter.club】(2023092208:00:00.8872062023092216:00:00.887206)1.人事招聘专员数名(可选远程或入职)2.招聘向坐标东京Yahoo、Shift、L
Python进阶者 Python进阶者
2年前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这