Why are PSD images pixelated on Mobile site?

Hi all,
In my muse site I have several .psd images that are pixelated when rendered on a mobile version (testing on iPhone 5).
They are psd buttons with a normal & rollover state. I have tried the knack I read somewhere of reducing both layers opacity in PS to 99% but this hasn't helped (can't remember why this would help).
When you pinch to zoom on the mobile, the image obviously gets more pixelated. The image is 165 x134 px....Is it a case of designing the image much larger and then creating a frame in Muse at 165 x 134 and placing the large image in this smaller box? Would this appear crisp when zooming in? The image even at normal size still seems pixelated too?
Really stuck on this one for a while so any help would be much appreciated. The 4 psd buttons appear under 'Features' on the middle of the home page.
thanks.
haventechnologies.businesscatalyst.com/index.html

I don't know if this applies, but:
Dark-tinted or dimmed images | 8sms
You may want to ask here:
http://androidforums.com/

Similar Messages

Why are my images pixelated in Bridge?

When I'm in Bridge, some of my images look fine, others are pixelated. When I open the pixelated images in Camera Raw or Photoshop they are perfect. What gives?

What sort of images are these? It might be a good idea to try both of the suggestions at the top of the forum page:
Remove minor corruption by exporting
Replace Your Preferences

Why are my images scrolling from outside the Page width?

Why are my images scrolling from outside the Page width? I am positive i has all the settings correct, to have an image parallax scroll from the edge of the page into the page and out again. But the images are flying in from the browser width - not the page width. This is not the effect I am after.
Any suggestions on how to fix this? Given the key position is only linked to the height, I can't for the life of me work out how to ensure the images start moving from a certain position onthe left and right of the page.
Thanks

I think the effect you are seeing is a result of how the lineHeight is set up. By default, the lineHeight will be calculated as 120% of the size of the largest thing on the line -- in your case, this is the inline graphic. This is designed to leave space between the line before and the line with the graphic. So it is taking the height of the graphic, multiplying by 120%, and making this the distance between the previous line and the line with the graphic. So the bigger the graphic, the bigger the space above the graphic. Normally this works well with text, but in this case you may want to get closer to "set solid". You can do this by setting the lineHeight to 100%. Or you may wish to leave a couple of percent for the descenders of the previous line. Or, another alternative that may work well for you if you really know exactly where you want the line set, you could measure the graphic, add on the number of extra pixels to leave for the descenders, and make the lineHeight a constant. So you could do something like this:
<img lineHeight="104%" height="411"/>
or this:
<img lineHeight="423" height="411"/>
Obviously you would still need to specify the source and any other parameters you want on the image.
Note that if you are trying to fit a 200 pixel high graphic into a 200 pixel high container, you will hit the same problem -- in order to fit the graphic, the container will have to be slightly bigger than the graphic in order to fit the descenders on the last line. This is true even if the last line contains only the graphic, and no descenders (or text) at all.
Hope this helps,
- robin

Why are my images suddenly darker in camera raw and photoshop C4 than when I open them in bridge?

Why are my images suddenly darker in camera raw and photoshop C4 than when I open them in bridge?

"Catalog"? Are you referencing Ps Elements perhaps?
Wrong forum. We do not do Elements here.
Here's the link to the Elements forum:
Photoshop Elements

Iphone 4s with upgrade to ios 6, why are the images I save "save photo" not in my camera roll?

I have an iphone 4s upgraded with ios 6. Why are the images I save "save photo" not in my camera roll? Where do they go?
Thx,
surfin steve

Hey, I just had this problem, I went into Settings -> Privacy-> Facebook (which is where I was saving photos from) -> turned it on, then back to settings -> Facebook-> and logged in. When I went back to Facebook and saved a photo and it saved to my camera roll. I haven't tried it with anything else yet though. Hope this helps!

Why are my images only showing as links on websites?

Why are almost all of my images showing up as a link to the image. I put a code in right for embedded images but when i refresh or re-visit the page with the embedded image it is no longer embedded. It shows up as a link to the image which is quite annoying. I have followed everything here http://support.mozilla.com/en-US/kb/Images+or+animations+do+not+show but none of it applies to me. I have reinstalled and checked everything in that website page.
== This happened ==
Every time Firefox opened
== Unknown, but I did not make changes to firefox.

