汕头做网站：如何将社交媒体融入移动网页设计

社交媒体是当今流行的社交和沟通形式的原因有很多。对于初学者来说，它让我们有机会与现场社区允许的人数成倍增长（这对消费者和企业来说都很棒）。它还鼓励采用简洁和视觉叙事规则的新型沟通方式。

那么，为什么我们不在移动网页设计中使用更多类似社交媒体的功能呢？

要明确的是，我并不是指我们已经在网站上看到的各种社交媒体元素，例如：

• 社交登录

• 社会跟随图标

• 社会分享图标

• 社交馈送

• <li.instagram galleries

• <="" li="" style="box-sizing: border-box;">

• YouTube嵌入

• 可画图像。

我正在谈论从我们与其他人交谈的缩写方式中汲取灵感。毕竟，移动网站，PWA和原生应用程序给我们提供了很少的空间来讲述故事并让观众参与其中。采用社交媒体设计将有助于在移动屏幕上快速传达我们的信息。

汕头做网站特别是这些元素值得您在移动设计工作中探索。

1.使用通知符号将访客引导至行动

你没有太多的空间或时间在手机上浪费，所以为什么要说明你希望访客采取什么样的行动呢？我们在社交媒体上使用的许多符号可以很容易地用于移动网站。

一个这样的符号是通知自动收报机，很像我们习惯在社交媒体应用程序的页眉或页脚中看到的那些，当我们需要了解消息或提醒时。就像在Facebook底部栏中找到的蓝色一样：

有时，红牛网站会在其汉堡包菜单图标上放置一个类似的红色自动收报机（虽然这个闪烁着）：

此闪烁通知与提醒我帐户活动无关（因为我没有登录网站）。但是，它确实吸引我的注意力先于导航。

如果您希望访问者在网站的导航或标题中看到相关内容，则通知图标是快速吸引他们注意力的好方法。它不一定是Facebook或红牛处理它的彩色圆点。您还可以使用数字计数器，例如当物品放在购物车中或收件箱中的电子邮件时出现的数字计数器。

2.使用Hashtags和Handles提升品牌

我们在社交媒体上互相交谈的方式非常独特。不仅许多人使用首字母缩略词来截断他们在很小的空间内说了多少，而且我们还采用了一种更快捷的方式将消息传递给目标用户。

举个例子来说，这个消息我已经写在微博约后亚德Joubran最近写的PWA。

现在，我可以保留我的信息，并希望Jad可以提及或者有兴趣学习如何构建PWA的人找到它。但是社交媒体上的噪音太大了，这就是为什么使用句柄（@）和＃标签符号有助于在正确的人面前传递我们的信息：

看一下上面的消息并注意差异。首先，我在#pwa和#progressivewebapp的帖子中包含了主题标签。这样，如果有人对相关主题感兴趣，现在找到这篇文章会更容易。

另外，我已经标记了Jad。这样，他会看到我的喊叫声。我也标记了Smashing Magazine，因为那是该文章出现的杂志。这对他们有好处，因为它会提高品牌的知名度，同时帮助遇到帖子的人在#pwa和@smashingmag之间建立直接联系。

该井号标签和手柄已经成为我们如何沟通这样一种与生俱来的一部分在网上，我很惊讶，更多的品牌没有在其网站上使用它们。我不是在谈论在页面上列出社交媒体句柄。我的意思是实际上在其设计中集成了品牌主题标签或句柄，就像eos在这里所做的那样：

几年前，我看到更多的标签和句柄被整合到网页设计中。今天，我看不太多。

我的猜测是，设计师已经不再将句柄和主题标签放入设计中，因为访问者无法轻易复制或点击并对其进行任何操作。但是，在移动设备上将品牌句柄和主题标签放入您的设计中是有价值的。

将其视为品牌形象的水印。就像上面的例子一样，人们不会只是想着这个“鸡蛋”看起来有多酷。他们也会注意到与它垂直的标签。对于那些正在成为忠诚的eos客户的人来说，这个标签会坚持下去。

