SlideShare a Scribd company logo
1 of 4
Digital Imaging
Unit 11: Creating Images for the Web
Module 4: Creating Slices in an Image
Slices
When working on the Web, you
want images to load quickly. One
way to do this is to slice the image
into smaller pieces for loading.
Slices are categorized by type, and
should be named the same way:
• Table
• Image
• No image
Digital Imaging
Unit 11: Creating Images for the Web
Module 4: Creating Slices in an Image
Slices
The slice tool looks like an x-acto
knife. It shares a spot with the
crop tool in the toolbox.
To create a slice using the slice
tool, drag over the area where you
want to create a slice.
Digital Imaging
Unit 11: Creating Images for the Web
Module 4: Creating Slices in an Image
Slices
Slice Tool Options:
Normal - Determines slice
proportions as you drag. Fixed
Aspect Ratio - Sets a height-to-
width ratio.
Fixed Size - Specifies the slice’s
height and width. Enter pixel
values in whole numbers.
Digital Imaging
Unit 11: Creating Images for the Web
Module 4: Creating Slices in an Image
Slices
Slicing can be done manually, or
you can map out the slices using
guides for more accuracy.
• Add guides to an image.
• Select the Slice tool, and click
Slices From Guides in the
options bar.

More Related Content

Viewers also liked

Wd133 unit 11 module 1 understanding web graphics
Wd133 unit 11 module 1 understanding web graphicsWd133 unit 11 module 1 understanding web graphics
Wd133 unit 11 module 1 understanding web graphicskateridrex
 
Elem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying stylesElem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying styleskateridrex
 
Wd133 unit 3 module 2 working with the color picker and swatches palette
Wd133 unit 3 module 2 working with the color picker and swatches paletteWd133 unit 3 module 2 working with the color picker and swatches palette
Wd133 unit 3 module 2 working with the color picker and swatches palettekateridrex
 
Wd131 unit 11 module 1 proportion and scale
Wd131 unit 11 module 1 proportion and scaleWd131 unit 11 module 1 proportion and scale
Wd131 unit 11 module 1 proportion and scalekateridrex
 
Elem of design unit 11 module 3 swatches panel
Elem of design unit 11 module 3 swatches panelElem of design unit 11 module 3 swatches panel
Elem of design unit 11 module 3 swatches panelkateridrex
 
Wd133 unit 9 module 2 modifying shapes
Wd133 unit 9 module 2 modifying shapesWd133 unit 9 module 2 modifying shapes
Wd133 unit 9 module 2 modifying shapeskateridrex
 
Wd133 unit 1 module 1 i understanding image editing concepts
Wd133 unit 1 module 1 i understanding image editing conceptsWd133 unit 1 module 1 i understanding image editing concepts
Wd133 unit 1 module 1 i understanding image editing conceptskateridrex
 
Dig imag unit 7 module 2 adjusting filters
Dig imag unit 7 module 2 adjusting filtersDig imag unit 7 module 2 adjusting filters
Dig imag unit 7 module 2 adjusting filterskateridrex
 
Elem of design unit 10 module 3 document creation
Elem of design unit 10 module 3 document creationElem of design unit 10 module 3 document creation
Elem of design unit 10 module 3 document creationkateridrex
 
Fund of design unit 2 module 1 understanding categories of l ine and their use
Fund of design unit 2 module 1 understanding categories of l ine and their use Fund of design unit 2 module 1 understanding categories of l ine and their use
Fund of design unit 2 module 1 understanding categories of l ine and their use kateridrex
 
Fund of design unit 7 module 2 strategies for crafting balance
Fund of design unit 7 module 2 strategies for crafting balanceFund of design unit 7 module 2 strategies for crafting balance
Fund of design unit 7 module 2 strategies for crafting balancekateridrex
 
Elem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying stylesElem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying styleskateridrex
 
Dig imag unit 4 module 3 creating path text
Dig imag unit 4 module 3 creating path textDig imag unit 4 module 3 creating path text
Dig imag unit 4 module 3 creating path textkateridrex
 