The code for all of the images in that thread is this:
<code>[url=http://img442.imageshack.us/i/packageplans.png/][url]http://img442.imageshack.us/img442/4330/packageplans.png[/url][/url]</code>
 ''(Edited by Moderator: placed link in a CODE block - c)''

Why are some images being exported to Assets folder?

On my desktop I have the structure of an Assets folder and within that a Images folder. When I export to HTML it puts a few of the images in the Assets folder. They are ones that are hyperlinked from a smaller image so that when they click on the smaller image the larger jpg opens in a new window. I have security on the Assets folder on the server so I don't want these to go in there. I am having to manually move them into the Images folder and then update the links in the HTML files. Is there a way to make them go into the Images folder like all the rest of the images are automatically doing when I export? By the way I don't want them to be a Lightbox slideshow. They are large images so I want them in a window so the person viewing them can move around in the browser to view the image if they have a smaller monitor.

Using Acrobat DC and the acrobat arrow tool. By right clicking on an image a submenu pops up. One of the items in that list is "Edit Image". Ordinarily or historically this would then open the image in Photoshop as a temp file. Edits could be made and saved and the image would be auto updated back into the PDF. In DC when selecting edit image, the document goes into a edit mode and the entire file gets converted into RGB color. From here one could again right click on the same image and get the option to edit using another program, (like photoshop). When returning back to document mode, the RGB conversion remains.
I determine the files are converted to RGB by using the inspector tool in Acrobat as well as looking at the colorspace in Photoshop
I determined the files were CMYK by building them that way and again verifying using Pitstop inspector.
Following screen grabs show image before / and after selecting "Edit Image"

Why are my images grey in the .pdf?

Hi,
I began working on a 72 page project that was already begun by my co-workers who are not familiar with CS5. In InDesign, there are a total of 618 links. Hundreds of them were missing, so I spent some time re-linking the images. There are 45 images still missing, but they are on my co-workers laptop. So that is an easy fix.
The real problem is when I convert the InDesign CS5 file into a .pdf all of the images appear as grey boxes. Even the images that have been re-linked! How can I fix this? Any advice is most appreciated!

What sort of images are these? It might be a good idea to try both of the suggestions at the top of the forum page:
Remove minor corruption by exporting
Replace Your Preferences

Why are my images coming out of CS5 Photoshop granulated and pixelated after saving?

I am new to CS5 Design Premium. I use a Canon 50D and shoot in RAW format. I upload my pictures into Bridge and do most of my editing in Camera Raw, then I open the object into Photoshop where I save the image into a folder. I save each image as a .psd file AND a .jpg file. I save an extra as a .jpg so I can upload to my website and to order from the lab I use.
My question is: Why is it that my pictures are so granulated when I open them back up? They look completely fine on the screen but when I re-open them or upload them to my site, they look terrible. Have I messed up something with the formating/file size/ppi...? 8-bit, 16-bit? PPI...?
I am confused here and highly discouraged from using my new program....HELP PLEASE!!

Are you seeing this problem, when you Import those PSD's into a Premiere Pro Project, or in Photoshop?
If the former, have you done the Scaling to match the Frame Size of Sequence in PrPro? If not, this ARTICLE will be helpful. Note: in Video, DPI/PPI is meaningless, and only pixel x pixel dimensions matter.
If the latter, you will want to post to the Photoshop Forum.
Good luck,
Hunt

Why are my images being pixelated when using free transform?

HI.
I am pretty comfortbale with PS but stil learning more of the finer details. I can't find an answer for this on any help topics or threads.
I often bring several images into a document or workflow and it seems that when I reduce an image that's too big for the canvas, it looses it's quality as soon as I break out the transform tool and becomes very pixelated. Any thoughts?
Thanks very much

Thanks for both of your suggestions. My images are at 100ppi resolution and I am viewing the documents at about 150% the entire time. My image interpolation is set for bicubit (best for smooth gradient).
I've tried to reproduce the problem in different ways before replying here and think I've narrowed it down a bit. It seems that when I use the File->Place way to insert an image into an existing document, I don't run into this pixelation or image degredation issue. It's only when I drag an image from one document to another using tabbed document introduced in CS4 (I'm using CS5 btw).
If I have document 1 open and drag an image (or layer) from document 2 into document 1, then resize that image in document 1, I get a loss of quality. Not sure if that helps anyone else. Also not sure why this is hapenning as the ability to drag layers back and forth is pretty handy and I'd rather not give it up.

Why are my images darker on a mobile device?

Ok so here's a weird question. When I edit my images in PSE12, they look flawless on my computer. They even still look great on Facebook on my computer. When I view my images on my Android phone, even on Facebook, the images are darker, the colors are what I can best describe as violent. My customers say that the images are still great on disc. What my question is, how can I make the images look better on my Android phone and would my customers see the same awful colors on their devices or would they look like they do on a computer? I've tried resizing the images, readjusting, converting to sRGB, you name it. HELP PLEASE!!! Lol. I just want a fair and true representation of my work on mobile devices as they are on PC. Forgot to add that even when I just transfer the images via USB to my device, they're still dark.

I don't know if this applies, but:
Dark-tinted or dimmed images | 8sms
You may want to ask here:
http://androidforums.com/

Why are some images at a shopping web site not displaying?

images at JCPenny don't display when I'm shopping a particular item, click on it and the details come up. The photo of the item won't display, just the details. The small block icon at the top and bottom of where the photo would be is visible but the entire area where the item photo should display is blank.
I'm using Firefox 8.0.1

If images are missing then check that you aren't blocking images from some domains.
*You can inspect and manage all permissions on the about:permissions page, via the location bar.
*Check the permissions for the domain in the current tab in "Tools > Page Info > Permissions"
*Check that images are enabled: Tools > Options > Content: [X] Load images automatically
*Check the exceptions in "Tools > Options > Content: Load Images > Exceptions"
*Check the "Tools > Page Info > Media" tab for blocked images (scroll through all the images with the cursor Down key).
If an image in the list is grayed and there is a check-mark in the box "Block Images from..." then remove that mark to unblock the images from that domain.
Make sure that you do not block third-party images permissions.default.images
*http://kb.mozillazine.org/Images_or_animations_do_not_load
There are also extensions (Tools > Add-ons > Extensions) and security software (firewall, anti-virus) that can block images.

Why are my images looking oversharp/pixelated when opened in CS from LR

When I open up my images in CS from LR they look oversharp when zoomed out to view the whole image. You can see it in her hair in this image
When I zoom in closer it looks fine
Any idea how to fix this?
TIA!
Amanda

What is there to fix? When zoomed out that far, your monitor can not display all the pixels needed. If you could fix anything, it would be increasing your screen resolution assuming it is even possible. Most video cards have a hard coded limit just like the monitor has a limit. To go beyond those limits would require purchasing a new card and/or monitor.

Why are still images importing larger than their size?

Per instructions in a thread I had here last week, I created all of my DVD still images at 720 x 534 pixels for Premiere Pro CS5.5. But when they are brought into a DVCPRO50 NTSC Standard sequence, they are being heavily clipped. The original in one example is this:
But when that same images is brought into PP, it is sized up like this:
It's still proportionally correct, but a lot of the top and bottom of the image are gone. The encoded MPEG-2 sequence and disk I've done as a test display just like that.
Why is PP doing this, and how can I get it to use images built to the correct size to be used 1:1 in a sequence instead of being scaled to about 115% of size? Hate to compare this way, but this was never an issue with Final Cut Pro, which I'm switching from. Stills created to the size FCP needed of 720 x 540 displayed and finished exactly as they were made in Photoshop. The only image area lost was the normal bit of overscanning DVDs display at on your TV.

I guess I don't understand. This is an excerpt from the CS help. This seems to be inconsistent with what the last two posts said.
Composition settings presets for square-pixel equivalents of standard definition formats have changed as follows:
format
pixel dimensions in After Effects CS4 and later
previous pixel dimensions
NTSC D1 square-pixel equivalent
720x534
720x540
NTSC D1 Widescreen square-pixel equivalent
872x486
864x486
PAL D1/DV square-pixel equivalent
788x576
768x576
PAL D1/DV Widescreen square-pixel equivalent
1050x576
1024x576

Why are my images positioned further down the page as size increases?

Hello,
I'm experiencing a problem with images that I'm a little baffled about.
My image tag is listed as below and comes below text in other plain paragraph tags.
<img id="p_image" height="411 width=312 source={src} styleName="image"/>
The image is not appearing. If I decrease the height to 50 it appears (obviously skewed though) and is positioned below the text.
If I increase the height to 300 it appears but now the top of the image is further below the text.
If I set the height to 411 it doesn't appear I assume because the combination of the image height as well as the increased space between the top of the image and the preceding paragraph puts it off the page.
Why does the space below the paragraph increase as the image height increases?
Images attached.
Any help is appreciated.
Thanks, peter

I think the effect you are seeing is a result of how the lineHeight is set up. By default, the lineHeight will be calculated as 120% of the size of the largest thing on the line -- in your case, this is the inline graphic. This is designed to leave space between the line before and the line with the graphic. So it is taking the height of the graphic, multiplying by 120%, and making this the distance between the previous line and the line with the graphic. So the bigger the graphic, the bigger the space above the graphic. Normally this works well with text, but in this case you may want to get closer to "set solid". You can do this by setting the lineHeight to 100%. Or you may wish to leave a couple of percent for the descenders of the previous line. Or, another alternative that may work well for you if you really know exactly where you want the line set, you could measure the graphic, add on the number of extra pixels to leave for the descenders, and make the lineHeight a constant. So you could do something like this:
<img lineHeight="104%" height="411"/>
or this:
<img lineHeight="423" height="411"/>
Obviously you would still need to specify the source and any other parameters you want on the image.
Note that if you are trying to fit a 200 pixel high graphic into a 200 pixel high container, you will hit the same problem -- in order to fit the graphic, the container will have to be slightly bigger than the graphic in order to fit the descenders on the last line. This is true even if the last line contains only the graphic, and no descenders (or text) at all.
Hope this helps,
- robin

Why are PSD images pixelated on Mobile site?

Similar Messages

Maybe you are looking for