3.将信任标记添加到设计中

某些社交媒体平台为品牌和公众人物提供了验证其身份的能力。这样，任何想要关注他们的人都会知道配置文件另一端的人实际上是谁（而不是，例如，机器人或冒充他们的人）。

Twitter和Instagram等平台不是在这些配置文件上打上“已验证的配置文件”标签，而是使用一个微小的符号，让人们知道可以相信用户就是他们所说的人。它的用户名旁边是一个小蓝色复选标记。

网站上已经使用了信任标记，以便让访问者知道网站何时足够安全，可以通过互联网进行购买。但是，它们通常采用Norton Security等大型安全提供商徽标的形式，在签出之前建立消费者信任。

相反，您应该找到利用较小信任标记的方法来加强整个体验中的信任。以下是丝芙兰为其商店做的事情：

上面的屏幕截图中有两个信任标记。

GlamGlow产品上印有红白图章，上面写着“Allure读者选择奖得主”。您已经知道有多少人信任其他消费者的评论和建议，因此您可以想象这种符号的作用是激发他们的兴趣并建立对产品的信任。

Farmacy产品上印有绿白图章，上面写着“Sephora清洁”。这是一个标签丝芙兰贴在任何没有可疑成分的产品上。对于那些对产品来自哪里以及产品来自哪些产品充满了意识的客户，这个符号会很快将他们的注意力转移到他们正在寻找的产品上。

4.带有奇异的难忘形象

当您滚动浏览社交媒体Feed时，您不太可能在帖子后发布附加图片库的帖子。除非，也就是说，有人只是去度假，他们想炫耀他们所做的或看到的一切。

通常，您遇到的大多数社交媒体帖子都保持简单：带有附加图像的文本消息。如果图像没有得到他们推广的链接的礼貌，那么他们会附加一些同样令人难忘和相关的东西。

社交媒体供稿充满了我们所连接的人的帖子，因此有一个强大的形象帮助我们在人群中脱颖而出是很重要的。移动网站将受益于同样的方法。

在这种情况下，我将指出您在West Elm移动网站上的促销元素，以便在美国接近7月4日假期：

由于烟火是我们庆祝独立日的重要组成部分，因此这款闪亮GIF是一种令人难以置信的有效且简单的方式，可吸引游客注意相关促销活动。

GIF不仅值得纪念，而且与网上购物者目前正在寻找的东西非常相关。此外，它都适合智能手机屏幕的空间，这使得它更方便地阅读有关促销的信息，然后点击通过宣布20％的优惠。

5.让你的品牌像Meme一样

当品牌使用社交媒体时，他们不仅要考虑将精心设计的信息与引人入胜的图像配对。他们还必须考虑帖子的一致性。在某些情况下，品牌会使用颜色将他们的帖子绑在一起。其他人将依靠消息传递本身来创建一个有凝聚力的身份。

然后，有品牌将其品牌转变为模因。Old Spice的“你的男人可以闻到的男人”或Terry Crews的活动是如何做到这一点的一些更成功和令人难忘的例子。

它不仅仅是像Old Spice或Dollar Shave Club这样的品牌，它们的幽默广告也会成为可以解决这个问题的模因。举个像奥利奥这样的品牌。

奥利奥是一个家喻户晓的名字。然而，有人会考虑与其他人分享关于奥利奥饼干的帖子吗？在2013年之前，我不太确定。然而，奥利奥在超级碗大停电期间发表其现在着名的帖子后，情况发生了变化。

这可能不是Old Spice级别的模因。但是，它肯定处于类似的趋势和可共享性水平。

奥利奥不断寻找方法将其标志性的奥利奥饼干图像变成类似于模因的状态符号。

感谢GDPR，你知道每个人和他们的母亲是如何在他们的网站上分享cookies通知的吗？奥利奥利用其品牌形象为其带来一点乐趣。

