Graphics and Multimedia for the Web with Adobe Creative Cloud (eBook)
XXV, 1017 Seiten
Apress (Verlag)
978-1-4842-3823-3 (ISBN)
- Use Adobe Creative Cloud software to create graphics and multimedia for a website
- Render images in various formats
- Work with video, HTML5 Canvas and audio files for the website
- Discover new features of HTML5 and CSS3 and how to work with them in Dreamweaver CC
Upgrade your skills in Adobe Creative Cloud and enhance your corporate or personal website with multimedia and graphics. In this book you'll look at the latest versions of five core Adobe programs: Photoshop, Illustrator, Animate (formerly Flash), Media Encoder and Dreamweaver. As you work with each of these programs to create images, animations, audio and video you will see how each one can help you complete and finally integrate your multimedia files into a final mobile friendly website.Adding new multimedia features to your website does not have to be difficult or confusing. If you plan your route and goals correctly, along the way you will see how each software has its own use, but ultimately, how they can all work together for a common goal. This book also shows you how additional Creative Cloud software can be used with the core five programs should you want to add further interactivity.What You'll Learn:Use Adobe Creative Cloud software to create graphics and multimedia for a websiteRender images in various formatsWork with video, HTML5 Canvas and audio files for the websiteDiscover new features of HTML5 and CSS3 and how to work with them in Dreamweaver CCWho This Book Is ForGraphic designers who are creating websites; students in the classroom; instructors wanting to upgrade their Adobe Creative Cloud skills.
Jennifer Harder has worked in the graphic design industry for over 10 years. She has a degree in Graphic Communications and is currently teaching Acrobat, InDesign, and Dreamweaver courses at Langara College. As a freelancer, Jennifer frequently works with Adobe PDFs to help enhance web sites. She enjoys talking about Adobe Software and her interests include: writing, illustration, and working on her websites.
Introduction
Part 1: Welcome to the Adobe Creative Cloud. Where should you begin?
Chapter 1: Entering the Software Maze or Labyrinth
· How will you get to your destination?
· A visual map of how the Creative Cloud Software Works
· Choosing the least amount of Adobe Software to accomplish your Goals
o Photoshop
o Illustrator
o Animate
o Media Encoder
o Dreamweaver
· Basic Web file formats for Image and Multimedia
o Bitmap
o JPEG
o PNG
o GIF (static and animated)
o SVG
o Canvas
o PDF
o Video Files (MP4, Webm, Ogg)
o Audio Files (MP3, Wav, Ogg)
o Interactive PDF & EPUB
· Summary
Part 2: Working with Photoshop to Create Web Graphics and Animations
Chapter 2: Getting Started with Photoshop
· Working with your RAW and Layered Files in Photoshop
· Creating a New File
· Image Files from other Adobe Programs
· Summary
Chapter 3: Color Choices (CMYK, RGB, Greyscale, Index)
· Working with Colors
· Adjusting the Image Size and Resolution
· Summary
Chapter 4: Saving or Exporting your files or the web
· Option 1: Save As
· Option 2: File > Export > Quick Export as PNG
o Export Preferences
· Option 3: File > Export> Export As
· Option 4: File Export> Save for Web(Legacy)
· Additional Options you can use to Export Files for the Web
o Artboards
o Layer Comps
o Layers
· Summary
Chapter 5: Actions to Speed up File Conversion and Slicing Tools
· Action to Speed up the file conversion process
o Actions
o Automate Batch Action
o Automate Droplets Actions
· Slicing Tools
· Zoomify an Image
· Summary
Chapter 6: Tools for Animation
· GIF Animated
· The Timeline Panel
o Adding a Frame
o Adding, Altering, and Removing Frames
o Adding Layers Style Effects and Turning Frames off and on in a Frame Sequence
o Tweening Layers in the Timeline
o Export Animate GIF
· Summary
Chapter 7: Tools for Video
· Video Set up tips
· Video Timeline
o Layers in the Timeline
o Other Layer Properties
o Smart Object Layers
o Adding Video Layers
o Interpret Footage
o Playing and Previewing Video
o Working with the Timeline and Play Head
o Adding Background Audio
o Rendering the Video
o Saving the Original File
· Summary
Chapter 8: Other Miscellaneous Items in Photoshop that you can use for web design.
· Library CC
· Extraction of Code from Layers
· Web Fonts and SVG Fonts
· Filter for Repeating Backgrounds
· New To Photoshop CC 2018 Paint Symmetry
· Web Styles
· Color Blindness Proofs
· Summary
Chapter 9: Putting it into practice (tutorials)
· Exporting Images for a gallery
· Exporting a GIF animation
· Exporting a JPEG Poster Image for your Movie the Web
· Rendering a Movie
· Summary
Part 3: Working with Illustrator to Create Web Graphics
Chapter 10: Getting Started with Illustrator
· Working with your RAW Files and Layered Files (AI, EPS, PDF)
o Creating a New File
o Raw File Types
Chapter 11: Color Choices (CMYK, RGB, Greyscale)
· Working with Color
o Copying CMYK Graphics to an RGB document
o Color Panel
o Swatches Panel
· Other Panels for Working with Color
o Color Guide Panel
o Adobe Color Themes Panel
o Gradient Panel
o Transparency Panel
o Appearance Panel
· Summary
Chapter 12: Saving or Exporting your files or the web
· Option 1: File>Save As or File>Save a Copy
· Option 2: File >Export > Export For Screens
o Artboards
o Assets
§ Export Selection
§ Asset Export Panel
§ Layers Panel Collect for Export
· Option 3: File > Export > Export As
· Option 4: File> Export > Save for Web (Legacy)
· Summary
Chapter 13: Actions for Speeding Up file conversion and Slicing tools
· Using Scripts
· Action to Speed up the File conversion process
o Actions Panel
· Automate Batch Actions
· Slicing Tools
o Using Slices and Slice Select Tools
o Align Slices
o Slice Options
o Save Slices for the Web
· Creating Image Maps
· Summary
Chapter 14: Tools for Animation and Video
· Tools for Animation
o SVG Interactivity
· Copying Illustrations to Photoshop (Vector Smart objects)
o Rasterize Smart Objects
o Puppet Warp Tool
· Tools for Video
o New Layout for Film and Video
o Adding 3D Images
· Summary
Chapter 15: Other Miscellaneous Items in Illustrator that you can use for web design.
· Library CC
· Web Fonts and SVG Fonts
· Creating Swatch Patterns
· Graphic Styles for Buttons and Rollovers
· Symbols Panel for web symbols Creation
· Color Blindness Proofs
· Summary
Chapter 16: Putting it into practice (tutorial)
· Exporting an Images for an Instructional Web Page
o Create a Custom Action
· Exporting an SVG File
· Summary
Part 4: Working with Animate to Create Animations, Movies and HTML5 Canvas
Chapter 17: Getting Started
· Getting Started with Animate
o Differences and similarities between Animate and Character Animator CC
o Setting up the Workspace
o Create an FLA Document
· What is HTML 5 Canvas?
· Working with your RAW Files
o Properties panel
o Timeline panel
o Library panel
o Tools panel
o FLA conversions ActionScript to HTML5
· Summary
Chapter 18: Color Choices (RGB…)
· Adding Color to the Stage
· The Tool Panel Stroke and Fill
· Properties Panel
· Color Panel
o Gradient Fills
o Bitmap Fills
· Swatches Panel
· Info Panel
· Summary
Chapter 19: Importing your Artwork
· Importing to the Stage or Library panel
o Import as an Image Sequence
o Import Images as an External Library
o Importing Illustrator and Photoshop Files with their elements or effects intact
§ Photoshop CC Blending Modes
§ Photoshop CC Layer Styles FX
§ Illustrator CC Blending Modes
§ Illustrator CC Effects FX
o Importing into Adobe Animate
§ Photoshop PSD import
§ Illustrator AI Import
o Animate CC Effects
§ Working with Symbols
§ Color Effect Tab
§ Display Tab
§ Display Render
§ Filters Tab
· Import Other Graphic File Formats
· Summary
Chapter 20: Import your Audio and Video
· Import Audio
o Sound Effect Settings
o Sync Settings
o Repeat Sound
· Import Video
o Components and Component Parameters
· Summary
Chapter 21: Working with the Timeline Panel
· Working with the Timeline panel
o A review of Layers
o New Layers
o Folders
o Hide and Show Layers and Folders
o Lock Layers and Folders
o Layer Outlined
o Advanced Layer Settings
o Layer Depth Panel
o Layer Types
· The parts of the Timeline panel
o Frames Types
· Easing for Classic, Shape and Motion Tweens
o Shape Tween Easing
o Classic Tween Easing
o Motion and Camera Tween Easing
o Camera Tool
· Bone tools
o Bone Tool and Armature Easing
o The Bind Tool
· Frame Picker Panel
· Scenes Scene Panel
· Summary
Chapter 22: Saving or Exporting your files or the web
· Option 1: File>Export> Export Image
· Option 2: File>Export> Export Image(Legacy)
· Option 3: File >Export> Export Movie
· Option 4: File >Export> Export Video
· Option 5: File >Export> Export Animated GIF
· Options 6: File > Publish Settings HTML5 Canvas & Other Formats
o Publish Settings
o Dissecting the Canvas HTML5
· Other Export Options from the Symbols in the Library Panel
o Export a PNG Sequence
o Generate a Sprite Sheet
o Generate a Texture Atlas
· Other Web Export Options
o Air Options
o Projector
o WebGL
· Summary
Chapter 23: Other Miscellaneous Items in Animate that you can use for web design.
· Edit > Preferences
· Actions, Code Snippets & History Panel
o Actions Panel
o Code Snippets Panel
o History Panel
· Library CC
· Patterns for Paint brushes, and pen tools
· 3D in animations
· Web Fonts
· The Dangers of Flashing Graphics
· Summary
Chapter 24: Putting it into practice (tutorial)
· Create an animated .gif
o Export your GIF Animation
· Create a Video (.mov) file
o Creating a story board
o Pre-plan your Video Settings
o Review the files
o Exporting the Video
o Opening in Adobe Media Encoder
· Create a HTML5 Canvas Animation
o Publish HTML 5 Canvas and OAM Files
· Summary
Part 5 - Working with Media Encoder to Create Audio and Video Files
Chapter 25: Getting Started
· Getting Started with Adobe Media Encoder
· Looking at the setup of Animate CC and Queue
o Set up a Workspace
§ Adjusting your Preferences
· Media Browser Panel
· Queue Panel
o Format Options
o Preset Options
o Output Options
o Status Options
o Interpret Footage
· Watch Folders Panel
· Encoding Panel
· Preset Browser Panel
o Preset menu options
· Summary
Chapter 26: Working with your RAW Files (AVI or MOV)
· Working with your RAW Files (AVI and MOV)
· Covert Video with Export Settings
o Export Settings Dialog Box
§ Source Tab
§ Output Tab
§ Preview settings
§ Export settings and Summary
§ Effects Tab
§ Video Tab
§ Audio Tab
§ Multiplexer Tab
§ Captions Tab
§ Publish Tab
§ Render, Time Code, Alpha and Output Size
o Combine Video (Stich Clips)
· WebM and OGG
· Summary
Chapter 27: Working with your RAW Files and Converting them to Audio
· Convert Audio to (export settings
o MP3
§ Export Settings Dialog Box
§ Preview Settings
§ Export and Summary settings
§ Effects Tab
§ Audio Tab
§ Publish Tab
§ Time Code Settings
o Wave Form Audio (.wav)
§ Export and Summary settings
§ Effects Tab
§ Audio Tab
§ Publish Tab
§ Time Code Settings
o Theora Ogg
o Working with Audio Files that are Audio 3GA
· Summary
Chapter 28: Working with your RAW Files and Converting them to an Image Sequence
· Convert to Other Web Formats (image sequences)
o Bitmap Sequence Export Settings
§ Effects Tab
§ Video Tab
§ Captions Tab
§ Publish Tab
§ Render Time Code and Alpha Channel settings
o JPEG Sequence Export Settings
§ Video Tab
o PNG Sequence Export Settings
§ Video Tab
o GIF (static) image Sequence Export Settings
o Animated GIF
§ Video Tab
§ Publish Tab
· Summary
Chapter 29: Putting it into practice (tutorial)
o Create Video MP4 File
o Create Audio MP3 and WAV Files
· Summary
Part 6 – Working with Dreamweaver. Adding Images, Animations, and Multi-Media to HTML5 Pages
Chapter 30: Getting Started
· Entering the Maze’s center
· Differences and similarities between Dreamweaver and Muse
· Setting up the Workspace
· What is HTML5 (.html)?
· Import and Save your files to your Site
· Fixing errors
· Summary
Chapter 31: Working with Images and Tags
· Inserting Images on an HTML Page
o Insert Panel
o Working with SVG Images
o Properties Panel
· Adding Images inside of various tags
o A Bit of HTML history
o Div Tags
o Semantic Elements
o Are tables obsolete from web design?
o Image Maps and tags
o The and elements
o The and elements
o The element
o The and elements
· Inserting Images favicons into your Browser’s tab
· HTML 5 and the Snippets Panel
· Summary
Chapter 32: Working with CSS
· CSS Inline Internal or External styles?
o Inline CSS
o Internal CSS
§ CSS Designer Panel
§ Adding Other Background properties
§ Background Image Gradients
§ Enabling and Disabling CSS properties
o Adding CSS to other tags and elements
§ Tags
§ IDs
§ Class
§ Pseudo Class selectors
· External CSS
o CSS Designer panel
o File >New CSS
· What is CSS3?
o Applying CSS to the tag
o Should you add background images to form elements
o CSS3 Borders
o Rounded CSS3 borders
o Outline CSS2
o CSS3 box-decoration-break
o Adding CSS3 Filters and Shadows
§ Box-Shadow
§ Text-Shadow
§ CSS Filters
o Image Masking in CSS3?
o Adding Custom images to Bullets
· Creating CSS Animation Transitions and Transforms
o CSS3 Animations
o CSS3 Transitions and Transitions
§ Transitions Panel
o CSS3 Transforms 2D and 3D it’s all about perspective
§ 2D Transform
§ 3D Transform
· Summary
Chapter 33: Working with Images for Mobile Web design
· CSS Floats
· Responsive Media queries and the View Port
· Image Slices and Mobile devices
· Media Queries (Mobile First)
o Scaling Images
o Scaling a Div with a background
o Loading a different images based on media query
· Column Count
· CSS for print with CSS Designer Panel
· Summary
Chapter 34: What is JavaScript?
· Creating a new JavaScript File
· Insert Image Rollovers
· Behaviors Panel
o Additional Behaviors
· JavaScript and the Snippets Panel
· Print Preview
· Summary
Chapter 35: Working with Templates, Library Items and the Assets Panel
· Bootstrap
· Woorking with Templates, Library Items, and the Assets Panel
o Templates
§ Adding Editable Areas
§ Additional Editable Regions
§ Creating a Template based page
§ Hidden areas in the ^§ Tenplates are updateable
§ Trouble-shooting Templates
o Library Items
§ Creating and Adding Library Items
§ Detach Libraray Item
· Summary
Chapter 36: Working with Videos, Audio and Animations
· Inserting HTML5 Video
o Setup and Testing
o The Track tag
o Mobile and video scaling
o Can you insert a Video into a background using CSS?
· Inserting HTML5 Audio
o Setup and Testing
o Can you insert an Audio into a background using CSS?
o Audio CSS Aural
· Insert a Canvas Elements
o Importing Animate Canvas in to Dreamweaver
o Canvas Element created without Animate CC
· Insert Animated Composition or OAM
· Inserting Flash SWF and Flash Video
· Insert Plugin
· Summary
Chapter 37: What other ways and I apply Graphics or Images in Dreamweaver to my Website?
· Target Attributes
· Graphs and Charts
· Web Fonts
· CC Libraries Panel
· Dreamweaver > Extract PSD
· Summary
Chapter 38: Final testing and getting the site ready for upload.
· Edit > Preferences of Browsers
· Validation options and uploading site
o Site Reports Panel
o Line Checker Panel
o Validation Panel
o Local and Remote sites
o Manage Site
· Check advanced settings
· Uploading Site to Remote Server
· Summary
Chapter 39: Putting it into practice (tutorial)
· Adding Images Web pages Review
· Carousel Gallery (Bootstrap)
· Video with Channel Changer
· Summary
Part 7 – Further Dreamweaver integration with other Adobe Products for Web sites
Chapter 40: What other programs that are part of Adobe Creative Cloud can I use to display my Graphics or Multi-Media online?
o Adobe InDesign CC
o Adobe Experience Design
o Adobe Portfolio
o Adobe Spark, Storytelling with audio and video
o Exporting to Phone GAP Build
o Test Your Knowledge Quiz
· SummaryIntroduction
Part 1: Welcome to the Adobe Creative Cloud. Where should you begin?
Chapter 1: Entering the Software Maze or Labyrinth
· How will you get to your destination?
· A visual map of how the Creative Cloud Software Works
· Choosing the least amount of Adobe Software to accomplish your Goals
o Photoshop
o Illustrator
o Animate
o Media Encoder
o Dreamweaver
· Basic Web file formats for Image and Multimedia
o Bitmap
o JPEG
o PNG
o GIF (static and animated)
o SVG
o Canvas
o PDF
o Video Files (MP4, Webm, Ogg)
o Audio Files (MP3, Wav, Ogg)
o Interactive PDF & EPUB
· Summary
Part 2: Working with Photoshop to Create Web Graphics and Animations
Chapter 2: Getting Started with Photoshop
· Working with your RAW and Layered Files in Photoshop
· Creating a New File
· Image Files from other Adobe Programs
· Summary
Chapter 3: Color Choices (CMYK, RGB, Greyscale, Index)
· Working with Colors
· Adjusting the Image Size and Resolution
· Summary
Chapter 4: Saving or Exporting your files or the web
· Option 1: Save As
· Option 2: File > Export > Quick Export as PNG
o Export Preferences
· &^ Export As
· Option 4: File Export> Save for Web(Legacy)
· Additional Options you can use to Export Files for the Web
o Artboards
o Layer Comps
o Layers
· Summary
Chapter 5: Actions to Speed up File Conversion and Slicing Tools
· Action to Speed up the file conversion process
o Actions
o Automate Batch Action
o Automate Droplets Actions
· Slicing Tools
· Zoomify an Image
· Summary
Chapter 6: Tools for Animation
· GIF Animated
· The Timeline Panel
o Adding a Frame
o Adding, Altering, and Removing Frames
o Adding Layers Style Effects and Turning Frames off and on in a Frame Sequence
o Tweening Layers in the Timeline
o Export Animate GIF
· Summary
Chapter 7: Tools for Video
· Video Set up tips
· Video Timeline
o Layers in the Timeline
o Other Layer Properties
o Smart Object Layers
o Adding Video Layers
o Interpret Footage
o Playing and Previewing Video
o Working with the Timeline and Play Head
o Adding Background Audio
o Rendering the Video
o Saving the Original File
· Summary
Chapter 8: Other Miscellaneous Items in Photoshop that you can use for web design.
· Library CC
· Extraction of Code from Layers
· Web Fonts and SVG Fonts
· Filter for Repeating Backgrounds
· New To Photoshop CC 2018 Paint Symmetry
· Web Styles
· Color Blindness Proofs
· Summary
Chapter 9: Putting it into practice (tutorials)
· Exporting Images for a gallery
· Exporting a GIF animation
· Exporting a JPEG Poster Image for your Movie the Web
· Rendering a Movie
· Summary
Part 3: Working with Illustrator to Create Web Graphics
Chapter 10: Getting Started with Illustrator
· Working with your RAW Files and Layered Files (AI, EPS, PDF)
o Creating a New File
o Raw File Types
Chapter 11: Color Choices (CMYK, RGB, Greyscale)
· Working with Color
o Copying CMYK Graphics to an RGB document
o Color Panel
o Swatches Panel
· Other Panels for Working with Color
o Color Guide Panel
o Adobe Color Themes Panel
o Gradient Panel
o Transparency Panel
o Appearance Panel
· Summary
Chapter 12: Saving or Exporting your files or the web
· Option 1: File>Save As or File>Save a Copy
· Option 2: File >Export > Export For Screens
o Artboards
o Assets
§ Export Selection
§ Asset Export Panel
§ Layers Panel Collect for Export
· Option 3: File > Export > Export As
· &nbs^ Export > Save for Web (Legacy)
· Summary
Chapter 13: Actions for Speeding Up file conversion and Slicing tools
· Using Scripts
· Action to Speed up the File conversion process
o Actions Panel
· Automate Batch Actions
· Slicing Tools
o Using Slices and Slice Select Tools
o Align Slices
o Slice Options
o Save Slices for the Web
· Creating Image Maps
· Summary
Chapter 14: Tools for Animation and Video
· Tools for Animation
o SVG Interactivity
· Copying Illustrations to Photoshop (Vector Smart objects)
o Rasterize Smart Objects
o Puppet Warp Tool
· Tools for Video
o New Layout for Film and Video
o Adding 3D Images
· Summary
Chapter 15: Other Miscellaneous Items in Illustrator that you can use for web design.
· Library CC
· Web Fonts and SVG Fonts
· Creating Swatch Patterns
· Graphic Styles for Buttons and Rollovers
· Symbols Panel for web symbols Creation
· Color Blindness Proofs
· Summary
Chapter 16: Putting it into practice (tutorial)
· Exporting an Images for an Instructional Web Page
o Create a Custom Action
· Exporting an SVG File
· Summary
Part 4: Working with Animate to Create Animations, Movies and HTML5 Canvas
Chapter 17: Getting Started
· Getting Started with Animate
o Differences and similarities between Animate and Character Animator CC
o Setting up the Workspace
o Create an FLA Document
· What is HTML 5 Canvas?
· Working with your RAW Files
o Properties panel
o Timeline panel
o Library panel
o Tools panel
o FLA conversions ActionScript to HTML5
· Summary
Chapter 18: Color Choices (RGB…)
· Adding Color to the Stage
· The Tool Panel Stroke and Fill
· Properties Panel
· Color Panel
o Gradient Fills
o Bitmap Fills
· Swatches Panel
· Info Panel
· Summary
Chapter 19: Importing your Artwork
· Importing to the Stage or Library panel
o Import as an Image Sequence
o Import Images as an External Library
o Importing Illustrator and Photoshop Files with their elements or effects intact
§ Photoshop CC Blending Modes
§ Photoshop CC Layer Styles FX
§ Illustrator CC Blending Modes
§ Illustrator CC Effects FX
o Importing into Adobe Animate
§ Photoshop PSD import
§ Illustrator AI Import
o Animate CC Effects
§ Working with Symbols
§ Color Effect Tab
§ Display Tab
§ Display Render
§ Filters Tab
· Import Other Graphic File Formats
· Summary
Chapter 20: Import your Audio and Video
· Import Audio
o Sound Effect Settings
o Sync Settings
o Repeat Sound
· Import Video
o Components and Component Parameters
· Summary
Chapter 21: Working with the Timeline Panel
· Working with the Timeline panel
o A review of Layers
o New Layers
o Folders
o Hide and Show Layers and Folders
o Lock Layers and Folders
o Layer Outlined
o Advanced Layer Settings
o Layer Depth Panel
o Layer Types
· The parts of the Timeline panel
o Frames Types
· Easing for Classic, Shape and Motion Tweens
o Shape Tween Easing
o Classic Tween Easing
o Motion and Camera Tween Easing
o Camera Tool
· Bone tools
o Bone Tool and Armature Easing
o The Bind Tool
· Frame Picker Panel
· Scenes Scene Panel
· Summary
Chapter 22: Saving or Exporting your files or the web
· Option 1: File>Export> Export Image
· Option 2: File>Export> Export Image(Legacy)
· Option 3^Export^ Export Movie
·&nb^Ex^ Export Video
· Option 5: File >Export> Export Animated GIF
· Options 6: File > Publish Settings HTML5 Canvas & Other Formats
o Publish Settings
o Dissecting the Canvas HTML5
· Other Export Options from the Symbols in the Library Panel
o Export a PNG Sequence
o Generate a Sprite Sheet
o Generate a Texture Atlas
· Other Web Export Options
o Air Options
o Projector
o WebGL
· Summary
Chapter 23: Other Miscellaneous Items in Animate that you can use for web design.
·^ Preferences
· Actions, Code Snippets & History Panel
o Actions Panel
o Code Snippets Panel
o History Panel
· Library CC
· Patterns for Paint brushes, and pen tools
· 3D in animations
· Web Fonts
· The Dangers of Flashing Graphics
· Summary
Chapter 24: Putting it into practice (tutorial)
· Create an animated .gif
o Export your GIF Animation
· Create a Video (.mov) file
o Creating a story board
o Pre-plan your Video Settings
o Review the files
o Exporting the Video
o Opening in Adobe Media Encoder
· Create a HTML5 Canvas Animation
o Publish HTML 5 Canvas and OAM Files
· Summary
Part 5 - Working with Media Encoder to Create Audio and Video Files
Chapter 25: Getting Started
· Getting Started with Adobe Media Encoder
· Looking at the setup of Animate CC and Queue
o Set up a Workspace
§ Adjusting your Preferences
· Media Browser Panel
· Queue Panel
o Format Options
o Preset Options
o Output Options
o Status Options
o Interpret Footage
· Watch Folders Panel
· Encoding Panel
· Preset Browser Panel
o Preset menu options
· Summary
Chapter 26: Working with your RAW Files (AVI or MOV)
· Working with your RAW Files (AVI and MOV)
· Covert Video with Export Settings
o Export Settings Dialog Box
§ Source Tab
§ Output Tab
§ Preview settings
§ Export settings and Summary
§ Effects Tab
§ Video Tab
§ Audio Tab
§ Multiplexer Tab
§ Captions Tab
§ Publish Tab
§ Render, Time Code, Alpha and Output Size
o Combine Video (Stich Clips)
· WebM and OGG
· Summary
Chapter 27: Working with your RAW Files and Converting them to Audio
· Convert Audio to (export settings
o MP3
§ Export Settings Dialog Box
§ Preview Settings
§ Export and Summary settings
§ Effects Tab
§ Audio Tab
§ Publish Tab
§ Time Code Settings
o Wave Form Audio (.wav)
§ Export and Summary settings
§ Effects Tab
§ Audio Tab
§ Publish Tab
§ Time Code Settings
o Theora Ogg
o Working with Audio Files that are Audio 3GA
· Summary
Chapter 28: Working with your RAW Files and Converting them to an Image Sequence
· Convert to Other Web Formats (image sequences)
o Bitmap Sequence Export Settings
§ Effects Tab
§ Video Tab
§ Captions Tab
§ Publish Tab
§ Render Time Code and Alpha Channel settings
o JPEG Sequence Export Settings
§ Video Tab
o PNG Sequence Export Settings
§ Video Tab
o GIF (static) image Sequence Export Settings
o Animated GIF
§ Video Tab
§ Publish Tab
· Summary
Chapter 29: Putting it into practice (tutorial)
o Create Video MP4 File
o Create Audio MP3 and WAV Files
· Summary
Part 6 – Working with Dreamweaver. Adding Images, Animations, and Multi-Media to HTML5 Pages
Chapter 30: Getting Started
· Entering the Maze’s center
· Differences and similarities between Dreamweaver and Muse
· Setting up the Workspace
· What is HTML5 (.html)?
· Import and Save your files to your Site
· Fixing errors
· Summary
Chapter 31: Working with Images and Tags
· Inserting Images on an HTML Page
o Insert Panel
o Working with SVG Images
o Properties Panel
· Adding Images inside of various tags
o A Bit of HTML history
o Div Tags
o Semantic Elements
o Are tables obsolete from web design?
o Image Maps and tags
o The and elements
o The and elements
o The element
o The and elements
· Inserting Images favicons into your Browser’s tab
· HTML 5 and the Snippets Panel
· Summary
Chapter 32: Working with CSS
· CSS Inline Internal or External styles?
o Inline CSS
o Internal CSS
§ CSS Designer Panel
§ Adding Other Background properties
§ Background Image Gradients
§ Enabling and Disabling CSS properties
o Adding CSS to other tags and elements
§ Tags
§ IDs
§ Class
§ Pseudo Class selectors
· External CSS
o CSS Designer panel
o File >New CSS
· What is CSS3?
o Applying CSS to the tag
o Should you add background images to form elements
o CSS3 Borders
o Rounded CSS3 borders
o Outline CSS2
o CSS3 box-decoration-break
o Adding CSS3 Filters and Shadows
§ Box-Shadow
§ Text-Shadow
§ CSS Filters
o Image Masking in CSS3?
o Adding Custom images to Bullets
· Creating CSS Animation Transitions and Transforms
o CSS3 Animations
o CSS3 Transitions and Transitions
§ Transitions Panel
o CSS3 Transforms 2D and 3D it’s all about perspective
§ 2D Transform
§ 3D Transform
· Summary
Chapter 33: Working with Images for Mobile Web design
· CSS Floats
· Responsive Media queries and the View Port
· Image Slices and Mobile devices
· Media Queries (Mobile First)
o Scaling Images
o Scaling a Div with a background
o Loading a different images based on media query
· Column Count
· CSS for print with CSS Designer Panel
· Summary
Chapter 34: What is JavaScript?
· Creating a new JavaScript File
· Insert Image Rollovers
· Behaviors Panel
o Additional Behaviors
· JavaScript and the Snippets Panel
· Print Preview
· Summary
Chapter 35: Working with Templates, Library Items and the Assets Panel
· Bootstrap
· Woorking with Templates, Library Items, and the Assets Panel
o Templates
§ Adding Editable Areas
§ Additional Editable Regions
§ Creating a Template based page
§ Hidden areas in the ^§ Tenplates are updateable
§ Trouble-shooting Templates
o Library Items
§ Creating and Adding Library Items
§ Detach Libraray Item
· Summary
Chapter 36: Working with Videos, Audio and Animations
· Inserting HTML5 Video
o Setup and Testing
o The Track tag
o Mobile and video scaling
o Can you insert a Video into a background using CSS?
· Inserting HTML5 Audio
o Setup and Testing
o Can you insert an Audio into a background using CSS?
o Audio CSS Aural
· Insert a Canvas Elements
o Importing Animate Canvas in to Dreamweaver
o Canvas Element created without Animate CC
· Insert Animated Composition or OAM
· Inserting Flash SWF and Flash Video
· Insert Plugin
· Summary
Chapter 37: What other ways and I apply Graphics or Images in Dreamweaver to my Website?
· Target Attributes
· Graphs and Charts
· Web Fonts
· CC Libraries Panel
· Dreamweaver > Extract PSD
· Summary
Chapter 38: Final testing and getting the site ready for upload.
· Edit > Preferences of Browsers
· Validation options and uploading site
o Site Reports Panel
o Line Checker Panel
o Validation Panel
o Local and Remote sites
o Manage Site
· Check advanced settings
· Uploading Site to Remote Server
· Summary
Chapter 39: Putting it into practice (tutorial)
· Adding Images Web pages Review
· Carousel Gallery (Bootstrap)
· Video with Channel Changer
· Summary
Part 7 – Further Dreamweaver integration with other Adobe Products for Web sites
Chapter 40: What other programs that are part of Adobe Creative Cloud can I use to display my Graphics or Multi-Media online?
o Adobe InDesign CC
o Adobe Experience Design
o Adobe Portfolio
o Adobe Spark, Storytelling with audio and video
o Exporting to Phone GAP Build
o Test Your Knowledge Quiz
· Summary
| Erscheint lt. Verlag | 16.11.2018 |
|---|---|
| Zusatzinfo | XXV, 1017 p. 1362 illus., 1102 illus. in color. |
| Verlagsort | Berkeley |
| Sprache | englisch |
| Themenwelt | Mathematik / Informatik ► Informatik ► Software Entwicklung |
| Mathematik / Informatik ► Informatik ► Web / Internet | |
| Schlagworte | Adobe Animate CC • Adobe Creative Cloud • Adobe Dreamweaver CC • Adobe Illustrator CC • Adobe Media Encoder CC • Adobe Photoshop CC • CSS# • HTML5 • JavaScript • web animation |
| ISBN-10 | 1-4842-3823-0 / 1484238230 |
| ISBN-13 | 978-1-4842-3823-3 / 9781484238233 |
| Haben Sie eine Frage zum Produkt? |
PDF (Wasserzeichen)Größe: 59,0 MB
DRM: Digitales Wasserzeichen
Dieses eBook enthält ein digitales Wasserzeichen und ist damit für Sie personalisiert. Bei einer missbräuchlichen Weitergabe des eBooks an Dritte ist eine Rückverfolgung an die Quelle möglich.
Dateiformat: PDF (Portable Document Format)
Mit einem festen Seitenlayout eignet sich die PDF besonders für Fachbücher mit Spalten, Tabellen und Abbildungen. Eine PDF kann auf fast allen Geräten angezeigt werden, ist aber für kleine Displays (Smartphone, eReader) nur eingeschränkt geeignet.
Systemvoraussetzungen:
PC/Mac: Mit einem PC oder Mac können Sie dieses eBook lesen. Sie benötigen dafür einen PDF-Viewer - z.B. den Adobe Reader oder Adobe Digital Editions.
eReader: Dieses eBook kann mit (fast) allen eBook-Readern gelesen werden. Mit dem amazon-Kindle ist es aber nicht kompatibel.
Smartphone/Tablet: Egal ob Apple oder Android, dieses eBook können Sie lesen. Sie benötigen dafür einen PDF-Viewer - z.B. die kostenlose Adobe Digital Editions-App.
Buying eBooks from abroad
For tax law reasons we can sell eBooks just within Germany and Switzerland. Regrettably we cannot fulfill eBook-orders from other countries.
aus dem Bereich
