پیشنهاد فرادرس

طراحی سایت در Photoshop و تبدیل به کدهای HTML

دسته بندی ها: آموزش فتوشاپ (Photoshop) ، آموزش های ادوبی (Adobe) ، آموزش CSS ، آموزش طراحی وب ، آموزش HTML ، آموزش های Educator

طراحی-سایت-در-photoshop-و-تبدیل-به-کدهای-html

در این آموزش تصویری با نحوه طراحی سایت در Photoshop و تبدیل به کدهای HTML آشنا می شوید.

این دوره آموزشی محصول Educator می باشد.

سرفصل های دوره:

  • طراحی صفحه سایت
  • آشنایی با Wireframes
  • ایجاد Wireframes
  • تعریف CSS
  • برش تصویر با فتوشاپ
  • بهینه سازی تصاویر
  • آشنایی با بهینه سازی
  • فرمت های تصویری برای وب
  • بهینه سازی تصاویر در فتوشاپ
  • طرح بندی صفحه
  • برنامه ریزی طراحی و Layout
  • تایپوگرافی وب
  • ایجاد پوشه
  • تعریف یک سایت محلی
  • بررسی رابط کاربری
  • ایجاد یک صفحه وب
  • آشنایی با CSS
  • ساخت صفحات وب
  • اضافه کردن متن به صفحه
  • ساختار صفحه با CSS
  • ایجاد ستون ها در صفحه
  • ایجاد  صفحه وب با خواص CSS
  • تعریف فونت پشته
  • سفارشی کردن متن با CSS
  • کار با رنگ پس زمینه
  • استفاده از کلاس های CSS
  • اضافه کردن خواص جدید CSS3
  • پیش نمایش صفحات  در مرورگرها
  • کار با صفحه وب برای Chrome
  • کار با صفحه وب برای Firefox
  • و...

عنوان دوره:Educator Photoshop Designs to Code with Candyce Mairs

توضیحات:

Learn how to convert your Photoshop website design into an HTML/CSS file in Dreamweaver. Adobe Certified Instructor Candyce Mairs will walk you through the basic steps of how to take a Photoshop file and set up the design in Dreamweaver in order to easily build a website. Candyce has been in the training industry since 1994, is a Certified Internet Webmaster (CIW) Master Designer and Instructor, and also holds Adobe Certified Instructor and Expert certifications in Fireworks, ColdFusion, Acrobat, and Contribute.
I. Web Page Design Mockup
 	Reviewing the Design	2:46
 	Planning Your Conversion	6:23
 	Getting to Know Wireframes	4:03
 	Creating Wireframes	4:19
 	Creating a Style Guide	4:33
 	Defining CSS	3:44
II. Slicing
 	What Is a Slice?	4:50
 	Slicing with Photoshop	10:40
 	Slicing with Photoshop Elements	5:28
III. Optimizing Images
 	Understanding Optimization	4:44
 	Image Formats for the Web	10:19
 	Optimizing Images in Photoshop	8:04
 	Optimizing Images in Photoshop Elements	10:21
IV. Planning Page Layout
 	Planning the Design Layout	6:07
 	Web Typography	7:53
 	Documenting Decisions	5:57
V.Exporting Images
 	Setting Up the Export with Photoshop, Part 1	11:27
 	Setting Up the Export with Photoshop, Part 2	12:22
 	Setting Up the Export with Photoshop Elements	10:12
VI. Getting Organized
 	Creating the Root Folder	7:32
 	Defining a Local Site	4:17
 	Exploring the Interface	5:08
 	Creating a Web Page	6:46
 	Inserting an Image	6:30
VII. Understanding CSS
 	Formatting Text with CSS	9:20
 	Using the Box Model	7:03
 	Creating DIV Tags with IDs	9:02
VIII. Building the Web Page
 	Building the Boxes	11:25
 	Adding Text to the Page	8:34
 	Adding Images Within DIV Tags	6:48
 	Customizing Box Backgrounds	7:38
 	Using CSS Background Images	8:32
 	Correcting Box Placement	9:37
IX. Customizing Page Structure with CSS
 	Testing CSS Properties	4:40
 	Positioning Upper Content	12:08
 	Creating Columns on the Page	10:52
 	Issues with Floats	8:30
 	Using Tracing Images	8:05
 	Adjusting Box Positioning	11:18
X. Creating the Look of the Web Page with CSS Properties
 	Positioning the Photos	4:19
 	Defining Font Stacks	10:21
 	Customizing Text with CSS	6:14
 	Finishing Font Definitions	8:45
 	Correcting Background Colors	6:51
 	Nudging Content Areas	10:22
 	Positioning Lower Columns	8:49
 	Creating Curved Boxes	5:51
 	Using CSS Classes	10:07
XI. Adding New CSS3 Properties
 	Adding Drop-Shadows	6:57
 	Creating Gradients	7:50
XII.Testing the Design
 	Previewing Pages in Browsers	3:07
 	Adding Column Separators	5:24
 	Finalizing the Web Page for Chrome	4:27
 	Finalizing the Web Page for Firefox	11:05
 	Fixing Page Content Alignment	6:26

حجم فایل: 3.49GB

به این نوشته امتیاز دهید 1 2 3 4 5 بدون امتیاز
Educator Photoshop Designs to Code with Candyce Mairs

پیشنهاد فرادرس