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

Cascading Style Sheets (CSS) ها استاندارهای مدرن برای طراحی وب سایت هستند که تا کنون در سه نسخه عرضه شده‌اند و در هر نسخه رویدادهای جدیدی را معرفی کرده‎اند. اینکه چطور بوجود آمدند و چطور مورد استفاده قرار گرفته‎اند به اندازه کافی در مباحث گوناگون دیگر مورد بررسی قرار گرفته است اما باید بدانیم و بپذیریم که نسخه سه تمام قابلیت‎ها و توانایی‎های دو نسخه قبل را پوشش می‎دهد و رویه‎ای جدید در طراحی سایت بوجود می‎آورد. CSS3 فرزندی جدید در خانواده Stylesheet محسوب می‌شود. امکانات جدید و هیجان انگیزی ارائه می‌دهد، روش شما در طراحی سبک و سیاق صفحات را تغییر می‌دهد و همچنین اجازه استفاده از لایه‌های بیشتر به سبک‌های گوناگون‌تر برای مناسبتهای مختلف در تحقق ایده ها را می‌دهد. نسخه‌ای که با پیدایشش، خصوصیت‌های جدیدی را به نسخه های قبل اضافه کرده است و در جاهایی نیز اشکالات قبلی را بر طرف نموده است. این خصوصیت‌ها مربوط به حاشیه‌ها (Border)، پس زمینه‌ها (Background)، رنگ‌ها (Color)، افکت‌های متنی (Text Effects)، رابط‌های کاربری (User Interface)، گزینشگرها (Selector) و همچنین تغییرات بسیار کم اما محسوس در بعضی ماژول ها نظیر استفاده از هر فونت در طراحی یا چند لایه‌ای بودن صفحات و از این قبیل می‌شود. برای دیدن کاربرد هر کدام می‌توانید به یکی از مراجع اصلی CSS3 یعنی اینجا مراجعه کنید که به اندازه کافی با مثال توضیح داده شده است.

CSS3 امکاناتی را به شما می‌دهد که بوسیله آن می‌توانید صرفه جوبی قابل توجهی در زمان داشته باشید. این امکانات در حدی است که شما می‌توانید توانایی‌های (هرچند کوچک باشد!) پلتفرهای مبتنی بر جاوااسکریپت مانند جی کوئری، موتولز و .. را در صفحات بدون استفاده از آنها پیاده سازی کنید. در این میان، حالات و توانایی‌های جی کوئری بیشتر به چشم میخورد. اما با این حال اینجا تنها به صورت کلی بیان شده است. پیشنهاد می‌کنم برای دیدن توانایی‌های بیشتر آن به یکی دیگر از مراجع اصلی آن یعنی css3.com و همچنین 33 مقاله ای که حتما در مورد CSS3 باید بخوانید مراجعه کنید.

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

این مقدمه را چیدم تا بهتر به اهمیت نسخه‌های زبان‌های تحت وب توجه کنید. با این حال از توضیح بیشتر آن می‌گذریم و به اصل موضوع یعنی HTML5 میپردازیم. HTML از دسته زبان های نشانه گذاری محسوب می‌شود که می‌تواند از طریق یکسری برچسب معین، صفحات استاندارد وب را ایجاد کند. حال که این برچسب‌ها در کدام نسخه به چه نحو کار می‌کنند خود بحث جدایی را می‌طلبد، اما این نکته قابل ذکر است که نسخه 5 رویدادهای مهمی را وارد این عرصه نمود. نسخه ای که از اکثر برندهای نرم افزاری دنیا که اصول طراحی وب را تایید می‌کنند، پشتیبانی می‌شود ( بجز اینترنت اکسپلورر که تنها بعضی از این امکانات را پشتیبانی می‌کند ). برای دیدن اینکه چه رویدادهایی در HTML5 وارد شده است به این سایت مراجعه کنید تا پیش نمایشی از هر قابلیت را ملاحظه کنید.

باید بدانید که مرورگرهای تحت وب تا سال 2022 مجبور به پشتیبانی کامل از HTML5 می‌شوند و تقریبا تمام اصول نمایش را بر اساس آن بنا می‌گذارند. در حال حاضر این نسخه، نسخه نهایی می‌باشد که تقریبا هیچ اشکالی بر آن وارد نشده است و زبانیست به شکل نهایی. در همین راستا Lachlan Hunt گسترش دهنده مرورگر اپرا برای HTML5 گفته است: “ما می‌خواهیم با این روش، کار را برای طراحان وب آسان تر کنیم به طوری که آنها مجبور به دوباره نویسی هر قسمت نشوند” دقیق ترین مفهومی که از این جمله می‌توان برداشت کرد همین است و بس که “HTML5 روش طراحی وب را کاملا تغییر می‌دهد.”

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

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

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

