Register Members List Search Today's Posts Mark Forums Read

Reply
 
Article Options
[HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions
Lazorbeam
Join Date: Aug 2010
Posts: 169

by Lazorbeam Lazorbeam is offline 13 Jan 2012
Rating: (1 vote - 5.00 average)

One of the high-impact criteria of a fast web page is whether image dimensions have been specified in html or not. Without image dimensions, web browsers must "reflow" and "repaint" the image once it is reloaded.

The problem is that specifying image dimensions can be tedious. One would be required to edit each template and insert dimensions manually. To make matters worst, there are hundreds (if not thousands) of images in vbulletin, some of which aren't even used. Conventionally, one could run a get image sizes script to pull all images and respective dimensions from vbulletin. This method returns thousands of results, most of which are images with no need to be optimized.

I found a very easy solution using VBSEO. If you don't use VBSEO, this article won't be of much help.
  1. Open up 3 instances of GTmetrix.com.
  2. The first should point to your CMS (if applicable), the 2nd to your forum root, and the third to any PUBLICLY viewable thread.
  3. GTmetrix then grades your site speed against several criteria.
  4. Click on the "specify image dimensions" criteria. Odds are you scored 0 on this.
  5. A list of images come up for each instance of GTmetrix. These are the images that load up on your most popular pages (CMS, FORUMHOME and SHOWTHREAD). You can use GTmetrix to find images on other pages, if you wish, like blogs etc.
  6. Copy paste each list of images into notepad and make sure there are no duplicates.
  7. Log into VBSEO.
  8. Navigate to VBSEO "Other Enhancements" and click on "Image Size Attributes".
  9. Select "Yes". Paste the list of images from your clipboard.
  10. Next, you have to format the list so that VBSEO can understand it. It's relatively simple. For example http://www.example.com/forum/images/smile.png (Dimensions: 728 x 90) would become 'smile.png'=>'728x90'
  11. Note: if you have multiple styles with the same image in each, this will work so long as the image has the same dimensions. Otherwise you will screw up your style.
  12. Note2: Be careful with avatars and other resized images, since they can appear in various sizes throughout your forum. You shouldn't be specifying dimensions for these.
  13. Run GTmetrix to make sure the image dimensions no longer need to be specified.

I haven't figured out how to do google adsense and external images with this method yet.

And that's it! You're done.

Last edited by Lazorbeam; 14 Jan 2012 at 00:36..
Views: 6151
Reply With Quote
Comments
  #2  
Old 18 Jan 2012, 18:59
garybrun garybrun is offline
 
Join Date: Nov 2011
Thanks you for this.
Im looking into it now.
Reply With Quote
  #3  
Old 22 Jan 2012, 02:51
kitawanita kitawanita is offline
 
Join Date: Jun 2011
Hi Lazorbeam,
I"m using another folder to place my image .ex : http://example.com/newfolder/smile.png
How to write the path in vbseo?
Thanks for any help and sorry for bad english.
Reply With Quote
  #4  
Old 23 Jan 2012, 12:54
Lazorbeam Lazorbeam is offline
 
Join Date: Aug 2010
Originally Posted by kitawanita View Post
Hi Lazorbeam,
I"m using another folder to place my image .ex : http://example.com/newfolder/smile.png
How to write the path in vbseo?
Thanks for any help and sorry for bad english.
You don't have to write a path unless the image name is used in another folder. Example:

http://example.com/newfolder/smile.png
http://example.com/smile.png

You would have to include the path for the images above. Otherwise it's simply /newfolder/smile.png
Reply With Quote
  #5  
Old 28 Jan 2012, 10:26
kitawanita kitawanita is offline
 
Join Date: Jun 2011
Ok,it works.Thanks
Reply With Quote
  #6  
Old 30 Jan 2012, 02:30
FReeSTER FReeSTER is offline
 
Join Date: Jun 2006
this is a great tutorial mate
ty
Reply With Quote
  #7  
Old 31 Jan 2012, 10:45
abdobasha2004's Avatar
abdobasha2004 abdobasha2004 is offline
 
Join Date: Aug 2008
great... i will try this after installing vBSEO today ISA
thanks
Reply With Quote
  #8  
Old 30 Sep 2012, 22:24
Mark_Zuckerberg Mark_Zuckerberg is offline
 
Join Date: Sep 2011
I f not having vbseo then what to do in vb 4.2
__________________
Webmasters Forum
Reply With Quote
  #9  
Old 25 Feb 2013, 18:38
Dorgham's Avatar
Dorgham Dorgham is offline
 
Join Date: May 2012
I also do not have vbseo
__________________
AdSense revenue sharing 100% - [ Hanan ]
News, egypt : أخبار مصر - Photo, picture : صور
Reply With Quote
  #10  
Old 27 Feb 2013, 15:52
watershed's Avatar
watershed watershed is offline
 
Join Date: Feb 2012
I have used this and managed to remove some of the images from the list, yet i'm still getting an F (0) result for this test.

Some of the files I hadn't removed were avatars/avatar thumbnails (As instructed). I've also not managed to specify sizes of files which do not sit on my website.

Any idea as to why this is?

I can give you my url in private to have a look if you want

Thanks!

Last edited by watershed; 27 Feb 2013 at 15:58.
Reply With Quote
  #11  
Old 28 Feb 2013, 18:46
Lazorbeam Lazorbeam is offline
 
Join Date: Aug 2010
Originally Posted by watershed View Post
I have used this and managed to remove some of the images from the list, yet i'm still getting an F (0) result for this test.

Some of the files I hadn't removed were avatars/avatar thumbnails (As instructed). I've also not managed to specify sizes of files which do not sit on my website.

Any idea as to why this is?

I can give you my url in private to have a look if you want

Thanks!
The way GTMetrix grades this criteria is weird. If you have a few images without dimensions, you will grade poorly, even if 99% of your images are OK. I imagine your avatars are screwing up the page. Maybe try a page without avatars.

You can do avatars and profile pictures, but it's a somewhat futile exercise because there are thousands (for me, at least) cycling through your pages.
Reply With Quote
  #12  
Old 11 Mar 2013, 04:58
datoneer datoneer is offline
 
Join Date: Jul 2011
Great thanks!
Reply With Quote
  #13  
Old 09 Jul 2013, 15:38
final kaoss final kaoss is offline
 
Join Date: Apr 2006
If only there were a mod to automate this process for every image....
Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Article Options

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


New To Site? Need Help?

All times are GMT. The time now is 18:27.

Layout Options | Width: Wide Color: