جادوی overflow:hidden در شیوه‌نامه‌ها( CSS )

استفاده ویژگی overflow:hidden علاوه بر کاربرد رسمی آن که در استانداردها تعریف شده، کاربردهای دیگری نیز دارد که در طراحی وب بسیار کارآمد است.
علت اصلی کاربردهای جانبی این دستور، تغییر ماهیت عناصر است. عناصری که با ویژگی «overflow:hidden» تعریف شوند حالت نمایشی BFC یا Block formatting context را به خود می‌گیرند.
در حال حاضر ویژگی استانداردی برای تغییر حالت عناصر به BFC تعریف نشده است و تنها راه دستیابی به این حالت استفاده از برخی دستورات CSS است که ساده‌ترین و ایمن‌ترین آن‌ها «overflow:hidden» به حساب می‌آید.

در ادامه برخی کاربردهای حالت BFC را مرور می‌کنیم:
ادامه‌ی خواندن

ارسال شده در CSS, برنامه‌نویسی | ۴ دیدگاه

قالب رایگان امیب ۱ برای بلاگفا

قالب بلاگفا رایگان امیب ۱.۱

۱۹ آذر ۱۳۹۱
با توجه به بازخوردهای موجود، تغییراتی در نسخه‌ی قبلی به وجود آمد که تصویر آن در بالا قابل مشاهده است


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

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

بلاگفا سیستمی است که به کاربران خود اجازه می‌دهد نوشته‌های خود را در فضایی رایگان با دیگران به اشتراک بگذارند.
برای تغییر قالب وبلاگ خود به بخش مدیریت مراجعه کنید و از منوی سمت راست گزینه‌ی «ویرایش قالب» را انتخاب نمایید.

برای دریافت کد قالب اینجا کلیک کنید

برای مشاهده‌ی نمونه‌ی آنلاین اینجا کلیک کنید

ارسال شده در قالب سایت | برچسب‌شده , | ۱۵ دیدگاه

متاتگ‌های استاندارد برای اشتراک گذاری در شبکه‌های اجتماعی

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

استاندارد مورد استفاده برای این موارد پروتکل Open Graph نام دارد.
این پروتکل منابع مورد نیاز برای اشتراک یک مطلب را به شیوه‌ای استاندارد در می‌آورد تا انتشار مطالب در شبکه‌های اجتماعی به بهترین شکل ممکن صورت بپذیرد.

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

اضافه کردن این تگ‌ها در سیستم وردپرس بسیار آسان است. کافی است یکی از افزونه‌هایی که برای این‌کار توسعه پیدا کرده‌اند را روی وبلاگ خود نصب کنید و تنظیمات مورد نیاز را در آن به انجام برسانید.
پیشنهاد من افزونه‌ی «WP Facebook Open Graph protocol» است.
دو تنظیم اصلی برای فعال شدن این افزونه، شناسه‌ی شما در فیسبوک و تصویری دلخواه است که برای مطالب بدون تصویر مورد استفاده قرار بگیرد.

برای آزمایش عملکرد این افزونه، همین مطلب را در شبکه‌های اجتماعی به اشتراک بگذارید
با تشکر !

ارسال شده در HTML, SEO, برنامه‌نویسی | برچسب‌شده | دیدگاه‌تان را بنویسید

AutoHotkey ابزاری برای همه

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

AutoHotkey

AutoHotkey توانسته است چندین عملکرد را به خوبی در یکدیگر ادغام کند. این ویژگی‌ها عبارتند از: اسکریپت‌نویسی، کلید میانبر و ماکرو.
ادامه‌ی خواندن

ارسال شده در برنامه‌نویسی, نرم‌افزار | ۶ دیدگاه

امنیت گذرواژه‌های ذخیره شده در مرورگرها

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

مرورگرهای Internet Explorer و Google Chrome از الگوریتمی مشابه برای محافظت از گذرواژه‌ها بهره‌گیری می‌کنند. این دو مرورگر، گذرواژه‌های شما را با کمک گذرواژه‌ی تعیین‌شده در ویندوز کدگذاری می‌کنند. به عبارت دیگر، امنیت گذرواژه‌های ذخیره شده در مرورگر با امنیت گذرواژه‌ی ویندوز رابطه‌ی مستقیم دارد.
ادامه‌ی خواندن

ارسال شده در امنیت, فناوری, نرم‌افزار | دیدگاه‌تان را بنویسید

Source Code Pro – فونت متن‌باز ادوبی برای توسعه‌دهندگان

Source Code Pro - فونت رایگان و متن‌باز Adobe برای توسعه‌دهندگان

گروه تایپ Adobe و پائول هانت به تازگی فونتی متن‌باز و رایگان با نام «Source Code Pro» آماده کرده‌اند. این فونت به طور ویژه برای برنامه‌نویسان طراحی شده است. عرض ثابت نویسه‌ها، تفاوت آشکار میان نشانه‌های شبیه‌به‌یکدیگر و پشتیبانی از زبان‌های مختلف از نکات قابل توجه در این فونت هستند.

تنها نکته‌ی منفی در این فونت برداری بودن آن است به این معنی که ویرایش Bitmap آن در فایل گنجانده نشده است. بنابراین برای استفاده از آن مخصوصا در اندازه‌های کوچک، لازم است تا ویژگی ClearType در سیستم‌عامل و ویرایشگر شما فعال باشد.

