如何在网页上创建背景图像？

Question

我是一个新的设计师，所以希望这个问题不是太基本！如何在网页上为程序员创建背景图像？我在photoshop中设计了页面，我想知道如何发送背景图像( 25%的不透明建筑覆盖)。我很乐意发送主图片(但它太大了，我想会大大减缓站点和加载时间)。

这是设计的链接..。

http://problemio.com/home_页面_1_1.pdf

Answer 1

如果你的背景完全是一个模式，你应该把它调整到平均尺寸(所以它在屏幕上的加载和显示方式比你使用的大图像要快，如果你想在网络上安装所有屏幕大小的图片的话)。

这是你可以在你的网站上实现它的方法。在css文件中：

background-image : url(path/to/your/background/image);
background-position : 0 0;
background-repeat: repeat;

或者是短手：

background : url(path/to/your/background/image) 0 0 repeat;

Answer 2

问程序员他们希望你如何发送给他们。有些人可能想要PSD，有些人可能想要PNG，JPG或GIF等等，这都取决于他们熟悉什么，以及他们在图形处理方面的舒适程度。

Answer 3

以下是我的建议：

1. 使页面背景成为设计中灰色的纯色。
2. 使背景图像成为具有透明背景的黑白PNG图像。

这应该会给你尽可能最小的文件集。您可以混乱的CSS和样式定义，使背景图像固定，这样它就不会滚动。

然而，你正在展示最常见的问题，图形设计师在网络世界-你没有相同的控制水平，你有在印刷世界。您不能阻止人们更改浏览器窗口大小、颜色质量、文本大小和其他基本细节。学习如何使您的设计灵活，您将有很多麻烦的在线设计。