网页设计师的照片选择指南_极简慕枫

当我们遇到它们时，摄影图像会吸引我们的注意并触发几乎瞬时的响应。因此，它们是我们创建的任何网站的重要组成部分。照片在确定我们的第一印象中起着重要作用，但它们也可以告诉我们网站的内容，并且可以成为赢得信任的重要因素。 

苏州高端网页设计如果使用得当，照片非常有效，可以快速将预期信息发送给您的观众。但是，使用错误的照片会降低用户的体验。我们如何选择合适的？ 

在网页设计中使用照片

尽管我们关注的是我们正在创建的网站的所有方面：内容，颜色，排版，层次结构，信息架构和其他细节，但在可用性和整体用户在您网站上的体验方面，照片值得关注。

处理网站上的照片应该是设计师理解并有效应用的内容，因此本文将指出您正确的方向，并告诉您在决定在下一个Web项目中使用照片时如何考虑照片。

使用大照片需要注意

人们根据过去的经验和期望扫描屏幕。左上角是用户眼中最常见的起点，尽管这取决于他们的文化阅读模式。如果您在页面上使用大型照片，它会立即吸引他们的注意力并将其从通常的趋势中拉开。

将照片视为内容

我相信你不会和我争辩说网页上的照片是满足的，但你真的这样对待吗？您是仅仅将其用作附加组件还是不错的内容填充程序？您是否考虑过该特定内容的所有方面？在您选择使用之前，您是否正确评估了照片？您是否考虑过用户的心理模型以及照片对他们的影响？照片是否提供有意义的信息或为用户当前的任务提供帮助？这些只是在网页上使用照片之前需要回答的一些问题。

永远不要只使用照片来“浏览”网页。

我见过许多设计师只是在网页上放置一张漂亮的全屏照片，投入一些标语或“号召性用语”并宣布完成。在许多情况下，照片尚未经过评估，设计师只是在追踪一个持续的趋势。让我们看看如何在您的网站上使用它之前评估照片。

选择完美的照片

决定在设计中选择照片时，需要考虑几件事情。 我将假设您已经知道如何评估照片的基本方面，即：质量，尺寸，构图和曝光。在所需分辨率，图像尺寸方面的质量，优选其对于预期用途的定向，照片的有效构图和裁剪以引起注意，以及在照片上适当曝光的对象。

完成后，照片已通过基础测试，您可以继续探索预期用途的选项。

我们的大脑处理图像的速度比阅读文本快60,000倍。- 迈克帕金森

它有用吗？

最重要的是，照片必须有用。使用照片作为占位符来照亮页面或填充一些空间没有任何问题，但即使这样，也要考虑使用该照片的上下文。有用，有用，发人深省的内容照片是需要我们特别关注的照片。有用的照片应该 

• 帮助我们更好地理解某事， 

• 教我们如何使用，或 

• 向我们展示如何完成某件事。 

Square  网站是网页设计中有用照片的一个很好的例子。

你可以立刻知道这张照片是专业拍摄的（看看手和指甲）。最重要的是，它直接传达了产品的含义以及使用的简便性。非常有用，教育和教学照片。

有用照片的另一个例子是Pencil网站。与前一个示例类似，此照片准确显示了产品的内容（手写笔），在何处以及如何使用（iPad应用程序）。

该  Woodster网站还充分利用照片来解释产品。很明显，他们的产品用于提升你的Mac，但也提供有用的USB连接。想象一下这个产品在没有上下文的情况下被隔离（iMac）。你觉得这张照片和这张照片一样有用吗？

Grovemade  在一张全屏背景照片上展示了他们产品的集合。很明显，他们制造高端木制办公配件。这张照片不仅有用，而且同时也非常有效和情绪化。我们马上就会看到有效而感性的照片。

如果你看一下上面的例子，你会发现所有的照片都非常明显，不言自明，而且他们很好地传达了预期的信息。您不必花很长时间才能弄清楚产品/服务/网站的内容。这些都是网页设计中有用照片的特征。

有效吗？

有效的照片是促使行动，影响我们的行为并清楚地传达预期信息的照片。特别是，优质有效的产品照片应该鼓励用户购买这些产品。我们从上面的例子中看到，可用的照片确实很有效，因为它们使产品变得可取，从而鼓励我们购买它们。每当我们看到一张触发行为改变的照片时，我们都可以将其描述为有效。

如果你看看  Mobility  网站和那些多汁的红色耳机，你会立即被吸引并可能想要购买它们！

苹果以其完美主义而着称。在  iPhone  登陆页面充满了辉煌和期望的产品照片，你想拥有自己的产品之一，这使得。

另一个有效照片的例子是tsptr网站。请注意照片上的男人是如何向下看的，就像下面有一些东西供您探索？确实有以下内容。

该Mapquest服务  网站不仅传达情感与意象，而且还采用了巧妙的视线方向来引导用户的眼睛重要内容的网页上，在这种情况下，左侧的手机下载链接。

Poco People  在他们的主页上使用了一个有趣和有趣的照片。你可以马上告诉它有什么奇怪之处。由于这一点，以及对色彩，灯光和曝光的良好运用，您的兴趣在某种程度上被激发，以了解该网站的内容。

在  庞  网站提供的网页上的大幅照片显示他们做了什么（他们手画大型广告和壁画），以及他们如何做到这一点（看看右边的人）。这张照片的有趣之处在于路过左边的人。他们看起来很兴奋他们所见证的东西会让你作为一个观察者，并使整个照片和信息令人兴奋和有效。

这是情绪化的吗？

