Register Arama Bugünkü Mesajlar Mark Forums Read

Reply
 
Thread Tools
[HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions
vB.Org Poster
vB.Org Poster has disabled reputation
Kayıt Tarihi: Jul 2018
Mesajlar: 298

Show Printable Version Email this Page
Makale: vBulletin 4 Makaleleri, yazar vB.Org Poster 10 Jul 2018, 09:52

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 Example Domain (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.
Views: 15
Reply With Quote
Reply

Thread Tools

Şunları Yapabilirsin
Yeni Konu Açmak
Konuya Cevap Yazmak
Eklenti Eklemek
Düzenleme Yapabilmek

Forum Atla


New To Site? Need Help?

All times are GMT +3. The time now is 15:37.

Tasarım Özelliği | Genişlik: Geniş Renk: [HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions [HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions [HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions [HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions [HOW TO - VB4 + VBSEO] Site Optimization: Easily Specify Image Dimensions