6

我在 Photoshop CS5 中制作了一些网站，但我通常倾向于只在 notepad++ 中制作它们。我通常将它们放在网站上，然后编辑代码并刷新页面以查看更改。我想转向更专业的方法并在 Photoshop 中制作整个模板/设计。阻止我潜入水中的事情是一开始就大声笑..

用于模板的好的分辨率是什么？我遇到过不同的教程，他们说不同的大小。例如，我的笔记本电脑分辨率是 1366x768。我的办公室有一个 22 英寸的 LCD，我知道它的分辨率也非常高。我会假设大多数显示器的最小分辨率是 1024x768 ......

在 Photoshop 中创建新模板以创建网站模板时，我应该制作多大尺寸的图像，为什么？

另外，既然我们是在讨论这个话题，你们有没有链接到图片收藏的好资源，这样你觉得在创建模板时对你有最大的帮助？我是一名程序员，我们都知道，大多数程序员都不擅长图像。我只是想加强我大脑的另一半 :)

提前致谢！

4

4 回答 4

14

我建议采取以下行动：

  1. 查看当前最广泛使用的屏幕分辨率的统计数据。如您所见，1366x768 是目前最流行的分辨率，其次是仍然拥有庞大用户群的老式 1024x768。并留意移动分辨率。
  2. 考虑浏览器 chrome 和其他操作系统绒毛占用的必要屏幕空间。
  3. 由于针对多种屏幕尺寸进行设计每天都变得越来越重要，因此我强烈建议您选择几个目标分辨率，而不仅仅是一个。这一切都可以由 CSS 很好地处理。即使您只针对台式机，考虑不同的屏幕尺寸仍然是有意义的。
  4. 由于您仍在使用 Photoshop，因此您可以从许多可用的基于网格的 PSD 模板之一开始。我知道一个960px和一个1140px 的，但你可以找到更多。如果您决定支持一种以上的屏幕尺寸，您可能不得不使用多个网格。

然后，当您想更加努力地考虑这一切时，请直接阅读这篇文章：Peter-Paul Koch的两个视口的故事。

于 2012-08-12T04:56:24.847 回答
1

查看粉碎杂志并注册他们的时事通讯以及 webdesignerdepot 并查看 Codrops.net。他们有很棒的免费赠品、教程和标准更新。我喜欢检查我的邮件以查看它们。

至于 PSD - 他们没有固定大小。我见过专业的 1100 像素宽的 wordpress 开发人员模型（高度是基于您的布局的变体）。我不推荐超过 1366px 的宽度。

我可能会做 1366 或 1440，因为这是大多数人会看到的分辨率。当你在 1920 范围内发送一个样机时，人们认为网站太小，当内容仍然是他们所有的 940-980 时

编辑：

我自己在 1100 像素或 1440 像素宽处做 PSD，主要内容始终是 940-980 像素宽。

当在正文背景中没有太多图形可以查看时，我使用 1100，而当背景对网站的“感觉”更为重要时，我使用 1440。

于 2012-08-12T04:11:56.980 回答
1

您想为最常用的屏幕分辨率设计您的网站，这似乎是 1280 像素 x 720 像素。因此，这就是您想要的宽度，您可以创建任何类型的背景，只需确保将其淡化为一种颜色或透明并使用 CSS 更改背景颜色。

确保您有帮助您保持内容内联的指南，最好的方法是创建一个宽度为 960-100 像素、高度为 720 像素的新文档，然后将指南拖动到所有四个边。

然后您可以将文档大小更改为 1280 像素 x 800-960 像素。

之所以有 720 像素的指南，是因为保证在所有分辨率上都能看到该线以上的所有内容，它被称为“首屏”。优秀的设计师会考虑到这一点，以确保吸引观众探索网站，特色内容滑块是一种简单的出路。

于 2012-08-13T02:15:08.113 回答
-1

incomepitbull，我明白你来自哪里......
我也是一名正在努力学习 Photoshop 的后端开发人员......
许多前端设计师对开发阶段的情况一无所知......
大多数 Photoshop 模拟取决于客户规格……
高度无所谓；使用 960 px (12col,16col,24col), 980 px (12col,24,col), 1000 px (100 % 响应友好对于那些不使用网格系统的人) 或 1140 (对于针对更大显示器的网络, 即不是移动优先 px.. .)
毕竟，作为开发人员，我们解决了所有这些问题；但是好的模型很重要...

于 2014-04-14T08:25:08.497 回答