正如您在此处所看到的，下拉菜单创造性地使用Oreo图像，同时还在“cookie”本身上播放。它是如何创造性的一个很好的例子，即使在最小的空间和有限的时间内也是如此。它当然吸引了我的注意力，认为值得在这里分享。

6.拥抱自拍

我认识到自拍并不总是具有最积极的内涵，但是在没有解决它们的情况下讨论在设计中使用类似社交媒体的元素真的很难。因此，我将在这里谈论并说移动网站将受益于包括类似自拍的肖像...当不用于虚假或令人讨厌的背景时。

我的意思是，这是关于自拍的主要抱怨，对吧？他们是上演的，并不是一个人的现实生活。或者他们没有上演，因为他们是在最糟糕的时间和最不专业的环境中进行的。

也就是说，自拍照确实从超级光泽的爆头和其他上演的公司照片中脱颖而出。当您将它们呈现在移动界面上时，它会为网站（以及其背后的品牌）提供更具社交性的存在感。换句话说，你邀请人们与你交往，而不是只是偶然地浏览复制品和照片，然后无意识地转换。当存在自拍时，这种体验还有更多。

我特别喜欢的一个例子来自SEO顾问和作家Aleyda Solis。

只是看看上面的屏幕截图，我觉得我在Instagram上滚动浏览她的个人资料。而且因为我已经习惯于在Instagram上看到有趣的照片，然后立即寻找有关它们的更多信息的字幕，我不得不在这里做同样的事情。谈论巴甫洛夫的狗吧？

对于拥有可识别人物或团队背后的品牌，自拍可能是提升访问者与网站互动的好方法。只要确保它以正面的方式描绘人或人。

7.使用过滤器来讲述个人故事

方式，回到白天，我们过去常常使用电影拍照，并祈祷图像出来没问题，并且可以接受足够的框架。然后，我们得到了数码相机，让我们可以实时看到我们的照片看起来像什么，虽然它经常导致太多的拍照以试图捕捉完美的照明或拍摄。

如今，我们的智能手机和社交媒体平台使这一切变得如此简单。无论我们在哪里，我们都可以拍照，我们的应用程序中已经内置了我们需要清理镜头和应用有吸引力的过滤器所需的许多工具。

毋庸置疑，过滤器是使社交媒体上的照片共享对用户具有吸引力的重要因素。

现在，并不是说品牌之前没有使用过滤器来修饰他们的品牌或摄影。但是，您是否考虑过在不同的环境中使用不同的过滤器可以为您的移动网站做些什么？他们可以有效地将不同的页面或产品变成他们自己的独特体验或故事。

Abel是一家在线香水店，出售一小部分香水，有粉红色鸢尾，红色檀香和绿色雪松等香水。注意趋势？每种香味都用不同的颜色来描述，正如这个金色橙花的例子所示：

尽管香水本身颜色鲜明，但这种图像的设计使瓶子呈现出与其同名相配的金色。现在，这里有趣的地方：

这是产品页面下方的图像之一。虽然我怀疑照片中拍摄的日落是真实的，但显然已经应用了一个过滤器来照亮和加热图像的整体色调。

对页面上的另一张图片也是如此：

同样，重点放在使图像更亮和更温暖的色调。如果你看看上面的文字片段，你会发现亚伯甚至将这款香水的感觉与“里斯本夜晚的温暖毯子”相提并论。

因此，考虑到每个页面或元素的个人情感和身份，而不是用一个单一的调色板来设计您的移动网站。您可能会发现过滤器和颜色可以帮助您为每个人讲述一个更强大，更独特的故事。

受社交媒体启发的移动设计的好处

汕头做网站当我们试图解开更多的移动设计方式而不扼杀创造力或压倒用户体验时，我认为寻找其他类型的媒体来获取灵感是很重要的。

这并不像我们还没有找到通过更小或更孤立的屏幕上的设计来讲述视觉故事的方法。只看视频游戏设计。社交媒体是另一种媒体，它成功地创造了自己的风格。考虑到社交媒体对于消费者来说是多么令人上瘾和引人入胜，这是一个转向设计灵感的好平台。