据最近民意调查在美国,博客在最值得信赖的信息来源中排名第三,仅次于朋友和家人。没错,博主比名人、记者、品牌和政客更值得信任。

但是你怎样才能让人们爱上你的博客呢?(当然,除了精彩的内容之外。)

嗯,就像你的网站主页就像你的商业的前门,你的博客的设计-就像一个欢迎垫-是你的商业博客的前门。

如果您在视觉上没有吸引人们,您将如何让他们接受其实读取的下一步(以及希望,订阅你的内容吗?一旦你创建了高质量的内容,你仍然有一个挑战,以一种方式清楚地表明你的博客是关于什么。图片、文本和链接必须显示得恰到好处——否则,如果没有以吸引人的、容易理解的方式显示,读者可能会放弃你的内容产生更大的兴趣

这就是为什么我们编译了一些例子博客主页让您在正确的轨道上为读者设计完美的博客。在下面检查'OUT。

立即下载:如何启动成功的博客[免费指南]

免费资源

77主页,博客和着陆页的辉煌例子

告诉我们一些关于你自己的情况,以便今天就能进入:

美丽博客主页设计的17个鼓舞人心的例子


1.帮助童子军

有时,最好的博客设计也是最简单的。帮助Scout,客户服务软件的制造商,在我们喜欢的博客上使用独特但极简主义的设雷竞技苹果下载官方版计 - 它限制了副本和视觉效果的使用,并包含负面空间。

我们特别喜欢这个博客是它对所有帖子的特色图像,包括顶部的横幅,突出最近或特别受欢迎的条目。这些图标设置在明亮的块颜色前面,捕获读者的眼睛,并用信号发出帖子的内容。它有效 - 关于这个博客设计的一切都说“干净”和“可读”。

美丽的博客设计帮助scout


2.微软的故事

全面披露:我们完全涌现在微软的“故事”的微软.我们无法控制——有什么比一个拥有美丽、互动和鼓舞人心的品牌内容的博客更好的方式来振兴一个老派的品牌呢?另外,这些故事的方形布局让人联想到微软的logo,这达到了一种有价值的效果品牌一致性

微软的故事也是商业博客如何成为整体重塑品牌的主要资产的一个主要例子。近年来,微软努力使其品牌人性化,主要是为了应对与苹果的竞争.“故事”微型网站有一个简单的口号——“深入了解那些感动我们的人、地方和想法。”可以说,这是微软较软的一面。

当你试图传达某种品牌信息时,你的博客可以用来传达它——无论是美学上还是内容上。

美丽的博客设计微软故事


3.Pando.

精心设计的博客的一个重要方面是一项一致的配色方案和风格 - 毕竟,80%的消费者表示,颜色提高了他们对品牌的认可

看到色彩的一致性如何统一设计中更多样化的元素是很有趣的。Pando是一个探索启动周期的博客,在其网站的几个部分中集成了蓝牙——背景、高亮栏和特定的文本区域。但它也使用了几种不同的字体-所有这些设法无缝结合在一起,通过一个紧密的配色方案。

漂亮的博客设计pando


4.设计牛奶

设计牛奶,在线现代设计插座,使用一个非常简单的布局来突出显示其帖子。右边的侧边栏 - 这仍然是博客帖子被打开阅读的观点 - 非常适合展示新文章的缩略图图像。那是一个内部链接策略,这有助于鼓励读者在网站上停留更长时间。

顶部的社交图标对网站的整体外观和感觉是一个令人愉快的补充——它们很容易被发现,并且使Design Milk的内容很容易被分享。(想要了解更多关于在博客中添加社交按钮的知识,请登录这篇文章.)

美丽的博客设计牛奶设计


5.Fubiz

Fubiz,一个艺术和设计博客,是一个非常时髦的设计,还包括一些很酷的个性化的例子。

在靠近博客主页顶部的地方,读者可以横向滚动浏览“突出显示”的帖子。下面是“创造性发现者”,访客可以在这里选择他们所选择的人物——从“艺术爱好者”到“自由职业者”——地点,以及他们所寻找的内容类型。从那里,读者可以浏览专门针对他们的内容。

我们也情不自禁地喜欢标题图像。它使用了一种叫做“蓝色”心理学家发现开阔的水面能自然地吸引我们。通过在设计方案中使用它,Fubiz能够在视觉上吸引游客到其内容。

美丽的博客设计fubiz


6.设计得宝

有一个像“Webdesigner Depot”这样的名字,难怪这个设计新闻网站在视觉上很吸引人。raybetapp

我们特别喜欢的是WebDesigner Depot在每个单个帖子上纳入社交共享图标的一件事。虽然我们当然建议实际阅读每件,但是随时可用的链接有助于访问者立即分享他们发现有趣的标题。并检查右侧的导航箭头 - 从未如此易于滚动到页面的顶部或底部。

更重要的是,配色方案、背景和字体都是一致的——这使得这个博客看起来很专业,但仍然与我们以前看到的基本博客模板不同。

美丽的博客设计网站设计师仓库


7.Mashable

我的意思是,看看标题图像。醒目的颜色,覆盖的线路,吸引人的瞳孔和对比鲜明的文字。它绝对能抓住读者的眼球——没有双关语的意思。

Mashable在主页上将其内容分成三个明显的部分:新文章以最小的缩略图列在左边。“What’s Rising”的帖子以大缩略图的形式显示在中心栏中,“What’s Hot”的帖子以大缩略图的形式显示在右边。这种三管齐下的内容展示方式可以帮助读者决定哪种新闻对他们来说最重要——引人注目的头条新闻,还是其他当前流行的帖子。raybetapp

另外,我们喜欢在每个帖子预览中显示分享的数量——这是一个很好的社会证明形式。

美丽的博客设计捣蛋


8.英国人+有限公司

关于Brit + Co主页的一切都是“干净”、“温暖”和“欢迎”。它摆脱了杂乱,使内容更易于消化,布局也极有条理。

我们也挖掘了该网站的季节性。我的意思是,10月黎明的鳄梨杰克 - 灯笼?可爱的,并用五颜六色的,有趣的照片,以说明故事的内容。

微妙的“趋势”标题也是一种推广流行内容的好方法,同时又不会让人觉得太直白。此外,如此伟大的视觉效果,我们注意到对Pinterest的点头-图标是重要的,包括当你的博客合并有吸引力的图像。

美丽的博客设计brit + co


9。特易购生活

我们喜欢英国杂货连锁店乐购的博客网站乐购生活的多彩、一致的设计。

还记得我们是如何反复强调品牌一致性的吗?看看上面横幅中菱形的设计,它与乐购的标志相同。

有易于生的生活取得了什么,是简单和勇气的巨大平衡。布局非常少,但它并不沉闷。温馨和欢迎的色调强调每个内容类别,照片在整个网站上添加了模块的破折号。这是一个正确的图像如何实现吸引力的“更少的”外观,特别是如果这适合您的整体品牌概念。

美丽的博客设计乐购


10.全体人员

Crew后台,Crew平台的博客,为设计师和开发者,有一个惊人的极简主义的博客设计,但安静的一个独特的。

请注意,在折叠的上方,它突出了一篇带有大标题、副标题的博客文章,并呼吁大家去阅读更多。

在左边,有一个同样极简主义的行动呼吁,使读者很容易与Crew联系,或了解更多。另外,这又是一种一致性,所有褶皱上面的颜色都是相同的蓝色,这已经证明了调用品牌信任

美丽的博客设计团队后台


11.无辜的饮料

不仅无辜饮料公司的人是优秀的文案吗,但它的博客设计也很好地提醒我们,博客设计不必太花哨。

请注意徽标如何 - 左上角 - 简单,卡通,几乎令人愉悦的儿童。它适用于无辜的饮料(暗示:童年纯真),并在整个公司的博客中保持品牌存在。raybet电子竞技

例如,五颜六色的字体与标识相匹配,并与品牌休闲、顽皮的声音保持一致。我们还喜欢左边的易于导航的档案链接,它与右边的几何社交分享按钮相辅相成。

美丽的博客设计


12.500 px

和Crew很像,500px的摄影博客以一篇特写文章和一张大的、粗体的、高清照片来吸引读者。这就很清楚这个博客是关于什么的了——它吹嘘有价值的摄影内容和扣人心弦的摄影。

加上,有多酷的是社交链接就在那里,显然展现在折叠以上?他们让读者从事内容,并让您轻松分享摄影 - 而且,带有图片的内容在社交媒体上被分享的可能性高达三倍

美丽的博客设计500px


13.Pixelgrade

Pixelgrade是一个设计工作室,为各种各样的有创造力的人和小企业创建令人惊叹的WordPress主题。他们的博客页面很好地突出了他们最近或最受欢迎的一篇博客文章,加上明确的行动号召和一个简短的摘录。我最喜欢的是页面设计100%符合他们的品牌,以及他们在其他渠道上的沟通方式InstagramFacebook,或推特.当你在社交媒体上滚动时,你可以毫不费力地识别他们的博客文章和其他内容。

漂亮的博客设计像素级


14.BarkPost

这不是什么秘密我们在Hubspot的狗有点像狗.因此,当作为狗主人遇到我们的雷达致力于生活的博客时,它得到了我们的注意。

犬类订阅箱公司BarkBox的博客BarkPost是一个很好的设计例子。raybet电子竞技首先,看看它是多么容易订阅-行动的号召就在那里,在特色内容上面。社交共享图标也很容易被注意到——当然,所有的图标都是品牌匹配的、值得信赖的蓝色。

我们也喜欢BarkPost将注意力吸引到它的姐妹公司,所有这些公司都隶属于Bark & Co的品牌组合。但与此同时,这个博客并没有典当自己的产品,而是为养狗的父母和爱犬者提供信息资源。

美丽的博客设计


15.国际亲善行业

谁说非营利组织不能博客?南他们应该- - - - - -Goodwill干净、多彩的导航栏(同样是值得信赖的蓝色)把读者吸引到这个博客的重要元素上。

这些帖子的位置也很整齐,易于读者阅读。而且,访问者可以通过从右上角的下拉菜单中选择一个主题来选择对他们最重要的信息类型。

最后,我们喜欢在介绍性文本中有一种合作的行动,邀请读者为善意博客提供内容。毕竟,该组织的服务已达到3700万人 - 这是他们分享他们的故事的一种方式,或者邀请捐助者写下他们为什么选择支持善意。

美丽的博客设计


16.慈善机构:水

让非盈利博客持续运转的是慈善:水,它可以很好地利用高质量的摄影。

最近,该组织重新设计了其博客,为其10周年纪念日写了一篇长篇文章。利用这个机会来分享它在过去十年的影响,charity: water保持了一个简单的设计,简洁的文字和明亮的图片来自周年活动。

另外,页面顶部有一个可以捐赠的CTA。把这句话放在一个关于慈善的故事之上:水的影响是一把双刃剑,既能激励人们为慈善事业捐款,又能让捐款变得容易。

美丽的博客设计慈善:水


17.约翰尼蛋糕

澄清一下,强尼·纸杯蛋糕其实不做纸杯蛋糕。它让衣服。但是这家公司在烘raybet电子竞技焙食品的品牌关联上做得很好——它的博客使用子域名“厨房”。

另外,约翰尼纸杯蛋糕的员工对跨渠道的品牌一致性也颇有心得。它的博客简单的配色方案和匹配的字体有助于创建一个统一的用户体验,从商店到一般的内容,同时扔粗体,彩色的图像来吸引读者的注意力。

此外,访问网站,并有一个滚动-我们认为这是相当酷的背景图像如何变化,但保持每个条目的位置静态。

漂亮的博客设计约翰尼纸杯蛋糕

寻找更漂亮的博客设计?以下是另外15个获奖作品网站设计的例子

编者按:这篇文章最初发表于2013年,现已全面更新。

新的行动呼吁

新的文字-动作

最初发布于2020年12月1日上午7:45,更新于2020年12月1日

主题:

网站设计的例子