رفع خطای Specify image dimensions | رفع مشکل image dimensions

در این مقاله از سایت آموزی قصد داریم شما را با رفع خطای Specify-image-dimensions در gtmetrix جهت ارتقای سرعت لود و توسعه سئو در وبسایت آشنا کنیم.

رفع خطای Specify image dimensions | رفع مشکل image dimensions

رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions | رفع خطای Specify image dimensions | رفع مشکل image dimensions

علت خطای Specify image dimensions

این خطا وقتی به وجود می‌اید که شما در تصاویر خود از اتریبیوت‌های مانند width و height استفاده نکرده باشید.

برای رفع این مشکل باید در تمام تصاویر خود عرض و ارتفاع آن را تعیین کنید.

به مثال زیر که کد یک عکس بدون ویژگی width و height می باشد نگاه کنید:

به مثال زیر که کد یک عکس با ویژگی width و height می باشد نگاه کنید:

روش رفع خطای Specify-image-dimensions

جهت رفع این خطا باید برای تصاویر خود حتما ویژگی های width و height در کد img سند html تعریف کنید.

رفع خطای Specify-image-dimensions باعث می‌شود تا تصاویر موجود در سند HTML شما سریع‌تر رندر شوند.

وقتی مرورگر صفحه‌ای از سایت را رندر می‌کند تا به کاربر نشان دهد فایل‌های مختلفی را دانلود می‌کند.

فایل عکس هم شامل موارد دانلود شده می‌باشد. حالا اگر ابعاد عکس را مشخص نکنیم، مرورگر هربار برای لود تصویر بایستی اندازه عکس را مشخص و مجددا تصویر را بارگذاری کنند.

درحالی که اگر ابعاد به شکل صحیح مشخص شده باشند نیازی به این بازنگری نیست.

شاید چنین خطایی در زمان قابل تشخص برای ما نباشد ولی هر چه تعداد عکس‌ها بیشتر باشد.

و ابعاد مشخص نشده باشند زمان نسبتا بیشتری طول می‌شد صفحات رندر شود.

تا در حالی که ابعاد مشخص است و مرورگر قبل از رندر کردن توسط اتریبیوت های CSS از ابعاد عکس‌ها به خوبی آگاهی پیدا می‌کند.

بهتر است علاوه بر رفع خطای Specify-image-dimensions برای بهینه سازی عکس های وبسایت دو خطای زیر را هم که در آموزش های مجزا در سایت آموزی توضیح دادیم رفع کنید:

  1. رفع خطای Serve scaled images
  2. رفع خطای Optimize images

رفع خطای Specify image dimensions | رفع مشکل image dimensions – اختصاصی سایت آموزی