آموزش سئو Minify Html JavaScript and CSS
در این مقاله می خواهیم برای شما آموزش سئو Minify Html JavaScript and CSS را ارائه دهیم. به عمل حذف فاصلهها و کدهای اضافی که باعث سنگینی صفحات سایت میشود Minify گفته میشود. MiniFy را با فشردهسازی کدهای سایت اشتباه نگیرید. در این آموزش میخواهیم شما را با Minify کردن کدهای قالب سایت آشنا کنیم.
قابلیت Minify چیست؟
Minify کاری هست که یک بهینه ساز وبسایت باید انجام دهد، با Minify میتوان حجم قالب را کم کرد و سرعت لود سایت را چندین برابر کرد. تأثیر این عمل بخوبی در سایتهای آنلالیز سئوی On Page نمایش داده میشود.
- Minify Html JavaScript and CSS
چگونه Minify را در وردپرس استفاده کنم؟
استفاده از Minify در وردپرس بسیار آسان است. به این گونه که هم میتوانید قالب خود را Minify نمایید و یا میتوانید با استفاده از پلاگینهای wp-Minify و یا wp super cache و یا دیگر پلاگینهای cache وردپرس این
عملیات را انجام دهید.
ولی پیشنهاد میشود از پلاگین استفاده W3 Total Cache نمایید. برای راه اندازی minify با استفاده ازW3 Total Cache به منوی Minify در پلاگینW3 Total Cache بروید.
معرفی ابزار برای Minify کردن استاندارد کدها
سایت های زیادی وجود دارند که به صورت آنلاین این کار را برای شما انجام میدهند.
-
- http://htmlcompressor.com/compressor
- http://tools.w3clubs.com/cssmin
- http://www.willpeavy.com/minifier
- http://www.minifyweb.com
- http://jscompress.com
- http://cssminifier.com
- http://refresh-sf.com/yui
- https://developers.google.com/speed/docs/insights/MinifyResources
- http://www.minifyjavascript.com
استفاده از روش دستی
هدف اصلی من از ارسال این آموزش ، آموزش این بخش است.
۱ – html :
برای این که html سایت خودتون را minfy کنید ، ابتدا باید این کد را اولین خط فایل index.php قرار دهید.
<?php function sanitize_output($buffer)
{$search = array('/>[^S ]+/s','/[^S ]+
</s','/(s)+/s');$replace = array('>','<','۱');if (preg_match(
"/<html/i",$buffer) == 1 && preg_match("/</html>
/i",$buffer) == 1) {$buffer = preg_replace($search, replace, $buffer);}
return $buffer;}ob_start("sanitize_output");?>
این کد به شکل های مختلف در سایت ها موجود است . اما مورد بالا بهترین کدی می باشد که من پیدا کردم ، به هر حال اگر درست کار نکرد ، میتوانید از یک کد دیگر استفاده کنید. فقط کافیه minify html output را جستجو کنید.
بعد این کد هم آخرین خط فایل index.php قرار دهید :
<?php ob_end_flush();?>
کد های سایت شما باید بین این دو کد قرار بگیرند. به همین راحتی
نمونه :
<?phpfunction sanitize_output($buffer)
{$search = array('/>[^S ]+/s','/[^S ]+</s','/(s)+/s');
$replace = array('>','<','۱');
if (preg_match("/<html/i",$buffer) == 1 && preg_match
("/</html>/i",$buffer) == 1) {$buffer = preg_replace
($search, $replace, $buffer);}return $buffer;}
ob_start("sanitize_output");?><!doctype html>
<html><head><meta charset="utf-8"><title>Test</title>
</head><body>this is test text</body></html>
<?phpob_end_flush();?>
۲ – فشرده سازی فایل های css , javascript :
برای minfy کردن فایل های css و javascript سایت خود ، ابتدا این اسکریپت را از یکی از لینک های زیر دانلود کنید.
code.google.com/p/minify
github.com/mrclay/minify
از حالت فشرده خارج کنید و سپس فولدر min را در root سایت خود کپی کنید.
حالا ۲ روش برای minfy کردن وجود دارد :
۲-۱ – مستقیم :
در این روش شما آدرس فایل را مستقیم به اسکریپت ارسال میکند و آدرس فایل ها قابل دیدن است :
- example.org/min/?f=js/quick-test.js
- example.org/min/?f=css/quick-test.css
با گذاشتن , بین فایل ها ، میتوانید چندین فایل را یکجا صدا بزنید. پیشنهادی
نمونه :
- forum.wp-parsi.com/public/min/index.php?
- ipbv=fa11d69d698cbe0f3287c01a12de13fb&f=public/style_css//
برای این کار وارد فولدر min شوید و فایل config.php را باز کنید.
مقدار $min_enableBuilder را برابر true قرار داده و سپس وارد آدرس زیر در مرورگر خود شوید :
http://example.org/min/builder
پسورد در فایل کانفیگ موجود است.
بعد از انجام کار ، دوباره مقدار $min_enableBuilder را برابر false قرار دهید.
۲-۲ – فشرده سازی غیر مستقیم : پیشنهادی
در این روش شما آدرس فایل را در یک آرایه به صورت گروه ذخیره میکنید و سپس فقط نام گروه را در آدرس وارد میکنید.
نمونه :
example.org/min/?g=css
برای این کار وارد فولدر min شده و سپس فایل groupsConfig.php را باز کنید.
۲ مثال به عنوان نمونه در این فایل وجود دارد ، میتوانید از حالت comment خارج کنید و استفاده کنید.
نمونه :
return array('js' => array('//js/file1.js', '//js/file2.js'),'css' => array('//css/file1.css', '//css/file2.css'),);
css و js که در این مثال نام برده شده اند ، همان نام گروه هستند که در آدرس فایل وارد میکنیم.
نحوه استفاده از فایل های minify شده :
بعد از انجام مراحل ، کافیه که فقط فایل را در صفحه به راحتی و مثل همیشه صدا بزنید.
<link rel="stylesheet" type="text/css" href="http://example.org/min/?g=css"><script type="text/javascript" src="http://example.org/min/?g=js"></script>
خب شما توانستید به راحتی کدهای سایت خود را minfy کنید.
سخن پایانی:
در این مقاله به شما آموزش سئو Minify Html JavaScript and CSS را ارائه دادیم. در مقالات بعدی بیشتر سعی می کنیم تا از این سبک مقالات برای شما منتشر کنیم. این کار باعث می شود که اگر شما طراح سایت هستید فایل های خود را بهینه تر اجرا کنید.این کار یک تخصص می باشد و باید در انجام این کار از یک تیم متخصص کمک بگیرید.البته که مجموعه وبیار با هدف رشد کسب و کار ها و رسیدن سایت های مشتریان خود به صفحات اول گوگل گام برمیدارد این خدمت را نیز برای شما انجام خواهد داد.برای آگاهی از آخرین اخبار و مقالات سایت وب یار ما را در اینستاگرام همراهی کنید.