سایتهای خود را سرعت ببخشید

نویسنده حامد در شهریور ۱۱م, ۱۳۸۹

تکنیکهای بسیاری برای بهبود سرعت بارگزاری صفحات وجود دارند که با یک جستجوی ساده در گوگل بهترین نتایج را خواهید دید. مسلما نوشتن این پست نیز تکرار مکررات است اما از آن مکرراتی است که باید بارها تکرارش کرد. متاسفانه در صنعت طراحی وب سایت ایران,  تعداد کمی از طراحان وب آگاهی کاملی از جنبه های مختلف طراحی سایت از کدنویسی بهینه گرفته تا تنظیمات مربوط به سرور دارند و تعداد کمتری این دانسته ها را واقعا به کار میگیرند. در این مطلب تکنیکهای را معرفی خواهم کرد که به چشم تاثیراتش را در سایتهای مختلف دیده ام.

به کار انداختن فشرده سازیGZIP

با یقین میگویم که این مورد مهمترین موردی است که در این مطلب میخوانید. gzip که مخفف Gnu Zip میباشد ابزاری برای فشرده سازی انواع مختلف فایل است که گاها میتواند تا حدود ۸۰ درصد از حجم صفحات وب شما بکاهد. اگر برای فایلهای js و css خود این قابلیت را فعال کنید کاهش حجم زیادی را در صفحات خود خواهید و در اینترنت کاهش حجم یعنی سرعت و سرعت یعنی همه چیز.

برای فعال کردن gzip در سرورهای apache میتوانید تکه کد زیر را  به فایل .htaccess که در روت هاست شما وجود دارد اضافه کنید.

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

تکه کد بالا فشرده سازی را برای فایلهای text, html, javascript, css, xml فعال خواهد کرد. و یا اینکه میتوانید با استفاده از کد زیر فشرده سازی را  بر حسب پسوند فایلها فعال کنید.


<IfModule mod_deflate.c>
<FilesMatch "\.(js|css|TTF)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

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

افزودن http Expire Headers

تقریبا تمام طراحان وب با عبارت caching آشنایی دارند. سیستم cache بدین گون عمل میکند که پس از اولین بارگزاری یک صفحه وب تعدادی از عناصر صفحه بر روی سیستم کاربر ذخیره میشوند تا دفعات بعد به جای خواندن فایل از سرور, آنها از روی سیستم خوانده شود. اینکار هم پهنای باند را حفظ خواهد کرد و هم سرعت را بهبود چشمگیری خواهد بخشید. اما اگر به مرورگر نفهمانیم که هر عنصر چقدر باید در کش بماند مشکلات زیادی از قبیل نمایش عناصر قدیمی به جای عناصر جدید و یا کلا عدمcaching  پیش خواهد آمد.

برای فعال سازی کش از طریق سرور باید خطوط زیر را به فایل .htaccess خود اضافه کنید.

<IfModule mod_headers.c>
# 1 YEAR
<FilesMatch "\.(ico|pdf|flv)$">
Header set Cache-Control "max-age=29030400, public"
</FilesMatch>
# 1 WEEK
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
# 2 DAYS
<FilesMatch "\.(xml|txt|css|js)$">
Header set Cache-Control "max-age=172800, proxy-revalidate"
</FilesMatch>
# 1 MIN
<FilesMatch "\.(html|htm|php)$">
Header set Cache-Control "max-age=60, private, proxy-revalidate"
</FilesMatch>
</IfModule>

استفاده از سرورهای تحویل محتوا (Content Delivery Networks)

cdn ها کارشان این است که فایلهایی را که استفاده زیادی در وبسایتهای امروزه دارند را در خود جای دهند و در موقع نیاز انها را به کاربر تحویل دهند. برای مثال کتابخانه جاوا اسکریپت JQuery را تصور کنید. کتابخانه‌ی بسیار معروفی که سیستم ورد پرس و بسیاری از سیستمهای دیگر به طور پیشفرض از آن استفاده میکنند. شما میتوانید به جای اینکه این فایل ها را از درون هاست خود در سایتتان استفاده کنید از آدرس زیر استفاده کنید.

http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js

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

ترکیب کردن جاوا اسکریپت و CSS در یک فایل

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

بهینه سازی تصاویر

