什么样的横幅设计会让人忍不住点击？设计师加藤光辉为您解析

横幅广告的设计是最大化其广告效果的重要要素之一。当然，委托专业设计师能做出更好的作品，但对于设计并非本职工作的网店店主来说，自己制作横幅广告时需要注意哪些事项呢？

本次，我们采访了Web设计师加藤光（Katou Hikaru）先生，请他分享一些即使初学者也能实践、让人忍不住想点击的横幅广告设计技巧。

请介绍一下加藤光先生

他是总部位于福冈的Web设计事务所“kanvas”的Web设计师。迄今为止参与了100多个网站的制作项目，提供从设计到HTML/CSS编码、CMS集成的一站式服务。他是《让人忍不住想点击的横幅设计基础》一书的作者。自2022年起，他还主持在线课程“kanvas study plaza”，致力于通过逻辑学习设计感，在设计教育方面也投入了大量精力。

他以福冈为据点，作为自由职业Web设计师开展活动。此外，他还是Web制作公司“kanvas（Canvas）”的创始成员之一，该公司由少数精锐团队组成，为客户提供工作服务。

他的主要业务是为当地福冈的中小企业制作和更新企业网站，但受新冠疫情影响，线上委托也增加了，目前他也承接来自东京、名古屋、大阪等远方制作公司的案件。

除了Web制作外，他还致力于设计教育等领域，于2022年2月出版了首本著作《让人忍不住想点击的横幅设计基础》（Impress出版社）。同年4月起，他主持在线学校“kanvas study plaza”，以“逻辑性地学习设计感”为理念，向学员传授横幅设计的基础知识。

进入2023年后，他被选任为Adobe Express大使，最近开始在Adobe博客上为非设计师撰写文章。

横幅广告是什么？

横幅广告分为“广告用横幅（横幅广告）”和“网站横幅（跳转横幅）”两种，各自的作用不同。大致来说，广告用横幅的目的是将用户引导至自家网站，而网站横幅则主要旨在让用户在站内顺畅地跳转。

通常人们认为“横幅=广告”，因此本文将主要围绕广告用横幅的制作技巧进行讲解。

横幅是广告物料中设计较小的部分。即使尺寸小，若能设计出具有强吸引力的横幅，也能期待强大的广告效果。然而，横幅并非用户特意去查看的内容，而是在浏览SNS或网站时突然出现的，因此若缺乏能瞬间抓住观看者兴趣的吸引力，就无法获得点击，进而无法促成购买。

为了促使用户采取行动，必须在有限的空间内准确传达想要表达的信息。横幅设计需要让“限时折扣优惠”、“季节限定/数量限定，请立即申请”等吸引点一目了然，关键在于营造出让用户感受到“现在”购买该商品或服务之优势的氛围。

横幅设计与标题图等其它设计有所不同吗？

横幅本质上属于广告，因此其设计也需要具备广告价值。

另一方面，缩略图类似于YouTube视频或博客文章等高亮内容的摘要缩略图和描述，其目的是激发用户对点击进入后的内容的兴趣。

由于标题图并非广告，只要能让用户产生“想看视频”或“想读文章”的欲望，仅凭照片或插图也是可以的。

当然，如果将标题图设置为OGP（Open Graph Protocol），在SNS上更容易被分享，从而获得类似广告的效果，但这并不意味着创意必须做得像广告。这正是与横幅设计的不同之处。

让人忍不住点击的横幅设计技巧

例如，如果销售的商品是服装，什么样的横幅设计比较好呢？

事实上，横幅设计中最重要的要素是商品名称以及“打几折”、“仅限此时”等文字信息。关于字体设计的技巧稍后再讲。其次重要的是照片，使用聚焦于商品卖点的照片，能为横幅增添个性并大幅提升吸引力。

在使用照片制作服装类横幅时，拍摄技巧包括：对于穿着舒适的商品，可以拍摄实际穿着者包含皮肤在内的袖部特写，以传达触感良好、穿着舒适的印象；对于时尚风格的商品，则推荐全身场景照，以便让用户联想到自己穿着该服装外出的情景。

