1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Embed in responsive web

Discussion in 'CSS' started by piropeator, Dec 12, 2015.

  1. #1
    Hi everyone.
    I have this code example (show a pdf file in a screen).
    <body>
    
        <embed src="Add.pdf" width="800" height="400" type="application/pdf">
    </body>
    </html>
    HTML:
    I want this code in a responsive web versión for smartphone.
    How I do that?
    SEMrush
     
    piropeator, Dec 12, 2015 IP
    SEMrush
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,157
    Likes Received:
    1,708
    Best Answers:
    239
    Trophy Points:
    515
    #2
    PDF's are themselves fixed size layouts -- they ONLY exist for the purpose of print, that's what they were designed FOR. As layouts designed to be shown at a fixed size, they are the polar opposite of responsive design and will not nor ever be such!

    Trying to shoe-horn one into a website is NEVER going to be accessible, much less usable on a small screen device. It is in fact the antithesis of accessibility and many mobile devices will flat out refuse to EVER show a PDF. Generally speaking using PDF's on websites are a giant middle finger to accessibility and usability.

    (... and that's before we talk about embed as a IE specific proprietary tag that should NEVER have been allowed into HTML 5 and is a significant part of why I call 5 the new 3.2)

    You want a "responsive" web version, you need to make a webform in HTML and style it with CSS, not dick around with a print media format since as web developers have tried to tell people for nearly two decades, the web is not print!
     
    deathshadow, Dec 12, 2015 IP
    sarahk likes this.
  3. piropeator

    piropeator Well-Known Member

    Messages:
    194
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    121
    #3
    Well, I dont want to print a pdf, I only want to show a pdf information, for example originals documents, letters, memos. For information only.
    That using a desk top computer or smartphone.
     
    piropeator, Dec 12, 2015 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,487
    Likes Received:
    368
    Best Answers:
    28
    Trophy Points:
    335
    #4
    The issue is that pdf docs are designed to display as physical objects. That mobile display, or even a not-huge monitor is going to be a pain in the ass, as the rendering will be the size of the document. For example, in the US a common size will be 8½ × 11 inches on the screen as it would be when printed, and not resizable without a lot of dicking around.

    gary
     
    kk5st, Dec 12, 2015 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,157
    Likes Received:
    1,708
    Best Answers:
    239
    Trophy Points:
    515
    #5
    Then you are best off copying that information out of the PDF and making a proper website out of it. PDF on websites is like trying to adapt a diesel locomotive and ten boxcars to go down a normal road.
     
    deathshadow, Dec 12, 2015 IP
  6. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,630
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #6
    While the statements about pdfs are correct, it's not a problem showing pdfs on mobile devices. Just be aware that most browsers on mobile devices will download the file, and show it in whatever pdf reader is set as the default.
     
    PoPSiCLe, Dec 12, 2015 IP
  7. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,157
    Likes Received:
    1,708
    Best Answers:
    239
    Trophy Points:
    515
    #7
    Assuming it even can...
    Assuming the flash storage is unlocked, and the user doesn't mind it chewing on battery and ending the device's functionality prematurely due to flash burn-in...

    Assuming there is one... which for a good number of phones and tablets there is no default one.

    ... and that's all assuming that devices at 480px or narrower (or lying about being that size like retina does no matter what you set the viewport meta to) can handle something designed for 300 to 1200 dpi 8.5x11, which is usually such a disaster mobile device owners end up playing "Send me to heaven" without even installing the game.

    ... or is that just a New England thing?
     
    deathshadow, Dec 13, 2015 IP
  8. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Messages:
    6,138
    Likes Received:
    1,208
    Best Answers:
    22
    Trophy Points:
    400
    #8
    I never had a chance to use a responsive .pdf file on my own sites, so I ran a test, just for fun, using a sample .pdf file and a test page. As it has already been mentioned your .pdf file will be impossible to read even on large cell phone screens. It looked ridiculously small. I'd say don't waste your time trying to implement something that won't be of any use to you and your users.
     
    qwikad.com, Dec 13, 2015 IP
  9. piropeator

    piropeator Well-Known Member

    Messages:
    194
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    121
    #9
    So how I view documents in PDF format in a responsive website?
    Any recommendation?
     
    piropeator, Dec 15, 2015 IP
  10. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Messages:
    6,138
    Likes Received:
    1,208
    Best Answers:
    22
    Trophy Points:
    400
    #10
    This is how it looks on my test page. Can you read anything? And the screen is still pretty wide, mind you.

    1.gif

    You will have to figure it out on your own. I don't want to be accused of utilizing bad practices. My question to you again is "Why do you even need it?"
     
    qwikad.com, Dec 15, 2015 IP
  11. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,157
    Likes Received:
    1,708
    Best Answers:
    239
    Trophy Points:
    515
    #11
    Much less where did you even get the idea it can be done in a useful fashion?

    PDF's are not responsive, period. As such they inhale upon the proverbial equine of short stature on anything LESS than a print device or a 1080p desktop size screen. (and honestly even at 1920x1080 24" a LOT of PDF's are useless trash even set to full screen width)
     
    deathshadow, Dec 15, 2015 IP
    qwikad.com likes this.
  12. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,630
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #12
    I really don't understand what PoS mobile devices you have. Or how bad your eyesight is. If I pull up the disassembly manual for a HP DV6 on my cell phone (5" 1920x1080p screen) I can read it just fine. And if there should be something less visible, I can zoom. Which is the good thing with pdfs, they are made for print, and you're usually able to zoom quite a bit.

    And, really, what are you running, hardware wise? I feel like I'm talking to people running HTC Heros. I prefer to assume silicon Valley / Manhattan style quality hardware. ;-)
     
    PoPSiCLe, Dec 15, 2015 IP
  13. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,157
    Likes Received:
    1,708
    Best Answers:
    239
    Trophy Points:
    515
    #13
    Anything older than two years? Not everyone can go and blow two weeks paychecks on the latest and greatest; particularly when service providers do NOT provide them "for free" or at a reduced rate with contracts. My most recent 7" tablet is only 800x1200.... my phone is 480x800.


    5" 1920x1080? What are you doing holding it 3" from your face? Much less zoom and "pan & scan" are useless crap if you're actually trying to read or digest content; that's WHY we have responsive layout for HTML and CSS in the first place alongside things like dynamic fonts -- so users don't have to try and zoom or scroll sideways since all that does is UTTERLY AND COMPLETELY PISS USERS OFF!!!

    ... and on my 18.4" 1920x1080 laptop at a comfortable viewing distance of just under two feet, assuming you mean the first result on google for "HP DV6 disassembly PDF" you find that usable on a 5" screen? WHISKEY TANGO FOXTROT!?!?! It's useless crap at DESKTOP resolutions... the only place I would find that useful, legible and navigable is on my 27" 2560x1440 display (at the normal viewing distance of somewhere between 3 to 4 feet).

    Though admittedly again I watch most people use computers and my back, arms, wrists, and eyes hurt just watching them hunched over the damned things their faces glued inches from the display... Doesn't that HURT?!?
     
    deathshadow, Dec 16, 2015 IP
  14. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Messages:
    6,138
    Likes Received:
    1,208
    Best Answers:
    22
    Trophy Points:
    400
    #14
    @PoPSiCLe then you need to post a viable solution. It seems like the guy really needs it.
     
    qwikad.com, Dec 16, 2015 IP
  15. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,630
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #15
    I've had Android for... lemme see... 5 years or so now? The first one had a resolution of 480x854px, on a 4" screen. The one after that had 768x1280, and all after that have had full HD. I change phones maybe every other year or so, depending on how sturdy they are.



    Nah, I hold it about 20-30cm from my face, normally? Usually in my lap if I'm on public transport, and if I'm lying on the couch, usually closer, just because that's more comfortable for my arms.

    I was gonna post a screenshot of that PDF on my phone, but the filesize was too big, and I couldn't be arsed mucking about with it. I can probably find it again and see if I can upload it somewhere and just link it.

    I usually have my laptop on my lap, and that works just fine - if I have my phone or my tablet, they're usually also in my lap, if I'm sitting, if not they're usually at the edge of the couch, or on my chest, depending on how I lie.
     
    PoPSiCLe, Dec 17, 2015 IP