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

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

اما همین کار هم در نوع خود زمانبر است، خصوصا اگر بخواهیم از محیط های صرفا متنی برای نوشتن کد HTML استفاده کنیم که در آن صورت با هر تغییر کوچک در کد باید برگردیم و صفحه را refresh کنیم تا نتیجه را ببینیم. و اگر نتیجه مطلوب نباشد دوباره باید این روند را تکرار کنیم.

خوشبختانه برای این مساله هم راه حل هایی وجود دارد. سایت هایی هستند که از طریق یک محیط javascript به ما اجازه می دهند دکمه های دلخواه خود را به شیوه ی کاملا بصری یا Visual ایجاد کنیم و بعد کد CSS مربوطه را در اختیارمان می گذارند. کد ارائه شده در خروجی cross-browser بوده و بر روی همه ی مرورگرهای مدرن پشتیبانی می شود. در ضمن مرورگرهای قدیمی هم کلا از این دکمه ی جدید ما بی بهره نخواهند ماند. به بیان دیگر دکمه نمایش داده شده در مرورگرهای قدیمی تر کاملا شبیه آنچه در مرورگرهای جدید دیده می شود نیست ولی به هر حال زیبایی و کارآیی خود را خواهد داشت.

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

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

متاسفانه بدون استفاده از css3 ایجاد و مدیریت ستون ها در صفحات وب کار دشواری است و البته استفاده از css3 هم به دلیل اینکه هنوز به صورت یک استاندارد یکپارچه برای همه ی مرورگرها در نیامده راه حل جالبی به نظر نمی رسد.

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

اما خبر خوب برای وردپرسی ها افزونه ی Advanced WP Columns که روال ایجاد و مدیریت ستون در نوشته های وردپرس را به شکلی کاربر پسند اداره می کند.

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

(بیشتر…)

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

اما به یمن معرفی اساندارد جدید CSS3 این مشکل حل شده و اکنون طراحان وب می توانند با خیالی آسوده از فونت دلخواه خود استفاده کنند. دستور @font-face از مجموعه ی دستورات CSS3 به کاربر اجازه می دهد که قلم دلخواه خود را به وب سایت خود اضافه نموده و به راحتی از آن استفاده کند. به عنوان نمونه می توان به دیوان حافظ روزهای خط خطی اشاره کرد که برای نمایش اشعار حافظ از قلم زر بهره می گیرد.

(بیشتر…)