به جرات میتوان گفت امروزه تصاویر بیشترین حجم صفحات وب را بخود اختصاص داده اند و روزانه هزاران گیگابایت پهنای باند را مصرف میکنند. تصاویری که گاها بدلیل استاندارد نبودنشان برای وب حجمی بسیار بیشتر از آنچه نیاز دارند اشغال میکنند. در بسیاری موارد میتوان حجم تصاویر را تا ۸۰ درصد بدون افت کیفیت کاهش داد. ابزارهای زیادی نیز برای اینکار موجود هستند. درسیستمهای لینوکسی دو ابزار بسیار مفید jpegoptim و optipng میتوانند تعداد زیادی تصویر را در زمان کمی بدون افت کیفیت بهینه کنند. برای ویندوز نیز ابزارهای مخصوصی وجود داردند.+ + +

کوچک کردن JavaScript و CSS

فایلهای css و js اگر به همان صورتی که نوشته میشوند استفاده شوند دارای فاصلها و خطوط بسیاری هستند که اینها نیز به خودی خود فضا اشغال میکنند. میتوانید با استفاده از ابزارهایی مشابه این ابزار فایلهای css خود را فشرده کنید. فایلهای جاوا اسکریپت هم قابلیت فشرده سازی دارند. با استفاده از این ابزار میتوانید کدهای جاوا اسکریپت خود را به اصطلاح pack کنید. با اینکار دو نشان را با یک تیر زده اید. هم  کدهای خود را از شر دزدی حفظ کرده اید و هم آن را فشرده کرده اید.

و در آخر این نکته را متذکر میشوم که گرچه افزایش سرعت برای سایتها بسیار مفید خواهد بود اما نباید محتوا را فدای سرعت کرد. به یاد داشته باشید محتوای خوب ارزش منتظر ماندن را خواهد داشت.

۱۵۰۰۰ Cheat Sheet برای توسعه دهندگان

نویسنده حامد در تیر ۲۱م, ۱۳۸۹

اگر مطلب قبلی من در مورد Cheat Sheet ها را خوانده باشید حتما میدانید که این به اصطلاح برگه تقلب ها چیستند. به طور خلاصه Cheat Sheet ها راهنما های سریع و جامعی هستند که معمولا سعی میکنند در یک صفحه اطلاعات لازم و کاربردی در مورد یک موضوع مخصوصا زبان های برنامه نویسی را به ما بدهند.

در مطلب قبل تعدادی برگه تقلب را برای شما معرفی کردم. اما اینبار قصد دارم منبعی را به شما معرفی کنم که با استفاده از آن به بیش از ۱۵۰۰۰ Cheat Sheet در موضوعات مختلف دسترسی پیدا خواهید کرد.

devcheatsheet.com

سایت devcheatsheet.com منبعی است که در آن از موضوعات گوناگون تعداد زیادی Cheat Sheet گردآوری شده و در اختیار کاربران قرار گرفته است. در این سایت میتوانید برگه های تقلبی از زبانهای برنامه نویسی مانند C/C++ , PHP, JavaScript گرفته تا تکنیکهای مختلف برنامه نویسی, کتابخانه های متنوع, سیستم عامل, امنیت و بسیاری موضوعات دیگر بیابید.

چرا طراحان وب نباید تنها کار کنند؟!

نویسنده حامد در تیر ۱۰م, ۱۳۸۹

مقاله زیر ترجمه‌‌ی قسمتی از مطلب منتشر شده در سایت Smashing Magazine است که مناسب دیدم شما نیز آن را بخوانید.

امروزه به دلیل گستردگی اینترنت و غنی شدن هرچه بیشتر ابزارهای ارایه شده در اینترنت باعث شده تا بتوان بسیاری از کار ها را از راه دور انجام داد و با بسیاری از افراد از سرتاسر دنیا در ارتباط بود. نمونه بارز این گونه استفاده از اینترنت به وجود آمدن پدیده ی کار در خانه است.

طراحی وب نیز یکی از کارهایی است که به راحتی میتوان از درون خانه و پشت کامپیوتر شخصی خود انجام داد. گرچه این استفاده از اینترنت سودهای فراوانی دارد اما نقاط منفی را نیز در پی دارد که در ادامه به آن اشاره میکنم.

خطرات تنها کار کردن

به مرور زمان تنها بودن و تنها کار کردن میتواند برای سلامت روان ما خطرناک باشد. حتی وقتی در گروهی هستید اگر همه افراد گروه از شما پایین تر باشند نیز شما دچار نوعی ایزوله شدن میشوید.

