颜色

以下颜色是我们的品牌颜色，支持HEX, RGB和HSB值.

如果可能的话，利用 主要的 颜色选项首先使用 二次 作为另一种选择. 使用辅助色 二次 在需要的时候上色.

我们的调色板也应该利用相关的文本颜色，当当前的颜色被用作背景时.

一个典型的例子是皮马岛.Edu的导航栏是 支持黑人 与 支持青色 作为字体颜色.

字体

皮马的主要印刷字体是 阉割过的雄鹿. 这种字体包括在我们所有的营销材料作为字体选择我们的口号和支持短语.

在我们的网络平台上, 然而, 在支持我们品牌的领域，我们为了易读性的原因，很少使用这种方法. 的 阉割过的雄鹿 字体只应用于标题，并且总是以标题大小写书写.

为了在网络上建立Pima的独特外观，我们只使用下面列出的字体.

字体选项

的 阉割过的雄鹿 字体应该只用于网站的标题，它也需要许可证才能使用. 对外关系办公室不负责提供授权字体. 的 Helvetica Neue 目前可以作为免费的网页字体使用和下载 谷歌字体.

如果无法使用这些字体，请联系 网络系统 直接询问如何进行的方向.

字体样式指南

下面是一些如何在整个web平台上正确处理这些字体的指导方针, 包括标题样式, 重量和尺寸.

显示了样式的颜色选择，文本的可选颜色选项可以在 color 节，上面列出.

标志的使用

皮马社区学院的标志是学院最直接的代表. 这是一项宝贵的资产，必须以适当的、经批准的形式持续使用. 品牌识别系统中最重要的元素是一个独特的标志, 这为我们的组织创造了一个强烈的视觉表达.

在皮马网区域内, 徽标目前只需要在页眉和页脚适当使用. 这提供了一个清楚的认识，该网页是一个皮马社区学院实体.

有关皮马社区学院的其他用法和徽标指南, 在我们的网站内外, 请浏览我们的 Logo使用指南.

主要网页Logo

我们在页眉和页脚的背景上使用全白版本的logo. 一个清晰的用例是标头本身.

下载的标志

的图标

这是我们的一个例子 的图标 对皮马人.edu，应在整个皮马场址使用.

下载的图标

Pima徽标的任何其他用例都应该引起Web系统团队的注意，以获得适当的指导.

页面布局

在我们的Pima网页, 我们充分利用元素之间的空白来容纳文本的所有区域, 图像和图形为我们的用户提供了消化整个内容的空间. 这也使我们有能力使用大尺寸, 品牌元素和图形的重量和颜色.

网页布局应该始终通过响应式网格或柔性系统来处理. 旧的固定宽度网格和布局方法不应该再使用，因为它们不能在不同的屏幕尺寸和设备上很好地显示.

布局的内容

我们的页面通常在布局上非常一致，这有助于在看到新内容时提供熟悉感.

首先，我们的内部内容页面包括一个左边的内部页面导航，一个 面包屑区域，支持图像和页面标题，然后是相关内容. 在相关内容中, 我们允许一个细的内部右列的重要信息, 例如联系信息或办公时间或支持项目的快速链接.

在更高级别的页面中使用, 我们放弃了左侧导航，因为这些页面中的内容通常表示要遵循的连接页面的导航.

最后，所有的皮马页面包括皮马页眉和皮马页脚，如图所示. 如果您对页面布局有疑问或担忧，请联系 网络系统 为方向.

摄影

在所有的PCC网站页面，我们选择的照片是真实的，相关的，引人入胜的. 我们希望通过我们的学生、教师和工作人员的经历来展示学院的一天.

网站上使用的图片是为了给我们的网站访问者创造可信和鼓舞人心的体验. 在我们吸引他们注意力的短暂时刻, 我们想分享尽可能多的关于被拍照的人的故事.

我们的摄影是我们身份的一个不断发展的部分，与不断发展的技术保持同步. 巧妙地, 我们调整自己的风格，以适应现代网络摄影，同时考虑和谨慎流行的临时风格.

主题 & 主题

PCC是一个非常多样化的社区，我们希望尽可能多地展示这一点. 永远要考虑到我们是在庆祝所有种族、性别、年龄和文化.

我们想讲一个故事. 我们的实验对象应该尽可能多地展示他们在皮马的一天.

我们也努力展示一个ctual学生. 我们希望在讲故事时做到真实，当我们展示真实的学生生活在他们的皮马故事中时，真实性就会得到体现, 而不是拍摄模特.

照明 & Color

我们的品牌欢迎温暖明亮的形象. 我们想要谨慎过度或欠饱和，同时仍然希望图像看起来尽可能自然.

我们经常在室外或温暖的房间里用自然光拍照. 在极少数情况下，需要在黑暗的地方使用人工照明, 我们对颜色的选择很有策略，总是使用专业的照明设备.

背景

图像的每个部分都需要讲述一个故事，包括我们拍摄对象的位置. 我们想要干净，专业的背景，很少分散注意力的元素.

我们经常, 但并非总是如此, 在我们的背景上应用一个小的模糊，以帮助焦点集中在我们的主体上，但我们仍然希望背景的上下文是清晰的，不要太混乱.

