آموزش رفع خطای minimize request size در gtmetrix
آگوست 23, 2020
این خطا زمانی اتفاق می افتد که به عنوان مثال یک عکس یا هرنوع فایل یکسان مانند فایل های css و یا javascript  را با دو آدرس متفاوت در صفحه ای از سایت خود بارگذاری  کنید ، این کار باعث می شود تعداد درخواست های سمت سرور افزایش یابد. چون هرکدام از این فایل ها یک نوع درخواست http به حساب می آیند و وقتی درخواستهای http افزایش می یابد ،درگیری سرور برای پاسخ بیشتر می شود.
آموزش رفع خطای serve resources from a consistent url در gtmetrix
آگوست 24, 2020

آموزش رفع خطای put css in the document head در gtmetrix

آموزش رفع خطای put css in the document head در gtmetrix   

یکی از خطاهایی که هنگام تست سرعت سایت با  Gtmetrix با آن مواجه می شویم به نام خطای put css in the document head که از سری خطاهای page speed است.

 

put css in the document head چیست؟

put css in the document head : یعنی فراخوانی فایل css به خارج از بخش head سایت.

این خطا به دلیل قرارنگرفتن کدهای css در جای مناسب است.کدهای css که ما در سایت استفاده می کنیم جزء بخشی هستند که باید در سایت دیده نشوند ، یعنی در بخش body که مربوط به نمایش صفحات است و بازدیدکننده آن را می بیند نباشد. این کد ها نیاز به دیده شد ندارند و فقط ظاهر سایت را آن طور که تعیین شده نمایش می دهند.پس فقط برای مرورگر مهم هستند. و به همین دلیل داخل head قرار می گیرند.

اگر شما فایل استایل خود را در بخشی خارج از head سایت تان فراخوانی کرده باشید. مثلا اگر فایل style  در بخش body بود برای رفع این خطا کافیست بخشی را که اخطار میدهد به قسمت head سایت منتقل کنید و خطای موجود در این بخش برظرف می شود.پس در صورت استفاده از استایل های inline css و تگ <link> که از طریق آن استایل های خارجیexternal style را فراخوانی می کنیم که  در قسمت head سند html قرار بگیرند.

آموزش رفع خطای put css in the document head در gtmetrix   : به دلیل قرارنگرفتن کدهای css در جای مناسب است.کدهای css که ما در سایت استفاده می کنیم جزء بخشی هستند که باید در سایت دیده نشوند ، یعنی در بخش body که مربوط به نمایش صفحات است و بازدیدکننده آن را می بیند نباشد. این کد ها نیاز به دیده شد ندارند و فقط ظاهر سایت را آن طور که تعیین شده نمایش می دهند.پس فقط برای مرورگر مهم هستند. و به همین دلیل داخل head قرار می گیرند.

رفع خطای put css in the document head

 

حال چگونه خطای put css in the document head را رفع کنیم ؟

این مقاله رو هم بخونید
چگونه خطای صفحه آبی(BSOD) را رفع کنیم ؟

اگر به هر دلیلی کدهای css را داخل جایی غیر از تگ head  قراردهید در این این صورت با خطای put css in the document head مواجه می شوید در صورتی که سند html صفحه شما به شکل زیر باشد:


<html>
<head>
<title> Hello World! </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<style>
// CSS Code
</style>
<body>
// Content
</body>
</html>

در نمونه کد بالا کدهای مربوط به استایل در جای غیر مناسبی قرار گرفته اند (خارج از تگ head ) در این صورت با این خطا در جی تی متریکس روبه رو می شویم که برای برطرف کردن آن باید بخش مربوط به css را به داخل تگ head ببریم. یعنی مثال بالا باید به شکل زیر اصلاح شود.

 


<html>
<head>
<title> Hello World! </title>
<link rel="stylesheet" type="text/css" href="style.css">
<style>
// CSS Code
</style>
</head>
<body>
// Content
</body>
</html>

همانطور که مشاهده کردید تنها با یک جابه جایی ساده خطای put css in the document head را رفع کردید.امیدواریم که این مقاله و رفع این خطا برای افزایش سرعت سایت و بهبود سئو سایتتان موثر باشد.

مطالب قبلی :

آموزش رفع خطای minimize request size در gtmetrix

آموزش رفع خطای inline small javascript در gtmetrix

 

Aida Parvaresh
Aida Parvaresh
آیداپرورش هستم،علاقمند به تکنولوژی و تولید محتوا،مدتیه که با تیم خوب هفت وب همکاری دارم.

3 Comments

  1. […] آموزش رفع خطای put css in the document head در gtmetrix […]

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *