گیک فارسی

نوشته های یک گیک فارسی از فعالیت ها ،‌ علاقه مندی ها و نقد هایش

رفع بسیاری از مشکلات مربوط به تفاوت‌های مرورگر ها در طراحی وب سایت

نویسنده:
30 نوامبر 14

یکی از اصلی‌ترین مشکلات و دردسر ها در طراحی وب سایت ، یکسان سازی نمایش وب سایت در مرورگر های مختلف است. جالب اینجاست که اکثر طراحان وب با خواندن مطلب تا به اینجا فوراً تفاوت‌های آشکار و غیر استاندارد IE (مخصوصاً نسخه های قدیمی تر از ۸) در ذهنشان نقش می‌گیرد. این در حالی است که حتی مرورگر های Firefox و Chrome نیز در خیلی از موارد تفاوت‌هایی را در نمایش المان‌های Html دارند.

این تفاوت‌ها از تنظیمات پیش فرضی ناشی می‌شود که تولید کنندگان آن‌ها برای محصول خود در نظر گرفته‌اند که مثلاً رنگ لینک ها در شرایط بازدید نشده و بازدید شده چه باشد و یا حاشیه های داخلی و بیرونی (Padding و Margin) برای المان هایی نظیر TD در TABLE و یا DIV یا LI و حتی خود BODY چه باشد. همین پیش‌فرض ها باعث می‌شود تا تغییراتی در اندازه و مکان المان های صفحه در هر مرورگر شاهد باشیم.

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

یک نمونه کد CSS RESET که توسط Eric Meyer نوشته شده است :

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {        margin: 0;      padding: 0;     border: 0;      font-size: 100%;        font: inherit;  vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {    display: block;}body {  line-height: 1;}ol, ul {        list-style: none;}blockquote, q {       quotes: none;}blockquote:before, blockquote:after,q:before, q:after {   content: '';    content: none;}table {  border-collapse: collapse;      border-spacing: 0;}

کدهای نمونه دیگری هم در سایت cssreset.com موجود است.

مهاجرت به لینوکس | نرم‌افزار های مورد نیاز در توسعه وب

نویسنده:
24 جولای 14

پیرو نوشته‌ای که با عنوان «مهاجرت به لینوکس | نصب و راه اندازی سرویس های مورد نیاز یا همون LAMP» منتشر کردم. در پنجمین و آخرین پست از نرم‌افزار های مشترک و جایگزینی که برای توسعه وب میتونید استفاده کنید خواهم گفت و این بحث را به پایان میبرم.

حالا که اوبونتو را نصب کردیم و سرویس های مورد نیاز برای توسعه وب را راه اندازی و پیکربندی کردیم حالا نیاز داریم برای ساخت وب سایت از ابزار های گرافیکی و محیط توسعه و کدنویسی استفاده کنیم. توی محیط ویندوز قطعاً برای طراحی وب از ابزار Adobe Photoshop استفاده میکنیم که در محیط لینوکس به صورت Native نمیشه ازش استفاده کرد مگر اینکه از ابزار Wine استفاده کنید که اصلاً توصیه نمیکنم.(Wine برنامه ای هست که امکان اجرای نرم‌افزار های ویندوزی را در لینوکس فراهم میکنه) به جای Adobe Photoshop میتونید از Gimp استفاده کنید. گیمپ قطعاً در قامت فوتوشاپ نیست ولی برای طراحی صفحات وب هیچ کم و کسری نداره و حتی یکسری قابلیت‌هایی داره که حداقل من توی فوتوشاپ نمیدونستم که شاید دلیلش دم دستی تر بودن ابزار گیمپ باشه.

برای کدنویسی توی محیط ویندوز ابزار بسیار زیادی هست که اکثر برنامه نویسان وب از ++Notepad و Adobe Dream Weaver یا Zend Studio استفاده میکنند. از بین این سه محیط توسعه وب فقط Zend Studio برای لینوکس موجود هست و میشه ازش استفاده کرد. اما Zend کپی رایت داره و من حاضر نیستم به صورت کرک شده ازش استفاده کنم. من در ویندوز از DreamWeaver استفاده میکردم و ادیتور های خیلی ساده زیاد برام جالب نبودند. بالاخره بعد از بررسی های فراوان به این نتیجه رسیدم که Eclipse PDT (در‌ واقع Eclipse ی برای PHP پیکربندی و بهینه شده) بهترین انتخاب هست و واقعاً هم ازش راضی هستم. البته Eclipse برای Java کار ها هم محیط توسعه معروفی هست و توی ویندوز هم خیلی ازش استفاده میشه ولی تجربه من بر میگرده به اوبونتو که بسیار هم خوب و روان بود.

برای تست کردن هم که هم مرورگر Firefox و هم Chrome روی لینوکس موجود هستند ولی من ترجیح میدم از فایرفاکس استفاده کنم. برای کروم درگیری‌هایی با IP ایران وجود داره که من کلاً از خیرش گذشتم.

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