Font sizing of embedded pdf in html - html

I have a brief technical document/note with scientific symbols in pdf. Actually, it's only a half page. To show it on my website I have it saved as a png and then I display the png. But then it does not scale well with different display sizes.
My Adobe pdf viewer scales perfectly with different displays even though the technical document was typeset at 12pt font size.
What's the scaling solution for html on my website? I cannot recreate the technical symbols in html so that they look so good. Is displaying/embedding a pdf a good solution? But what if I only want half of the pdf page to be displayed since only half has any print?

Related

Images being displayed in wrong orientation

The company I work for stores some of their product images in Google cloud storage, and I've been able to fetch the images however when putting the img tags onto a page, they appear to be in the wrong orientation i.e landscape instead of portrait (no issues with images taken in landscape mode).
When viewing the image in a new tab however they appear correctly!
Is there a reason why this may be? Suggestions are appreciated.
I have tried putting the img on a blank page without an anchor wrapping it to see if that made a difference and it did not.
I'm guessing the OP is having problems due to EXIF data. If the original images contain EXIF data indicating that they should be rotated, special measures must be taken to get that data interpreted by a web browser when displaying a page. It is discussed here:
Is there a way to tell browsers to honor the jpeg exif orientation?
If the the solutions provided for exif orientation are not acceptable, the OP will have to preprocess the images to rotate them to proper orientation and save them that way on the serverside. Then the correctly rotated images can be delivered on web page.

Any way to display PDF in browser full screen

When displaying a PDF with standard (US letter) size pages, the PDF appears to be 'zoomed out' in Chrome. In Firefox, the PDF shows at a better zoom level.
Here is an example:
http://www.pdf995.com/samples/pdf.pdf
When viewed in Chrome on a 4k monitor, it is zoomed out so far that you can see 1.5 pages. While in Firefox you can see roughly half of the first page which in our case is much more desirable.
Is there any way that we can display this PDF at a standard zoom. For example, setting some headers, etc.
I'm currently using PHP to display the PDF, by setting the following headers and then echoing out the file.
Content-type: application/pdf
Content-Disposition: inline; filename=filename.pdf
Any ideas or suggestions would be great!!
From the description above
Chrome was and still does generally use "standard" 100% zoom.
Whilst FireFox was using Fit Width ("roughly half of the first page").
Many pdf extenders but not all will use the Adobe Acrobat URL trailing fragment so for the example in question try
http://www.pdf995.com/samples/pdf.pdf#zoom=200
however that can be fickle and require a second refresh of same URL.
Better (for more consistency) with the questions description of Firefox at the time use.
http://www.pdf995.com/samples/pdf.pdf#view=FitH
Which for me, with my current window in Chromium Brave / Edge will be 136% on this occasion, but some other 100%hv on a different window setting or screen.
Note the above can be over-ridden as much HTML can by the clients setting so assuming they allow a PDF to run with its own control, it works but if they pre-set remember last PDF view setting it may not.

Issue in png image when exporting SSRS report to PDF format

I have an issue in PDF exporting functionality in SSRS report.The report contains a PNG image with several lines.When I preview the report in browser(Both IE and Chrome) that image is displaying correctly but when I exported it to the PDF and open the file in PDF viewer software, the lines inside the image are getting blurry.
The image is loaded to a standard image control in SSRS report.I already have tried all the image size properties inside the image controller(like Original Size / Fit to size etc) and images with different resolutions, but still the issue is there. Please note that I can't change the image format from PNG to other one since I want to keep the image background as transparent.
Can someone help me to resolve this issue please?
This can be a number of things. Sometimes the image is fine but your screen resolution and the PDF viewer combined can make them look bad.
First, try to print the PDF and see if if still looks bad, if it looks OK printed then the chances are it's the screen resolution and/or PDF viewer causing it. I use Nitro PDF and they always look better than using Adobe Reader.
In anyway case, savingthe PNG with higher DPI setting will usually fix the issue. Typically I save PNG's at 600 dpi, which might be overkill but it does mean they are sharp on the PDF.
If you need a Windows tool to save at a different DPI, try Inkscape which is free. When you export images you can set the DPI to whatever you want. Try 600dpi and if that works.

Are ALL images 72dpi in web browsers?

I've used Fancybox (and similar) in the past to display images on websites. When I upload images to the server that are higher resolution than 72dpi, they usually take noticeably longer for Fancybox to load and display.
I was under the impression that all websites were displayed at 72dpi, and I threw images in under that general assumption. Can images be displayed at higher resolutions in a web browser? Is that why these images that I've used take longer to load? Or are they still displayed at 72dpi, but have to be scaled every time the page loads?
Thank you.
Images are shown at the resolution and dpi in which they are - for example; if i upload an 388dpi image to my site it will show at 388dpi at the same original resolution. The evidence behind this is that I am a web app developer. When first testing with one of my first apps we uploaded a full background image at 72dpi and the text wasnt very good so we made it higher dpi and same res and all worked perfectly!
Hope this helps!

PNG will not load from img tag in html, will load directly on a blackberry 8520 (4.6.1)

I have the damndest problem. A fairly simple webpage with an embedded png won't load on one particular device I've tested with. It's a Blackberry Curve 8520 running 4.6.1. The browser settings are all using the standard Blackbery Browser, e.g. not pointing to Firefox or IE identity.
I've tested it with a really simple cut down html page:
<html>
<head>
</head>
<body>
<img src="bblogo.png"/>
</body>
</html>
I know the above is technically html5, but that's not the problem it's just short hand included as an example.
The webpage is displayed with a red x for missing image. Yet the image will view fine if accessed directly, e.g. placing cursor over missing image and selecting Full Image from the blackberry menu.
This is the only device it happens on, other blackberries, iphones and 'droids have been fine. If I replace the image with a jpg it's fine. Other png formats are also broken (128 color 8bit png, 24bit no transparency, 24bit with transparency).
So what's going on here and is there a solution? Is it configuration on the local device or something the BES could be doing to the image when it's embedded in a page but not when it's served directly?
I'm trying to avoid jpgs due to color dithering issues on older mobile phones.
Any advice gratefully received, I'm a complete blackberry newbie so know very very little about the devices or their configuration. However from what I've read png support should be pretty solid.