اگر شما کسی را هم سطح خود نداشته باشید که در حین کار با وی بحث و گفتگو کنید و ایده های مختلف را برای یکدیگر بیان کنید, ممکن است دچار مشکلات زیر شوید:

  • از دست رفتن خلاقیت: حفظ خلاقیت اگر تنها باشید به مرور زمان سخت خواهد بود. معمولا خلاقیت از جمع عده‌ای حاصل میشود که در موضوعات مختلف افکار خود را روی هم میریزند و با هم به بحث و جدل میپردازند. در جمع است که از یک ایده جالب به ایده های جالب دیگر رهنمون میشوید.
  • از دست دادن اعتماد به نفس: معمولا اشخاصی که به تنهایی کار میکنند به مرور زمان دچار کمبود اعتماد به نفس میشوند. اگر کسی را نداشته باشیم که ما را در مواقع لازم تشویق کند و در برابر مشکلات موجود به ما روحیه بدهد ممکن است دچار این عارضه شویم.
  • اعتماد به نفس بیش از حد: مشکل دیگری که به اعتماد به نفس مربوط می‌شود  زیاد بودن  بیش از حد آن است. اگر تنها باشیم ممکن است دچار غرور کاذب شویم, ولی اگر در یک گروه کار کنیم معمولا افرادی پیدا میشوند که همیشه دانسته های ما را به چالش بکشند و ما را به دنبال کسب علم بیشتر بفرستند. همیشه گفته اند که غرور آفت پیشرفت است.
  • ته کشیدن دانسته ها: امروزه فعالیت در هر زمینه ‌ای به قدری گسترده شده که باید محدوده‌ی زیادی از علوم را برای انجام یک کار در اختیار داشت. خوب هیچ کس نمیتواند همه چیز را به تنهایی فرا گیرد و تنها کار کردن باعث میشود که سرانجام به انتهای دانش خود برسیم. در این مواقع است که جای خالی یک همکار به چشم می‌آید.
  • داشتن دید محدود: معمولا هر فرد برای انجام هر کار از زاویه‌ی خاصی به یک مسئله مینگریم. حال اگر به تنهایی کار کنیم مسلما  زوایای دید ما محدود خواهد بود. با شرکت در جمع است که میتوان یک مسئله را از زوایای مختلف بررسی و تحلیل کرد.
  • تحت فشار بودن: معمولا هر کار مشکلات و موانع خود را در پیش دارد. تنها کار کردن باعث میشود که در مقابل مشکلات مختلف احساس ضعف کنیم و در بسیاری موارد ممکن است از ترس شکست به کلی میدان را خالی کرده و بیخیال شویم. در این مواقع داشتن یک پشتیبان میتواند ناجی ما باشد.

حال سوال اینجاست که چگونه میتوان از این مشکلات جلو گیری کرد؟ در زیر تعدادی پیشنهاد موجود است.

  • میتوانید در ازای پرداخت مبلغی یک مشاور برای خود داشته باشید. معمولا کسی که از بیرون به کار شما مینگرد کمک بزرگی برای شناختن مشتریان شما خواهد بود.
  • یا اینکه میتوانید از کسی درخواست راهنمایی کنید. برای مثال شما کار یک طراح خاص را تحسین میکنید و به نوعی از وی الگو میگیرید. چرا از خود استاد نمیپرسید که رمز کارش چیست؟
  • داشتن یک رفیق نیز میتواند راه حل خوبی باشد. شخصی مانند خودتان یک کمک بزرگ خواهد بود.
  • یا اینکه میتوانید از جوامع آنلاین و آفلاین کمک بگیرید. هزاران گروه اینترنتی موجود هستند که حاضرند به شما کمک کنند. سعی کنید گروهی نه چندان بزرگ را انتخاب کنید که حداقل اسم شما را به خاطر بسپارند.

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

PHP یا ASP؟ مسئله این است!

نویسنده حامد در اردیبهشت ۱۵م, ۱۳۸۹

بار ها این سوال ذهن منو به خودش مشغول کرده زبانهای PHP و ASP چه تفاوتهایی با هم دارن و کدوم نسبت به دیگری برتری داره. بعد از کمی جستجو و خوندن چند مقاله تصمیم گرفتم تا نتایج تحقیقم رو با شما هم به اشتراک بذارم.

ابتدا از ASP شروع میکنم.

