PSD آموزش طراحی وب سایت خبری

وب سایت خبری

در این کلیپ صفر تا 100 یک وب سایت خبری را طراحی می کنیم در این کلیپ در فتوشاپ تمامی قالب سایت رو پیاده سازی می کنیم html,css رو طراحی می کنیم سپس در کلیپ بعدی

سورس پروژه را می توانید از اینجا دانلود کنید

http://source project : https://github.com/Borhani-clipamooz/clipamooz_news

پیشنهاد می شود قبل از دیدن این آموزش حتما کلیپ زیر رو نگاه کنید

https://www.youtube.com/watch?v=2QSolCcex7g&t=7s

میتونید به صورت آنلاین وب سایت رو در اینجا مشاهده کنید

http://projects.clipamooz.ir/clipamooz-news/

سرفصل های ارائه شده در این کلیپ

: – معرفی وب سایتی که میخواهین طراحی کنید

– آموزش امکانات اولیه فتوشاپ جهت اجرای این پروژه

– بررسی اولیه انجام پروژه و توضیح امکانات و بخش های وب سایت جهت تولید این وب سایت

– کار با خط کش فتوشاپ و قالب بندی پروژه با این ابزار

– طراحی منوهای وب سایت

– طراحی هدر سایت

– منوها gradiant تنظیم

– آیکون های مورد نظر رو از iconfinder دانلود میکنیم – طراحی باکس های مورد نظر –

طراحی تبلیغات وب سایت –

طراحی اسلایدر وب سایت

– – استفاده از motion blur –

طراحی مطالب ویژه طراحی

آخرین اخبار سایت

– طراحی خبرنامه وب سایت

– طراحی مطالب سایت –

طراحی شمارنده صفحات وب سایت

– طراحی فوتر وب سایت

Click to see the clip

آموزش طراحی وب سایت گوگل

google

در این کلیپ برای تقویت اچ تی ام ال و سی اس اس شما یک طراحی ساده در نظر گرفتم

پیشنهادم این است قبل از دیدن این کلیپ اینجا رو مشاهده کنید

https://www.youtube.com/watch?v=x8jL4KnyGJc

مطالبی که در این کلیپ به آن اشاره میشه به شرح ذیل است

  • تعاریف اجزای اصلی گوگل بدون هیچگونه استایل دهی –
  • استفاده از تگ تصویر جهت الصاق تصویر گوگل به صفحه اصلی سایت
  • – مرتب سازی کدها جهت خوانایی بهتر توسعه دهنده
  • – تعاریف کلاس های مورد نیاز –
  • ID بخش بندی قسمت های مختلف با استفاده از
  • – ریست کردن فضاهای اضافی در قالب صفحه –
  • پیدا کردن رنگ ها از رویه تصویر قالب گوگل
  • – hover تنظیم حالت های دکمه ها –
  • تعریف سایه برای دکمه ها –
  • طراحی فیلدهای ورودی گوگل –
  • طراحی منوهای گوکل
Click to see the clip