How to Make Webpage Backgrounds
A web page's background image is a crucial component of the site's overall design. Creating your own backgrounds allows you to customize the look and feel of any page. Just like the desktop background on your computer, web page backgrounds usually take the form of either tiled patterns or a single static image. Tiled backgrounds are composed of a small patterned image, such as dots, stripes and textures. Static images showcase one large image that appears only once in the background. With image editing software, you can design a web page background that is ready to be incorporated into the site as a whole.
Other People Are Reading
Instructions
-
-
1
Obtain permission to use any image that you did not create yourself, or create a background image of your own design.
-
2
A patterned background image can connect seamlessly with itself when tiled. Open your image editing software. Set an equal height and width for your image If you are designing a tiled background from scratch. For example, 300 pixels by 300 pixels. Confine the dimensions of the image to 300 pixels or less for a pattern that repeats more frequently. Once your image attributes are set, put your creativity to work. Depending on which software you are using, you may have access to features such as filters and brushes that will allow you to edit and manipulate the image. Create a patterned effect that repeats seamlessly by making sure that all edges of the image meet up when tiled.
Design a single static background image that does not repeat by fitting the image's dimensions to the screen resolution that your website is optimized for. By choosing an image that fits your website's optimal resolution, you will eliminate stretching or blurring of the background. Create your own background from scratch by setting the dimensions in your image editing software. Begin designing as you would with a tiled background. If you are using a personal or royalty-free image, the image is ready to be added to your web page once it has been resized to the proper dimensions.
-
-
3
Save the completed image in one of the following file formats: .gif, .jpg, or .png.
-
4
Add the completed background to your website code. Locate the option within your web design software that allows you to insert the image. If you are coding your own website, open the site's code in the text editor of your choice and insert the image from there.
-
5
Upload the background image to your website.
-
1
Tips & Warnings
Your web page background will show up behind the site's body, so it is important to select a color scheme that will allow your website's text to be read.
Visit a search engine and look for free backgrounds if you need some design inspiration.Try modifying one of these public-use backgrounds in your own image editing software.
Make sure that the image you choose as the basis of your background is not copyrighted by another individual or organization.
References
- Photo Credit stone pattern image by Fernando Soares from Fotolia.com square towel image by Karin Lau from Fotolia.com