Elem of design unit 9 module 1 integrating text and graphics
Elem of design unit 9 module 1 integrating text and graphicsElem of design unit 9 module 1 integrating text and graphics
Elem of design unit 9 module 1 integrating text and graphicskateridrex
 
Wt1110 sb unit 1
Wt1110 sb unit 1Wt1110 sb unit 1
Wt1110 sb unit 1kateridrex
 

Viewers also liked (15)

Wd133 unit 11 module 1 understanding web graphics
Wd133 unit 11 module 1 understanding web graphicsWd133 unit 11 module 1 understanding web graphics
Wd133 unit 11 module 1 understanding web graphics
 
Elem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying stylesElem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying styles
 
Wd133 unit 3 module 2 working with the color picker and swatches palette
Wd133 unit 3 module 2 working with the color picker and swatches paletteWd133 unit 3 module 2 working with the color picker and swatches palette
Wd133 unit 3 module 2 working with the color picker and swatches palette
 
Wd131 unit 11 module 1 proportion and scale
Wd131 unit 11 module 1 proportion and scaleWd131 unit 11 module 1 proportion and scale
Wd131 unit 11 module 1 proportion and scale
 
Elem of design unit 11 module 3 swatches panel
Elem of design unit 11 module 3 swatches panelElem of design unit 11 module 3 swatches panel
Elem of design unit 11 module 3 swatches panel
 
Wd133 unit 9 module 2 modifying shapes
Wd133 unit 9 module 2 modifying shapesWd133 unit 9 module 2 modifying shapes
Wd133 unit 9 module 2 modifying shapes
 
Wd133 unit 1 module 1 i understanding image editing concepts
Wd133 unit 1 module 1 i understanding image editing conceptsWd133 unit 1 module 1 i understanding image editing concepts
Wd133 unit 1 module 1 i understanding image editing concepts
 
Dig imag unit 7 module 2 adjusting filters
Dig imag unit 7 module 2 adjusting filtersDig imag unit 7 module 2 adjusting filters
Dig imag unit 7 module 2 adjusting filters
 
Elem of design unit 10 module 3 document creation
Elem of design unit 10 module 3 document creationElem of design unit 10 module 3 document creation
Elem of design unit 10 module 3 document creation
 
Fund of design unit 2 module 1 understanding categories of l ine and their use
Fund of design unit 2 module 1 understanding categories of l ine and their use Fund of design unit 2 module 1 understanding categories of l ine and their use
Fund of design unit 2 module 1 understanding categories of l ine and their use
 
Fund of design unit 7 module 2 strategies for crafting balance
Fund of design unit 7 module 2 strategies for crafting balanceFund of design unit 7 module 2 strategies for crafting balance
Fund of design unit 7 module 2 strategies for crafting balance
 
Elem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying stylesElem of design unit 10 module 1 applying styles
Elem of design unit 10 module 1 applying styles
 
Dig imag unit 4 module 3 creating path text
Dig imag unit 4 module 3 creating path textDig imag unit 4 module 3 creating path text
Dig imag unit 4 module 3 creating path text
 
Elem of design unit 9 module 1 integrating text and graphics
Elem of design unit 9 module 1 integrating text and graphicsElem of design unit 9 module 1 integrating text and graphics
Elem of design unit 9 module 1 integrating text and graphics
 
Wt1110 sb unit 1
Wt1110 sb unit 1Wt1110 sb unit 1
Wt1110 sb unit 1
 

Similar to Wd133 unit 11 module 4 creating slices in an image

Dig imag unit 11 module 4(2) creating slices in an image
Dig imag unit 11 module 4(2) creating slices in an imageDig imag unit 11 module 4(2) creating slices in an image
Dig imag unit 11 module 4(2) creating slices in an imagekateridrex
 
Dig imag unit 11 module 4 creating slices in an image (2)
Dig imag unit 11 module 4 creating slices in an image (2)Dig imag unit 11 module 4 creating slices in an image (2)
Dig imag unit 11 module 4 creating slices in an image (2)kateridrex
 
