I've designed some badges for a new forum. In the mobile version I would like these to display the same size as the navigation icons.
I know that if they are too detailed, detail will be lost once they get too small. However, the badges are flat with not too much detail. But they do have text descriptions in the design. When I save and upload them as PNG, the design is very fuzzy and the text unclear even though it's at an ok size.
I'm using Illustrator to do this and wondering if there are some best practice methods in designing and saving PNG images so they are clear and sharp on the web at smaller sizes.