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
-
Will There Be Much Impact When Moving Site To New Root Folder?
Hi, ok so I have a pretty big site that is located on my sever /root/current-folder/. I want to rebuild the site completely as it's using software that is out of date and not our main focus anymore (OpenCart). We want to move to a Wordpress platform, but want to have as little impact on the SEO as possible. Our current strategy is: List all URLs/Titles/Meta indexed with Google on current site Create new folder on the server /root/new-folder/ My question is... if I move to a new folder on the server (same TLD) and then re-route the TLD to go to this new folder, will there be more of an impact on SEO that if I start a fresh in the current folder? Thanks
Web Design | | Easigrass0 -
Can someone please help with technical question!
I have noticed that our website tool to get a quote does not work with active scripting disabled is this bad? How many people have this disabled?
Web Design | | BobAnderson0 -
Including key words in alt image attributes - stuffing etc?
I'm pretty new to all this but seem to have been getting good result by adjusting our sit to meet the seomoz on page analysis factors. I'm currently adjusting the alt image attributes for this page: www.katalysticevents.com The copy I'm writing is aimed at targeting "luxury marquee hire". It's quite hard to get the keyword into a readable image attribute which properly relates to the image. So my question is if I add say " | Luxury Marquee" onto the end of each image attribute would this get penalised and seen as keyword stuffing or something like that? My image attributes would be:
Web Design | | EdoubleD
Cocktail bar inside Giant Tipi at night | Luxury Marquee Hire Live Band on stage | Luxury Marquee Hire and so on. Thanks!!!!0 -
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 -
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 -
Tips for Panda-Proofing an Image Gallery
I'm currently working on a website that has a video, image and media gallery with over 9,000 items. The gallery can be found here:
Web Design | | Peter264
http://flyawaysimulation.com/images/16/microsoft-flight-simulator-x/ Every image has a page of its own. Therefore, essentially 9,000 pages of very thin content, especially the image pages with no UGC comments. Does anyone here have any tips to "panda-proof" these pages? The images still need to be indexed. What can we do here? The site also hosts videos, which of course the page the video resides on needs to stay in the index too (like youtube). Example of the video page here: http://flyawaysimulation.com/images/media/9371/fsps-3d-real-cockpit-effect-for-fsx/ Really want to hear your thoughts. Thanks in advance!0 -
How can the Web site designer and the SEO strategist work together peacefully?
The organization I work for has decided to re-design or re-develop the existing company Web site. My part in this project is to come up with new features to add to the site, as well as making the site SEO-friendly (copywriting, link-building, keyword research, etc.). I don’t know a thing about Web site design, coding, format, etc., and I guess I will have to work with a designer on this project. How would I go about finding a Web site designer? Should they have some SEO knowledge? How much designer, coding and site structure knowledge should I have? And how do we not infringe on one another as we work together? (Sorry so many questions.)
Web Design | | Obie0