Responsive Images

课程
en
英语
此内容评级为 0/5
来源
  • 来自www.udacity.com
状况
  • 自定进度
  • 免费获取
更多信息
  • 2 序列
  • 等级 介绍

他们的员工每天都在学习Edflex

  • Safran
  • Air France
  • TotalEnergies
  • Generali
Learn more

课程详情

教学大纲

Lesson 1 - Getting up and Running

Before you start working with responsive images, you need to start debugging on your mobile devices. This lesson will help you get started with Developer Tools and mobile debugging.

Lesson 2 - Units, Formats, Environments

You can't optimize what you can't measure. In this lesson, you will start with comparing different kinds of images on the web and getting familiar with different units you can use to scale them.You will also get a chance to set up your development environment so that responsive images become a painless part of your workflow.At the end of the lesson, you will start working on the responsive blog project, where you have a chance to apply responsive image principles in a real-world scenario!Topics covered:* Sizing Images* File Types* Automation Tools

Lesson 3 - Images with Markup

Not all graphics need to be .JPGs or .PNGs. This lesson dives into using markup techniques like CSS and icon fonts to create responsive graphics. While markup techniques are awesome because they are natively responsive, they are often **extremely** lightweight, requiring a fraction of the bytes of traditional images!At the end of the lesson, you will replace extraneous images with markup techniques and take advantage of font icons to add social media icons to the responsive blog project!Topics covered:* CSS Techniques* Inlining Images* Unicode* Icon fonts

Lesson 4 - Full Responsiveness

Here comes the full monty! In this lesson, you will make your images fully responsive using the new `` element! Along the way, you will use the `srcset` and `sizes` attributes. You will also learn the importance of `alt` attributes for your visually impaired users.At the end of this lesson, you will make the blog project fully responsive, as you implement `` to display beautiful images across a range of device widths and pixel ratios.Topics covered:* ``* `sizes` attribute* `srcset` attribute* `alt` attributes

先决条件

没有。

讲师

  • Sam Dutton - Sam Dutton is a Developer Advocate for Google. He also publishes the monthly media tech newsletter and maintains , which provides the simplest possible examples of HTML, CSS and JavaScript. Sam grew up in South Australia, went to university in Sydney, and has lived since 1986 in London. He has designed and coded lots of websites, including previous releases of and .
  • Cameron Pittman - A passionate educator and programmer, Cameron lives and breathes web development as he creates programming courses at Udacity. Before coming here, Cameron was a combination Director of Content and web developer at Seattle startup LearnBIG. He taught four years of high school physics and chemistry in Nashville, TN, during which time he pioneered teaching physics with the video game Portal 2. Cameron graduated with a degree in physics and astronomy from Vanderbilt University and earned his master's in teaching from Belmont University.

编辑

谷歌是一家公司,由谷歌搜索引擎的创始人拉里-佩奇(Larry Page)和塞尔吉-布林(Sergueï Brin)于 1998 年 9 月 4 日在加利福尼亚州硅谷的谷歌车库创立。

该公司主要通过其搜索引擎的垄断地位而声名鹊起,先是面临 AltaVista 的竞争,然后是雅虎和必应的竞争。此后,该公司进行了一系列收购和开发,如今拥有许多著名的软件产品和网站,包括 YouTube、Android 手机操作系统以及 Google Earth、Google Maps 和 Google Play 等其他服务。

平台

Udacity est une entreprise fondé par Sebastian Thrun, David Stavens, et Mike Sokolsky offrant cours en ligne ouvert et massif.

Selon Thrun, l'origine du nom Udacity vient de la volonté de l'entreprise d'être "audacieux pour vous, l'étudiant ". Bien que Udacity se concentrait à l'origine sur une offre de cours universitaires, la plateforme se concentre désormais plus sur de formations destinés aux professionnels.

此内容评级为 4.5/5
(没有评论)
此内容评级为 4.5/5
(没有评论)
完成这个资源,写一篇评论