也就是说，能够一目了然传达特征的照片很重要。

列举一些非文字的设计技巧，如果是品牌影响力较高的商品，将品牌Logo放大并醒目地放置，更容易吸引用户的目光。

装饰元素的摆放也有技巧，虽然人们常因“正值樱花季”而撒满花瓣，但即便想体现季节感，也应尽量控制与商品无关的元素。如果主题是“新生活支持活动”，仅点缀少量樱花是可以的，但横幅的空间是有限的。

基本而言，请优先充分展示吸引点，包括简洁体现商品特色的照片、反映商品特性的文案以及如“复购率○%”等数据。

那么，如果销售的商品是食品，情况又如何呢？

食品横幅的制作思路与服装基本相同。如果是鱼沼产越光大米等知名产地的大米，可以将产地名称放大并配上大米照片。如果想通过肉类传达“便宜、量大、性价比高”的信息，配合能体现分量感的照片，并将“1公斤○日元”等价格信息醒目地展示出来，就更容易让用户产生“因为划算所以买一点吧”的想法。

此外，对于补充剂等健康食品，通过醒目且扎实地设计其特点和优势，可以提升吸引力，增加获得点击的可能性，例如说明摄入多少会有何种效果，或含有多少毫克的成分等。

横幅上记载的文本，最佳字数是多少？

主标题文案的字数，以一句约10个字为基准。由于广告用横幅最重要的是标题文案，请务必认真思考，力求简洁地表达商品的吸引点。

"50%OFF"或"赠送500积分"等数字往往是吸引点，因此插入数字时，将其设计为强调部分也是一个技巧。此外，若需添加作为辅助信息的说明文字，建议控制在20字左右，并将字号尽可能调小。

太长的话确实一眼看不完。在选择字体方面有什么技巧吗？

字体种类繁多，因此若非专业设计师，很难从中选出最佳的一款。对于非设计师的网店店主或运营人员来说，在制作横幅时若想挑选字体，可能会陷入漫长的寻找过程，最终决定往往需要耗费数小时。

推荐给新手的是，提前确定两三种喜欢的字体。只要确定了使用的字体，制作横幅时就不会迷茫。

选择字体时，一个技巧是挑选从细到粗大约有5个粗细等级（字重）可选的字体，以便根据诉求内容灵活调整文字粗细（字重）。对于高端商品，较细的字重显得更高级；若想表现实惠或气势，使用粗字重会更有效。

话虽如此，如果“根本不知道有哪些字体可用”，使用免费的Google Fonts或许也是个不错的选择。Google和Adobe开发的Google字体中有“Noto sans”和“Noto Serif”两种类型，它们分别以“源ノ角ゴシック”（源角黑体）和“源ノ角明朝”（源角明体）为基础，且提供了约5种字重，使用体验良好。

在字体选择上犹豫不决时，时间不知不觉就流逝了；纠结过多反而可能让人困惑不已。在设计文字时有什么要点吗？

当素材齐备进入实际制作横幅阶段时，请先用已确定的字体进行排版设计。完成后如果觉得“希望更有氛围”或“印象不够强烈”，可以尝试复制文本并仅改变字重。按此方法制作，应能减少在设计上的犹豫。

文字的粗细方面，通常较粗的字重会增加文字的占据面积，从而保证第一眼看到的可视性和可读性。然而，像Apple这样风格简约的品牌，如果在商品照片旁大幅放置粗体文字，反而会显得不够美观。

在这种情况下，使用细字重和小字号，能让商品外观的美感凸显，转变为精致的印象。文字固然重要，但并非简单地把文字放大即可，需要根据商品特性和吸引点进行相应调整。

推荐用于制作横幅广告的工具是什么？

平时使用什么工具来制作横幅？有推荐的工具吗？

大多使用自由度较高的Photoshop进行创作。不过，非设计师要熟练掌握Photoshop门槛稍高，因此推荐之前介绍的“Adobe Express”。

