I have a link to download an image heavy PDF on my site. It works fine in Firefox and Safari. But the 2nd to last page is rendered wrong when using Chrome. The background behind some logos turns black instead of white making them unreadable.
It even displays wrong locally, when just pulling the file into the chrome browser.
Is there a possibly and issue when exporting the PDF from Indesign? Maybe the file is too large? Thanks for any advice.
Link to PDF here
Related
I can't figure out why Chrome won't completely render this image while all other browsers can. https://www.c2-it.com/test/logo-test.html
The strange this is that if you open the image itself directly in Chrome it displays properly.
I have a website where I also run a blog at http://climatecanchange.com/blog/ and the blogs are stored in a mysql database and each is matched to a unique image in one folder. I use php to get the image filename and other data to display all the blogs on my page.
For blog #2, my image is not showing on any iOS device (Chrome and Safari) though it can be seen on computers and Google Pixel too.
The link is http://climatecanchange.com/blog/blogs.php?id=2. When I open the image in a new tab it just shows white space. But, when I try to save it (on Chrome), it saves the actual image to my camera roll.
Can someone please help me with this? Why is there a problem with displaying that specific image?
The image format is Web/P which appears not to be supported in Safari right now
https://caniuse.com/#feat=webp
I have web page (php page) and it is showing the image very well for any browser in my desktop, ipad (9.7 inch or bigger) but never show in iphone, android phone, and ipad mini. The mobile browser only shows black image.
I wonder that the image is too large (jpg), but same jpg file is showing well in desktop browser but is showing black in mobile browser.
I research google. Someone says this image may use CMYK format. How can I know this image is CMYK format? is it the issue?
Does anyone know how to fix the issue?
Give you an image sample
link: http://www.cbeiji.com/upload1812/20200308120858161866827.jpg
html:
<img alt="" src="http://www.cbeiji.com/upload1812/20200308120858161866827.jpg">
Desktop browser shows well.
Mobile browser doesn't show up. It is a black rectangle.
That's not a JPEG, it's a PNG.
Now, the browser doesn't really know or care what the filename is, but your server is using the .jpg extension to determine what Content-Type header to send back. Your server is sending:
Content-Type: image/jpeg
Obviously, since it's not a JPEG, some clients are going to have a problem with this. For the ones that are working... the browser is being nice to you.
By the way, you can verify this stuff yourself using one of the many metadata viewers online. For example: https://exifmeta.com/
Use an image editor and save the file as a regular jpg (or just right-click save as)
Make sure there is no transparency added
first check it with one image, see if that helps.
If you look at this page, you will see that the right two images are sideways:
http://www.disneypinplace.com/beta/pin.php?id=PD78685
But when you click on them, they appear correctly in full screen view, vertically. I can't see anything wrong in my HTML img code that could cause this.
Can anyone tell me why this is happening? These photos were taken with an iPhone 5 by the way.
This is a particular problem with how the iPhone exports images. Seem this link for a similar situation.
Computers/browsers and iPhone software interpret the camera metadata (details about image, including portrait/landscape) differently thus causing the difference in rendering.
I was able to download the far right image in Pixelmator/Photoshop and save it as a jpg again, making sure it was portrait. This made it so the browser properly rendered the image and did not rotate it 90 degrees.
Were these pictures taken sideways, by any chance? Have you tried editing and "exporting for web" from Photoshop, for example?
Maybe the problem is on the image EXIF (as in you only see the image correctly because the browser reads the EXIF info and rotate it on screen). Exporting it will most likely remove that info from the image file and it might make it correct.
I spent an hour with this that I'll never get back. :)
The Problem
I took the picture on my Samsung GALAXY Tab PRO 8.4. It rendered SIDEWAYS in an Android Emulator as well as in FireFox 42.0.
The Fix
I edited the picture in IrfanView.
I went to Properties_Settings -> JPG_PCD_GIF ->
UNCHECK "Auto-rotate Image according to EXIF info (if available)"
It now renders OK in FireFox. I haven't checked the emulator yet.
I have this annoying problem driving me nuts, IE 8 randomly won't show background images of my divs. One minute it shows, then the next time it won't. Then I have to refresh the page 2-3 times for it to show.
All my pages work fine on firefox, chrome.
Has anyone faced a similar problem? Any solutions?
I had a similar issue but the image would never show in IE8, regardless of how many times I refreshed the page. It worked fine in Chrome and FF (latest versions as of the time of this post).
The image file was created in Adobe Illustrator (CS3) and saved as a JPG. It turned out to be file corruption of the JPG that I resolved by opening the file in Paint.NET, saving as a GIF, opening the GIF and re-saving as a JPG. The issue does have to do with IE8 but Paint.NET had problems with the file as well. I could not save the original JPG as a JPG; I had to switch to another format and then back.
I hope this helps those with the issue I ran in to.