Jump to content

Background Images


Recommended Posts

Hello All,


I am trying to get this image thing down and I can't wrap my head around the process. I am just trying to have a nice background image as a full page(I took one of the sample images from windows to play with)and then add different elements on top of it. I can't even get the image to appear. I think I am not using the url part correctly...When you have a moment can you have a look please?


Link to comment
Share on other sites

Solid background images are not a good choice for many reasons.


  1. Weight/size - there is a rule of thumb size for pages, such large images get you close without much of anything else.
  2. Accessibility - An image will have differences in colors and shades. These differences can make it very hard for the user to read the text color/font against it as it will contrast well in some places and poorly in others. This will tire the eyes and people will move away from your site faster than they would normally. Add then to the basic facts those with disabilities and it gets worse much faster. People with vision impairments will have a harder time. People with cognitive issues like dyslexia and ADHD for instance and even concentration issues or if they have tired eyes from work.
  3. Time - such large images take time to render where the user has to sit and wait, which these days few people want to.
  4. Cost - Your users pay for your choice as that adds much more data transfer to their providers limits then it needs to.

Those are just a few quick reasons. Your best bet is always a simple low contrast background made of small blocks that will tile automatically to fill the screen. This way all you have a a small image repeated after being loaded once. More like a mirrored repeated image.

Link to comment
Share on other sites

Take it from someone who just tried to do a job full of a massive background image, LSW is very right :bash:

All it will do is drive you crazy with any code that is anything above basic, so you will have to work around the image instead of using it to your advantage...


Also, i can't open the image through the path you put in the CSS, so its either a path issue, or maybe you have it set to .jpg when the CSS says .jpeg? Not sure if that changes anything, but its a possibility :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...