How To Use Sketchup
How To Use SketchupHow To Use Sketchup
How To Use Sketchupjohnysteve
 
CreativeEssentials_0503
CreativeEssentials_0503CreativeEssentials_0503
CreativeEssentials_0503tutorialsruby
 
CreativeEssentials_0503
CreativeEssentials_0503CreativeEssentials_0503
CreativeEssentials_0503tutorialsruby
 
how to use design by software.pptx
how to use design by software.pptxhow to use design by software.pptx
how to use design by software.pptxNitinKumar12570
 
Introduction to CorelDRAW
Introduction to CorelDRAWIntroduction to CorelDRAW
Introduction to CorelDRAWSanthiNivas
 
Unit 1- Introduction.pptx
Unit 1- Introduction.pptxUnit 1- Introduction.pptx
Unit 1- Introduction.pptxSanthiNivas
 
Affinity+designer+start+guide
Affinity+designer+start+guideAffinity+designer+start+guide
Affinity+designer+start+guidemoodleyveez
 
Applied vision4 usermanual for cam 107a
Applied vision4 usermanual for cam 107aApplied vision4 usermanual for cam 107a
Applied vision4 usermanual for cam 107aDukaneAVMarketing
 
Plan601 e session 2 demob
Plan601 e session 2 demobPlan601 e session 2 demob
Plan601 e session 2 demobrkottam
 
Learning Photoshop by Godwin Adoro
Learning Photoshop by Godwin AdoroLearning Photoshop by Godwin Adoro
Learning Photoshop by Godwin AdoroGodwin Sunny Adoro
 
Adobe Animate CC.
Adobe Animate CC.Adobe Animate CC.
Adobe Animate CC.Edgar Hdz
 
Find and Use the Snipping Tool in Windows
Find and Use the Snipping Tool in WindowsFind and Use the Snipping Tool in Windows
Find and Use the Snipping Tool in WindowsCharles Edelen
 
plan601 e session 2 demo
plan601 e session 2 demoplan601 e session 2 demo
plan601 e session 2 demorkottam
 

Similar to Wd133 unit 11 module 4 creating slices in an image (20)

Dig imag unit 11 module 4(2) creating slices in an image
Dig imag unit 11 module 4(2) creating slices in an imageDig imag unit 11 module 4(2) creating slices in an image
Dig imag unit 11 module 4(2) creating slices in an image
 
Dig imag unit 11 module 4 creating slices in an image (2)
Dig imag unit 11 module 4 creating slices in an image (2)Dig imag unit 11 module 4 creating slices in an image (2)
Dig imag unit 11 module 4 creating slices in an image (2)
 
Ddpz2613 topic5 image
Ddpz2613 topic5 imageDdpz2613 topic5 image
Ddpz2613 topic5 image
 
How To Use Sketchup
How To Use SketchupHow To Use Sketchup
How To Use Sketchup
 
Adobe illustrator basics
Adobe illustrator basicsAdobe illustrator basics
Adobe illustrator basics
 
Get the Sheet out of here! Plan production for jobs due yesterday
Get the Sheet out of here! Plan production for jobs due yesterdayGet the Sheet out of here! Plan production for jobs due yesterday
Get the Sheet out of here! Plan production for jobs due yesterday
 
CreativeEssentials_0503
CreativeEssentials_0503CreativeEssentials_0503
CreativeEssentials_0503
 
CreativeEssentials_0503
CreativeEssentials_0503CreativeEssentials_0503
CreativeEssentials_0503
 
how to use design by software.pptx
how to use design by software.pptxhow to use design by software.pptx
how to use design by software.pptx
 
Introduction to CorelDRAW
Introduction to CorelDRAWIntroduction to CorelDRAW
Introduction to CorelDRAW
 
Unit 1- Introduction.pptx
Unit 1- Introduction.pptxUnit 1- Introduction.pptx
Unit 1- Introduction.pptx
 