“Adobe Express”是一款任何人都能轻松制作横幅等内容的应用程序，其魅力在于可以从丰富的模板中自由选择，替换文字和图片，进行自由的二次创作。通俗地说，它就像是可以随意编辑的“Pinterest”。

在“Adobe Express”中，基本注册账号即可免费使用，包括图片素材在内，并允许商用。成为付费会员后，可以无限制地使用“Adobe Fonts”中的字体和“Adobe Stock”中的照片，更加便捷。它不仅支持PC端，也支持手机端，还会推荐字体，使用起来非常轻松。

如何验证横幅广告的效果？

应该如何进行横幅设计的效果测量呢？

横幅设计的效果可以通过A/B测试来验证。但是，付费工具的使用费较高，即使使用像“Google Optimize”这样的免费工具，对新手来说负担也可能较大。

在这种情况下，Twitter等熟悉的SNS活用也是一个方案。在不改变发布内容的前提下，准备一张以图片为主和一张以文字为主的版本，在同一时间点发布。通过观察哪一版的展示量增长更多等方式来进行判断。

顺便提一下，过去曾尝试在Google Display Network上投放多个横幅广告，以验证哪种反应更好。结果显示，创意本身的差异对效果的影响微乎其微，但“50% OFF”或“限时免费注册”等活动内容的不同，却导致了成果的巨大差异。

因此，仅靠创意的力量来提升销售额是非常困难的。不过，即便如此，如果未能将活动内容很好地融入设计中，诉求力就会减弱，所以请也要重视创意部分。

请介绍从今天开始就能实施的横幅设计技巧

如果读了这篇采访文章或相关书籍后，有人想“重新制作现有的横幅”，那么应该从哪里开始重新审视呢？

在横幅设计中，文字至关重要，因此建议从文字入手进行重新审视。由几乎没有设计经验的人制作的横幅，往往字体偏小，或者虽然粗细不同但字号却完全一致。然而，要提升吸引力，就需要有层次感（重点突出）。

在修改时，请提取出3到4个核心卖点，并大胆地将它们放大到原来的2到3倍左右。试着将文字大幅撑满整个宽度放置，你会意识到印象会有所不同，或者发现原素材中的文字太小了，从而看清许多问题。

此外，优先信息是否以大号字体显示也是检查要点之一。横幅设计通常以文字为主体、辅以图片进行布局，这样能提升吸引力；由于难以阅读的文字会被人迅速忽略，因此在制作横幅时，应对价格、日期、商品特点、品牌名等所纳入的内容设定优先级，力求打造让人一眼就能理解核心信息的版面。

面向BtoC和BtoB的横幅，其诉求要素会发生变化吗？

对于BtoC，观看横幅的人本身就是决策者，因此只要制作符合目标受众的内容即可。而对于BtoB，通常是经办人员查看后，经过公司内部审批流程才决定引入，这就产生了差异。

例如，如果用“您是否有这样的烦恼？”这种负面切入的方式制作，经办人员可能会觉得“这能解决我的烦恼，真想引入以提高工作效率”，但上级主管看到后可能会觉得“感觉阴暗，印象不好”。

在商务场合，第一印象尤为重要。因此，对于BtoB情况，为了不让任何人产生不良印象，用清爽、干净的表现方式来制作比较好。

放置在网店内的横幅，也可以用同样的思路来制作吗？

网店内的横幅大致可分为广告型横幅和导航型横幅。如果是广告型横幅，与之前讨论的内容几乎相同，所以可以用同样的思路来制作。

对于具有导航功能的横幅，保持整体统一感会更易于理解，因此建议在网站内统一横幅尺寸、文字排版方式及视觉风格等元素。

最后，向正在挑战横幅设计的初学者们说一些建议或鼓励的话。

在构思“设计”时，人们容易陷入对装饰和排版的思考，但作为广告而言，“文字信息”才是关键。首先要确保文字清晰可读，并在字号上做出层次区分，通过巧妙设计让吸引点得以传达，这一点至关重要。

让我们打造出充满魅力的横幅设计，让各位所经营商品的特色传达给更多的人！