Need help with image resizing (re: slow site)
-
I'm trying to figure out why I'm having speed issues with my site, and using google speed test to help me knock out some of the issues.
One of issues deals with image resizing. I have a responsive design and so even though on the home page the normal width is 580 of the blog area, the full post can go up to 1170. So I size all of my images to 1170 wide and let CSS resize them depending on the size of the browser. (The images on the most recent post are a little bigger than this because I was testing something.)
I was wondering what the best practice was in regard to what I'm trying to do.
Also feel free to check out my site and let me know of any other feedback / advice you have. Thanks !:)
-
Thanks a lot Keri,
These days with the online competition being so strong we should pay more attention to the website architecture, usability, visual impact, speed and technical problems. SEO it's so complex that you'll find yourself overwhelmed by the number of critical issues that needs to be addressed and fixed. Don't focus just on the content try to enhance every aspect of your page from to . Optimizing pictures takes only a few moments and you can use automated functions in Photoshop.
-
Another area to help with the images is to host them on a content distribution network.
Amazon is not the cheapest, but its the easiest for low volume.
A few stats:
I host about 4000 images on Amazon S3.
My bill is about 4 bucks a month.
You can put your images in a few areas (west coast vs east coast etc)....
This will help get your images closer to your audience, but it will not help you with the "last mile"
I had a customer uploading 7 MB images in Wisconsin using dial up....
can't help them...
I'm alos moving to Cloud Front, amazon Content Distribution Network...
Also, you use chrome to determine what's causing the delay.. many times, images are just part of a larger problem...
-
Hi Rick,
To the best of my knowledge, smushit compresses what it can while keeping the quality exactly the same. Saving for the web will lower the quality to "looking good on screen" from "good enough to print and hang on your wall". I also looked at the most recent post about Noah standing, and saw that the original size was 1900 pixels wide -- you certainly want to resize that to the 1170 wide before uploading it.
Being a photographer with a portfolio, Coltaire can give you a lot more details than I can, and help guide you with settings to use in Photoshop to get pictures that still look great on the web but aren't bigger than they need to be.
-
Thanks for the kind words.
As I mentioned sometimes I like to do full width posts which are 1170 wide so if I use 800x600 the images won't show up correctly on full screen. -
Rick, you have a wonderful son and the story of your website left me without words and I don't know if I can give you a good response at this moment... Try resizing them to 800x600, the size accommodates a lot of user screens / mobile traffic.
Have a wonderful day
-
Yes, i use catching. But like I said, saving it for 640 wouldn't work for me since I want image to show up bigger than that if the screen is 1170. I'm assuming the images wouldn't be able to be resized any bigger than 640 without looking stretched.
-
I never used that tool and I think it's ok to use it in some situations but you have a lot more control of the file saving for web in PS, lot more options and the quality loss is insignifiant.
Take a look at my Portfolio page. All of my files are 640x480px/72dpi/50-60quality/jpegs.
Also are you using any caching / minifing plugins?
-
I'm using smushit to make the file size smaller, but I need to be able to at least have 1170 for full width posts (like this one.) I don't think I need to use save for web if I'm using smush it do I?
Does having css resize the images cause a site to slow down a lot?
-
I think that your images are very big and are slowing down your page speed and affect your rankings. Why don't you try to scale and reduce the quality using the "Save for web" feature in PS, it's fast and you have the option to compare with the original file when saving? 800x600 , 640x480 px are large enough to be properly visualized, Think about the different screen resolutions your visitors have. I avoid using pictures larger than 100kb and my average picture quality when saved for web is 60%. Hope it helps.
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Is there an issue if we show our old mobile site to Google & new site to users
Hi, We have our existing mobile site that contains interlinking in footer & content and new mobile site that does not have interlinking. We will show existing mobile site to google crawler & new mobile site to users. Will this be taken as black hat by Google. The mobile site & desktop site will have same url across devices & browsers. Regards
Web Design | | vivekrathore0 -
How much copy do you need on the homepage?
The general rule used to be around 300 words of copy on the homepage, but so many new websites now have very little copy, if any, on the homepage. Has the best practice changed here? If you include keywords in the title and header tags, is that enough to support strong SEO on the homepage...or do you need a few hundred words of copy still? Would love to hear what others think.
Web Design | | KevinBloom1 -
Re-designing a homepage
Hi all, Of those who've done it or have valuable advice to impart, what are the things to look out for when re-designing a homepage? In the same breath, what are vital considerations and elements to include/features to bear in mind when 'prettying up' a primary landing page as a homepage essentially serves as? UX fundamentals? Thanks folks
Web Design | | Martin_S0 -
Can white text over images hurt your SEO?
Hi everyone, I run a travel website that has about 30 pre-search city landing pages. In a redesign last year we added large "hero" images to the top of the page, and put our h1 headlines on top of them in white. The result is attractive, but I'm wondering if Google could be reading this page as "white text on white page", which is an obvious no-no, especially if it could seem that we're trying to hide text. Here's an example: http://www.eurocheapo.com/paris/ H1: Expert reviews of cheap hotels in Paris I should add that our SERPs for these city pages has dropped (for "Cheap hotels in X"), but it could obviously be related to other issues. Any advice would be appreciated. Many thanks! Tom
Web Design | | TomNYC0 -
Avoiding duplicate content with multi-lagusage site
Hi, We have a client in China that is looking to create three versions of the same website, English, Chinese and Korean. They do not want to use a translation plugin like Google translate, preferring to have the pages duplicated. What is the best way to do this bearing in mind that the site needs to be found in all three languages. Would also appreciate if anyone knows of a good hosting company that has English support on the Chinese main land. Thanks Fraser
Web Design | | fraserhannah0 -
Question About Site Redesign and Nav / Page Structure
Hey guys, i am currently redesigning our company's site, and have come across some things that I'm not quite sure of. We used to have individual service pages in our main navigation (design, video, marketing) before the redesign. In this new design, i had the idea of making just one "services" or "capabilities" page, where these three services would each be outlined, and each service would have a list of links to more specific landing pages. Obviously, breaking it up correctly with HTML5 using the andtags. What I'm wondering is that if i'm going to be penalized for having those three services that aren't necessarily related too closely on the same page as opposed to having the one page for each service (like we have now). Any help would be greatly appreciated, and let me know if i need to elaborate more. Thanks in advance!
Web Design | | RenderPerfect0 -
Keyword help for a beginner
Hello Everyone! I have a few simple questions about picking/using the best keywords for my website. Just to give a little background on the company, we sell branded servers (IBM, HP, DELL) workstations, storage, and related hardware and software (memory, processors, hard drives, operating systems, management software, etc...) I'm trying to pick the keywords to use on the home page but have these questions: 1. This question is a little hard for me to explain, but we would like to show up in the search results whether a user types in: Dell server(s) or IBM server(s) or HP Workstation so for the title tag can we use: DELL, IBM, HP Servers, Workstations, Storage or we need to use DELL Servers, IBM Servers, Dell Workstations, IBM Workstations, etc... Basically what I'm asking is can we combine keywords in the title tag or we need to write them out (hope this make sense) if not let me know and I'll try provide a little more detail and few more examples. 2. This question might not fall under this category of topics and might have to start a new thread but here it goes. We are re-designing our site on a new eCommerce platform using x-cart shopping cart, its a very configurable and inexpensive shopping cart however one of the drawbacks is its speed. Most users of the x-cart shopping cart software report on average of 2-4 seconds page loads, which is kind of slow. even with some heavy optimization you get about 1.5 - 2.5 seconds page load. I've heard that if you want to be higher in Google's search results speed is a big plus, being in the 0.5 second range is a huge plus. I was thinking of creating a static html home page that would include some company info, content with relevant keywords, some links to main categories... (basically kind of copy the google.com page but with a little more text) Would that be a good idea to implement? Hope this question makes sense as well or stick with the default shopping cart home page and try to optimize it as best as possible? 3. We probably have about 10 - 15 short keyword phrases that we want to concentrate on, again they would be:
Web Design | | igor.pinchevskiy
DELL Servers, HP Servers, IBM, Servers
DELL Workstations, HP Workstations, IBM Workstations,
DELL Memory, HP Memory, IBM Memory
DELL Hard Drives, HP Hard Drives, IBM Hard Drives What is the maximum or recommended quantity of keyword phrases to try to include on the home page? Is it also recommended to maybe create a separate page for each keyword phrase? Does a home page get better ranking then another page on the server just because its a home page? Hope my questions aren't too dumb and make sense. I appreciate everyone who takes their time to read through and answer my questions or guide me in the right path. Thank you,
Igor Pinchevskiy0 -
What is a really great bounce rate for a product or service site? What does Good look like?
I am really curious about a result I have never seen before. Our bounce rate went down a lot on a new site. So, what is good??? Recently, we took on a project with a company that offers a product they install for consumers and who had been in business for 15 plus years. The company is successful, has good customer base of those who have been made very happy, etc. It is not a repeat sale type of product, etc. One and done. Their site when we began talking was roughly a year old and was not well constructed but not terrible. Most of the issues were around I frames, use of older coding, poor SEO, etc. There was not really a way to "redesign" and we built a new site. This became a true collaboration in a B2B environment as the owner pushed us like crazy. Not the bad kind of push, the one that makes you say to your team, "Let's find a way!" The result, IMO, was a gorgeous site. But, as you know, those are a dime a dozen. But, to get to the point, when we took over the account they had a bounce rate of around 45%. I did not see this as either good or bad, but a fact and for this industry probably not bad at all. In all honesty, I was not looking at that as a first metric I wanted to move, but it was obviously at or near the top for all the reasons we know. So, this site is a local business, not an everyday product and gets about 2500 to 3000 uniques per month. If we compare to May of 2011/2012: 2011 2012 Total Visitors 1852 3,298 Uniques 1609 2,740 Pageviews 5,634 23,203 Pages/visit 3.04 7.04 Avg Duration 2.05 3.20 Yes, I am leaving off what we are getting, yes, I am leaving off the site. Please don't hate me. I am really wanting to see what others see with site changes and bounce rates first and will disclose. So, what's a great bounce rate? How do you know?
Web Design | | RobertFisher0