0

هیچ محصولی در سبد خرید نیست.

طراحی سایت در اصفهان, سئو سایت اصفهان, ساخت سایت اصفهان, طراحی سایت حرفه ای اصفهان, بهینه سازی سایت , بازاریابی و دیجیتال مارکتینگ 09133886881 احمدپور

آموزش سئو Minify Html JavaScript and CSS

نویسنده پشتیبانی وب یار
امتیاز مطلب
تعداد بازدید 4078
تاریخ بروزرسانی ۱۲ مهر ۱۳۹۸

آموزش سئو Minify Html JavaScript and CSS

به عمل حذف فاصله‌ها و کدهای اضافی که باعث سنگینی صفحات سایت می‌شود Minify گفته می‌شود، MiniFy را با فشرده‌سازی کدهای سایت اشتباه نگیرید. در این آموزش می‌خواهیم شما را با Minify کردن کدهای قالب سایت آشنا کنیم.

قابلیت Minify چیست؟

Minify کاری هست که یک بهینه‌ ساز وبسایت باید انجام دهد، با Minify می‌توان حجم قالب را کم کرد و سرعت لود سایت را چندین برابر کرد. تأثیر این عمل بخوبی در سایت‌های آنلالیز سئوی On Page نمایش داده می‌شود.

 

Minify Html JavaScript and CSS
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”);?>

این کد به شکل های مختلف در سایت ها موجود است ، بهترینش هست که من پیدا کردم ، به هر حال اگر درست کار نکرد ، میتوانید از یک کد دیگر استفاده کنید. فقط کافیه minfy html output را جستجو کنید.

بعد این کد هم آخرین خط فایل index.php قرار دهید :

<?phpob_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//

نقل قول

این اسکریپت یک generator هم داره که میتونه آدرس فایل را خودکار براتون بسازه.
برای این کار وارد فولدر 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 که در این مثال نام برده شده اند ، همان نام گروه هستند که در آدرس فایل وارد میکنیم.

نحوه استفاده :

بعد از انجام مراحل ، کافیه که فقط فایل را در صفحه به راحتی و مثل همیشه صدا بزنید.

<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 کنید.

0/5 (0 Reviews)
مطالب مرتبط
مطالعه :

در روش آموزش دریافت subscribe YouTube ساب اسکرایب رایگان یوتیوب ابتدا در پنل زیر عضو میشوید و با کلیک بروی گزینه پنل رایگان ساب اسکرایب یوتیوب های خود را دریافت می کنید.   پنل جدید اضافه شد نمایی از تست پنل جدید دریافت رایگان ساب اسکرایب یوتیوب free youtube subscribe سامانه بروز شد و رفرال گیری جهت افزایش دوبرابری ساب اسکرایب ها اضاهه شد   آموزش دریافت ممبر کانال یوتیوب و subscribe YouTube ساب اسکرایب رایگان یوتیوب free subscribe افزایش ساب اسکرایب دریافت ساب اسکرایب ساب اسکرایب رایگان آموزش دریافت ساب اسکرایب دریافت subscribe youtube آموزش دریافت ساب اسکرایب رایگان آموزش دریافت subscribe ازسایت youtube ساب اسکرایب یوتیوب subscribe youtube free subscribe youtube get subscribe youtube site get youtube subscribe pannel افزایش subscribe یوتیوب فروش subscribe youtube خرید ساب اسکرایب یوتیوب خرید subscribe youtube subscribe youtube رایگان طبق فیلم آموزش ساب اسکرایب رایگان جلو بروید.  سخن آخر YouTube یکی از وب سایت های می باشد برای کسب درآمد می توان در آن ویدئو ها را آپلود کنید. با آپلود ویدئو ها در سایت یوتیوب ، یوتیوب در میان ویدئو های شما تبلیغاتی را به نمایش می‌گذارد که این امر باعث افزایش درآمد شما به دلار می‌شود.یوتیوب در ازای هر ویدئو می‌تواند به شما بین یک تا چند هزار دلار پرداخت کند. این امر بستگی به تعداد بازدید ها و […]

gif-on-line
مطالعه :