موفق باشید/.

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

برای نصب و اجرای این افزونه مواردی لازم است که باید به آنها توجه شود. اول اینکه نسخه مرورگر شما باید از 4 بیشتر باید تا قابلیت افزونه نصب کردن را داشته باشد. نکته بعدی نوع مرورگر شما است که مهم است که از چه نوعی باشد؛ Dev باشد یا Tester . سری Dev نسخه ای است که گوگل برای برنامه نویسان عرضه می کند تا بتواند آن را گسترش دهد، و Tester نسخه ای است که برای عموم عرضه می کند تا هرچه سریعتر مشکلات شناخته شده و آنها را رفع نماید. طبق آخرین اطلاعاتی که من دارم نسخه 4.0.220.1 یا همان آخرین نسخه توانایی نصب افزونه چه برای Dev و چه Tester را دارد، اما چنانچه هنگام نصب افزونه با پیغامی مبنی بر عدم اجازه جهت نصب مواجه شدید، بدانید که حتما از نسخه Tester استفاده می نمایید و باید به Dev تغییر دهید. برای اینکار هم میتوانید از اینجا مراحل را گذرانده و تغییر دهید. البته لازم به ذکر است که این بخش برای ایرانیان در دسترس نمی باشد و باید از آی پی خارج از ایران استفاده گردد. چنانچه اطلاعات بیشتری برای بررسی نیاز دارید، می توانید به اینجا مراجعه کنید.

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

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

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

پس از دانلود، آن را از حالت فشرده در آوورید. مکانش مهم نیست که در کجا باشد اما حتی الامکان در مکانی در درایو ویندوز باشد تا دسترسی مستقیم از کروم وجود داشته باشد، به عنوان مثال شاخه root از درایو ویندوزتان می تواند گزینه خوبی باشد. حال در کروم، chrome://extensions را تایپ نموده تا به بخش افزونه ها وارد شوید. با رفتن به گزینه load unpacked extension پوشه ای را که دانلود کرده اید انتخاب نمایید. حال با تصویری مشابه تصویر زیر مواجه می شوید که بازگو کننده ی اتمام نصب می باشد و تایید آن وجود منویی در پایین مرورگر است که بخش های افزونه را نشان می دهد.

حال به تنظیمات رابط گوگل کروم ( shortcut properties ) بروید و این متن را در انتهای بخش target وارد نمایید تا در هر بار اجرا شدن مرورگر، افزونه نیز خودکار نصب و اجرا شود:

–load-extension=”c:\Twitterome”

توجه کنید که به جای آدرس درج شده، محل قرار گرفتن افزونه را قرار دهید!

تا اینجا نصب افزونه تمام شد و برای اجرا آماده است. حال نوبت به انجام تغییرات در تنطیمات مطابق با اطلاعات حساب خود میرسد. فایل twitter.html را با نرم افزاری مانند notepad باز نموده و حساب کاربری و رمز عبور خود را در جای مشخص شده که با توضیحات اشاره شده، وارد کنید. در همان قسمت دو متد دیگر نیز میبینید که میتوانید آنها را نیز مطابق با میل خود تغییر دهید.  کار تمام شد! شما هم اکنون می توانید از طریق این افزونه که ما آن را Twitterome نامیدیم، توئیت کنید و از کروم لذت ببرید. : )

پی نوشت:

1. این افزونه از یک افزونه نسخه خارجی که توانایی توئیت به صورت فارسی را نداشت الگو برداری شده است. برای رعایت حقوق فرد نویسنده اطلاعات او نیز در هر فایل ذکر شده تا مراتب کپی رایت رعایت شود.
2. Twitterome نامی است که موقتا بر روی این افزونه گذاشته شده است. اما این افزونه از سیستم کاربری توئیتر استفاده نمی کند و نام API برای سیستم فرستنده درج می شود. دلیل استفاده نشدن از سیستم کاربری توئیتر نیز فقط بالا نبردن حجم اطلاعاتی است که شاید برای کسی که فقط توئیت کردن اهمیت دارد، مهم نباشد. با این حال چنانچه تمایل به استفاده از آن فراگیر گردد، کامل شدن آن و شبیه شدن به چیزی مانند افزونه های فایرفاکس دور از دسترس نیست.
3. امکاناتی که به این افزونه نسبت به نمونه خارجی اضافه شده است، به صورت توضیحات در ابتدای هر فایل و همچنین در فایلی با نام Read Me ذکر شده است.
4. چنانچه تمایل به کامل تر کردن آن دارید، می توانید کارهای خود را در همین مطلب به صورت نظر ارسال نموده تا کلیه بخش ها در کنار هم و بدون پراکندگی بررسی شوند.