情感照片应该导致观众的情绪反应。只要照片以某种方式吸引我们的情感，它就会更好地看待，平静或令人不安，从而迫使我们采取某些行动，或有趣和有趣，或有吸引力和可取的方式比没有的影响。

Frogdesign在其网站上提供了有关FEMA和救灾管理的案例研究。主要照片与良好的标语相结合，非常有效且具有感情色彩。它讲述了一个故事，它表明了危险，因为我们感到与之相关。 

呼吸  网站的主要照片  非常平静。结合良好的标语和正确的凝视方向，照片上的女人将她的呼吸轻松传递给观众。注意按钮标签“吸气”？ 

Shaun Groves网站的主要照片讲述了一个关于他的精彩故事。它将快乐，信任，希望，友谊和期待传递给与之相关的观众，并对他的工作表现出同情。

除了Relay Foods  照片选择的实用性和有效性之外  ，他们还可以翻译他们提供的服务的情感。左边和右边的女人表现出为他们工作的快乐，而且因为Relay Foods所有关于天然产品的女性在这些照片上的面部表情与他们的品牌/服务信息一致。

面子的力量

有七种（或八种）基本情绪： 

1. 喜悦

2. 悲

3. 鄙视

4. 恐惧

5. 厌恶

6. 惊

7. 愤怒

它们是通用的，并且（通常）通过面部表情和身体姿势进行交流。如果您使用人物照片来传达您的预期信息，请注意这些基本的七种情绪，并决定哪些情绪会驱动您的目标受众。

关闭人们的照片立即抓住我们的注意力并帮助触发我们的情绪，这使他们成为一个强大的设计元素。 

当我们看到一张脸时，我们会自动触发感受某事或同情那个人

我们已经在之前的例子中看过人们的照片，但让我们进一步探索它们。

即使一个女人的  Build Fire照片没有告诉我们关于他们产品的任何信息，它也会增加产品的个性，是吸引用户注意力的有效方式。如果只有iPhone而不是女人的照片，则无法实现同样的效果。

如果您决定在个人网站上使用大型肖像照片，我向您致敬，我一直在那里。不过要小心！一个微小的面部表情可以对你正在传达的信息产生巨大的影响。Daniel Eckler在向观众展示自己方面表现非常出色。他的面部表情传达了自信，冷静和信任。 

人们可以分辨出笑容是真实的还是假的

每个人都知道世贸中心发生了什么。在  9月11日进贡中心  网站是专门为那些谁在那里的故事。照片上的男人直接看着我们，从而帮助我们与邀请我们进入社区的网站主题相关联。

注意：这是在没有对抗的情况下完成的; 细线！

保护  网站是另一个用贴近人脸照片来传递信息的好例子  。照片上的Kayapo男人传达了权威，勇气和欣赏。

正如  Susan Weinschenk所说，关闭照片在慈善网站上最具说服力，这是事实。 救助儿童会  特写了一张有需要的儿童的近照照片，完全符合该网站的标语和主题。注意捐赠按钮的凝视方向？

如何*不*在网页设计中使用照片

尽管我们已经看到很多很好的例子，说明如何在我们的网页设计中使用照片，但这些很容易被滥用。因此，我将向您展示如何不使用照片和避免什么的几个例子。

无关照片 - 提供“量身定制”服务的网页设计工作室使用不相关的背景照片（彩色线程），这会产生错误的第一印象并向访问者发送错误信息。这里有意义，但这是一个不起眼的比喻。

 这里更好的解决方案是使用纯色或团队合影。此外，数字产品无法量身定制。

作为服务提供团队协作工具的软件使用工作中担心女人的照片。这可能会让人觉得她担心该网站正在宣传的软件。这里更好的解决方案是显示真实产品截图或显示使用他们产品的幸福女人。

模糊的照片背景 - 仅用作装饰占位符，不会传达有关网站的任何信息，因此没有实际效果。我会建议你尽量避免模糊的照片背景，你可以做得更好;）

另一张完全不相关的网站主题照片。尽管“手工制作”和“工作室”这两个词可能与照片本身有关，但它并不能传达网站的真实主题。Brand Bat致力于创造品牌战略，并且通过一系列木材加工相关照片，他们错过了传达信息的绝佳机会。

错误的照片选择 - 当您看到这张照片时，您的第一印象是什么？站在咖啡店的两个快乐的人将帮助您的企业在线取得成功。对？不，一个提供全面服务的网页设计机构实际上提供了这个帮助，照片应该显示他们的快乐和成功的客户之一。这也可能是你应该避免的照片。

股票照片  - 他们几乎从不传达正确的信息。为什么有个小男孩戴着眼镜，竖起大拇指？他是开发人员提供PHP编码服务吗？我不这么认为。 

Nationwide网站未能将此消息与此照片进行通信。首先，这张照片与拍摄对象无关，女人似乎咬着指甲（我们知道这是一种心理障碍），她平板电脑上的屏幕模糊不清。这张照片显示了焦虑，紧张和压力，我真的不认为Nationwide想要向访客传达这一点。

最后的想法

本文一直是关于在您的网站上使用大型照片，但还有许多其他方式可以正确使用照片来吸引您的观众。在设计过程的早期开始考虑照片。如果你做了适当的项目研究，你已经有了很多见解。 

投资拍摄好照片：一位出色的摄影师可以为您的网站增加一笔财富。

苏州高端网页设计无论您的设计是什么，您的观众都将由将从您的设计中受益的人员组成。了解人类行为是实现有效设计的唯一方法，这适用于为您的下一个网站设计选择最佳照片。