I've got a PSD template to convert it to HTML. How do I deal with the background food images (highlighted red on the image) when I zoom-out (ctrl--) the browser? The total width is 1300px, container is 1000px. What would be the best approach? Do I repeat them? How? What would you do? Thank you.
One possible solution is to make the images to the left and to the right larger than the visible page area and set the columns (or divs) that contain these images to an expandable value, e.g. left colum: 49% center colum: 2% right colum: 49% Then place something into the center colum that cannot become smaller than the minimum width of your site content, e.g. a div or a an img with a fixed with of 1000px. The left and right columns can then be filled with a background image that is much wider than the visible space, so that when the colums expand, more of their background image becomes visible. Here is sample website that is using this approach: http://pizza-recipe.bitpalast.net .
How about making a great background image and if visitor zooms he will see more or less from the background but the background stays still?
Welcome what happens when someone blows smoke up your backside deluding you into thinking that dicking around in Photoshop is web design. It is NOT. Those background images are too massive to belong on any legitimate website for a business, so the REAL solution? GET RID OF THOSE! There are other worries -- the yellow or white on that green are below accessibility minimums, the center images reek of "for print" design that has zero business on a website either... Lemme ask you this -- forget zoom -- what happens when you're on a device with a smaller screen? A larger screen? Figure out what the CONTENT actually is, create semantic markup for that content with zero concern for what it's going to look like, then create your responsive layoutS -- YES, plural! Then and only then do a paintover with accessible colours or product images. Screwing around in a paint program that only works in pixels, creating a single pixel based design is not web design! My advice, pitch that scam artist nonsense in the trash and learn what a website is.