What is the proper method for designing and implementign a logo in a mobile responsive site? I currently link to my logo from with the html. But the logo is a bit fuzzy. I notice sites with super crisp logo that when you 'view image', the image is much bigger than it appears on the page. How do I achieve this? Thanks!
Start with the proper image file format. If the image is a photo or contains many gradient shades of color, use .jpg. If an image has only a few distinct colors good contrast and little or no shading/gradient colors, a .png would offer better compression.
Use an image editing tool such as PhotoShop to produce a good quality image to the scale you need. There are at least dozens of fairly easy inexpensive or free tools to scale images. How to scale? Set height or width and scale proportionally so the image is not distorted.
The css part is easiest. Set a default image max-width of 100% and control the image size automatically by the size and padding of its container element (assuming the container width is responsive).
You can use the "srcset" attribute of the <img> tag, (there is also a <picture> tag, but I found the img + srcset was working better). Like that you can serve different size of an image based on device resolution.
If your logo is suitable for it, the best remains the SVG format.
Is it the same on all devices? Historically, Guess Which Browser was famously bad at resizing images. It will be different, of course, on mobile platforms.
If you can't go with SVG, you're really better off creating a small number of static files and serving them at actual size, selecting the one that's the best fit for the user's device. That way you're not expending bandwidth sending material that can't be displayed (like a 600px image displayed at 150px), and you don't have to trust the user-agent to get things right.
Edit: I took a quick run over to caniuse dot com.
IE9-11 desktop & mobile don't properly scale SVG files.
Finally, the vast majority of logos (and similar graphics) should be designed in a vector format, and should therefore be easy to convert to SVG. If you have existing graphics in raster formats, get them redrawn.
Anyone still drawing graphics in a raster image editor, has seriously obsolete skills and you should no more employ them than you would a programmer who insists on using punched cards, or a carpenter who does not own a hammer because you can drive nails in with a screwdriver.