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.
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
-
What do you use for test rendering your dev site?
I'm redesigning our company ecommerce site and need to test render an infinite scroller to ensure that it is as SEO friendly as possible. My problem is that I cannot view it in Webmaster Tools since I am blocking the site from crawlers using robots.txt. I know I could simply unblock Google temporarily but I really would rather not make my dev site available to search engine crawlers.
Web Design | | bearpaw0 -
What To Do When Improved Site Speed & Layout Result In Higher Bounce Rates & Lower Time On Site
We launched a new Bootstrap 3.0 site template 2 weeks ago. The site loads 5x faster and has a much improved layout (utilizing most common above the fold recommendations ). It's only been two weeks, but our bounce rate has increased 5-10% and our avg time on site decreased by 10-18%. Here is the page for one of our most common products so you can see the general experience: <a>http://www.jwsuretybonds.com/surety-bonds/commercial-bonds/auto_dealer_bond.htm</a> (here is the old version: <a>http://199.119.123.134/surety-bonds/commercial-bonds/auto_dealer_bond.htm</a>) We spent two months implementing the new design and working on a speedy load time. We had anticipated a drastic improvement, not mild downturn in user behavior. I'm hopeful that the Analytics metrics aren't showing the true picture on the keywords we care about (can't see anymore due to "Not Provided" listed as most keywords now. Argh!) and perhaps some of the more important/accurate user behavior metrics that we can't see are improving. We know our industry and our clients needs VERY well. We THOUGHT our new content/layout was perfect so it will be tough for us to try to make improvements at this point. We believe our best plan of action now is to add more content on each page and A/B test it along with other subtle changes. The problem is that our new content is very concise and hits on all of the primary visitor intentions, so additions of content could be redundant and making concise answers more "fluffy", which is what we tried to get away from. What do you think? Is there reason for panic? What would your plan of attack be if your "sure shot" new design didn't provide the improvements you "knew" it would? 🙂
Web Design | | TheDude0 -
Do I need to redirect soft 404s that I got from Google Webmaster Tools?
Hi guys, I got almost 1000+ soft 404s from GWT. All of the soft 404s produce 200 HTTP status code but the URLs are something like the following: http://www.example.com/search/house-for-rent (query used: house for rent) http://www.example.com/search/-----------rent (query used:-------rent) There are no listings that match these queries and there is an advanced search that is visible in these pages. Here are my questions: 1. Do I need to redirect each page to its appropriate landing page? 2. Do I need to add user sitemap or a list of URLs where they can search for other properties? Any suggestions would help. 🙂
Web Design | | esiow20130 -
Thoughts on my site structure? (And a quick thank you!)
I've learned a lot through this site (and the community built around it) about everything SEO related. It's been extremely helpful in helping us help others to learn that all people (even those with a "disability") deserve respect and integrity. (Wow, that's a lot of helps!) So I wanted to give a quick thanks to everyone on this site who has helped, supported, and encouraged us. We really appreciate it. One thing I've been trying to do on my site is look at my categories and over all site structure. I've pruned a lot of things from the menu bar; pruned away and tightened up the categories, and even rearranged the navigation of the site. As you can see, I have several drop down categories up top. I wanted to see if I could get some feedback on how what I'm doing looks thus far, specifically as it relates to my categories / menus / navigation. Although any feedback you'd like to provide would be more than appreciated. One thing I'm curious about (and not sure how to tackle it) is regarding the top most item in the main menus. For instance you'll see I have a top level category called "Down Syndrome Resources" which takes them to all of the posts in that category. Under that, there is a drop down menus that gives them other categories, and even some pages that fall under the topic of Down syndrome resources. I'm not sure if people would know the top most item is a link, or just look at the ones below it. (If that makes sense.) (On a side note I have therapy as a category as well as parenting, the truth is those could all be sub-categories I guess since everything on my site pretty much could fall under "down syndrome resources." Maybe this is a huge FAIL I made when setting up my categories.) I'm also not sure if I should use some sub-categories as well. For instance I have a main category for Therapy. Under that I have posts about speech therapy, physical therapy, and occupational therapy. Right now they are all grouped into therapy. Do you think I should use sub-categories on those 3 terms, leave as is, or perhaps another option? Another question I have is regarding landing pages. It seems like I need to have a landing page for my top "key words." For example therapy. Now if you visit my /therapy you get the category index page, not a "landing page." Same would go for the sub-categories if I were to create them. So I'm not sure if I should make a new post or page naming it something else (maybe "Down syndrome therapy" another named "Down-syndrome-physical-therapy" etc) or something else. (Although therapy isn't really the keyword I want to rank for, I'm thinking more along the lines of children therapy, pediatric therapy, therapy for children with Down syndrome, etc. So maybe I need to rename my categories? I was going for shorter names, so I very well may have done this incorrectly.) All of these questions are things I'm not to sure about, so I'd appreciate any feedback or advice you can give me. And since I'm learning, I could be doing things wrong that I don't even know to ask. So feel free to tell me what you see that's wrong, you won't hurt my feelings. I promise. 🙂 Thanks in advance.
Web Design | | NoahsDad0 -
H1 image replacement question
Working with content folks on a new section of our website. Developed a new logo for this section of the site, and they want to incorporate the style of it into all of the page headings. The only way to pull this off is to use images for H1's. (Without getting into unnecessary detail, they have to be images - too precise to try text over background images.) I made everyone aware of the importance of H1 text for SEO purposes, but they really want these images. When I first attempted SEO back in 2003, I recall doing a site using CSS image replacement along these lines: Widget Page #example {
Web Design | | c2g
background: url(../images/example.gif) no-repeat;
text-indent: -5000px;
} That was nearly 10 years ago, and they definitely ranked for the H1s at the time which led me to believe it worked. Anyone know if this is considered an acceptable practice today? I read some other threads about enclosing the image in tags and relying on the ALT text, but that doesn't seem to be a good option.0 -
How will a sites ranking be affected??
Hey guys, My MD has just put this to me, we have a site the is currently ranked in top 3 for all there chosen search terms. The company is undergoing an overhaul of their design and want a new site to match this. They have asked how changing the site design will affect their rankings. More content is going to be added with this there will be new pages links etc Any information would be greatly appreciated.. Thanks Anthony
Web Design | | Anthonykal-group0 -
Need an SEO pro to build us a new fine art website
Hey Seomoz friends My friends and I started buying and selling art 5 years ago. We did it all on ebay. Two years ago I decided to try an attempt at building us a website to further our business outside of ebay. www.originalartbroker.com I used homestead.com software aka intuit to do this. I was able to get a lot of first page results in seo after a ton of work and willing to do a lot more. I'm sure the homestead site slowed my efforts down. I need more power 🙂 What we do. We sell fine art. We are trying to aspire to the leading seller of fine contemporary art online. We will do whatever it takes to get there. Our issue is not our product. Our issue is getting traffic to the site. I only have 175-200 visitors a day. I need better results for the keywords of our artists and inquires that surround them. We have a bounce rate of 70%, average time on site of 1 minute 50 seconds, and a slow loading site that is almost impossible to create individual pages for pieces (mgmt nightmare) Outside of our site we have blogs, squidoo pages, facebook account with 2500 fans, twitter page with 2k followers, youtube channel, and a blog on the site for new arrivals. We have a 200-250 piece on our site at any given time. We add probably ten pieces on average a week. We don't need any kind of ecommerce management software as most of our sales are done over the phone being that it is higher end art. I need a site that out performs my competition. I need to be in the top three when someone types in "leroy neiman" "peter max" and so on. I, with limited knowledge, need to be able to use the software everyday to upload new art as it comes in. I want every piece to have its own page so that I can also add pieces to a google merchant account. When I add new pieces under a certain artists and it creates its own page i want it to create h tags and an url extension for each product as I add them based off the discription and artists name. I would like some sort of blog integration to post our new arrivals as we get them. I would like some sort of customer capture. I am thinking something along the lines of them prociding email, name, and zip code to see the prices on the site. You are the seo pro so you know what it takes. I would like to know what a solution would cost to get us on the ground with more seo power. A site with speed that is easily indexed. It doesn't need to have a lot of bells and whistles. Please look at my site and let me know what you think. You can get an idea from that of what we are doing. Please give me an idea of what you can do and what it would cost. Thank you
Web Design | | forecastedinvestments0 -
Finally have a budget for a great seo ecommerce site but need help choosing wordpress, joomla, modx, magneto or? Thank you in advance for your generosity of time
We finally have a budget and want to dump our intuit/homestead site www.originalartbroker.com Our budget is 5k-10k but could do more if needed. I am slowly catching my competition with this homestead site that I built. But I do realize it is time to step back, figure out what is best, and hire a pro to get the job done. I am green in the seo and web development arena so please go easy on me and please help to point me in the right direction. Just went out on a limb a couple years ago playing with homestead.com site software and built what we have today. Didn't know anything about website development...it sort of just happened. I feel and know that homestead.com solution is hindering what we could be doing due to the bloated nature of the site and inability to perform such task as 301 redirects etc.... I have been able to slowly attain first page seo rankings on keywords based of the artists we carry using this po-dunk homestead platform to build my site after a ton of work education thanks to seomoz and a lot of you. But, have never asked for help and could really use some generosity of time in explaining a solution that would work best for our business. Do we just go with a wordpress site that is similar to our current setup and use their plugins? Do we use a cms software solution like magneto or joomla? We will only have 200-300 pieces at any given time. We are constantly selling and buying new pieces providing us content. We are need of a site that can perform well in terms of seo. I have heard of a lot of people talking about joomla, wordpress, and magneto. Would like to be able to have a product catalogue that ultimately sends whatever inventory we are uploading to our social sites and blogs so I don’t have to pump the product out to all of these sites. We offer free custom framing with our pieces and it would be nice to have a program that could wrap the photos of the pieces with the different frames for our customers. When I add a new piece I would like this software to have a predesigned product page that it plugs the information into. I would like it to create the url extension based of the artists name, medium used, and piece name to create unique and individual urls. I would like it to also create its own H tags throughout that product page according to the artist name description, and medium used. I would like to be able to sink this up to google merchant and other sites to carry our product. Bottom line is we sell art. We sell pieces by specific artists. We are constantly buying and selling. I need something powerful that keeps up with our content
Web Design | | forecastedinvestments1