Photoshop basics
Photoshop basicsPhotoshop basics
Photoshop basics
 
Affinity+designer+start+guide
Affinity+designer+start+guideAffinity+designer+start+guide
Affinity+designer+start+guide
 
Applied vision4 usermanual for cam 107a
Applied vision4 usermanual for cam 107aApplied vision4 usermanual for cam 107a
Applied vision4 usermanual for cam 107a
 
Plan601 e session 2 demob
Plan601 e session 2 demobPlan601 e session 2 demob
Plan601 e session 2 demob
 
Learning Photoshop by Godwin Adoro
Learning Photoshop by Godwin AdoroLearning Photoshop by Godwin Adoro
Learning Photoshop by Godwin Adoro
 
Adobe Animate CC.
Adobe Animate CC.Adobe Animate CC.
Adobe Animate CC.
 
Find and Use the Snipping Tool in Windows
Find and Use the Snipping Tool in WindowsFind and Use the Snipping Tool in Windows
Find and Use the Snipping Tool in Windows
 
plan601 e session 2 demo
plan601 e session 2 demoplan601 e session 2 demo
plan601 e session 2 demo
 
In designtutorial
In designtutorialIn designtutorial
In designtutorial
 

More from kateridrex

Dig imag unit 11 module 3 creating buttons
Dig imag unit 11 module 3 creating buttonsDig imag unit 11 module 3 creating buttons
Dig imag unit 11 module 3 creating buttonskateridrex
 
Dig imag unit 11 module 1 understanding web graphics
Dig imag unit 11 module 1 understanding web graphicsDig imag unit 11 module 1 understanding web graphics
Dig imag unit 11 module 1 understanding web graphicskateridrex
 
Dig imag unit 10 module 1 advanced type effects
Dig imag unit 10 module 1 advanced type effectsDig imag unit 10 module 1 advanced type effects
Dig imag unit 10 module 1 advanced type effectskateridrex
 
Dig imag unit 9 module 2 modifying shapes
Dig imag unit 9 module 2 modifying shapesDig imag unit 9 module 2 modifying shapes
Dig imag unit 9 module 2 modifying shapeskateridrex
 
Dig imag unit 9 module 1 working with the pen tool
Dig imag unit 9 module 1 working with the pen toolDig imag unit 9 module 1 working with the pen tool
Dig imag unit 9 module 1 working with the pen toolkateridrex
 
Dig imag unit 8 module 3 making color corrections
Dig imag unit 8 module 3 making color correctionsDig imag unit 8 module 3 making color corrections
Dig imag unit 8 module 3 making color correctionskateridrex
 
Dig imag unit 8 module 2 creating and saving alpha channels
Dig imag unit 8 module 2 creating and saving alpha channelsDig imag unit 8 module 2 creating and saving alpha channels
Dig imag unit 8 module 2 creating and saving alpha channelskateridrex
 
Dig imag unit 8 module 1 understanding channels
Dig imag unit 8 module 1 understanding channelsDig imag unit 8 module 1 understanding channels
Dig imag unit 8 module 1 understanding channelskateridrex
 
Dig imag unit 7 module 1 understanding and implementing filters
Dig imag unit 7 module 1 understanding and implementing filtersDig imag unit 7 module 1 understanding and implementing filters
Dig imag unit 7 module 1 understanding and implementing filterskateridrex
 
Dig imag unit 6 module 3 using clipping masks
Dig imag unit 6 module 3 using clipping masksDig imag unit 6 module 3 using clipping masks
Dig imag unit 6 module 3 using clipping maskskateridrex
 
Dig imag unit 6 module 2 using adjustment layers
Dig imag unit 6 module 2 using adjustment layersDig imag unit 6 module 2 using adjustment layers
Dig imag unit 6 module 2 using adjustment layerskateridrex
 
Dig imag unit 6 module 1 working with layer masks
Dig imag unit 6 module 1 working with layer masksDig imag unit 6 module 1 working with layer masks
Dig imag unit 6 module 1 working with layer maskskateridrex
 
