McMaster Brand Standard for Websites
|
|
- Derrick Golden
- 6 years ago
- Views:
Transcription
1 McMaster University s policy calls for all university websites to follow its brand standard. McMaster websites share common elements, presentation and behavior and a consistent design, enabling visitors to navigate seamlessly from site to site within the McMaster domain. The McMaster University website provides a model for all mcmaster.ca sites. Templates for developing sites can be downloaded from: Which areas are required to use the brand standard? 1. ALL OF THE FOLLOWING AREAS ARE REQUIRED TO USE THE BRAND STANDARD FOR WEB SITES: All university administrative areas All Faculty, School, Institute and program sites All department and division sites and all centres within the departments and divisions All sites using the mcmaster domain Page 1 of 12
2 2. THE FOLLOWING AREAS ARE ENCOURAGED BUT NOT REQUIRED USE THE BRAND STANDARD FOR WEB SITES: Individual faculty member sites 3. THE FOLLOWING AREAS ARE NOT ALLOWED TO USE THE BRAND STANDARD FOR WEB SITES: Student and other sites not affiliated with or approved by the University or the McMaster Students Union Any site that is not affiliated with the University. What elements must remain common across all websites? A McMaster website may be divided into the following five areas: header (including the McMaster logo), top navigation bar, left navigation bar, content area and footer. Page 2 of 12
3 Page Specifications 1. Page Dimensions Width: 945 pixels fixed Height: variable 2. Layout The new design uses <div> containers instead of tables to layout pages Tables are used only to contain tabular information 3. Text Font-family: Specify Verdana as the primary font. If Verdana is not available on the user s computer, then specify Ariel as the second choice, Helvetica as the third, and sans-serif as the default CSS font-family: Verdana, Arial, Helvetica, sans-serif Do not change the order of the attribute for font-family in the stylesheet. For example, Arial is not allowed to be the primary font Do not use other fonts Font-sizes: Allow user s browser to set initial font size and specify font sizes relative to the initial size Colours: Use approved colour palette below. Do not use other colours 4. Graphics Colours: Use approved colour palette below Use CSS to create borders and graphical elements whenever possible instead of using image files. Use borders and horizontal rules to separate content sections. Light gray (#CCCCCC) and maroon red (#990033) are preferred for borders and horizontal rules 5. Page backgrounds and borders Do not use background colours or background images for the page body Do not use borders around the page body 6. Images Page 3 of 12
4 Colour photography is to be used Photography should look natural and candid, not posed Photographs taken on campus and university subjects are preferred over stock photography Panoramic photographs or images are encouraged for home pages and may also be used on other pages. The dimensions are 776 pixels wide and from 200 to 287 pixels high The subjects of photographs are intensely engaged in what they are doing and, when possible, working together towards a goal With static subject matter, focus on foreground elements or subjects, creating depth and visual interest. Subjects should be actively involved in an activity or discussion When possible, subjects should be focusing on an object or tool Photographs of campus buildings should include people and activity to show community Departments are encouraged to create photos reflecting consistent University themes Limited use of photo animation refreshing photos in a clean and simple way is permitted. Broken images and complex animation are not appropriate Photo Gallery It is important to demonstrate real innovation and collaboration within the McMaster community. You may select images from the McMaster Photo Gallery: Page 4 of 12
5 Colour Palette Specifications The selected palette is comprised of a range of tones that are drawn from the primary school colours to form a primary and secondary palette. The tertiary colour palette allows the addition of colours to enrich the University as a whole. These colours should be used only as an accent to the primary and secondary palette. Primary Colours Dark Gray Web Code: # Secondary Colours Maroon Red Web Code: # Black Web Code: # Medium Gray Web Code: # Tertiary Colours Light Gray Web Code: #CCCCCC Yellow Web Code: #FFCC33 Blue Web Code: # Page 5 of 12
6 Header Specifications 1. Header to be the same as on the main McMaster website. 2. McMaster logo, text and links are the same on all websites. 3. Only the optional radio button under search may be customized in the header for each website. 4. Dimensions Width: 945 pixels Height: 160 pixels 5. McMaster logo Located in the top left corner Where is the image file for the McMaster logo? Download the McMaster logo from the main McMaster website: 6. Maroon bar Located in top right corner Colour: maroon red (code #990033) Width: 500 pixels Height: 8 pixels 7. Links to MUGSI and the Faculty and Staff Directory are in the left section under the maroon bar. Text for links: Colour: black (code #000000) Font-family: Arial, Helvetica, sans-serif Font-size: 0.63em Font-weight: bold 8. Quick Links Contain the same links as on the main McMaster website. Located below the right maroon red bar in the right section Font-family: Verdana, Arial, Helvetica, sans-serif Page 6 of 12
7 Colour: black (code #000000) Label Font-size: 0.69em Font-weight: bold Text Box Font-size: 10 pixels Font- weight: normal 9. Search Located below the Quick Links in the right section The search box has the ability to search the entire McMaster domain (i.e., The main McMaster website uses a Google Customizable Search Engine that is available for all websites to use Search label: Colour: black (code #000000) Font-family: Verdana, Arial, Helvetica, sans-serif Font-size: 0.69em Font-weight: bold Search text box: Font-size: 10 pixels Font- weight: normal Search radio buttons (optional) Located below search label and text box Allow users to more specifically target the search. The first radio button searches the entire mcmaster.ca domain, the second searches the website within the domain, and optionally, a third may be used to search a specified section of the website or another website within the domain. Colour: black (code #000000) Font-family: Verdana, Arial, Helvetica, sans-serif Font-size: 0.90em Font-weight: bold Page 7 of 12
8 Top Navigation Bar Specifications 1. The header has the following dimensions: Width: 941 pixels Height: 33 pixels 2. All university administrative sites and faculty sites must use the McMaster global navigation in the top navigation bar. 3. All other areas may choose to use the top navigation bar as their primary site navigation or use the McMaster global navigation. 4. The text for the links have the following characteristics: Font family: Verdana, Arial, Helvetica, sans-serif. Font size: 12 pixels Font weight: bold Colour: white (code #FFFFFF) Background: maroon red (code: #990033) Background on hover: dark gray (code #666666) 5. When the cursor hovers over a parent link in the top of the top navigation bar, a submenu may optionally drop down. 6. When the cursor hovers over a link in a submenu, a second sub-menu may optionally drop down. 7. Do not use more than three levels in the top navigation bar. 8. All drop downs use the same text characteristics defined for the parent link in the top navigation bar except that a dark gray (code #666666) border separates each drop down menu item. 9. All drop downs are left-justified under its parent link, except if the drop down would go over the right edge of the page, in which case the drop down is rightjustified under its parent link Page 8 of 12
9 Left Navigation Bar Specifications 1. Dimensions: Width: 169 pixels Height: variable Top margin: 10 pixels Bottom margin: 10 pixels Padding right: 25 pixels 2. Text (first level of menu) Font-family: Arial, Helvetica, sans-serif Font-size: 0.75em Font-weight: normal Colour (on mouse out): black Colour (on hover): maroon red Padding right: 3 pixels 3. All university administrative sites and faculty sites use the left navigation bar as the primary navigation for the site. 4. If other areas choose to use the top navigation bar as their primary navigation, then the left navigation bar may be used for secondary navigation. 5. Drop downs, where needed, appear after parent link is clicked. 6. Do not use more than three levels in the left navigation bar. 7. Text (second level of menu) Font-family: Verdana, Arial, Helvetica, sans-serif Font-size: 0.91em Font-weight: normal Colour (on mouse out): maroon red Colour (on hover): black Padding right: 6 pixels 8. Text (third level of menu) Font-family: Verdana, Arial, Helvetica, sans-serif Font-size: 1em Font-weight: normal Colour (on mouse out): black Colour (on hover): maroon red Padding right: 6 pixels Page 9 of 12
10 Content Area Specifications 1. Dimensions Width: 776 pixels Height: variable 2. Text Font family: Verdana, Arial, Helvetica, sans-serif. Page 10 of 12
11 Footer Specifications 1. Footer to be the same as on the main McMaster website. All text and links are the same on all websites. 2. Do not put other information in the footer. For example, do not put another copyright or contact information for your department in the footer. Locate this information elsewhere within the content of the site. 3. Dimensions Width: 945 pixels Height: 43 pixels Top Margin: 20 pixels Top border: 3 pixels Top border colour: light grey Top Padding: 10 pixels 4. Text McMaster copyright, address and phone number separated by vertical bars Font family: Arial, Helvetica, sans-serif. Font-size:.69em; Font-weight: bold Colour: dark gray 5. Links Contact Us page URL: Terms of Use & Privacy Policy page URL: Font family: Arial, Helvetica, sans-serif. Font-size:.69em; Font-weight: bold Colour: dark gray Colour (on mouse out): dark gray Colour (on hover): maroon red Page 11 of 12
12 Other Specifications 1. No advertising is permitted on any web pages. No names or links of external contractors work on websites are permitted. Software names are also not permitted. 2. All websites should render in the following browsers: Internet Explorer versions 6.0 and 7.0 Firefox 2.0 Safari 2, 3, 4 Page 12 of 12
UNSW 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 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 informationTo illustrate how to set TAG styles the <body> and <h1> tags (for the BODY and the HEADING 1 styles) will be adjusted.
Chapter The formatting of CSS pages is carried out by setting the required styles. There are four different types of styles: Class which are custom styles that you create. You did this in Chapter 12. Tag
More informationLayout with Layers and CSS
Layout with Layers and CSS Today we're going to make a Web site layout. Preparatory Step 1. Inside your folder create a new folder and name it layout. 2. Inside the layout folder create a new folder and
More informationQUICK START GUIDE FOR CLUB WEBSITES
QUICK START GUIDE FOR CLUB WEBSITES Introduction Quick Start Guide for Club Websites For more than 100 years, Rotary has united leaders committed to applying their expertise to better their communities.
More informationJen Smith Photography Website Proposal
Jen Smith Photography Website Proposal Revision 1.1 April 16, 2006 Prepared by Jenni Smith of ABC Web Design Rev. 1.1 1 of 12 Table of Contents Project... 3 Stakeholders... 3 End-Users... 3 Content...
More informationWEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5
WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 3 Key Concepts 1 LEARNING OUTCOMES In this chapter, you will learn how to... Describe the evolution of style sheets from print media to the Web List
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 informationFRESNO STATE. Web Publishing STYLE GUIDE
FRESNO STATE Web Publishing STYLE GUIDE Web Style Guide Table of Contents INTRODUCTION Fresno State Web Publishing Guidelines Resources Quick Start Web Design Template Kits Quick Start Banner Design Catalog
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 informationHow to lay out a web page with CSS
Activity 2.6 guide How to lay out a web page with CSS You can use table design features in Adobe Dreamweaver CS4 to create a simple page layout. However, a more powerful technique is to use Cascading Style
More informationCreating Forms. Starting the Page. another way of applying a template to a page.
Creating Forms Chapter 9 Forms allow information to be obtained from users of a web site. The ability for someone to purchase items over the internet or receive information from internet users has become
More informationCSS: The Basics CISC 282 September 20, 2014
CSS: The Basics CISC 282 September 20, 2014 Style Sheets System for defining a document's style Used in many contexts Desktop publishing Markup languages Cascading Style Sheets (CSS) Style sheets for HTML
More informationThe Deerbrook Web Style Guide
The Deerbrook Web Style Guide Table of Contents Introduction Agency Dashboard 2 Customer Data Window 3 Creative Brief Page Structure Agency Dashboard 5 Customer Data Window 7 Typography Color Photography
More informationSession 3.1 Objectives Review the history and concepts of CSS Explore inline styles, embedded styles, and external style sheets Understand style
Session 3.1 Objectives Review the history and concepts of CSS Explore inline styles, embedded styles, and external style sheets Understand style precedence and style inheritance Understand the CSS use
More informationICT IGCSE Practical Revision Presentation Web Authoring
21.1 Web Development Layers 21.2 Create a Web Page Chapter 21: 21.3 Use Stylesheets 21.4 Test and Publish a Website Web Development Layers Presentation Layer Content layer: Behaviour layer Chapter 21:
More informationWeb Style Guide. Version 2.0
Web Style Guide Version 2.0 Document Overview Reflecting Ryerson s new visual identity, Ryerson's Web Style Guide is a tool to create visual consistency and simplicity across all Ryerson websites. This
More informationIntroduction to Web Design CSS Reference
Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:
More informationIntroduction to Web Design CSS Reference
Inline Style Syntax: Introduction to Web Design CSS Reference Example: text Internal Style Sheet Syntax: selector {property: value; Example:
More informationTaking Fireworks Template and Applying it to Dreamweaver
Taking Fireworks Template and Applying it to Dreamweaver Part 1: Define a New Site in Dreamweaver The first step to creating a site in Dreamweaver CS4 is to Define a New Site. The object is to recreate
More informationKSB Online-Styleguide
KSB Online-Styleguide Guide Stand Version November August 204 203 Design guidelines for online presence 2 In addition to print media, KSB also has an online presence. This style guide documents the main
More informationWeb Development & Design Foundations with HTML5
Web Development & Design Foundations with HTML5 KEY CONCEPTS Copyright Terry Felke-Morris 1 Learning Outcomes In this chapter, you will learn how to... Describe the evolution of style sheets from print
More informationUNIVERSITY OF CAMBRIDGE INTERNATIONAL EXAMINATIONS International General Certificate of Secondary Education
*0000000000* UNIVERSITY OF CAMBRIDGE INTERNATIONAL EXAMINATIONS International General Certificate of Secondary Education INFORMATION TECHNOLOGY 0418/03 Paper 3 Practical Test October/November 2008 2 hours
More informationWeb Development & Design Foundations with HTML5
1 Web Development & Design Foundations with HTML5 CHAPTER 3 CSS BASICS Copyright Terry Felke-Morris 2 Learning Outcomes In this chapter, you will learn how to... Describe the evolution of style sheets
More informationWeb Design. Santa Barbara. Dreamweaver Spry Menu Modifications
Web Design Santa Barbara Dreamweaver Spry Menu Modifications Scott Nelson Web Design Santa Barbara www.webdesignsb.com Updated Table of Contents Introduction... 3 Default Spry Menu... 3 Top-Level Menu
More informationFor web design questions, please contact: Christopher McComas Manager, Web Communications
WEB DESIGN GUIDE For web design questions, please contact: Christopher McComas Manager, Web Communications 304-696-5720 chris.mccomas@marshall.edu MARSHALL UNIVERSITY BRAND GUIDELINES WEB DESIGN GUIDE
More informationGetting Started with Eric Meyer's CSS Sculptor 1.0
Getting Started with Eric Meyer's CSS Sculptor 1.0 Eric Meyer s CSS Sculptor is a flexible, powerful tool for generating highly customized Web standards based CSS layouts. With CSS Sculptor, you can quickly
More informationCascading Style Sheets (CSS)
Cascading Style Sheets (CSS) Mendel Rosenblum 1 Driving problem behind CSS What font type and size does introduction generate? Answer: Some default from the browser (HTML tells what browser how)
More informationWeb Style Guide. May 15, 2010
2667 N. 2667 Washington N Washington Blvd. Blvd. North Ogden, Odgen, Utah 84654 84414 801-416-2136 801-782-3920 www.castlecreekpd.com email: info@castlecreekpd.com Web Style Guide May 15, 2010 This is
More informationIf you are using WordPress, please refer to the UH West O ahu WordPress Guide for more information.
UHWO Web Graphic Standards Other documents to review: UH System Graphic Standards: http://www.hawaii.edu/offices/eaur/graphicsstandards.pdf UH System Style Guide: http://www.hawaii.edu/offices/eaur/styleguide-2015.pdf
More informationCSS Selectors. element selectors. .class selectors. #id selectors
CSS Selectors Patterns used to select elements to style. CSS selectors refer either to a class, an id, an HTML element, or some combination thereof, followed by a list of styling declarations. Selectors
More informationWelcome to The Nova Scotia Government. Website Template
Welcome to The Nova Scotia Government Website Template Why a new web template? The new Nova Scotia Government website template is designed to help you maintain or create your government web pages. If right
More informationMoore Stephens digital guidelines
Moore Stephens International PRECISE. PROVEN. PERFORMANCE. Contents Introduction 1 Typography 2 Colour palette 3 Logo and mast 4 Buttons, icons & tags 5 Images 7 Navigation 8 Rolling banner 10 Widgets
More informationFLEET LOGO USAGE AND STANDARDS INNOVA BRANDING STANDARDS 2015 GUIDE
FLEET LOGO USAGE AND STANDARDS INNOVA BRANDING STANDARDS 2015 GUIDE INNOVA BRANDING STANDARDS 2015 GUIDE 2 TABLE OF CONTENTS The Innova Brand 3 Branding Elements Logo Colors Typography 4 8 10 INNOVA BRANDING
More informationBrand Guidelines. version
Brand Guidelines version 2017.1 Primary Logo The OPSWAT logo is a universal signature spanning all of our communications. Because it is such a recognizable and highly visible asset, it s important that
More informationWeb Recruitment Module Customisation
Web Recruitment Module Customisation Introduction The People Inc. Web Recruitment add-on enables users to publish details of vacancies on their web site. This information is integrated seamlessly into
More informationCNOOC Nexen Employer Brand Guidelines. A New Energy
CNOOC Nexen Employer Brand Guidelines A New Energy Corporate Colours The primary colour palette is used in the logo. The extended colour palette is built with a range of blues to create a spectrum that
More informationIntroduction to WEB PROGRAMMING
Introduction to WEB PROGRAMMING Web Languages: Overview HTML CSS JavaScript content structure look & feel transitions/animation s (CSS3) interaction animation server communication Full-Stack Web Frameworks
More informationINFORMATION AND COMMUNICATION TECHNOLOGY 0417/03. Paper 3 Data Analysis and Website Authoring For examination from 2020
Cambridge IGCSE INFORMATION AND COMMUNICATION TECHNOLOGY 0417/03 Paper 3 Data Analysis and Website Authoring For examination from 2020 SPECIMEN PAPER 2 hours 30 minutes *0123456789* You will need: Candidate
More informationWanted! Introduction. Step 1: Styling your poster. Activity Checklist. In this project, you ll learn how to make your own poster.
Wanted! Introduction In this project, you ll learn how to make your own poster. Step 1: Styling your poster Let s start by editing the CSS code for the poster. Activity Checklist Open this trinket: jumpto.cc/web-wanted.
More information- The CSS1 specification was developed in CSSs provide the means to control and change presentation of HTML documents
3.1 Introduction - The CSS1 specification was developed in 1996 - CSS2 was released in 1998 - CSS3 is on its way - CSSs provide the means to control and change presentation of HTML documents - CSS is not
More informationCSS worksheet. JMC 105 Drake University
CSS worksheet JMC 105 Drake University 1. Download the css-site.zip file from the class blog and expand the files. You ll notice that you have an images folder with three images inside and an index.html
More informationDreamweaver CS3 Lab 2
Dreamweaver CS3 Lab 2 Using an External Style Sheet in Dreamweaver Creating the site definition First, we'll set up the site and define it so that Dreamweaver understands the site structure for your project.
More informationDesigning Posters TIDI Development Research Week
Designing Posters TIDI Development Research Week Derina Johnson PhD Candidate, School of Social Work and Social Policy DSAI Steering Committee Postgraduate Representative Date 1 st November 2017 Today
More informationStyle Sheet Reference Guide
Version 8 Style Sheet Reference Guide For Password Center Portals 2301 Armstrong St, Suite 2111, Livermore CA, 94551 Tel: 925.371.3000 Fax: 925.371.3001 http://www.imanami.com This publication applies
More informationZen Garden. CSS Zen Garden
CSS Patrick Behr CSS HTML = content CSS = display It s important to keep them separated Less code in your HTML Easy maintenance Allows for different mediums Desktop Mobile Print Braille Zen Garden CSS
More informationBrand Overview COLORS / FONTS / LOGOS rd Street, Suite 210 Denver, CO communityengineeringcorps.org
Brand Overview COLORS / FONTS / LOGOS 1031 33rd Street, Suite 210 Denver, CO 80205 720 204-3194 Color Palette PRIMARY COLORS PRIMARY PALETTE For most situations, it is important to utilize the two main
More informationQuick Start Guide for Club Websites
Quick Start Guide for Club Websites Introduction Quick Start Guide for Club Websites For more than 100 years, Rotary has united leaders committed to applying their expertise to better their communities.
More informationWhile editing a page, a menu bar will appear at the top with the following options:
Page Editor ===> Page Editor How Can I Use the Page Editor? The Page Editor will be your primary way of editing your website. Page Editor Basics While editing a page, you will see that hovering your mouse
More informationCSS. https://developer.mozilla.org/en-us/docs/web/css
CSS https://developer.mozilla.org/en-us/docs/web/css http://www.w3schools.com/css/default.asp Cascading Style Sheets Specifying visual style and layout for an HTML document HTML elements inherit CSS properties
More informationVisual Style Guide. February 2014
Visual Style Guide February 2014 Contents Introduction to the MC&FP Logo 3 Safe Area and Size 4 Incorrect Usage 5 Color Palette 6 Typography 7 Tone and Style of Photography 8 Print Examples 9 Screen Examples
More informationWelcome Please sit on alternating rows. powered by lucid & no.dots.nl/student
Welcome Please sit on alternating rows powered by lucid & no.dots.nl/student HTML && CSS Workshop Day Day two, November January 276 powered by lucid & no.dots.nl/student About the Workshop Day two: CSS
More informationCOMP519 Web Programming Lecture 8: Cascading Style Sheets: Part 4 Handouts
COMP519 Web Programming Lecture 8: Cascading Style Sheets: Part 4 Handouts Ullrich Hustadt Department of Computer Science School of Electrical Engineering, Electronics, and Computer Science University
More informationFrontPage 2000 Tutorial -- Advanced
FrontPage 2000 Tutorial -- Advanced Shared Borders Shared Borders are parts of the web page that share content with the other pages in the web. They are located at the top, bottom, left side, or right
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 information<body bgcolor=" " fgcolor=" " link=" " vlink=" " alink=" "> These body attributes have now been deprecated, and should not be used in XHTML.
CSS Formatting Background When HTML became popular among users who were not scientists, the limited formatting offered by the built-in tags was not enough for users who wanted a more artistic layout. Netscape,
More informationLOGO CONFIGURATION. The tag line Because Nutrition Matters TM. shall only be alinged to the right hand size of the logo.
BRAND USAGE GUIDE LOGO CONFIGURATION The Jaylor word mark is the most visible component of the overall brand identity. The primary lockup consists of two parts: the Jaylor word mark set in the type family
More informationGoldfish 4. Quick Start Tutorial
Goldfish 4 Quick Start Tutorial A Big Thank You to Tobias Schilpp 2018 Fishbeam Software Text, Graphics: Yves Pellot Proofread, Photos: Tobias Schilpp Publish Code: #180926 www.fishbeam.com Get to know
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 informationWeb Structure and Style. MB2030 Section 2 Class 4
Web Structure and Style MB2030 Section 2 Class 4 Web Site Hierarchies The Structure of the Web How the Internet Works Computers connected to the Web are called clients and servers. A simplified diagram
More information8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives (1 of 2) Learning Objectives (2 of 2)
Web Development & Design Foundations with HTML5 Ninth Edition Chapter 3 Configuring Color and Text with CSS Slides in this presentation contain hyperlinks. JAWS users should be able to get a list of links
More informationUNC Eshelman School of Pharmacy
UNC Eshelman School of Pharmacy Brand Guide FINAL Typography The primary typeface is Fira Sans (Hair, Extra Light, Book, Bold, Extra Bold as well as matching italic equivalents). This has been carefully
More informationWeb Development & Design Foundations with HTML5
1 Web Development & Design Foundations with HTML5 CHAPTER 5 WEB DESIGN Copyright Terry Felke-Morris 2 Learning Outcomes In this chapter, you will learn how to... Describe the most common types of website
More informationTouchCMA Branding Options. Give your newest tech tool a makeover with your company s look and feel!
TouchCMA Branding Options Give your newest tech tool a makeover with your company s look and feel! Why Does Your Brand Matter? Your brand is your identity. It distinguishes you and your agents from a sea
More informationMYGOV.SCOT ASSETS. Design Guide for Developers
MYGOV.SCOT ASSETS Design Guide for Developers Contents Click on the options below for further information: Typography The mygov.scot font is Roboto, this is an open source, licence free font which can
More informationCSS. Shan-Hung Wu CS, NTHU
CSS Shan-Hung Wu CS, NTHU CSS Zen Garden 2 Outline The Basics Selectors Layout Stacking Order 3 Outline The Basics Selectors Layout Stacking Order 4 Grammar selector { property: value; 5 Example /* for
More informationOLIN BAJA Brand Guidelines
OLIN BAJA Brand Guidelines Brand manual for maintaining consistent visual communication and identity OLIN BAJA Olin College of Engineering 2016-2017 OLINBAJA Olin Baja s Mission Engage students in a long-term,
More informationFIFA.com Graphic Guidelines
FIFA.com Graphic Guidelines issue #1 2008 Copyright 1994-2008 FIFA. All rights reserved. www.fifa.com Contents FIFA.com Graphic Guidelines Pages Layout Slicing General Color Code Picture Sizes Font Slot
More informationDear Candidate, Thank you, Adobe Education
Dear Candidate, In preparation for the Web Communication certification exam, we ve put together a set of practice materials and example exam items for you to review. What you ll find in this packet are:
More informationCorporate Identity Guidelines
Corporate Identity Guidelines CONTENTS 1.0 TRADEMARK Watco Companies Logo Logo Clear Space Logo Variations Project Logos Proper Logo Use 03 04 05 06 07 08 2.0 TYPOGRAPHY Type Family 3.0 COLOR Brand Color
More informationBefore you begin, make sure you have the images for these exercises saved in the location where you intend to create the Nuklear Family Website.
9 Now it s time to challenge the serious web developers among you. In this section we will create a website that will bring together skills learned in all of the previous exercises. In many sections, rather
More informationGRAPHIC S TANDARDS M ANUAL
GRAPHIC S TANDARDS M ANUAL 9 x12 Folder PENN-HARRIS-MADISON GRAPHIC STANDARDS THE BRAND A BRAND IS MORE THAN JUST A LOGO. It is a consistent look. It is a consistent feel. It is a consistent voice. Founded
More informationAdmin. Midterm 1 on. Oct. 13 th (2 weeks from today) Coursework:
Midterm 1 on Admin Oct. 13 th (2 weeks from today) Coursework: E1 grade released: please see Karoon (TA) at his office hours (Tues at 12-1pm) E2 due tomorrow E3 posted yesterday; due this Friday 11:59pm
More informationVisual Standards Manual
Visual Standards Manual fredonia.edu/brand 2 MISSION Fredonia enriches the world through academic scholarship, artistic expression, community engagement, and entrepreneurship. The university challenges
More informationPUBLISHER SPECIFIC CSS RULES
PUBLISHER SPECIFIC CSS RULES Solita Oy Helsinki Tampere Oulu 26.1.2016 2 (24) Document History Version Date Author Description 0.1 August 17, 2015 J. Similä First draft 0.2 January 26, 2015 A. Autio Fixed
More informationVisual Identity Manual
Visual Identity Manual 2015 v1 February 2015 Visual Identity Manual - 2015 Table of Contents Introduction... 1 European Youth Week 2015visual identity... 2 Verbal branding... 2 Colour... 3 Size and shape...
More informationCambridge International Examinations Cambridge International General Certificate of Secondary Education
Cambridge International Examinations Cambridge International General Certificate of Secondary Education *9248013325* INFORMATION AND COMMUNICATION TECHNOLOGY 0417/32 Paper 3 Data Analysis and Website Authoring
More informationGCU Students Association Brand Guidelines
GCU Students Association Brand Guidelines December 2014 Our Identity It is essential for our organisation to deliver its corporate identity in a coherent manner at all times. The brand is the focal point
More informationMINI BRAND GUIDELINES
MINI BRAND GUIDELINES 9.18.17 TABLE OF CONTENTS SECTION 1 Introduction 3 SECTION 4 The Hamline Logo(s) & Seal 5 SECTION 5 Colors 16 SECTION 6 Typography 20 Questions about how to use this brand guide?
More informationWhite Paper April Using Cascading Style Sheets (CSS) with AR System 6.x
April 2004 Using Cascading Style Sheets (CSS) with AR System 6.x Copyright 2004 BMC Software, Inc. All rights reserved. Remedy, the Remedy logo, all other Remedy product or service names, BMC Software,
More informationTABLE OF CONTENTS. NAVIGATION & USABILITY 8 Navigation 9 Links 10 Buttons 10 Tabs 10 Search Boxes 11 Log Ins
the rockefeller university hospital CENTER FOR CLINICAL AND TRANSLATIONAL SCIENCE Web graphic standards manual INTRODUCTION The Rockefeller University Hospital s visual identity was created in early 2012
More informationICT IGCSE Practical Revision Presentation Web Authoring
21.1 Web Development Layers 21.2 Create a Web Page Chapter 21: 21.3 Use Stylesheets 21.4 Test and Publish a Website Web Development Layers Presentation Layer Content layer: Behaviour layer Chapter 21:
More informationUsing Advanced Cascading Style Sheets
HTML 7 Using Advanced Cascading Style Sheets Objectives You will have mastered the material in this chapter when you can: Add an embedded style sheet to a Web page Change the body and link styles using
More informationCMPT 165 INTRODUCTION TO THE INTERNET AND THE WORLD WIDE WEB
CMPT 165 INTRODUCTION TO THE INTERNET AND THE WORLD WIDE WEB Unit 3 Cascading Style Sheets (CSS) Slides based on course material SFU Icons their respective owners 1 Learning Objectives In this unit you
More informationBrand Guidelines HOAR PROGRAM MANAGEMENT. All rights reserved. Copyright 2014.
Brand Guidelines 2014 0.1 Table of Contents Table of Contents 0.1 Contact Information Hoar Program Management Andi Sims Marketing Director asims@ (205) 423-2395 (office) (205) 213-7955 (cell) 1.0 Introduction
More informationDreamweaver CS5 Lab 2
Dreamweaver CS5 Lab 2 Using an External Style Sheet in Dreamweaver Creating the site definition First, we'll set up the site and define it so that Dreamweaver understands the site structure for your project.
More informationControlling Appearance the Old Way
Webpages and Websites CSS Controlling Appearance the Old Way Older webpages use predefined tags - - italic text; - bold text attributes - Tables (and a few other elements) use specialized
More informationGraphic Standards. Bethany uses three font families for the creation of signage, letterhead, marketing and other communication materials:
I. Introduction No asset is more valuable to an institution than its image and reputation. A well-defined and consistent identity is crucial to achieving the highest possible awareness and relationship
More informationLOGO & BRAND STANDARDS GUIDE
LOGO & BRAND STANDARDS GUIDE INTRODUCTION The SparkPost Brand Standards Guide provides key information needed to accurately and consistently produce external and internal documents and communications.
More informationResponsive Grid. Grid Variations. Built with responsive 12 column grid, layouts and components. LOGO HEADER IMAGE SECONDARY NAVIGATION FOOTER
WEB STYLE GUIDE School of Medicine Styleguide LAYOUT Responsive Grid Built with responsive 12 column grid, layouts and components. Grid Variations One Column LOGO HEADER IMAGE SECONDARY NAVIGATION FOOTER
More informationINTRODUCTION TO CSS. Topics MODULE 5
MODULE 5 INTRODUCTION TO CSS Topics > Cascading Style Sheets (CSS3) Basics Adding a Style Sheet Selectors Adding Dynamic Styles to Elements CSS3 Properties CSS3 Box Model Vendor Prefixes Cascading Style
More informationCreating Layouts Using CSS. Lesson 9
Creating Layouts Using CSS Lesson 9 CSS Page Layout Advantages Greater typography control Style is separate from structure Potentially smaller documents Easier site maintenance Increased page layout control
More informationStyle Sheet Reference Guide
Version 8 Style Sheet Reference Guide For Self-Service Portal 2301 Armstrong St, Suite 2111, Livermore CA, 94551 Tel: 925.371.3000 Fax: 925.371.3001 http://www.imanami.com This publication applies to Imanami
More informationWeb Design and Development Tutorial 03
Table of Contents Web Design & Development - Tutorial 03... 2 Using and Applying CSS to XHTML... 2 Conventions... 2 What you need for this tutorial... 2 Common Terminology... 3 Parent / Child Elements...
More informationProduct Page PDF Magento Extension
Product Page PDF Magento Extension User Manual This is the user manual of Magento Product Page PDF v2.0.2 and was last updated on 26-11-2017. To see what this extension can do, go to the Magento Product
More informationCAMBRIDGE INTERNATIONAL EXAMINATIONS International General Certificate of Secondary Education INFORMATION TECHNOLOGY
CAMBRIDGE INTERNATIONAL EXAMINATIONS International General Certificate of Secondary Education INFORMATION TECHNOLOGY 0418/04 Paper 4: Practical Test October/November 2003 Additional Materials: Candidate
More informationIDENTITY SYSTEM GUIDELINES
IDENTITY SYSTEM GUIDELINES Whether you re starting out, moving up or starting again WE RE READY WHEN YOU ARE August 2014. Version 1.5 Contents 02 CONTENTS 03 Our brand 04 Our Identity 04 Our logo 05 Logo
More informationBRAND BURNER DESIGN AND CONTROL GUIDELINES
BRAND BURNER DESIGN AND CONTROL GUIDELINES prepared by gobrandgo! Oct. 2016 version 1.0 CONTENTS LOGO IDENTITY All Allowed Logo Versions BRAND COLORS Primary & Secondary Color Variations 03 05 BRAND TYPE
More informationCascading Style Sheet Quick Reference
Computer Technology 8/9 Cascading Style Sheet Quick Reference Properties Properties are listed in alphabetical order. Each property has examples of possible values. Properties are not listed if they are
More informationA Graphic Standards Guide for Southlake Regional Health Centre
Connecting with the Southlake Brand A Graphic Standards Guide for Southlake Regional Health Centre 1.0 A Special Message from the President and CEO 2.0 Logo Overview 2.1 Logo Variations (Standard) 2.2
More information