زبان ASP که مخفف کلمات Active Server Page است یکی دیگر از محصولات کمپانی مایکروسافته که به دلیل ASP.NET بودن میتونه از کمپوننت های .NET هم استفاده کنه. این زبان بیشتر در کمپانی های بزرگ مورد استفاده قرار میگیره. ASP سینتاکس مستقلی نداشه و معمولا از دستور زبان در حال انقراض VBSsript استفاده میکنه گرچه از زبان های دیگری نیز میشه استفاده کرد. در زیر تعدادی از ویژگی های مربوط به این زبان رو آوردم.

  • اول اینکه این زبان فقط مخصوص سیستم عامل ویندوز هست و از وب سرور IIS استفاده میکنه. گرچه برنامه های جانبی برای سازگاری ASP با بعضی از سیستم های دیگه هم پیدا میشه.
  • متأسفانه ASP فقط میتونه از پایگاه داده MSSql استفاده کنه و قابلیت استفاده مستقیم از دیتابیس های دیگر رو نداره.
  • باید بدانید که هردوی IIS و MSSql محصول مایکروسافت هستند و از این رو باید اونها رو خریداری کرد.
  • بسیاری معتقدند که فقط در ASP معنای حقیقی شئ گرایی گنجانده شده.
  • در ASP میتوان علاوه بر VBSript از زبانهایی مثل C++, C#, Visual Basic.NET, Jscript.NET, Python, Perl, Java (J#), COBOL, Eiffel و Delphi نیز استفاده کرد.
  • ASP بخشی از .NET هست و همین برای بسیاری از برنامه نویس ها کافیه.

و اما اینکه چرا کمپانی های بزرگ بیشتر از ASP استفاده میکنند تا زبان های دیگه.

  1. مهمترین دلیل اینکه محصولات مایکروسافت رو میشه در سرتاسر دنیا و روی هر سیستمی پیدا کرد. استفاده از ASP باعث سازگاری با بسیاری از سیستم های کمپانی های دیگر خواهد شد.
  2. شرکت های بزرگ معمولا از سالها پیش از محصولات مایکروسافت استفاده میکرده‌اند و کارمندان آنها نیز برای کار با این محصولات آموزش دیده اند. ASP هم دقیقا به همین دلیل طرفدار بیشتری میان کمپانی های بزرگ دارد. استفاده از ASP باعث صرفه جویی فراوانی خواهد شد چرا که لازم نیست دوباره افرادی را برای کار با سیستم جدید استخدام کرد و یا کارمندان را دوباره آموزش داد.
  3. اگر یک کمپانی قصد خرید کمپانی دیگری را داشته باشد باید اطلاعات آن را با اطلاعات موجود در سرورهای خود ادغام کند و چون معمولا بقیه کمپانی ها نیز از ASP استفاده میکنند, شرکت مذکور نیز با داشتن ASP روی سرورهای خود عملیات ادغام را بسیار کم خرج تر و راحت تر میکند.

حالا نوبت به PHP میرسد.

PHP که مخفف Hypertext Preprocessor است ابتدا توسط Rasmus Lerdorf پایه گذاری شد و بعد ها اشخاص دیگری نیز به این پروژه پیوستند. PHP اکنون یکی از پرطرفدار ترین زبان های سمت سرور است که هر روز به محبوبیتش افزوده میشود. دلایل این افزایش محبوبیت میان کاربران را میتوان به صورت زیر عنوان کرد.

  1. اول اینکه بر خلاف ASP که فقط روی IIS اجرا میشود که IIS نیز رایگان نیست, PHP در بسیاری از نرم افزارهای سرورها  و تقریبا در هر سیستم عاملی اجرا میشود. PHP به دلیل گسترش موارد استفاده به هیچ وجه به استفاده از یک سیستم خاص محدود نیست.
  2. PHP از سینتاکس آشنای زبان C/C++ استفاده میکند و به همین دلیل بسیاری از افرادی که با زبان محبوب C آشنایی دارند به راحتی میتوانند کار با PHP را نیز شروع کنند. این سینتاکس به کوتاهی معروف بوده و عملیات کامپایل و تبدیل به زبان ماشین را سرعت بالایی میبخشد.
  3. PHP از تعداد زیادی پایگاه داده پشتیبانی میکند. MySQl, PostgreSQL, Oracle و … . شما به هیچ وجه محکوم به استفاده از یک دیتابیس خاص نیستید.
  4. PHP تقریبا برای هر کاری تابع آماده دارد.
  5. هر چیزی که برای راه اندازی و استفاده PHP لازم باشد به صورت رایگان و قانونی قابل تهیه است. از نرم افزار سروری مثل Apache گرفته تا پایگاه داده‌ای مثل MySql… .

