اوتوبان

آموزش ویدیویی مقدماتی طراحی سایت با فلش

اخیرا تو یکی از درسهای دانشگاهیم (محیط های چند رسانه ای) پروژه ای به من محول شد که باید یک سایت کامل رو با فلش پیاده سازی میکردم. از اونجایی هم که من هیچ وقت تو هیچی کم نمیارم رفتم و هرطور که شد Adobe Flash CS 5  رو تا حدودی یاد گرفتم. این شد که تصمیم گرفتم تو یه مجموعه ویدیو به صورت خیلی مقدماتی طراحی وب سایت با فلش رو آموزش بدم.

توی این مجموعه به طور کلی کار مفاهیم زیر رو یاد میگیریم.

• نحوه کار با TimeLine
• روش ساخت و به کارگیری منوها در فلش
• جداسازی صفحات مختلف در تایم لاین
• و همچنین اعمال انیمیشن های از پیش ساخته به آبجکت‌ها

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

دانلود آموزش مقدماتی طراحی وب سایت با Flash

استایل فونت فارسی برای توییتر و فیس بوک لینوکسی ها

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

این استایل که قابل استفاده با استفاده از افزونه های Stylish و Greasemonkey هست رو میتونید از آدرس روبرو دانلود کنید. استایل فونت فارسی برای توییتر و فیس بوک

اگر فکر میکنید سایت دیگه نیاز به چنین استایلی داره حتما خبرم کنید که به این استایل اضافش کنم.

فونت Tahoma و Sans در لینوکس

برای طراحان وب انتخاب یک فونت مناسب برای وب سایت یکی از ضروریات کار هستش. در انتخاب فونت مناسب باید چند نکته در نظر داشت:

1. فونت انتخاب شده, باید با بقیه اجزای سایت همخونی داشته باشه.
2. باید خوانا باشه
3. و همچنین در همه مرورگها و سیستمهای مختلف به خوبی نمایش داده بشه.

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

اما در این بین به عهده طراحان وب هست که به موقع از فونت sans بهره ببرن. ابتدا بگذارید نمونه هر دو فونت رو در یک سیستم عامل اوبونتو ببینیم.

در تصویر بالا فونت تاهوما رو در اوبونتو مشاهده میکنید. میبینید که اصلا اون ظاهر همیشگی رو نداره و خوانایی بسیار پایینی داره.این حالت به این دلیل اتفاق میوفته که در سیستم های لینوکسی اصلا فونت Tahoma وجود نداره و مرورگر به طور پیشفرض از فونت serif استفاده میکنه. اما حالا نمایش فونت Sans رو در اوبونتو میبینیم.

میبیند که فونت sans نمایش بسیار بهتری رو داره (حتی بهتر از خود تاهوما در ویندوز). برای اینکه وبسایتهای ما در سیستم عاملهای لینوکسی هم بدرستی نمایش داده بشن فقط کافیه در css بعد از فونت Tahoma فونت sans رو نیز ذکر کنیم. درست مثل کد زیر:

فهرست تمامی شهرهای ایران

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

فهرست رو از اینجا دانلود کنید. —> فهرست تمامی شهرهای ایران مرتب شده بر اساس حروف الفبا

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

اولین برنامه اندروید

برای شروع و همچنین راه افتادن دست افرادی که میخوان کار با اندروید رو شروع کنن، بهتر دیدم که این پست کوتاه رو بنویسم که در برنامه های بعدی مشکلی از این نظر نداشته باشیم.

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

بسیار خوب، اولین برنامه اندروید ما هیچ چیز نیست جز همون برنامه «سلام جهان!». برای شروع پس از باز کردن Eclipse از منوی File و انتخاب گزینه New و سپس Project رو انتخاب کنید. در پنجره باز شده به دنبال Android Project باشید و پس از انتخاب این گزینه روی Next کلیک کنید.

در این مرحله باید یک نام مناسب برای پروژه خودتون انتخاب کنید.

در مرحله بعد باید نسخه اندروید مورد نظرتون رو انتخاب کنید. اگر محیط توسعه اندروید رو به درستی راه اندازی کرده باشید، باید گزینه Android 2.3.3 رو در لیست ببینید. روی Next کلیک کنید.

در مرحله بعد باید یک Package Name برای برنامه خودتون داشته باشید. Package Name های اندروید معمولا از فرمت com.some.name و یا org.some.name استفاده میکنند. شما هم سعی کنید نامی رو انتخاب کنید مختص برنامه تون باشه، چرا که اندروید برنامه شما رو با این اسم میشناسه و باید با بقیه برنامه های متفاوت باشه.

بر روی Finish کلیک کنید و مراحل تمام است.

حالا شما یک برنامه اندرویدی خام دارید که باید توسعه اش بدید. برای اینکه پروژه خودتون رو اجرا کنید و اون رو در عمل ببنید کلیدهای Ctrl+F11 رو بزنید. بعد از اینکار باید بصورت خودکار یک نسخه از شبیه ساز اندرویدی که قبلا ساختید ایجاد بشه و پس از چند لحظه برنامه شما باید اجرا شده باشه. درس مثل تصویر زیر…

در زیر خلاصه ای از محتویات پروژه اندرویدی شما، پوشه ها و فایلهای موجود فهرست وار آوردم.