موفق باشید/.

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

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

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

نکته ی بالا جدا از اینکه خوانایی یک برنامه را افزایش می دهد، باعث می شود در برنامه های کمی طولانی تر از اشتباهات هم جلوگیری به عمل بیاید.یک مثال بسیار ساده اینکه: به نظر کسی نیست که در طول نوشتن یک برنامه، در مورد متغییر ها به مشکل بر نخورده باشد. ابتدا شما یک متغییر تعریف می کنید. حال در یک تابع با استفاده از Global از آن متغییر استفاده می کند. غافل از اینکه با انجام این کار مقدار متغییر رو کلن دچار تغییر کرده اید.( اینکه می گویم غافل از این، به این معنا نیست که شما چنین چیزی رو نمی دانید، بلکه بدین معناست که فراموش کرده اید) حال یک ساعت با برنامه سر و کله می زنید و آخر سر هم علت درست کار نکردن برنامه رو پیدا نمی کنید!

با تعیین آرگومانی از یک تابع به صورت اختیاری، تمامی آرگومان های بعد از آن نیز باید از نوع اختیاری(و با مقدار پیش فرض) تعریف شوند.

تنظیم مقدار پیش فرض برای آرگومان های یک تایع امریست بدیهی و بسیار معمول. اما نکته ی مهم اینجاست که باید دقت کنید اگر برای یکی از آرگومان ها مقدار پیش فرض قرار داده اید، باید برای تمامی آرگومان های بعد از آن نیز مقدای را به عنوان پیش فرض قرار دهید. به مثال بسیار ساده ی زیر توجه کنید:

function itvillage ($face, $size) {
print “<font face=\”$face\” font size=\”$size\”>
یک مثال روشن و ساده</font>”;
}
itvillage(”tahoma”);

بدیهیست که استفاده از کد بالا با نمایش یک پیغام خطا توسط موتور PHP همراه خواهد بود. برای حل این مشکل و اینکه در صورت دریافت نکردن هیچ نوع ورودی برنامه به هم نریزد، بهتر است از یک مقدار پیش فرض برای آرگومان های تابع استفاده کنیم. حال موضوع مهم این است که اگر برای آرگومان face$ مقدار پیش فرض انتخاب کرده ایم(”face = “tahoma$) حتمن باید برای size$ نیز مقدار پیش فرض تعیین کنیم. در غیر این صورت دوباره با خطایی روبه رو می شوید که در مثال بالا دیدید! بنابراین اگر تابع شما 10 آرگومان دارد و برای مثال شما برای آرگومان پنجم مقدار پیش فرضی در نظر گرفتید، باید برای بقیه آرگومان ها تا دهمی نیز مقدار پیش فرض بگذارید. اما لازم نیست برای آرگومان های قبل از آرگومان پنجم، مقداری را در نظر بگیرید.

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

همه ی دوستان می دانند که برای برنامه نویسی به زبان PHP حتی می توان از محیط Notpad نیز استفاده کرد. اما خب آیا محیطی بهتر از این برنامه وجود ندارد؟ جواب این سوال مسلما بله است! بنده هم به این دلیل که به یک محیط خوب نیاز داشتم وقت زیادی برای پیدا کردن یک ادیتور خوب صرف کردم، که توانستم برای زبان پی اچ پی ، 57 ادیتور فقط در سطح متوسط به بالا پیدا کنم! در این پست تصمیم دارم 9 ادیتور بهتر و برتر را معرفی کنم که می دانم به درد خیلی از دوستان خواهد خورد.
البته یک توضیح کوچک باید بدهم. بسیاری این برنامه ها دارای ویژگی های مشترکی هستند و بنده لزومی ندیدم همه ی این ویژگی های تکراری را ذکر کنم.

