finds BG images groups into sprites generates sprite recomputes BG pos injects into page

Slides:



Advertisements
Similar presentations
Bending Zen Intro Using Zen Themes functionality, but bending it into your own theme.
Advertisements

Creating posters and flyers Lesson -IV. Editing pictures inside Office Office 2007 has tools to edit photos and pictures in the document. Office 2007.
This will be your summary section.
Part 5 Introduction to CSS. CSS Display - Block and Inline Elements A block element is an element that takes up the full width available, and has a line.
PowerPoint Enhancements CMCE 1155 Prof. N Anderson.
Using the Photo Album in PowerPoint 2003 Multimedia Services at The Citadel Updated 6/18/07.
TUTORIAL 4: CREATING PAGE LAYOUT WITH CSS Session 4.3.
Document Processing CS French Chapter 4. Text editor used for simple text entry and editing not intended to look good for editing programs and data e.g.
Lecture HTML Images. Use for Images Photos and Graphics Buttons for Navigation Bullets for Lists Backgrounds Symbols and Icons Logos.
4.01 Cascading Style Sheets
To get to the Progress Toward Degree worksheets, click on “Contents” on the menu bar…
SRM Community Wiki – User Guide Sign-up Edit a page Insert photo & video and other files Create pages & page menu titles Forum & commenting.
Making a Virtual Book With PowerPoint 2007 How to make a virtual book Using PowerPoint 2007 This is not a presentation template. This is not the venue.
Cascading Style Sheets CSS. CSS Positioning Normal Flow Top -> bottom | left -> right Arranged in the order they appear in the code make room for one.
Cascading Style Sheets CSS. div … Used like a container to group content Gives context to the elements in the grouping Give it a descriptive name with.
CSS Sprites. What are sprites? In the early days of video games, memory for graphics was very low. So to make things load quickly and make graphics look.
PowerPoint 1 The Basics 1. Save this file to your Apps Folder as YourLastName_PP1 2. Read each slide. 3. Complete each set of numbered directions.
CSS The Definitive Guide Chapter 8.  Allows one to define borders for  paragraphs  headings  divs  anchors  images  and more.
 This presentation introduces the following: › 3 types of CSS › CSS syntax › CSS comments › CSS and color › The box model.
HOW TO BUILD YOUR CULINARY ARTS PORTFOLIO. Adding a New Slide/ Duplicating a Slide Go to the slide menu on the left side of the screen Right click to.
Creating Web Pages Chapter 5 Learn how to… Identify Web page creation strategies. Define HTML Web page elements. Describe the principles of good screen.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
GAME:IT Helicopter Objectives: Review skills in making directional sprites Create objects that shoot and destroy for points Create random enemies on the.
McGraw-Hill Career Education© 2008 by the McGraw-Hill Companies, Inc. All Rights Reserved. Office Word 2007 Lab 3 Creating Reports and Tables.
GAME:IT Pinball Objectives: Review skills from Introduction Introduce gravity and friction Introduce GML coding into programming.
Why would you want to embed video & audio into the Discussion forum on a wiki?
Creating a navigation bar in Fireworks. Setting up the canvas Open Fireworks and choose a canvas size big enough to fit the buttons on you are going to.
How to Make a Power Point. How to Open Power Point Go to the bottom of the screen Click on START PROGRAMS MICROSOFT WORD PROGRAMS MICROSOFT OFFICE POWER.
Week 8 – Part 2 Page Layout Basics Key Concepts 1.
Course 5: Building 2D Stratigraphic Modeling Relationships.
Web Design Part I. Click Menu Site to create a new site root.
Cascading Style Sheets (CSS). A style sheet is a document which describes the presentation semantics of a document written in a mark-up language such.
PowerPoint Practice Assignment (Make all changes in this presentation. Do not open a new one.) Save this Tutorial (FILE – SAVE AS) to your computer as.
The Web Wizard’s Guide to HTML Chapter Three Colors, Patterns, and Inline Graphics.
CSCI 6962: Server-side Design and Programming Facelets and User Interface Design.
How to Generate an Artificial Book. Generate a page of 14-segment Using function GenerateNPage() to generate an image file contain alphabets of 14-segment.
Dreamweaver MX. 2 Tools for Code Editing (p. 366) n An HTML editor like Dreamweaver writes most of the code you need, but at times you will need to perform.
Web Design (12) CSS Introduction. Cascading Style Sheets - Defined CSS is the W3C standard for defining the presentation of documents written in HTML.
Grade 4 Science.  -Click Start  -Click Programs  -Click IHMC Cmap Tools  -Click Cmap Tools.
First Project: Dance Dance Sprite  Write a dance with your sprite (You pick or create the sprite)  Incorporate as many of the Motion Commands as you.
Transportation Agenda 165. Transportation About Pages Pages organize and present information Pages are files that end in.aspx 166.
Document Control Template Editors Brad Adamczyk Template Editor Bands Bands create document layout Header, data, footer Order not critical.
Word 2010 Headers and Footers You can make your document look professional and polished by utilizing headers and footers. The header is a section of the.
Creating a Google Site For a Digital Portfolio Purpose.
Project 02 Creating and Editing a Web Page Concept Map of Unit Creating and Editing a Web Page Key Learning Understand the elements to create a web page.
Creating Web Documents CSS examples (do more later) Lab/Homework: Read chapters 15 & 16. Work on Project 3, do postings.
Adding Fractions BY MRS. MULLER. Key Vocabulary  Numerator: The top number of the fraction (the amount out of the whole)  Denominator: The bottom number.
Making a Quiz – using graphics
4.01 Cascading Style Sheets
CSS Layouts: Positioning and Navbars
CSS Layouts: Grouping Elements
Advanced CSS BIS1523 – Lecture 20.
PowerPoint Practice Assignment (Make all changes in this presentation
September 25, 2017 Multiple Digit Multiplication Day Warm Up
Chapter 7 Page Layout Basics Key Concepts
How to Add a Reading Progress Bar in WordPress Posts? Guided By: WPGLOBALSUPPORTWPGLOBALSUPPORT.
Basics of Web Design Chapter 7 Page Layout Basics Key Concepts
CREATING POWERPOINT PRESENTATIONS
Putting Images on Your Web Page
Trees made simple in Blender
How to Make a Google Slideshow
Floating and Positioning
Lesson 3: Create an Invitation
Adding a Document to Your Report
Making a website.
Introduction to Snap Programming
COS 125 Day 5.
4.01 Cascading Style Sheets
COS 125 Day 5.
Presentation transcript:

finds BG images groups into sprites generates sprite recomputes BG pos injects into page

savings

todo reduce file and memory size increase pngcrush level reduce whitespace, better image layout don't cross 255 color boundary more logic combine repeat with non-repeat bg image short – put on top or bottom bg image narrow – put on left or right options – bg color, wiggle room sprite across multiple page

big todos foreground spriting with IMG images wrap IMG with DIV enhances progressive rendering sprite image editor add image boundary to sprite comments edit som subimages w/o effecting others ImageMe inline image optimization

thanks Jared Hirsch Bryan McQuade