Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Uploaded Image quality after converting to jpeg

Discussion in 'Adobe Forum:' started by szaz, Jun 26, 2016.

  1. szaz

    szaz New Member

    Hi Guys,

    I'm new to designing, so please bear with me.

    I have created some vector diagrams in illustrator. I have to use these diagrams in a professional online blog and add in to google docs as well to send it to some students.

    The problem is that when i submit the images to those who would publish my blog, they might choose to not have the image published to the 100% size. They might reduce it. And when reduced, the images doesn't look clear or good. The text is unclear. But once I drag the image to 100% size, it looks fine.

    Is there a way to maintain the clarity of the images even when it gets published at less than 100% of the original size?

    Thanks in advance.
     
  2. scotty

    scotty Well-Known Member

    Make it bigger?
     
  3. szaz

    szaz New Member

    As I mentioned, someone else is publishing my blog. I'm not sure of the size that would appear on the page as they would do it as per their requirements. They would probably scale it down and the image would be clear only when clicked on to enlarge. I need an option where even when it's scaled down to let's say 70%, it still maintains the clarity.

    I tried to change my original image size to something smaller and play around with the fonts. But that just destroys the aesthetics of my diagram.
     
  4. Levi

    Levi Moderator Staff Member

    Realistically there is nothing you can do to fix this issue because part of the 'scaling down' process is making things smaller which in turn reduces clarity and/or quality of the image. You have the same issue with any type of thumbnail which is there to be clicked on to show at 100%.
     
    szaz likes this.
  5. szaz

    szaz New Member

    I see your point there and that makes sense. Thank you clearing that out. You explanation made more sense than the Mr.Scotty rhetorical point. Don't answer if you can't help a noob.
     
  6. scotty

    scotty Well-Known Member

    I wasn't being facetious nor rhetorical.
    Let me explain...

    If the diagram isn't legible at a smaller size the "make it bigger".
    If it needs to be viewed at a certain size then make it clearer.
    If a diagram or info-graphic are not presenting the information in a clear way then it kind of defeats the point.
    Practicality sometimes outweigh aesthetics.
    I hope that makes it a bit clearer but if not I could always make you a diagram.

    By the way...It's "Mr Jackson" to you.
     
    @GCarlD likes this.
  7. szaz

    szaz New Member

    Thanks. My issue is that I am not going to be publishing the blog myself. It's being published by a professional online community. I might not be given a chance to view the final output. So I needed to know if there is anything I can do to make sure that the image quality isn't completely degraded when scaled down to 70 or 80 % (Just in case they decide to do so) and it is at least readable.

    But thank you. I'm sorry if I misunderstood your intentions. I'm not a designer. I do know how use Illustrator or Photoshop to produce some pretty images, just never had to optimise it until now for professional online publishing.
     
  8. ash

    ash Member

    Do they allow an .svg format? this will keep the quality and a user can zoom in without the graphic getting fuzzy
     
  9. Paul Murray

    Paul Murray Moderator Staff Member

    SVG isn't supported in all browsers though, so you'd need a fallback to a PNG/JPG which I assume the average publisher of the site may not know how to do.

    I'd probably just give them a range of sizes that you'd scaled in Illustrator yourself and let them pick the most appropriate. You may have to just deal with what you get given though. :unsure:
     
  10. ash

    ash Member

    true, I guess you can not add your own CSS and set media queries according to different screen-sizes?
     
  11. Paul Murray

    Paul Murray Moderator Staff Member

    You wouldn't use CSS for this, you'd need to add a fallback to the mark-up that just detects an error if the SVG doesn't load and replaces it with a JPG version. There's ways to do it, but it depends on what the site is using as a CMS.
     

Share This Page