NuSphere PhpED:
این محیط، ویژگی های بسیار خوب و مفیدی دارد که از جمله ی آنها، به اشکال زدایی بسیار قدرتمند، پشتیبانی کامل از کد های زبان PHP، HTML، CSS و … ، به روزسانی خودکار، پشتیبانی کامل از PHP5، پشتیبانی تمام و کمال از MySQL، قابلیت فرستادن اسکریپت به سرور به صورت بسیار ساده و سریع، پروفایل پیشرفته و … . این برنامه در محیط لینوکس و ویندوز به خوبی کار می کند و به 64 مگا بایت رم و 80 مگابایت حافظه نیاز دارد. البته یک مشکل اساسی برای ما دارد و آن هم این که رایگان نیست و شما تنها می توانید نسخه ی 14 روزه ی آن را از اینجا دانلود کنید.

ActiveState Komodo:
این برنامه، محیط قدرتمندی برای نوشتن برنامه، توسعه، اشکال زدایی و تست کردن برنامه در اختیار شما قرار می دهد. اشکال زدایی گرافیکی، مدیریت پروژه، مدیریت کد های منبع، حدس زدن و کامل کردن کلمات و … از ویژگی های دیگر این نرم افزار است که در همه ی پلت فرم ها کار می کند. البته این نرم افزار هم پولی است، اما نسخه ی آزمایشی آن را می توانید از اینجا دانلود کنید.

emacs:
فکر کنم دوستان لینوکسی از دیدن این اسم بسیار خوشحال شدند! تا اونجا که بنده اطلاع دارم emacs و Vi دو برنامه ی ویرایش در لینوکس هستند که از دومی برای کار های ساده و از اولی برای کار های پیشرفته تر استفاده می شود. emacs با زبان Lisp نوشته شده است و با اینکه دارای بسیاری از قابلیت ها نیست، اما ویژگی کد باز بودن آن این اجازه را به شما می دهد که با نوشتن برنامه ی مورد نظر خود و افزودن آن به فایل emacs. ویزگی مورد علاقه خود را به آن بیفزایید. این نرم افزار رایگان است و اگر می خواهید ویژگی های آن را بدانید سری به اینجا بزنید.

TSW WebCoder:
این برنامه بهترین گزینه برای کسانی است که می خواهند سایت داشته باشند. مهم نیست که شما تازه کار هستید و می خواهید یک سایت با نمای زیبا داشته باشید. این برنامه به راحتی به شما کمک خواهد کرد. البته با این نرم افزار قادر به نوشتن برنامه هم خواهید بود. این برنامه فقط در ویندوز کار می کند. قیمت نرم افزار تقریبا 30 دلار است اما شما می توانید نسخه ی تریال آن را این آدرس دانلود کنید!

Maguma Workbench:
این برنامه ی کد باز به شما اجازه ی هر کاری را که بخواهید می دهد! تقریبا دارای ویژگی هایی می باشد که سایر برنامه ها نیز دارا می باشند و می توانید به راحتی در آن برنامه ی خود را بنویسید. این برنامه در همه ی پلت فرم های موجود کار می کند و قیمت آن 69 یورو می باشد! اما خب برای شما نسخه ی آزمایشی هم وجود دارد که از اینجا می توانید دانلود کنید!

PHP Designer:
بالاخره رسیدیم به نرم افزار محبوب من! این نرم افزار دو نسخه ی حرفه ای و خانگی دارد که نسخه ی حرفه ای آن پولی می باشد! اما نسخه ی خانگی آن، که من از آن استفاده می کنم بسیار عالی است و تقریبا تمامی نیاز ها را بر طرف می کند. شما می توانید در این برنامه به زبان های PHP، VBScript، #C، Perl، Java و … برنامه بنویسید. غلط گیر قدرمتند، پشتیبانی کامل از کد های زبان های مختلف، اطلاعات کامل از موقعیت برنامه نویس، جدا کردن متغیر ها، اشیا ها و آرایه ها و توابع از یکدیگر و مرتب کردن آنها و … از جمله ی ویژگی های این نرم افزار است.حجم کم نسخه ی خانگی، زیبایی و شکیل بودن آن باعث می شود تا در بین برنامه هایی با همین ویژگی ها، این برنامه به انتخاب اول تبدیل شود. شما می توانید نسخه ی خانگی و حرفه ای آن را از اینجا دانلود کنید و لذت ببرید!

Bluefish:
این برنامه محیطی قدرتمند را برای برنامه نویسی و مدیریت سایت در اختیار شما قرار می د