معرفی سایت ساختن تصویرمتحرک gif online طراحی سایت انجام می دید و دوست دارید توی سایتتون از تصاویر متحرک استفاده کنید؟ فکر می کنید کار سختیه؟ نه .. فقط کافیه به سایت های زیر سر بزنید. وارد وبسایت های زیر شده عکس های خود را به ترتیب وارد کنید و از افکت های رایگان این وبسایت ها لذت ببرید.  لوجیکس (بدون تبلیغات) (بدون تبلیغات)  میک گیف (با تبلیغات) wpu(بدون تبلیغات) و به وسیله نرم افزار با نرم افزار زیر: ابزاریست بسیار کامل و در عین حال ساده برای تمامی کاربران که هم برای مبتدیان مناسب است و هم برای حرفه ای ها . چرا که برای مبتدیان از نظر ساده بودن استفاده بسیار مناسب است و برای حرفه ای ها هم از قابلیت های کلیدی مهمی برخوردار می باشد که برای این دسته از کاربران اهمیت دارد. افکت ها مختلفی برای طراحی در این نرم افزار وجود دارد که بر افزایش سرعت کار طراحی کمک زیادی می کند. قابلیت های نرم افزار Easy GIF Animator Personal  : طراحی آسان انیمیشن های فلش ، بنر و تصاویر امکان ساخت عکس های GIF تمام صفحه امکان ویرایش تصاویر GIF قابلیت ساخت متن های متحرک امکان بهینه سازی تصاویر GIF با سرعت بالا در نمایش پیش نمایش در مرورگر سهولت در ذخیره سازی به صورت GIF امکان اضافه نمودن موزیک و صدا به […]

menu-css-html
مطالعه :

همانطور که می دانید یکی از مهم ترین بخش های وب سایت که منوی ناوبری می باشد. این قسمت جز بخش های بسیار تزئینی و تعاملی صفحه است. در این مقاله شما را با نحوه ی ایجاد منو و زیر منو آشنا خواهیم کرد. به طوریکه در پایان این آموزش شما می ­توانید یک منوی ناوبری تعاملی ایجاد نمایید. با تیم طراحی سایت اصفهان وب یار همراه باشید. مرحله اول-ایجاد یک منوی ساده در مرحله ی اول باید کد های html مربوط به منوی اصلی در یک فایل با پسوند html نوشته و ذخیره شود. برای نوشتن منو در html تگ های ul و li مورد استفاده قرار می گیرد. <!DOCTYPE html> <head> <title>DropDown Menu with HTML and CSS</title> </head> <body> <nav> <ul> <li><a href=”#”>طراحی سایت </a></li> <li><a href=”#”>سئوسایت </a></li> <li><a href=”#”>طراحی فروشگاه اینترنتی </a></li> <li><a href=”#”>درباره وب یار</a></li> <li><a href=”#”>تماس با وب یار</a></li> </ul> </nav> </body> </html> کد بالا یک فهرست توسط ul ایجاد می کند. آیتم­ های منو در درون این فهرست و در تگ li قرار می گیرند. کد های بالا لیستی از منوی ساده ی عمودی فاقد زیر منو را نمایش می دهد.این کد ها شامل 5 منوی اصلی می باشد. مرحله دوم- ساخت زیر منو تا اینجا تنها منو های اصلی طراحی شده است، حال برای این که منو هایی با زیر منو داشته باشیم […]

بوت استرپ 5
مطالعه :

سلام در سپتامبر سال 2020 یک خبر توجه همه را به خودش جلب کرد. کمپانی توییتر پنجمین ورژن از فریمورک محبوب بوت استرپ را ارائه کرد. در این نسخه تغییرات بسیار زیادی ایجاد شده است که در ادامه آن ها را خواهیم نوشت. می خواهیم به سوالاتی که در این باره برای شما پیش می آید پاسخ دهیم. بوت استرپ چیست؟ چرا باید از بوت استرپ بلد باشیم؟ بوت استرپ 5 چه ویژگی هایی دارد؟ چه تفاوتی بین ورژن 4 و 5 وجود دارد؟ چگونه از بوت استرپ 4 به 5 کوچ کنیم؟   بوت استرپ چیست؟ بوت استرپ یک فریمورک سی اس اس، محصول کمپانی توییتر می باشد. این محصول علاوه بر ریسپانسیو کردن وبسایت شما به یک سری کلاس آماده برای زیبا سازی و چینش سایت شما مجهز است. این محصول در 5 ورژن عرضه شده که نسخه 5 آن هنوز آزمایشی است. و تا اصلاح شدن آن زمان زیادی لازم است.     ویژگی ها و تفاوت های بوت استرپ 5 : تغییرات در این نسخه از بوت استرپ بسیار زیاد و وسیع بوده به گونه ای که باعث تعجب عموم شده است. در نسخه بتا 1 این تغییرات عبارت اند از: اضافه کردن کلاس جدید شبکه بندی: در این نسخه یک کلاس شبکه بندی برای نمایش گر های بزرگ تر از 1400 پیکسل تحت عنوان col-xxl- […]

