بررسی و توضیح کامل Web 2 و ابزارهای مرتبط با آن

[javid]

بخش اول؛ مرور کلی جزییات Web 2 همراه مراحل ساخت آنها
 با آمدن وب 2 تغییرات گسترده در ظاهر و عملکرد صفحات ایجاد شد. حالت های خیلی جدیدی برای عموم کاربران ایجاد شد و خیلی ها علاقه مند تر شدن نسبت به سایت ها. در ادامه به توضیحات و منابع کلی برای طراحی سایت هایتان به صورت وب 2 بسنده می کنیم.
 
 
 Badges
 این واژه را می توانیم در فارسی علامت یا " امضای سایت " نیز نام ببریم. در اکثر سایت هایی که به شکل وب 2 در آمده اند می توانید این علائم را مشاهده نمایید. در زیر چند نمونه را مشاهده می نمایید :
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .  شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 این علائم بیشتر برای نمایش دادن موارد خیلی مهم صفحات با کمک استایل و رنگ های جذاب صورت می گیرد. برای ساختن این علائم می توانید از ابزار آنلاین موجود که در ادامه آدرس آنها را قرار می دهم استفاده نمایید یا اینکه با کمک فتوشاپ خودتان بسازید که برای این روش نیز یک مقال آموزشی معرفی خواهم کرد:
 
 روش اول: ساخت آنلاین؛
لینک اول - لینک دوم
 
 روش دوم: ساخت با کمک فتوشاپ به صورت دلخواه و اختصاصی؛
لینک اول
 
 
 روش دوم: ساخت با کمک فتوشاپ به صورت دلخواه و اختصاصی؛
لینک اول - لینک دوم
 
 
 Buttons
 در سایت های وب 2 دکلمه ها و باتن ها خیلی تاثیر گذار و یکی از بخش های خیلی مهم کار می باشند. در ادامه قبل از توضیحات کامل تر و ارائه آموزش تهیه این کلید ها به چند نمونه مثال توجه می نماییم :
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 برای تهیه این دکمه ها نیز که کار اطلاع رسانی امکانات و خدمات خیلی مهم سایت و برخی از امکانات روتین امروزی را دارد نیاز به طراحی اختصاصی نیست چون سایت های زیادی در کمتر از چند دقیقه به شما کمک می کنند ده ها دکمه با طرح های مختلف طراحی نمایید. برخی از سایت های رایگان به شرح زیر است:
لینک اول - لینک دوم
 
 
 Buttons
 در سایت های وب 2 دکلمه ها و باتن ها خیلی تاثیر گذار و یکی از بخش های خیلی مهم کار می باشند. در ادامه قبل از توضیحات کامل تر و ارائه آموزش تهیه این کلید ها به چند نمونه مثال توجه می نماییم :
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 برای تهیه این دکمه ها نیز که کار اطلاع رسانی امکانات و خدمات خیلی مهم سایت و برخی از امکانات روتین امروزی را دارد نیاز به طراحی اختصاصی نیست چون سایت های زیادی در کمتر از چند دقیقه به شما کمک می کنند ده ها دکمه با طرح های مختلف طراحی نمایید. برخی از سایت های رایگان به شرح زیر است:
لینک اول - لینک دوم - لینک سوم

 
 
 Rounded Corners
 در وب 2 گوشه های اشکالی که قبلا مستطیلی شکل بوده اند و گوشه ای تیز داشته اند اکنون به صورت گرد شده در آمده که جلوه و حالت حرفه ای تری به صفحات وب می دهد. برای ساخت صفحات وب 2 شما نیز تمام تلاش خود را انجام دهید تا از گوشه های تیز کمتر استفاده نمایید. با کمک ابزار های آنلاین هیچ سردردی نیز نخواهید داشت برای اجرای گوشه های گرد و زیبا ! به مراجع زیر مراجعه کنید و دعا به جان طراحان آن! :
لینک اول - لینک دوم - لینک سوم - لینک چهارم
 
 
 Logos
 
 شما هم شاید مثل من عاشق لوگو ها و جذابیت آرم های شرکت ها با رنگ های جذاب و افکت های خاص آن هستید. مثل بقیه جزییات بالا نیز می توانید هم خودتان و هم با کمک ابزار آنلاین لوگوهای زیبا خلق کنید. اگر به فتوشاپ مسلط هستید این بخش از کار را دست ابزار های آماده هرگز نسپرید:
لینک اول - لینک دوم - لینک سوم

 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 Icons
 در وب 2 یکی از مهمترین بخش های کار همین آیکون ها می باشند که وجود آن نعمت بزرگی به حساب می آید .
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 حرفه ای ترین آیکون ها را انتخاب و استفاده نمایید تا تاثیر آنرا خودتان در صفحات وبتان تجربه و مقایسه نمایید:
لینک اول - لینک دوم - لینک سوم - لینک چهارم - لینک پنجم
 
 
 Gradient Images
 با این گزینه در فتوشاپ آشنا هستید افکت زیبایی که در تصاویر تغییرات جالبی می دهد و دارای سایه روشن و تیره های زیبایی می باشد و یکی از پرکاربردترن بخش های فتوشاپ و همین طور وب 2 به شمار می آید.
لینک اول - لینک دوم - لینک سوم
 
 
 حباب های زیبا و خاص
 خب نوبتی هم باشد نوبت کادر ها و حباب مانند های زیبای وب 2 می باشد.
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
لینک اول
 لینک دوم
 
 آموزش انجام دستی این کار: لینک اول
 
 
 عکس های پشت زمینه
 در گذشته برای پشت زمینه های سایت ها از تصاویر استاتیک و یا تک رنگها بسیار استفاده می شود. یکی از نکاتی که تغییر نموده است استایل همین پشت زمینه ها می باشد.
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
لینک اول - لینک دوم - لینک سوم

 
 ترکیب رنگ بندی ها
 
 شما اجازه ديدن اين عکس را نداريد .
لطفا ابتدا در انجمن ثبت نام و يا به انجمن وارد شويد .
 
 همیشه انتخاب رنگ بندی های زیبا و جذاب در تمامی دوره های طراحی وب مورد بحث و بررسی بوده است و اکثر افرادی که موفق به ایجاد صفحات زیبا و کاربر پسند شده اند به کار گیری به موقع همین ترکیب های رنگی بوده است. ترکیب های جذاب و زیبا را در این سایت مشاهده نمایید که به چه صورتی با هم هماهنگ و سازگار شده اند:
لینک اول
 
 
 برای حرفه ای تر و مداوم کار نمودن می توانید این نرم افزار ها را نیز دانلود نمایید تا خیلی حرفه ای تر وارد مبحث رنگ ها شوید:
 لینک اول
 
 Favicons
 همگی با آیکون هایی که کنار browser ها لود میشوند آشنا می باشند . در مورد ساخت و طراحی آیکون یک مقاله نوشته بودم می توانید با کمک مقاله من به این آدرس مراجعه نمایید یا از این مقاله ی خارجی بهره ببرید و در غیر اینصورت بروید سراغ ابزار های آماده!
لینک اول - لینک دوم
 
 این مطلب تنها بخش مقدماتی و آشنایی کلی و اجمالی بود به مبحث وسیع وب 2 در مقالات بعدی که قسمت 2 و 3 خواهد داشت بررسی دقیق تر و تخصصی تر خواهیم داشت.