• src – این پوشه اصلی برنامه شماست و کد اصلی جاوای شما در این پوشه قرار میگیره.
• gen – این پوشه که به صورت خودکار توسط Eclipse ساخته میشه مجموعه ای از کلاسهای سیستمی رو در خودش جای داده که توصیه میشه بهشون کاری نداشته باشیم.
• assets – این پوشه برای قرار دادن فایلهای کمکی هست که ممکنه بخواید در برنامه استفاده کنید.
• bin – در این پوشه هم فایلهای اجرایی و کامپایل شده برنامه شما یافت میشه.
• res – این پوشه هم مخصوص فایلهایی مانند xml layout ها که برای ساخت ظاهر برنامه استفاده میشن کاربرد داره و همچنین عوامل گرافیکی، مانند آیکون ها که ممکنه در برنامه ما کاربرد داشته باشند.

شروع برنامه نویسی برای اندروید

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

و اما اندروید…

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

1. Java SE Development Kit (JDK) کیت توسعه جاوا یکی از ابزارهایی هست که به درد همه کاری میخوره. میتونید از این لینک دانلود بفرمایید.
2. Android SDK یا به اصطلاح محیط توسعه اندروید که میتونید از این آدرس دانلود کنید. برای دوستانی هم که مشکل تحریم رو دارن میتونن، از این آدرس با لینک مستقیم دانلود کنن. لازم به ذکره که محیط توسعه ما ویندوز هست. البته شاید در آینده آموزش توسعه در لینوکس هم گذاشتم.
3. Eclipse که یک IDE برای زبان جاوا هست. البته NetBeans هم قابل استفاده است ولی Eclipse ابزارهای بهتری رو برای توسعه در اندروید داره. از این آدرس باید Eclipse Classic رو دانلود و نصب کنید.
4. ADT Plugins که افزونه های مورد نیاز Eclipse برای توسعه اندروید است که میتونید از این لینک (نسخه ۱۸) دانلود کنید.
5. Platform Tools هم مجموعه ای از ابزارهاست که برای توسعه در اندروید مورد نیاز هست. از اینجا دانلود کنید.
6. و در آخر هم شما باید یک نسخه از سیستم عامل اندروید رو که به دردتون میخوره دانلود کنید. من برای توسعه از نسخه ۲٫۳٫۳ استفاده میکنم که یک نسخه استاندارد هست که تقریبا واسه همه دیوایس های اندرویدی جواب میده. برای دانلود این نسخه از این آدرس استفاده کنید.
7. پوووووووووووووووووووف… بالاخره تموم شد… حالا بریم سراغ نصب و تنظیم این چیزایی که دانلود کردیم.

بسیار خوب، ابتدا باید JDK رو نصب کنیم. پس از نصب JDK نوبت به نصب Android SDK هست که فکر نمیکنم چیز سختی داشته باشه. از اونجایی که فرض رو بر این میگیرم که شما هم مشکل تحریم رو دارید، باید Platform Tools اندروید رو که در مرحله پنجم دانلود کردید، از حالت فشرده در بیارید و داخل پوشه نصب SDK کپی کنید.

مرحله بعد هم اضافه کردن سیستم عامل اندروید هست که در مرحله ششم، یعنی آخر دانلود کردید. این فایل رو هم مثل مورد قبل از حالت فشرده خارج کنید و به طور کل درون پوشه platforms داخل محل نصب Android SDK بریزید. الان محیط توسعه اندروید شما آماده ی استفاده است.

حالا نوبت تنظیمات اکلیپس میره. ابتدا اکلیپس رو از حالت فشرده خارج کنید. چون Eclipse به حالت پرتابل هست (به نصب احتیاج نداره) بهتره که اون رو به یک محل مناسب، مثلا روی درای C خودتون ببرید که بعدا کارتون راحت تر باشه. Eclipse رو اجرا کنید. از منوهای بالا Help رو انتخاب کنید و سپس روی Install New Software کلیک کنید.

در پنجره جدید، در قسمت بالا روی کلید Add کلیک کنید و سپس کلید Archive رو انتخاب کنید. در این مرحله باید فایل ADT Plugins که در مرحله ۴ دانلود کردید رو انتخاب کرده و روی Open کلیک کنید. سپس باید در لیست ظاهر شده تیک کنار گزینه Developer Tools رو انتخاب کنید و با کلیک بر روی Next بقیه مراحل نصب رو انجام بدید.

در مرحله بعد، باید آدرس مسیر نصب Android SDK رو در تنظیمات اکلیپس وارد کنید. برای اینکار کافیه از منوی Windows و انتخاب Preferences، از لیست سمت چپ Android رو انتخاب کنید و محل مشخص شده آدرس نصب Android SDK رو وارد کنید.

و اما در مرحله آخر، ما باید یک ماشین مجازی اندرویدی بسازیم که بتونیم برای توسعه برنامه هامون ازش استفاده کنید. برای اینکار از منوی استارت برنامه AVD Manager رو اجرا کنید. در پنجره ظاهر شده بر روی کلید New کلیک کنید و سپس طبق شکل زیر با انتخاب گزینه Target مشخص کردن دیگر ویژگی های ماشین مجازی روی Create AVD کلیک کنید.

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

استاندارد کد بنویسید – بخش دوم

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

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

استایل کد نویسی من

۱- از خط جدید زیاد استفاده کنید

بدترین روشی که میتونید در پیش بگیرید اینه که تمام کدهاتون رو در یک خط بنویسید. کد زیر رو ببینید. (من در اینجا از دو زبان HTML و PHP برای مثالهام استفاده میکنم.)

کد بالا رو میتونیم به صورت بسیار خوانا تری به صورت زیر بنویسیم.

۲ -از تو رفتگی استفاده کنید.

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

و حالا همین کد را با تو رفتگی ببینیم.

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