نرخ کلیک (CTR) چیست و چگونه آن را افزایش دهیم ؟
مطالعه :

در این مقاله از وب یار قصد داریم به بررسی نرخ کلیک بپردازیم و راه های افزایش آن را بیان کنیم. پس با ما همراه باشید. نرخ کلیک (CTR) چیست ؟     CTR که به نرخ کلیک معروف است، مخفف “Click Through Rate” ،به معنای درصدی از کاربران است که بر روی لینک سایت شما کلیک می کنند. نرخ کلیک از تقسیم تعداد افرادی که بر روی یک لینک کلیک کرده اند ، بر تعداد نمایش آن محاسبه می شود. حال سوال مهم اینجاست آیا نرخ کلیک بر روی سئو سایت تاثیر دارد ؟ رتبه شما در موتورهای جستجو تا حدی بر اساس محبوبیت وب سایت شما است و میزان محبوبیت آن با بازدید از صفحه اندازه گیری می شود. هرچه کلیک صفحه شما بیشتر شود – یا به عبارت دیگر CTR بالاتر باشد – موتور جستجوگر ارزش آن را بالاتر می داند. بنابراین صفحه شما به طور طبیعی رتبه بالاتری خواهد داشت. در نتیجه می توان گفت CTR بالاتر برابر با SEO بهتر است. چه راه هایی برای افزایش نرخ کلیک سایت وجود دارد ؟ در جهت افزایش نرخ کلیک توضیحات متا (meta description) موثر بنویسید متا تگ های توضیحات بیشترین ورودی SERP شما را تشکیل می دهند. آنها به بازدیدکنندگان بالقوه می گویند هنگام کلیک کردن روی پیوند چه انتظاری باید داشته باشند. نوشتن توضیحات متا موثر […]

تبلیغات و آگهی در اصفهان
مطالعه :

تبلیغات در اصفهان با تیم حرفه ای و با سابقه ی وب یار ، با ارائه ی خدمات خود به بهترین نحو ممکن و با عالی ترین نتایج در استان اصفهان مشغول فعالیت است. به کارگیری بهترین‌های دیجیتال مارکتینگ و تبلیغات توانسته است سابقه ی درخشانی را برای این تیم به ارمغان بیاورد. در ادامه به معرفی گوشه ای از فعالیت های این تیم در زمینه ی تبلیغات در اصفهان می‌پردازیم. می‌توان فعالیت های ارزشمند تیم آگهی و تبلیغات اصفهان را در زمینه های زیر دسته بندی کرد. رسته مشاوره رسته خدمات رسانه رسته خدمات تبلیغ در ادامه به معرفی هر یک  از این موارد می پردازیم. رسته مشاوره این رسته حرفه ای‌ترین و تخصصی ترین نوع رسته کانون‌ها و شرکت‌های تبلیغاتی می‌باشد. فعالیت در این رسته مستلزم داشتن تحصیلات عالی مرتبط و سوابق تجربی است. چرا که تعیین هدف، تهیه پیام، انتخاب رسانه، تعیین بودجه و ارزیابی از جمله مراحل اجرایی آن است و انجام هر یک از آنها تخصص خاص خود را می طلبد. فعالیت مرتبط برنامه نویسی (کمپین) برای معرفی کالا و خدمات به همراه تحقیقات بازار و ارزیابی اثربخشی تبلیغات. رسته خدمات رسانه فعالیت در حوزه ای که کانون صاحب رسانه می باشد یا رسانه ای را در اجاره دارد. فعالیت‌های مرتبط در ادامه فعالیت های مرتبط با این رسته را به صورت مفصل برای شما […]

دیدگاه ها

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

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