انجام تغییرات و بازنشر این فونت در سایت‌هایی مانند GitHub توسط ادوبی مورد تشویق قرار گرفته است.

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

منبع

ارسال شده در برنامه‌نویسی, فناوری | برچسب‌شده | ۲ دیدگاه

کد قابل توسعه: تورفتگی کد

هر چه تورفتگی یا Indentation در کدهای برنامه بیشتر باشد، خوانایی با نسبتی نمایی کاهش می‌یابد.
در حالت ایده‌آل تورفتگی در هر تابع نباید بیش از یک پله باشد.

<?php
	if( $user_name == 'AMIB' ) {
 
		foreach( $files as $file ) {
 
			if( $file == 'image.jpg' ) {
				// BAD
			}
 
		}
 
	}
?>

برای پاکسازی تورفتگی‌ها گاهی تلاش زیادی لازم است. در مورد «if»ها، استفاده از شرط معکوس می‌تواند بهترین راه‌حل باشد. شکستن عملکرد کدهای بلند به توابع کوچک‌تر نیز یکی از راه‌های خوب برای کاهش تورفتگی و افزایش خوانایی است:

<?php
	if( $user_name != 'AMIB' ) {
		return;
	}
 
	foreach( $files as $file ) {
		// GOOD
		process_file( $file );
	}
?>

تلاش کنید تا جایی که ممکن است از کلمه‌ی کلیدی «else» استفاده نکنید. نوشتن صریح شرط به جای «else» و یا حالت ساده‌تر، نوشتن شرط در توضیحات مقابل «else» می‌تواند راه‌حل‌های جایگزین باشند.

<?php
	// ========= BAD =========
	if( $user_name == 'AMIB' ) {
		// ...
		// ...
	} else { // BAD
	}
 
	// ========= GOOD =========
 
	if( $user_name == 'AMIB' ) {
		// ...
		// ...
	}
 
	if( $user_name != 'AMIB' ) {
		// GOOD
	}
 
	// ======= GOOD TOO =======
 
	if( $user_name == 'AMIB' ) {
		// ...
		// ...
	} else { // $user_name != 'AMIB'
		// GOOD TOO
	}
?>
ارسال شده در برنامه‌نویسی | برچسب‌شده | دیدگاه‌تان را بنویسید

PhraseExpress

PhraseExpress

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

یکی دیگر از کاربردهای مفید این برنامه توان انجام کارهای تکراری با ایجاد ماکروها است. کارهایی از قبیل باز کردن یک برنامه، کلیک کردن در محلی خاص، باز کردن یک وبسایت، کپی کردن متن از Clipboard و دیگر کارهای متداول در ویندوز.

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

استفاده از PhraseExpress برای کاربردهای شخصی رایگان است. این نرم‌افزار از سیستمی درونی برای تشخیص کاربران تجاری بهره‌گیری می‌کند. برای اینکه از غیرفعال شدن نرم‌افزار جلوگیری کنید از به‌کارگیری امکانات شبکه‌ای نرم‌افزار خودداری کنید و عبارت‌های تجاری مانند «VAT» و «Order» را در جملات خود قرار ندهید.

برای مراجعه به سایت برنامه اینجا کلیک کنید

برنامه‌های رایگان دیگری که کاری مشابه انجام می‌دهند در اینترنت قابل دسترسی هستند. اگر از نرم‌افزاری دیگر که ویژگی‌های بهتری دارد، استفاده می‌کنید، آن را در بخش نظرات معرفی کنید.

ارسال شده در نرم‌افزار | دیدگاه‌تان را بنویسید

رهایی از هرزنامه‌ها در بخش نظرات وبلاگ وردپرس

مدت زیادی نبود که وبلاگم را راه‌اندازی کرده بودم. هرزنامه‌هایی که در بخش نظرات وبلاگ پست می‌شد مرا به این فکر انداخت که افزونه‌ای مناسب برای جلوگیری از این مزاحمان پیدا کنم
با جستجوی افزونه‌های وردپرس «Cookies for Comments» را پیدا کردم که با شیوه‌ای جالب مانع فعالیت ربات‌های ارسال هرزنامه می‌شود

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

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

برای دریافت Cookies for Comments اینجا کلیک کنید

ارسال شده در امنیت, وردپرس | یک دیدگاه

استفاده از صفت placeholder در inputها( HTML5 )

نمایش توضیحات اضافی در فیلد متنی html5

یکی از ویژگی‌های جدید در HTML5 که می‌تواند در inputها مورد استفاده قرار گیرد، placeholder نام دارد. این صفت که می‌تواند به انواع text، search، url، tel، email و password تخصیص داده شود، برای نمایش توضیحاتی اضافی درون فیلد مورد استفاده قرار می‌گیرد.

<input type="text" placeholder="نام کاربری" />
<input type="password" placeholder="گذرواژه" />

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

مرورگرهای مختلف هنگامی که با این صفت مواجه شوند، آن را به صورت کمرنگ درون فیلد نمایش می‌دهند. زمانی که کاربر با ورود به فیلد بخواهد متن خود را تایپ کند، این توضیحات به صورت خودکار مخفی می‌شود.

ارسال شده در HTML | برچسب‌شده | دیدگاه‌تان را بنویسید