|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/the-basics-of-web-design-layout/
课程评论:没有评论
课程名称:网页设计布局基础 概述:自2007年以来,我一直在制作网站,其中一个需要掌握的重要知识就是网页设计布局的基本概念。在设计应用程序中,我们可以拖放、对齐、分组、设置宽度、高度和坐标。我们拥有图层面板和精细控制的能力,但在Photoshop或Sketch中的设计并不等于最终的网站,即使文件名是web-FINAL final.psd。最终网站是在浏览器中展示的,直接呈现在客户面前。掌握如何使用HTML和CSS将设计描述给浏览器,是你可以具备的最佳技能之一。HTML和CSS是可以像使用Sketch或Photoshop那样学习的描述性设计语言组合。本课程将向您展示如何向浏览器描述布局,什么是默认配置,如何覆盖它们以及何时进行覆盖。您将更深入理解浏览器的工作方式,以及与网页设计应用程序的不同之处。这将改变您的设计方式,您甚至可能会开始像我一样更多地在浏览器中进行设计。了解您的工具是非常有益的。作为设计师或开发者,了解浏览器中的布局工作原理将使您的工作更加迅速和果断。 本课程内容包括: - 五种不同的定位类型 - 深度管理 - 常见显示类型 - 内边距 - 边距 - 边框 - 平移X和Y - HTML与CSS术语 - 丰富的案例 - 创建网页的实操演示,展示您无需在数字运算上非常精通,或对网站开发的所有知识都了如指掌。我们会调试、查找资料并尝试各种方法。 本课程致力于帮助您掌握网页设计布局的基础知识,提升设计和开发效率。
I've been making websites since 2007. And one of the largest chunks of knowledge I had to acquire was learning the basics of web-design layout. In design apps we drag and drop. We align. We group. We set widths, heights, and x & y positions. We have a layers panel. We have super-fine control. But the design in the Photoshop or Sketch is not the final website, even if the filename is web-FINAL final.psd. The final website is the one in the browser. It's the one in front of your customer. And the skill of knowing how to describe a design to a browser using HTML & CSS is one of the best skills you can have. HTML & CSS are a descriptive design language pair that can learned, just like you learned to use Sketch or Photoshop. This class will show you how to describe layouts to the browser, what the defaults are, how to override them, and when to override them. You'll understand more of how the browser works and how it differs from web design apps. It will change how you design, and you may even start designing in the browser more (like I do). Knowing your tools is super beneficial. And as a designer, or developer, knowing how layout in a browser works will allow you to work quicker and more decisively. This class will cover the following: The 5 different types of positioningDepth managementCommon display typesPaddingMarginsBordersTranslateX and YHTML & CSS terminologyLots of examplesA walkthrough of creating a web page, where I show that you don't have to be really good at numbers, or know absolutely everything about developing websites. We debug. We Google for things. We try things out.