Dig imag unit 5 module 2 using the various painting tools
Dig imag unit 5 module 2 using the various painting toolsDig imag unit 5 module 2 using the various painting tools
Dig imag unit 5 module 2 using the various painting toolskateridrex
 
Dig imag unit 5 module 1 learning about brush types and properties
Dig imag unit 5 module 1 learning about brush types and propertiesDig imag unit 5 module 1 learning about brush types and properties
Dig imag unit 5 module 1 learning about brush types and propertieskateridrex
 
Dig imag unit 4 module 1 learning about type fonts and properties[2]
Dig imag unit 4 module 1 learning about type fonts and properties[2]Dig imag unit 4 module 1 learning about type fonts and properties[2]
Dig imag unit 4 module 1 learning about type fonts and properties[2]kateridrex
 
Dig imag unit 3 module 3 incorporating color techniques
Dig imag unit 3 module 3  incorporating color techniquesDig imag unit 3 module 3  incorporating color techniques
Dig imag unit 3 module 3 incorporating color techniqueskateridrex
 
Dig imag unit 3 module 2 working with the color picker and swatches palette
Dig imag unit 3 module 2 working with the color picker and swatches paletteDig imag unit 3 module 2 working with the color picker and swatches palette
Dig imag unit 3 module 2 working with the color picker and swatches palettekateridrex
 
Dig imag unit 2 module 3 modifying selections
Dig imag unit 2 module 3 modifying selectionsDig imag unit 2 module 3 modifying selections
Dig imag unit 2 module 3 modifying selectionskateridrex
 
Dig imag unit 2 module 1 using and managing layers
Dig imag unit 2 module 1 using and managing layersDig imag unit 2 module 1 using and managing layers
Dig imag unit 2 module 1 using and managing layerskateridrex
 
Dig imag unit 1 module 1 i understanding image editing concepts
Dig imag unit 1 module 1 i understanding image editing conceptsDig imag unit 1 module 1 i understanding image editing concepts
Dig imag unit 1 module 1 i understanding image editing conceptskateridrex
 

More from kateridrex (20)

Dig imag unit 11 module 3 creating buttons
Dig imag unit 11 module 3 creating buttonsDig imag unit 11 module 3 creating buttons
Dig imag unit 11 module 3 creating buttons
 
Dig imag unit 11 module 1 understanding web graphics
Dig imag unit 11 module 1 understanding web graphicsDig imag unit 11 module 1 understanding web graphics
Dig imag unit 11 module 1 understanding web graphics
 
Dig imag unit 10 module 1 advanced type effects
Dig imag unit 10 module 1 advanced type effectsDig imag unit 10 module 1 advanced type effects
Dig imag unit 10 module 1 advanced type effects
 
Dig imag unit 9 module 2 modifying shapes
Dig imag unit 9 module 2 modifying shapesDig imag unit 9 module 2 modifying shapes
Dig imag unit 9 module 2 modifying shapes
 
Dig imag unit 9 module 1 working with the pen tool
Dig imag unit 9 module 1 working with the pen toolDig imag unit 9 module 1 working with the pen tool
Dig imag unit 9 module 1 working with the pen tool
 
Dig imag unit 8 module 3 making color corrections
Dig imag unit 8 module 3 making color correctionsDig imag unit 8 module 3 making color corrections
Dig imag unit 8 module 3 making color corrections
 
Dig imag unit 8 module 2 creating and saving alpha channels
Dig imag unit 8 module 2 creating and saving alpha channelsDig imag unit 8 module 2 creating and saving alpha channels
Dig imag unit 8 module 2 creating and saving alpha channels
 
Dig imag unit 8 module 1 understanding channels
Dig imag unit 8 module 1 understanding channelsDig imag unit 8 module 1 understanding channels
Dig imag unit 8 module 1 understanding channels
 
