WEB PAGE ARCHITECTURE
|
|
- Letitia Griffin
- 6 years ago
- Views:
Transcription
1 The goals of webpage architecture: 1. Bring order to many types of information: text, images, links, navigation. 2. Create movement through the page. 3. Provide centers of visual interest that serve as landing spots for the eye. 4. Promote scannability.
2 One thing on a page creates a focal point. It attracts our attention. It creates a landing spot for our eyes. The starting point on any page is called the center of visual interest (CVI)
3 Two dots on a page create two landing spots for the eyes. Two dots create competition. Two dots on a page create movement. Two dots divide our attention. Two dots create an axis.
4 Two dots on a page create two landing spots for the eyes. Two dots create competition. Two dots on a page create movement. Two dots divide our attention. Two dots create an axis.
5 AXIS n An axis is a line established by two points in space. It is the simplest way to organize space. n For any publication, a natural axis is formed by the edge of the page. n Other horizontal and vertical axes divide the page into logical and useful spaces.
6 n The designer will establish horizontal and vertical design axes to divide the space. n Axes are made apparent by the columns of type, gutters and alleys. n The axes are implied rather than drawn on the page.
7 n Alleys are horizontal bands of empty space that separate page elements vertically. n Gutters are vertically bands of empty space between columns. n We refer to alleys and gutters together as internal margins.
8 n Newspapers layouts have been governed by a horizontal axis formed by the banner headline meeting with a vertical axis in a T-formation. n The vertical axis was the gutter next to the dominant element on the page. THE GRID 8
9 n This simple arrangement still is effective in contemporary design and is common in Web-page design.
10 n This simple arrangement still is effective in contemporary design and is common in Web-page design.
11 n The eye naturally seeks out patterns of organization on a page, mentally connecting the dots to form axes. The page itself suggests an axis according to its length. A photograph used correctly, with its shape fitting its content, takes advantage of this natural axis.
12 n We can use the natural lines in art to direct the eye. n In this way we help establish a visual hierarchy.
13 n Start with the Center of Visual Interest. n Find an arrangement that leads to a starting point. n This will establish a visual hierarchy. CVI
14 n Axes are crucial to good Web page design. n The sheer number of images and text elements on a Web page demand order.
15 Architecture is the division of form and space. Elements must be organized in ways that are: Coherent: The page and document must hang together and make sense as a whole. Meaningful: The pages should reveal a hierarchy or a logical progression. Functional: Page design should aid readability, navigation.
16 Success depends on the underlying structure of the page. n This structure is expressed as a grid. A grid is simply a set of intersecting lines uniformly spaced, like graph paper.
17 A grid in Web design usage also means a division of the browser window common to all pages on the site. The grid becomes the basic foundation for placing elements on the page, becomes part of the character of the page. It affects the look and the personality of the document.
18 A grid in Web design usage also means a division of the browser window common to all pages on the site. The grid becomes the basic foundation for placing elements on the page, becomes part of the character of the page. It affects the look and the personality of the document.
19 n Symmetry is the balanced distribution of equivalent forms photos, type blocks, white space, rules positioned on either side of an axis down the middle of the page. n The left side is a mirror image of the right in shape and form. DESIGN AXIS
20 n Symmetrical pages are said to have formal balance. n As the name implies, formal balance can led a dignified or conservative look to a page. DESIGN AXIS
21 n Most designers today seek an asymmetrical page. The vertical axis is placed off-center. n Asymmetrical pages are said to have informal balance. DESIGN AXIS
22 n Asymmetrical pages often have a feeling of movement. n When done correctly, the asymmetrical page will still feel unified and at rest with itself; it will feel balanced. DESIGN AXIS
23 Symmetry, or formal balance is useful when the design needs a formal or conservative look, or when equality between two things needs to be emphasized. But it doesn t have to be dull.
24 n Asymmetrical pages rely on the axis or axes to bring order and balance to the page.
25 n Hierarchy deals with the importance or significance of a form or space by its size, shape or placement. n Before any elements are positioned, the designer must study the content and decide on a hierarchy. n The design then serves the hierarchy.
26 n Research has shown that the eye is attracted first to the largest image on the page, then to the largest type as the reader seeks more information. n Thus, a large image always will dominate the hierarchy of a page. n It must be relevant to the remaining content
27 n The repetitive elements of any publication create a rhythm, a feeling of regularity. n With asymmetrical balance and a planned variation in placement, rhythm feels syncopated.
28 n Rhythm begins with the body text: line height, paragraph indents, uniform internal margins. n Careful placement of typographical devices large initials, headlines, blurbs and pull quotes will break up text. n Pictures and graphics, arranged with careful attention to internal margins, add sizzle.
29 n A page with rhythm has a natural feel, especially in sequences of items. n Uniform design for repetitive elements ties the page together even as it deviates from exact alignment.
30 n Web pages really need a carefully thought-out rhythm.
31 n Your page size is determined by monitor size and resolution. n The standard display up to about five years ago was 1,024 pixels wide by 768 pixels tall. n After subtracting for overhead, space needed for menu bars etc., the browser-safe area is about 800px by 600 px. n The browser-safe area is the first thing the visitor sees without scrolling. 768 px 600 px 1024 px 800 px
32 n Computers today have wide-screen monitors that accommodate the 16:9 screen ratio of HDTV. n The standard widescreen computer display is 1,280 pixels wide by 800 pixels tall. n A browser-save area for this screen might be 1,000px by 700px. 800 px 1280 px 1000 px 700 px
33 A web page will have different graphic-safe areas on different displays. Design for one or the other.
34 HEADER <header> ZINGER (LOGO OR IDENTITY) Home page --> Submenu --> Submenu CLARIFIER (Short statement of purpose) BREAD-CRUMB NAVIGATION MAIN CONTENT <main> SEARCH SELECT SELECT SELECT SELECT SELECT Favorite site Another favorite GO SIDEBAR or SCAN COLUMN (provides a place for added features, perhaps the echo ) <aside id="sidebar"> ACCORDION (Standard navigation represents expandable content of the site) <nav id="rollover"> FOOTER (Provenance of the site; the echo ) <footer>
35
36 HEADER NAVIGATION MAIN CONTENT SIDEBAR COLUMN FOOTER
37 RULE 1 n Consider carefully what appears above the fold. This would be the portion of the page that is visible in the first browser window without scrolling. n Design your opening page to fit key content in the browser-safe area.
38 n The browsersafe area is determined by two factors: n the minimum screen size in common use, or n the width of paper used to print Web pages. n A good measure for the screen browser-safe area is about 1,000 pixels wide by 700 pixels tall
39 n The browsersafe area for printing depends on the width of the printed page, usually 8½ inches. n A width of pixels is recommended for pages designed to be printed. n Scrolling is OK for pages meant to be printed
40 RULE 2 n If you decide to use a dominant image, it should be about twice as big in area as any other image on the page. n Contrast is apparent to the reader ONLY if it is somewhat obvious.
41 RULE 3 n Put related elements close together and separate unrelated elements. n Lines drawn between elements provide the most emphatic separation, so never put lines between related elements. n White space is the best separator.
42 RULE 4 n Use consistent internal margins. n The internal margins between related elements will be smaller than the internal margins between unrelated elements.
43 RULE 5 n Use space consistently from page to page, especially for site logos and for navigation. n Your division of space becomes part of your Web site s identity.
PAGE ARCHITECTURE Architecture Coherent: Meaningful: Functional:
PAGE ARCHITECTURE Architecture deals with form and space. Typographic elements must be organized in ways that are: Coherent: The page and the entire document must hang together make sense as a whole. Meaningful:
More informationSTONELAW HIGH GRAPHIC
GRAPHIC COMMUNICATION Technical Education THE A to Z of DTP Your knowledge of desktop publishing terminology will be expanded as you progress within the subject THE A to Z of DTP ALIGNMENT positions of
More informationDesign Principles. Advanced Higher Graphic Presentation. Professional Graphic Presentations by kind permission of
Design Principles Advanced Higher Graphic Presentation Professional Graphic Presentations by kind permission of Design Principles:- Balance Balance in Composition Three different types of balance :- *
More informationWeb Design, 5 th Edition
Planning a Successful Website: Part 2 Web Design, 5 th Edition Chapter Objectives Discuss the relationship between page length, content placement, and usability Complete Step : Specify the s navigation
More informationPage Layout Design min
1 of 8 09/11/2011 19:26 Home > Design Tips > Page Layout Design Page Layout Design 15-25 min In this tutorial, we ll explore the design phase of document creation. With the grid as our layout guide, we
More informationASMP Website Design Specifications
Page 1 ASMP Website Design Specifications Page 2 All Pages 130 pixels (background = #ffffff) 100 pixels (background = #000000) Header Bar Use logo provided in PSD file. Match size and placement. AMERICAN
More informationCOPY/PASTE: Allows any item within a document to be copied and pasted within the same document or within compatible software applications.
You will need to understand basic terms and techniques used in DTP, as well as file types used within DTP and their advantages and disadvantages. This is separate from Elements and Principles of DTP which
More informationUnit 3. Design and the User Interface. Introduction to Multimedia Semester 1
Unit 3 Design and the User Interface 2018-19 Semester 1 Unit Outline In this unit, we will learn Design Guidelines: Appearance Balanced Layout Movement White Space Unified Piece Metaphor Consistency Template
More informationCOSC 414: The Grid - Arranging Information in Space and Time. Andrew Gin
COSC 414: The Grid - Arranging Information in Space and Time Andrew Gin 0218625 1 INTRODUCTION 1 1 Introduction Visual media has existed for a long time. In order for a viewer to make sense of what is
More informationPublisher 2007 Creating Flyers and Brochures
MS Publisher 2007 User Guide Publisher 2007 Creating Flyers and Brochures THE NATURE OF DESKTOP PUBLISHING - INTRODUCTION Publisher is a desktop publishing program. You can create publications that
More informationPublisher 2007 Creating Flyers and Brochures
MS Publisher 2007 User Guide Publisher 2007 Creating Flyers and Brochures THE NATURE OF DESKTOP PUBLISHING - INTRODUCTION Publisher is a desktop publishing program. You can create publications that use
More informationGrid. Skeletal framework to organize information making it clear and optimally accessible
Grid Skeletal framework to organize information making it clear and optimally accessible Space When typographic elements introduced in space > divisions Letterform: centered=motionless; off-center > velocity;
More informationWord Tutorial 3. Creating a Multiple- Page Report COMPREHENSIVE
Word Tutorial 3 Creating a Multiple- Page Report COMPREHENSIVE Objectives Format headings with Quick Styles Insert a manual page break Create and edit a table Sort rows in a table Modify a table s structure
More information3. Formatting Documents
69 3. Formatting Documents The document format is the (highest) level of formatting for a Word document. It is important to select an attractive font and arrange the text in a balanced manner. A good page
More information2/1/2016. Discuss website usability essentials Explain principles of design Critique a website in terms of usability and design
Due Tuesday, Feb. 9 upload to Blackboard Locate five HTML (not Flash) websites you believe exhibit good web design, usability and accessibility principles. Each website s critique is worth 10 points (50
More informationDESIGNING THE PAGE FOUNDATIONS OF DIGITAL DESIGN. Layout composition, the grid and typography. Prof. Eva Machauf
DESIGNING THE PAGE Layout composition, the grid and typography FOUNDATIONS OF DIGITAL DESIGN Prof. Eva Machauf prof.machauf@gmail.com THE GRID The grid is the foundation of all design. Creating and working
More informationPAGE LAYOUT IN GRAPHIC DESIGN Where do you start when you want to create an attractive and effective design?
PAGE LAYOUT IN GRAPHIC DESIGN Where do you start when you want to create an attractive and effective design? Aims & Outcomes for this week: Aims: To understand the three main page layout conventions used
More informationPart 1 The Elements of Design. Lines
Part 1 The Elements of Design There are seven elements of graphic design that are the starting point of your design ideas: Line, Shape, Texture, Space, Size, Value and Color. Each of these elements is
More informationASSIGNMENT 5. TYPE & IMAGE POSTER LAYOUT, TYPE, IMAGE, and the use of GRID in single page layout and design.
ASSIGNMENT 5 TYPE & IMAGE POSTER LAYOUT, TYPE, IMAGE, and the use of GRID in single page layout and design. LAYOUT DEFINED 2 Organization of image, type, and other design elements to emphasize or reinforce,
More informationDesign Elements. Advanced Higher Graphic Presentation. Professional Graphic Presentations by kind permission of
Design Elements Advanced Higher Graphic Presentation Professional Graphic Presentations by kind permission of Lines can Design Element:- Line Convey a mood or an emotion. Organise the design. Establish
More informationCOMS 359: Interactive Media
COMS 359: Interactive Media Agenda Review Web Design Preview Review Tables Create html spreadsheets Page Layout Review Table Tags Numerous Attributes = border,
More informationInterface Redesign: Thomson.com
Interface Redesign: Thomson.com December 7, 2004 Anne Finlayson Interface Designer INP Associates Interface Redesign: Thomson.com page 2 Table of Contents Executive Summary... 3 Analysis of Current Interface...
More informationPage Layout Using Tables
This section describes various options for page layout using tables. Page Layout Using Tables Introduction HTML was originally designed to layout basic office documents such as memos and business reports,
More informationFundamental of Digital Media Design
Fundamental of Digital Media Design Chapter 5 Principle of Design by Noraniza Samat Faculty of Computer Systems & Software Engineering noraniza@ump.edu.my OER Fundamental of Digital Media Design by Noraniza
More informationUsing CSS for page layout
Using CSS for page layout Advantages: Greater typographic control Style is separate from structure Potentially smaller documents Easier site maintenance Increased page layout control Increased accessibility
More informationUNSW Global Website Branding Guidelines. Website Brand Guidelines
Website Brand Guidelines I Contents 1 Introduction... 1 2 Website Structure... 1 2.1 Page structure overview... 1 2.2 Home page structure... 1 2.3 Secondary page structure... 4 3 Page elements... 6 3.1
More informationINFS 2150 Introduction to Web Development
Objectives INFS 2150 Introduction to Web Development 3. Page Layout Design Create a reset style sheet Explore page layout designs Center a block element Create a floating element Clear a floating layout
More informationINFS 2150 Introduction to Web Development
INFS 2150 Introduction to Web Development 3. Page Layout Design Objectives Create a reset style sheet Explore page layout designs Center a block element Create a floating element Clear a floating layout
More informationMS Word Professional Document Alignment
MS Word Professional Document Alignment Table of Contents CHARACTER VS. PARAGRAPH FORMATTING...5 Character formatting...5 Paragraph Formatting...5 USING SHOW/HIDE TO REVEAL NON-PRINTING CHARACTERS...5
More informationDigital Media, UX-UI Design > Website Principles
Contents At a glance: Page layout header To ensure the correct appearance of our brands in a broad spectrum of applications with a web front end, uniform treatment of design elements is an absolute necessity.
More informationObjectives. Appreciate what alignment is and how it improves design. Introduce the use of grids in page design.
Alignment Objectives Appreciate what alignment is and how it improves design. Introduce the use of grids in page design. Gain a working vocabulary of typical visual elements used in newsletter and magazine
More informationLayout of a Desktop Publishing Document
Layout of a Desktop Publishing Document 1.03A Demonstrate desktop publishing. Margin Guides Margin guides are lines that indicate the space between the edge of the page and the document contents Margin
More informationChanging the Layout of a Document
LESSON 5 Changing the Layout of a Document 5.1 After completing this lesson, you will be able to: Adjust page margin settings. Set paragraph indentation and spacing. Change indents and tab settings. Insert
More informationPrinciples of Design. Alignment
Principles of Design Alignment Essential Question: How does alignment affect layout design? Can you imagine how difficult it would be to find your car in a crowded parking lot if everyone ignored the parking
More informationStyles, Style Sheets, the Box Model and Liquid Layout
Styles, Style Sheets, the Box Model and Liquid Layout This session will guide you through examples of how styles and Cascading Style Sheets (CSS) may be used in your Web pages to simplify maintenance of
More informationToday s Hall of Fame and Shame is a comparison of two generations of Google Advanced Search. This is the old interface.
1 Today s Hall of Fame and Shame is a comparison of two generations of Google Advanced Search. This is the old interface. 2 And this is the new interface. (If you can t read the image, go to http://www.google.com/advanced_search.)
More informationCreating Page Layouts 25 min
1 of 10 09/11/2011 19:08 Home > Design Tips > Creating Page Layouts Creating Page Layouts 25 min Effective document design depends on a clear visual structure that conveys and complements the main message.
More informationGood Publication Design
Good Publication Design The top ten tips for creating professional print documents How do I create a well-designed print publication? Good publication design is an art form. Attractively presenting written
More informationTable Basics. The structure of an table
TABLE -FRAMESET Table Basics A table is a grid of rows and columns that intersect to form cells. Two different types of cells exist: Table cell that contains data, is created with the A cell that
More informationMultimedia Design Guidelines MMP
Multimedia Design Guidelines MMP 100-141 Metaphor A metaphor is a figurative representation that links the content of your website to an established mental model. Using metaphors in your website allows
More informationInDesign Tools Overview
InDesign Tools Overview REFERENCE If your palettes aren t visible you can activate them by selecting: Window > Tools Transform Color Tool Box A Use the selection tool to select, move, and resize objects.
More informationORB Education Quality Teaching Resources
These basic resources aim to keep things simple and avoid HTML and CSS completely, whilst helping familiarise students with what can be a daunting interface. The final websites will not demonstrate best
More informationABOUT RESEARCH POSTERS
ABOUT RESEARCH POSTERS Research posters summarize information or research concisely and attractively to help publicize it and generate discussion. The poster is usually a mixture of a brief text mixed
More informationCHAPTER 4: MICROSOFT OFFICE: EXCEL 2010
CHAPTER 4: MICROSOFT OFFICE: EXCEL 2010 Quick Summary A workbook an Excel document that stores data contains one or more pages called a worksheet. A worksheet or spreadsheet is stored in a workbook, and
More information1. Message. I am Speculative Layout intensifies the message and the identity of the sender
1. Message 1.1. Layout intensifies the message and the identity of the sender A printed product, for instance a poster, newspaper, magazine or a VDU transmits information, firstly, through the content
More informationKnightswood Secondary School. Graphic Communication. Desktop Publishing otes. Auto Tracing
Auto Tracing The process of converting a bit mapped image into a vector image. In a bit-mapped image, each object is represented by a pattern of dots, while in a vector image every object is defined geometrically.
More informationDesktop Publishing (Word)
Desktop Publishing (Word) In addition to word processing, Microsoft Word is a suprisingly capable desktop publishing application. It is no substitute for a professional grade program like Adobe PageMaker
More informationCreating a Website Using Weebly.com (June 26, 2017 Update)
Creating a Website Using Weebly.com (June 26, 2017 Update) Weebly.com is a website where anyone with basic word processing skills can create a website at no cost. No special software is required and there
More informationName: Class: Teacher:..
Name: Class: Teacher:.. Introduction Desktop publishing (DTP) is the process of designing newspapers, magazines, books, leaflets, booklets and reports on a computer. The industry that produces these items
More information4. You should provide direct links to the areas of your site that you feel are most in demand.
Chapter 2: Web Site Design Principles TRUE/FALSE 1. Almost every Web site has at least one flaw. T PTS: 1 REF: 49 2. Not only should you plan for a deliberate look and feel for your Web site, but you must
More informationHIERARCHICAL ORGANIZATION
A clearly defined home page Navigation links to major site sections HIERARCHICAL ORGANIZATION Often used for commercial and corporate websites 1 Repetition DESIGN PRINCIPLES Repeat visual elements throughout
More informationLesson 3 Images and WordArt Basics
Lesson 3 Images and WordArt Basics Objectives Students will insert WordArt. Students will format WordArt. Students will insert clip art. Students will resize images. Students will apply compression to
More informationCS Multimedia and Communications. Lab 06: Webpage Tables and Image Links (Website Design part 3 of 3)
CS 1033 Multimedia and Communications Lab 06: Webpage Tables and Image Links (Website Design part 3 of 3) REMEMBER TO BRING YOUR MEMORY STICK TO EVERY LAB! Table Properties Reference Guide The Property
More informationMake a Website. A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1
Make a Website A complex guide to building a website through continuing the fundamentals of HTML & CSS. Created by Michael Parekh 1 Overview Course outcome: You'll build four simple websites using web
More informationFormatting a One-Page Report
FOCUS AND ENGAGE Learning Microsoft Office 2010 Word Chapter 3 283 Lesson 21 Formatting a One-Page Report What You Will Learn Analyzing Document Production Setting Margins Inserting a Section Break Setting
More informationSkill Area 323: Design and Develop Website. Multimedia and Web Design (MWD)
Skill Area 323: Design and Develop Website Multimedia and Web Design (MWD) 323.1 Design and Plan a Web site (7 hrs) 323.1.1 Web Authoring Tool 323.1.2 List and Use various features to make a Website 323.1.3
More informationDesign Principles. The Four Basic Principles That Underlie Good Page Design
Design Principles The Four Basic Principles That Underlie Good Page Design Some of the information presented in this video will appear on quizzes and exams. Please be sure to pay attention to key points
More informationComputer Applications Information Processing 1
Computer Applications Information Processing 1 Lesson 8: Organize and Arrange Content Microsoft Word 2016 IN THIS CHAPTER, YOU WILL LEARN HOW TO Reorganize document outlines. Arrange objects on the page.
More informationBoth transferring content to a template or re-formatting an existing Word document are similar in terms of time and effort.
Open the Template in MS Word You can use one of our templates as a fresh document and transfer over your text, images, and content. This guide will also help you format an existing Word document. Both
More informationWord Tutorial 4 Enhancing Page Layout and Design
Word Tutorial 4 Enhancing Page Layout and Design Microsoft Office 2013 Objectives Use continuous section break for page layout Format text in columns Insert symbols and special characters Distinguish between
More informationPART 7. Formatting Pages
PART 7 Formatting Pages In the preceding part, you learned how to format characters and paragraphs. In this part, you learn how to apply formatting that affects entire pages. You ll start with changing
More informationReference Services Division Presents. Microsoft Word 2
Reference Services Division Presents Microsoft Word 2 This handout covers the latest Microsoft Word 2010. This handout includes instructions for the tasks we will be covering in class. Basic Tasks Review
More informationFast Company Homepage This ad is very distracting and grabs the viewer attention more than the logo and navigation. It could cause the user to overloo
Competitive Review Fast Company Homepage Doing well: It has a bold and modern feel that appeals to the internet audience. Doing poorly: The layout is confusing as to which elements match up and it's unclear
More informationMSOffice WORD Microsoft Office 20 13
MSOffice WORD Microsoft Office 2013 Lesson 2: Format Content Objectives: Create headers and footers Insert and modify a table and chart Insert and manipulate Clip Art, SmartArt, and WordArt Work with a
More informationWord Processing Graphics
Class Description This class is intended for those who are comfortable with the fundamentals of word processing. It covers the use of various types of graphics to improve or clarify or just beautify the
More informationNew Perspectives on Microsoft Word Module 4: Enhancing Page Layout and Design
New Perspectives on Microsoft Word 2016 Module 4: Enhancing Page Layout and Design Objectives, Part 1 Use continuous section break for page layout Format text in columns Insert symbols and special characters
More informationdoor to my garden Simple CSS resulting in impressive, sophisticated visual effects
Patrick H. Lauke, Designer www.csszengarden.com/041 door to my garden Simple CSS resulting in impressive, sophisticated visual effects AN AVID PHOTOGRAPHER, Patrick Lauke prefers to take his own photographs
More informationEssentials for Text and Graphic Layout
5. Essentials for Text and Graphic Layout This section provides specific text and graphic guidelines that will help create a unified series of interpretive signs around Humboldt Bay. Text refers to the
More informationTypography. is the foundation of good web design
Typography is the foundation of good web design my name is Samantha Warren I am a web designer for Viget Labs I teach web & graphic design at the Center for Digital Imaging Arts at Boston University &
More informationProject 1: Creating a Web Site from Scratch. Skills and Tools: Use Expression Web tools to create a Web site
E00EW3.qxp 4/14/2007 3:17 PM Page 1 Workshops w Introduction The Workshop is all about being creative and thinking outside of the box. These workshops will help your right-brain soar, while making your
More informationSmartArt Office 2007
SmartArt Office 2007 This is not an official training handout of the, Davis School District SmartArt... 2 Inserting SmartArt... 2 Entering the Text... 2 Adding a Shape... 2 Deleting a Shape... 2 Adding
More informationIntroduction to Microsoft Word 2008
1. Launch Microsoft Word icon in Applications > Microsoft Office 2008 (or on the Dock). 2. When the Project Gallery opens, view some of the available Word templates by clicking to expand the Groups, and
More informationUsing Graphics to Enhance A PowerPoint Presentation
Using Graphics to Enhance A PowerPoint Presentation This document provides instructions for working with various types of graphics in Microsoft PowerPoint. A design rule of thumb is to include some sort
More informationCOMSC-031 Web Site Development- Part 2
COMSC-031 Web Site Development- Part 2 Part-Time Instructor: Joenil Mistal December 5, 2013 Chapter 13 13 Designing a Web Site with CSS In addition to creating styles for text, you can use CSS to create
More informationAnatomy of a Marketing
Anatomy of a Marketing Email Your Guide to Email Design and How it Can Work for You After all, Isn t Email Dead? The first email was sent in 1971. In digital marketing terms that s like a million years
More informationIt is written in plain language: no jargon, nor formality. Information gets across faster when it s written in words that our users actually use.
Web Style Guide A style guide for use for writing on Tufts Library Websites and LibGuides. Contents: 1. Web style guides for online content 2. LibGuides 2-specific style guide 3. Tisch s website-specific
More informationUnit 8. Lesson 8.1. Microsoft FrontPage. Introduction. Microsoft FrontPage-1. Microsoft FrontPage
Microsoft FrontPage Unit 8 Microsoft FrontPage Introduction Lesson 8.1 Microsoft FrontPage-1 A number of Software Packages are available in market for creating a website. Among popular software s are Dreamweaver,
More informationThe Newsletter will contain a Title for the newsletter, a regular border, columns, Page numbers, Header and Footer and two images.
Creating the Newsletter Overview: You will be creating a cover page and a newsletter. The Cover page will include Your Name, Your Teacher's Name, the Title of the Newsletter, the Date, Period Number, an
More informationUnit D Lecture Notes Word 2003
Unit D Lecture Notes Word 2003 Objectives: In this project you will learn: Set document margins Divide a document into sections Insert page breaks Insert page numbers Add headers and footers Edit headers
More informationBefore & After. Use the Principles Cheatsheet! From The Non-Designer s Design Book, Robin Williams Non-Designer s Design 8
Before & After Use the Principles Cheatsheet! From The Non-Designer s Design Book, Robin Williams Non-Designer s Design 8 Before & After From The Non-Designer s Design Book, Robin Williams Non-Designer
More informationMicrosoft Word 2007 on Windows
1 Microsoft Word 2007 on Windows Word is a very popular text formatting and editing program. It is the standard for writing papers and other documents. This tutorial and quick start guide will help you
More informationDeveloping successful posters using Microsoft PowerPoint
Developing successful posters using Microsoft PowerPoint PRESENTED BY ACADEMIC TECHNOLOGY SERVICES University of San Diego Goals of a successful poster A poster is a visual presentation of your research,
More informationDreamweaver Tutorial #2
Dreamweaver Tutorial #2 My web page II In this tutorial you will learn: how to use more advanced features for your web pages in Dreamweaver what Cascading Style Sheets (CSS) are and how to use these in
More informationHow to create a prototype
Adobe Fireworks Guide How to create a prototype In this guide, you learn how to use Fireworks to combine a design comp and a wireframe to create an interactive prototype for a widget. A prototype is a
More information> > > Portfolio Project
> > > Portfolio Project Project Info This will be a site dedicated to you, your work, and your brand. Must include: These items can be organized in whatever manner you want, but must be included: Design:
More informationWhat are the elements of website design?
Contents What is a website?...1 Why does design matter?...1 What are the elements of website design?...1 What guidelines can help direct the design?...2 What physical objects are most similar to a web
More informationA Step-by-step guide to creating a Professional PowerPoint Presentation
Quick introduction to Microsoft PowerPoint A Step-by-step guide to creating a Professional PowerPoint Presentation Created by Cruse Control creative services Tel +44 (0) 1923 842 295 training@crusecontrol.com
More informationUsing Microsoft Word. Paragraph Formatting. Displaying Hidden Characters
Using Microsoft Word Paragraph Formatting Every time you press the full-stop key in a document, you are telling Word that you are finishing one sentence and starting a new one. Similarly, if you press
More informationTypography One Project Two
Typography One Project Two Typographic Systems, Emphasis and Hierarchy An important design problem is to aid reader comprehension of information through carefully considered logic, structure and order.
More informationPROJECT THREE - EMPHASIS
PROJECT THREE - EMPHASIS INSTRUCTIONS Before you begin this assignment: 1. Read Design Basics, on the two topics of Emphasis and Color. Study the Introduction to Emphasis, the PowerPoint presentation,
More informationTechnical Case Study. Medieval Studies 1: Beginnings of English Q31207 (School of English Studies) WebCT Interface Design
Technical Case Study Medieval Studies 1: Beginnings of English Q31207 (School of English Studies) WebCT Interface Design Nuno Barradas Jorge Rich Media Group, IS Learning Team November 2007 01 1. Introduction:
More informationDesigning Research Posters. College of Art and Design Chris Jackson, Associate Dean Keli DiRisio, Assistant Professor
Designing Research Posters College of Art and Design Chris Jackson, Associate Dean Keli DiRisio, Assistant Professor Size and Orientation If you are NOT using the poster template: Start is with a 48"
More informationReaders are wary of out of date content, so it's important to actively manage the information you publish.
Web Style Guide Important tips for writing for the web People don t usually read for pleasure on the website. They are looking for a specific piece of information, and they don't want extraneous junk to
More informationMicrosoft Word
OBJECTS: Shapes (part 1) Shapes and the Drawing Tools Basic shapes can be used to graphically represent information or categories. The NOTE: Please read the Objects (add-on) document before continuing.
More informationHow to Create Greeting Cards using LibreOffice Draw
by Len Nasman, Bristol Village Ohio Computer Club If you want to create your own greeting cards, but you do not want to spend a lot of money on special software, you are in luck. It turns out that with
More informationUnit 4. Multimedia Element: Text. Introduction to Multimedia Semester 2
Unit 4 Multimedia Element: Text 2017-18 Semester 2 Unit Outline In this unit, we will learn Fonts Typography Serif, Sans Serif, Decorative Monospaced vs. Proportional Style Size Spacing Color Alignment
More informationDTP Theory Notes. Arbroath Academy - Technology Department - National 5 Graphic Communication
DTP Theory Notes What is Desktop Publishing? Desktop Publishing (DTP) is the process of using software to create different publications, e.g, magazines, brochures, posters, booklets,newspapers. Who makes
More informationThe 12 most common newsletter design mistakes
The 12 most common newsletter design mistakes www.targetmarketingnetwork.com By: Roger C. Parker Your newsletter s success depends on its design. An attractive, easy to read newsletter encourages readers
More informationPOFT 2301 INTERMEDIATE KEYBOARDING LECTURE NOTES
INTERMEDIATE KEYBOARDING LECTURE NOTES Be sure that you are reading the textbook information and the notes on the screen as you complete each part of the lessons in this Gregg Keyboarding Program (GDP).
More informationAn Introduction to Human Computer Interaction
The contents of this Supporting Material document have been prepared from the Eight units of study texts for the course M150: Date, Computing and Information, produced by The Open University, UK. Copyright
More information