I have a mac and use safari, my site looks fine and I created my own header by customizing the zenlight theme. When I view it in safari its fine but others with smaller computer screens see the edges of the header cut off. I then changed my header from black and white to colour and the file size of the header increased from 146k to 585k and wont even load in IE and is evem slow in safari. What do i need to do to make it work. Please Please help!! Its www.ashleycrowley.com any feeback would be really appreciated I'm really trying here.
Wordpress header problem
- Thread starter newtothis
- Start date
matobo
Member
I downloaded your header and viewed the image size in Photoshop Ashley. I am not surprised that your graphic is struggling - 300dpi is print resolution and not necessary for the web. Try using the 'save for web and other devices' option if you use Photoshop and it will automatically take the resolution down to 72dpi for you. The high resolution jpeg option shouldn't affect the quality too much.
Regarding the edges being cut off the side - your image is a fixed 1000 pixels wide and there isn't much you can do to fix that on smaller screens. You could take it down to 800 pixels wide which will suit older smaller monitors, but you will probably find that people with newer ones won't have any problems viewing it. Was the original graphic there 1000 pixels wide? If so, then you shouldn't worry about it.
Regarding the edges being cut off the side - your image is a fixed 1000 pixels wide and there isn't much you can do to fix that on smaller screens. You could take it down to 800 pixels wide which will suit older smaller monitors, but you will probably find that people with newer ones won't have any problems viewing it. Was the original graphic there 1000 pixels wide? If so, then you shouldn't worry about it.
matobo
Member
I right clicked on it (also on mac) clicked 'view background image' it opens up in a new window and then right clicked again on the image and 'save image as' to download it to my desktop.
It is hard to keep the resolution up when you change it from 300 dpi under the 'save for web and other devices' option, but there are ways to play with the settings - The high resolution jpeg is usually the best you will get under the jpeg option - but you might find that changing it into the highest .png option is the better route for maintaining quality... but then you will also have to change the code to the new extension.
You could also try different options to see if you can reduce the file size manually - keep the dimensions locked and change the image size resolution from 300dpi to 150dpi and move down from there to see the impact that it has on your file size. In all honesty the 300dpi is where your current problems are stemming from.