در نهایت انتخاب شما در استفاده از ASP و PHP به مورد کار و تجربه شما بر میگرده. هر دو زبان برتری ها و نقوص خودشون رو دارن و

خلاصه‌ای از کاربرد ریاضیات در طراحی وب

نویسنده حامد در بهمن ۲۸م, ۱۳۸۸

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

اما در این مطلب قصد دارم تا رابطه ریاضیات و طراحی وب را هر چند مختصر برای شما شرح دهم. اگر طراح وب هستید به شما توصیه میکنم ادامه مطلب را بخوانید. هرچقدر هم از ریاضی بدتان بیاید قول میدهم این مبحث شیرین خواهد بود.(حداقل برای من که بود!)

نسبت طلایی و مستطیل طلایی

نسبت طلایی یکی شگفتی های عالم ریاضیات است. این نسب که یک ثابت عددی با مقدار تقریبی 1.618033987 است خواص عجیب و شگفت انگیزی دارد. این نسبت را در بسیاری از پدیدهای طبیعی میتوان یافت. در بسیاری از فراکتال های طبیعی این نسب به وفور یافت میشود. مقدار دقیق این نسب اینگونه به دست می‌آید. دو مقدار را در نظر بگیرید. اگر نسبت مجموع دو مقدار به مقدار بزرگتر برابر با نسبت مقدار بزرگتر به مقدار کوچک تر باشد, آنگاه این دو مقدار با هم نسبت طلایی دارند. شکل زیر….

Golden Ratio

Golden Ratio

و اما مستطیل طلایی. مستطیلی که نسب اضلاع آن برابر با نسبت طلایی (تقریبا ۱.۶۱۸) باشد مستطیل طلایی نام دارد. هنرمندان معتقدند کامل ترین و زیباترین مستطیلی که وجود دارد مستطیل طلایی است. در ادامه چگونگی رسم یک مستطیل طلایی آورده شده است.

ادامه مطلب

اولین نسخه از سیستم مدیریت محتوای نیوک لرن منتشر شد!

نویسنده حامد در بهمن ۱۹م, ۱۳۸۸

چند ماهی است که علاوه بر فعالیت های جانبی و نوشتن در وبلاگ در سایت نیوک لرن در حال توسعه‌ی نسخه جدید از پرتال محبوب نیوک بودیم که به لطف همت همکاران و مدیر پروژه آقای غضنفری دیروز اولین نسخه پایدار این سیستم برای دریافت عموم منتشر شد. لازم دیدم در این وبلاگ مطلب مختصری در معرفی این سیستم بنویسم.

Nukelearn USV

پرتال NukeLearn که برپایه پرتال IranNuke و برگرفته از پرتال محبوب phpNuke تحت لیسانس OpenSource در اختیار عموم قرار گرفته شده است. ااز نظر ساختاری سعی در بهینه شدن هسته سیستم شده به صورتی که بسیاری از کدهای بی استفاده که به مرور زمان کارآیی خود را از دست داده بودند حذف شده و علاوه بر آن سعی بر این بوده تا پایگاه داده نیز مرتب و سبک گردد.

در سیستم جدید بسیاری از ماژول‌هایی که کاربرد عمومی نداشته از بسته اصلی حذف شده و به صورت پلاگین و جدا ارائه شده است. از این رو شاهد کاهش حجم کل بسته خواهیم بود. همچنین سعی شده در بخش مدیریت سیستم از تکنیک های نوین برنامه نویسی استفاده شود, به صورتیکه بسیاری از قسمتها به صورت آژاکسی در آمده است.

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

تغییرات زیر و درشت بسیاری در این نسخه وجود دارد که در یک مطلب نمیتوان به همه آن اشاره کرد. اما اگر علاقه مند هستید تا با این سیستم و اماکانات آن بیشتر آشنا شوید, به این آدرس مراجعه کنید.

مرجع پرتال Nukelearn

دانلود پرتال نیوک لرن USV نسخه ۱


کپی رایت ۷ سال. قدرت گرفته از وردپرس طراحی از پوسته های وردپرس ترجمه از متابلاگ