Dig imag unit 7 module 1 understanding and implementing filters
Dig imag unit 7 module 1 understanding and implementing filtersDig imag unit 7 module 1 understanding and implementing filters
Dig imag unit 7 module 1 understanding and implementing filters
 
Dig imag unit 6 module 3 using clipping masks
Dig imag unit 6 module 3 using clipping masksDig imag unit 6 module 3 using clipping masks
Dig imag unit 6 module 3 using clipping masks
 
Dig imag unit 6 module 2 using adjustment layers
Dig imag unit 6 module 2 using adjustment layersDig imag unit 6 module 2 using adjustment layers
Dig imag unit 6 module 2 using adjustment layers
 
Dig imag unit 6 module 1 working with layer masks
Dig imag unit 6 module 1 working with layer masksDig imag unit 6 module 1 working with layer masks
Dig imag unit 6 module 1 working with layer masks
 
Dig imag unit 5 module 2 using the various painting tools
Dig imag unit 5 module 2 using the various painting toolsDig imag unit 5 module 2 using the various painting tools
Dig imag unit 5 module 2 using the various painting tools
 
Dig imag unit 5 module 1 learning about brush types and properties
Dig imag unit 5 module 1 learning about brush types and propertiesDig imag unit 5 module 1 learning about brush types and properties
Dig imag unit 5 module 1 learning about brush types and properties
 
Dig imag unit 4 module 1 learning about type fonts and properties[2]
Dig imag unit 4 module 1 learning about type fonts and properties[2]Dig imag unit 4 module 1 learning about type fonts and properties[2]
Dig imag unit 4 module 1 learning about type fonts and properties[2]
 
Dig imag unit 3 module 3 incorporating color techniques
Dig imag unit 3 module 3  incorporating color techniquesDig imag unit 3 module 3  incorporating color techniques
Dig imag unit 3 module 3 incorporating color techniques
 
Dig imag unit 3 module 2 working with the color picker and swatches palette
Dig imag unit 3 module 2 working with the color picker and swatches paletteDig imag unit 3 module 2 working with the color picker and swatches palette
Dig imag unit 3 module 2 working with the color picker and swatches palette
 
Dig imag unit 2 module 3 modifying selections
Dig imag unit 2 module 3 modifying selectionsDig imag unit 2 module 3 modifying selections
Dig imag unit 2 module 3 modifying selections
 
Dig imag unit 2 module 1 using and managing layers
Dig imag unit 2 module 1 using and managing layersDig imag unit 2 module 1 using and managing layers
Dig imag unit 2 module 1 using and managing layers
 
Dig imag unit 1 module 1 i understanding image editing concepts
Dig imag unit 1 module 1 i understanding image editing conceptsDig imag unit 1 module 1 i understanding image editing concepts
Dig imag unit 1 module 1 i understanding image editing concepts
 

Wd133 unit 11 module 4 creating slices in an image

  • 1. Digital Imaging Unit 11: Creating Images for the Web Module 4: Creating Slices in an Image Slices When working on the Web, you want images to load quickly. One way to do this is to slice the image into smaller pieces for loading. Slices are categorized by type, and should be named the same way: • Table • Image • No image
  • 2. Digital Imaging Unit 11: Creating Images for the Web Module 4: Creating Slices in an Image Slices The slice tool looks like an x-acto knife. It shares a spot with the crop tool in the toolbox. To create a slice using the slice tool, drag over the area where you want to create a slice.
  • 3. Digital Imaging Unit 11: Creating Images for the Web Module 4: Creating Slices in an Image Slices Slice Tool Options: Normal - Determines slice proportions as you drag. Fixed Aspect Ratio - Sets a height-to- width ratio. Fixed Size - Specifies the slice’s height and width. Enter pixel values in whole numbers.
  • 4. Digital Imaging Unit 11: Creating Images for the Web Module 4: Creating Slices in an Image Slices Slicing can be done manually, or you can map out the slices using guides for more accuracy. • Add guides to an image. • Select the Slice tool, and click Slices From Guides in the options bar.