Wiley Interactive Graphics

Slides:

Advertisements

Similar presentations

Layout of a Desktop Publishing Document 1.03 Demonstrate desktop publishing.

Advertisements

YEARBOOK Layout and Design.

MS-Word XP Lesson 4.

1 Cascading Style Sheets Continued Different kinds of selectors in a style sheet –Simple- Pseudo-Class –Contextual- Pseudo-Element –Class Image Styles.

กระบวนวิชา CSS. What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to.

Unit 20 - Client Side Customisation of Web Pages

Paragraph Formatting Lesson 4. Skills Matrix SKILL #MATRIX SKILL 2.1.4Format paragraphs 2.1.5Set and clear tabs 4.2.1Create tables and lists.

Part 2 Lesson 2 Review. true 1. Creating well formatted documents is important because a document’s formatting is the first thing the reader will note.

Lesson 2 — Working with Text

Exploring Microsoft Word

How to Create a Professional Magazine Layout Handout-16.

A lesson approach © 2011 The McGraw-Hill Companies, Inc. All rights reserved. a lesson approach Microsoft® PowerPoint 2010 © 2011 The McGraw-Hill Companies,

CHAPTER 11 Tables. How Are Tables Used Data Display  Very tidy and very useful Better Text Alignment  Putting text in tables allows you to format indents.

Lesson 1 EQ: What are three ways to visually organize text?

Principles of Web Design 6 th Edition Chapter 7 – Page Layouts.

ITP 104.  While you can do things like this:  Better to use styles instead:

Microsoft Word Building Block - Frequently used text saved in a gallery, from which it can be inserted quickly into a document. Clipboard - A storage.

 Every aspect of a Web Page should reflect the goals that led you to create the page in the first place. Not only should the text and graphics themselves.

 Word doc for you to download › Link at the beginning of class › 10 Questions › Answers to be added inline  Post to Sakai when completed › No resubmits.

Chapter 2 Creating Text and Gradients. Objectives Create and format text Flow text into an object Position text on a path Create colors and gradients.

Word Lesson 5-Part 1and 2. √Paragraph Alignment√Indents alignment blocked paragraph center alignment first-line indent justified alignment hanging indent.

Columns run horizontally in tables and rows run from left to right.

 Remember that HTML is just text  Need to point to pictures  Use the img tag  alt: › screen reader › REQUIRED for this class and to validate.

© 2011 Delmar, Cengage Learning Chapter 2 Creating Text and Gradients.

INTRODUCTORY Tutorial 4 Exploring Graphic Elements and Images.

Desktop Publishing Review. What is a rough sketch used in planning a layout and design?

11/12/2015 Box Model Reed Crouch. 11/12/2015  HTML elements can be considered as boxes. In CSS, the term "box model" is used when referring to layout.

© 2008 The McGraw-Hill Companies, Inc. All rights reserved. M I C R O S O F T ® Developing Presentation Text Lesson 2.

Creating Tables LESSON 6 - #1.06 ESSENTIAL STANDARD #1 - UNDERSTAND WORD PROCESSING INDICATOR #6 – CREATING TABLES.

Web Page Tables GMU-Teaching with Technology. Table Characteristics: Looks like a news page Contains columns and rows.

A lesson approach © 2011 The McGraw-Hill Companies, Inc. All rights reserved. a lesson approach Microsoft® Word 2010 © 2011 The McGraw-Hill Companies,

SPRING, 2010 Types of Formatting and Copy vs. Move.

Microsoft® PowerPoint  From the Insert tab, in the Tables group, click the Insert Table button.  Drag your pointer down and across to define.

TAUCHI-Template (Title)

A review of the overview

Laying out Elements with CSS

Exploring Microsoft Word

CSS Layouts: Grouping Elements

Exploring Microsoft Word 2000

Formatting Text and Paragraphs

Exploring Microsoft Word

Unit 2.1: Identifying design elements when preparing graphics

Layout Terms Visual Hierarchy

Chapter 6 More CSS Basics Key Concepts

Layout: Title and Content - Heading Arial 24pt. Regular

First text statement positioned here at guide intersection

Objectives Create a reset style sheet Explore page layout designs

Smart Graphic Layout TOPIC statement

Basics of Web Design Chapter 6 More CSS Basics Key Concepts

Fixed Positioning.

MORE Cascading Style Sheets (The Positioning Model)

Basics of Web Design Chapter 6 More CSS Basics Key Concepts

CSS Style Sheets: Intro

Chapter 11 Review.

Basics of Web Design Chapter 6 More CSS Basics Key Concepts

Microsoft Office XP Illustrated Introductory, Enhanced

How to use the CSS box model for spacing, borders, and backgrounds

Layout of a Desktop Publishing Document

Layout of a Desktop Publishing Document

Paragraph Formatting MOAC Lesson 4.

Paragraph Formatting MOAC Lesson 4.

Transitioning Opacity

Layout of a Desktop Publishing Document

Cascading Style Sheets

Layout Terms Visual Hierarchy

Changing the Appearance of a Worksheet

Cascading Style Sheets

Positioning Boxes Using CSS

Presentation transcript:

Wiley Interactive Graphics Guidelines 1.0

Activity Dimensions Width (fixed): 766px Height: 575px–1000px Height of the activity should be same across all the screens of the activity. Height of the activity should be determined according to the screen having maximum content.

Activity Layout - Margins Margin: 50px It is the white space around the content. It should be equal on all sides (if possible). If not possible, it should be equal on at least opposite sides. There can be exceptions for few templates. Gutter: 40px It is the white space between two columns.

Activity Layout - Spacing Internal spacing: 20px-30px It is the horizontal white space between: Text and graphic/button Graphic and graphic/button Spacing between text paragraphs is covered in typography Pop-up Should be always aligned to center of the screen. Black patch behind the pop-up should be 50% transparent.

Typography Character Paragraph Family: Source Sans Pro Size: 14px Color: #202020 Paragraph Alignment: left Space between lines: default Space between paragraphs: 7px First line indent: 25px Indentation should be used for all paragraphs except for the first.

Buttons Rectangular Circular (big) Circular (small) Hotspot Colors Height: 26px Border radius: 4px Circular (big) Border radius: 13px Circular (small) Height: 22px Border radius: 12px Hotspot Height: 26px Border radius: 13px Outline: 2px Shadow: Black: 2px 2px 4px Transparency: 0.5 Colors Normal: #007098 (fill) Rollover: #4095b4 (fill) Selected:#007098 (outline 2px) Disabled: 0.25 (transparency)