如果您是一家代理机构或公司,拥有一系列希望在线共享的网站或页面,您可能已经经历过尝试捕获每个网站的统一屏幕截图的痛苦。
与我们合作的一位客户构建了可以在公司范围内进行内部托管的托管 Intranet 解决方案。 内部网对于公司传播公司新闻、分发营销信息、提供福利信息等非常有帮助。
我们帮助该客户从其母公司的网站迁移了他们的 Intranet 解决方案产品。 这是一个广泛的项目,包含了从构建新的社交资料、更新 Marketo 到分解他们为合并站点所做的一些自定义开发的所有内容。
一个关键步骤是确保我们在他们的新网站上突出显示他们客户的内部网站的精美产品照片。 我们希望确保每个屏幕截图在整个网站上的宽度和高度始终相同。 这可能很困难……除非您使用的是 Google Chrome。
使用Google Chrome浏览器的客户端截图
您可能没有意识到这一点,但您可以使用 Google Chrome 内置的一组强大的开发人员工具捕获完美的屏幕截图。 有趣的是,尽管它具有惊人的灵活性,但它并不是一个非常知名的功能。 该功能还允许您针对特定尺寸和屏幕尺寸拍摄响应式网站。
这是一个快速视频教程,介绍如何使用 Google Chrome 截取完美的、特定大小的网页屏幕截图:
使用Google Chrome浏览器截图的步骤
Google Chrome 的开发人员工具可以使用其设备工具栏预览网站。 该工具的构建是为了让开发人员可以看到网站在不同设备上的不同视口尺寸下的外观……但它也恰好是获得完美尺寸的网页屏幕截图的完美方式。
在这种情况下,我们希望客户的每个行业的关键客户都建立了漂亮的 Intranet 站点来截取屏幕截图,以便我们可以将它们全部显示在他们网站上的投资组合中。 我们希望页面正好是 1200 像素宽乘以 800 像素高。 要做到这一点:
- 在最右边的导航按钮(3个垂直点)中,选择 自定义和控制菜单.
- 选择 更多工具>开发人员工具
- 切换 设备工具栏 调出设备选项和尺寸。
- 将第一个选项设置为 反馈积极,然后将尺寸设置为1200 x 800,然后按Enter。 现在,页面将显示这些尺寸。
- 在设备工具栏的右侧,单击导航按钮(3个垂直点),然后选择 捕获截图.
- Google Chrome浏览器将获得完美的屏幕截图并将其放入您的 资料下载 您可以在其中附加并通过电子邮件发送的文件夹。 确保不要选择全尺寸屏幕截图,因为这会占据整个页面长度并忽略您的高度限制。
Google Chrome浏览器键盘快捷键的屏幕截图
如果您是键盘快捷键高手,您可以使用这些快捷键截取整页屏幕截图。 我不喜欢这种方法,因为我无法设置视口的最大高度……但如果您需要整个页面的屏幕截图,它会派上用场。
键盘快捷键 (Mac)
1. Alt + Command + I
2. Command + Shift + P
键盘快捷键 (Win / Linux)
1. Ctrl + Shift + I
2. Ctrl + Shift + P