Join Morten Rand-Hendriksen for an in-depth discussion in this video Art direction: Responsive images and graphics, part of Mapping the Modern Web Design Process.
- The final piece of the build phase puzzle…is responsive images and graphics.…This is an area where the web design world…is undergoing a significant shift and staying…at the cutting edge of these developments…will put you and your project well ahead…of the competition.…When adding images and graphics to your site,…you should, whenever possible, utilize…modern techniques and technologies.…These improve load and rendering time…and lessen the volume of data that needs to travel…from the server to the visiting device while still…retaining the highest quality image possible.…
Before we move on to the post-build testing…phase, let's take a look at three techniques…and technologies that will make your images…and graphics truly responsive.…Out-of-the-box images are static elements.…They have a fixed width and height and are best…displayed at their native size and resolution.…The nature of the screens they will be…displayed on is the opposite.…Screens have an almost infinite variation of sizes…and resolutions also vary greatly.…
Author
Morten Rand-Hendriksen
Released
12/19/2014- Understanding what your users care about
- Creating user personas
- Creating content priority hierarchies
- Testing wireframes and interaction patterns
- Establishing a three-track build process
- Incorporating accessibility principles
- Using content blocks
- Testing and revising your web design
- Optimizing for social media and SEO
- Launching your web design
- Getting feedback from users
Skill Level Beginner
Duration
Views
-
Introduction
-
Welcome1m 13s
-
-
1. Web Design as a Process
-
2. Some Perspective
-
3. Preprocess
-
Roles and responsibilities2m 19s
-
Version control3m 2s
-
-
4. The Content Strategy Phase
-
Content strategy1m 36s
-
Content audit5m 49s
-
Content modeling4m 17s
-
Information architecture2m 53s
-
Wireframing4m 37s
-
-
5. Prebuild Testing
-
Taking it to the streets4m 28s
-
Card-sorting exercise3m 29s
-
-
6. The Build Phase
-
Designing in the browser3m 24s
-
Using content blocks3m 23s
-
7. The Test-and-Revision Phase
-
Accessibility testing2m 24s
-
Break and edge-case testing3m 16s
-
End-user testing2m 31s
-
8. The Optimization Phase
-
Optimizing for SEO2m 36s
-
Analytics integration2m 47s
-
9. Launch and Reset
-
Prelaunch checklist3m 4s
-
Post-launch user testing1m 36s
-
-
10. Going Further with lynda.com
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Art direction: Responsive images and graphics