标志 & 品牌

虽然我们可能与外部公司或机构有良好的关系, 我们希望避免或删除任何类型的品牌或标志，不是皮马的一部分. 如果任何关系或公司声誉因任何原因发生变化，这将使我们的形象拥有更长的生命.

位置

当使用图像来支持我们的位置时, 我们喜欢展现维护良好的现代化大学校园的照片. 外景以自然色彩丰富、风景优美、健康为主.

在可能的情况下，我们会在校园最具影响力的区域拍摄我们的建筑. 如果可能的话, 我们希望在交通繁忙的时候展示皮马人寿的来来往往.

设备

几乎总是, 我们选择展示和宣传我们品牌的照片都是用专业的设备拍摄的. 这包括一个专业的数码单反相机, 适当的镜头拍摄和额外的设备时，需要.

这意味着我们会偏离使用蜂窝设备或小型数码相机拍摄的图像来保持原始图像质量.

股票的照片

我们所有的照片都是在内部拍摄的. 然而，有时这是不可能的. 在这种情况下，库存照片是唯一的选择，以帮助支持我们的内容. 虽然这些情况应该是极其罕见的, 我们总是通过Getty images选择付费许可下的图像.

我们通过这个授权选择的形象是与我们的品牌风格有凝聚力的, 偏离时尚的照片风格和典型的库存姿势.

如果库存照片和内部选项不可用, 外部照片来源必须得到网络系统的批准，不能要求补偿, 必须是无版权的, 并且不能显示来自图像生成器的任何类型的水印.

捕捉技巧

大小: 我们的照片应该灵活地用于我们网站的不同区域, 有时需要极大的照片尺寸. 记住这一点, 同时捕捉拍摄对象的水平和垂直图像是一种很好的做法.

在照片的主题周围留出空间也是一个很好的做法，这样可以轻松地对照片进行操作，以适应我们网站上的不同位置.

关系: 通过经验, 当我们的皮马学生对所发生的事情感到舒适时，他们往往会有更真实的情感. 即使是作为摄影机后面的摄影师, 我们努力与学生建立联系，以提供这种舒适感.

干扰: 我们总是希望意识到背景中正在发生的事情，以免分散最终观众的注意力, 包括人、物和装饰品.

图解

在我们所有的网络平台在皮马社区学院，我们利用图标服务于多种目的. 添加图标可以吸引用户的注意力，同时传达相同的信息. 它们有助于增加我们品牌的凝聚力，并在皮玛产品中呈现出清晰的身份. 图标还可以快速识别我们的用户预期的目的地或操作.

记住这一点, we at Pima utilize two separate icon libraries to serve two different but cohesive purposes; our own PCC图标库 and a free icon library from 字体太棒了.

PCC图标库

首先，我们使用了一套多色的品牌图标. 这些图形应该是可扫描的和有吸引力的. 我们使用品牌图标来分割长文本块, 显示兴趣点或支持副本部分.

下面你会发现一些常用的图标在皮马.Edu和其他外部位置.

FontAwesome

其次，我们使用最新的免费图标库从字体Awesome. 这让我们能够创造出更加微妙、快速和简单的方向或行动. 它还允许我们在调色板中灵活地支持所有内容, 不管品牌选择是什么.

下面你会发现一些常用的图标和相关的样式在Pima.edu.

支持图形

与整个匹马的品牌元素一致, 我们将辅助图形添加到最适合附加品牌支持的区域.

这些辅助图形很少使用，通常用作图像中的页脚支持元素或辅助元素.

如果有一个适用的区域添加这样的图形，请咨询网页设计师在 网络系统.

下载

下载

下载

链接样式

对于不同的用例，Pima有一些不同风格的链接. 如果您不确定要使用哪个用例，请联系Web设计师 网络系统.

内嵌链接

内联链接，比如 这个链接，原色:#1A0DAB，颜色:#03406f，作为悬停动作. 当前所有链接都加了下划线, 除非在特殊情况下，如导航和按钮，其中内容的理解是一个链接.

访问过的链接应该有一个十六进制紫色，#660099.

块的链接

关联段落之外的链接可以具有相似的特征，也可以不同. 这些样式示例包括列表、边列和导航区域中的链接. 这不包括已被样式化为按钮的链接.

查看按钮信息和样式.

按钮

主要按钮选项

辅助按钮选项

面包屑

作为一种快速导航和页面定位的形式，Pima.Edu有一个链接的快速导航路径，被称为“面包屑”. 这是导航的必要部分，可以帮助传达信息体系结构，如果可能的话，应该添加到适当的区域.

下面是皮马面包屑标准的一个例子.

首页 主要位置 内部位置 当前位置

呼出样式

通过我们学院网络平台上的许多页面, 内容区域由称为对话框的风格化区域分隔. 这些呼出的目的是引起人们对重要信息或相关内容的注意.

下面是一些例子，说明这些呼叫区域应该如何风格化，以保持皮马品牌的形象

您 & 统计数据

支持长区域的内容, 大声说出重要的信息和引人入胜的引语是很好的. 这些样式通常漂浮在内容的一侧(移动设备除外)。. 下面你会看到一些例子，我们是如何设计的，以适应我们的品牌参数.