DESIGN GUIDELINES FOR GENER8 WEBSITES

Save this PDF as:
 WORD  PNG  TXT  JPG

Size: px
Start display at page:

Download "DESIGN GUIDELINES FOR GENER8 WEBSITES"

Transcription

1 ONLINE COMMUNICATION SERVICES FACTSHEET - DESIGN Created by: Mark Selan Version 1.1 Date Last Modified: April 2008 DESIGN GUIDELINES FOR GENER8 WEBSITES The purpose of this document is to provide Online Communication Services staff (OCS), clients and graphic designers with information regarding the creation and selection of interface graphics for nonstandard intranet/internet websites. Boutique websites do not use the standard Department of Education and Children s Services (DECS) website design. BACKGROUND The majority of DECS websites exist within a Content Management System (CMS). Currently the CMS used by DECS is Gener8, a product maintained by Adelaide company, CDAA. Gener8 works in a framed environment, where a browser displays 3 web pages simultaneously; the banner frame, the navigation frame and content frame. There are a number of guidelines that will affect the design of a website; these guidelines are borne from DECS specifications (logo size, meta data), theories of useability (accessibility, use of graphics) and the Gener8 environment. BOUTIQUE WEBSITES Boutique websites are those websites which, having met a set of criteria, has received Online Governance Committee (OGC) approval to have a design outside the standard DECS design. The standard design can be seen at For websites to have their own unique designs they must Be a special project Be under a directive of a CEO or Minister Be directed at a school children These specifications are for those sites that have been approved by OGC to have their own design but will use the Gener8 CMS. Adding Images to Web Pages Using the Gener8 System Version 1 August 2008 Page 1 of 7

2 THE GENER8 TEMPLATE The Gener8 template consists of 3 separate web elements which combine to create a web page. These elements are the Banner frame Navigation frame Content frame Banner Frame (incorporates Content Strip). Maximum total height of banner frame is 150px, this includes the content strip (if one is being used). Content Strip 27 px high Navigation Frame Content Frame Standard Width 180px Maximum Width 200px BANNER GRAPHIC REQUIREMENTS The banner frame is the top most portion of the website, running horizontally, across the breadth of the screen. In contains the website s title, the top level of navigation, called the content strip and the bulk of the graphic design. In consideration of the available area required for the content (in the content frame), it is recommended that the height of the top banner page elements do not exceed 150 pixels. The banner frame can contain a Content Strip bar which is a Gener8 navigation tool used to better direct customers to appropriate information. Sites incorporating a content group strip bar can only have a banner of 123 pixels high, as the strip is, itself, 27 pixels high. In conjunction with OCS staff, clients identify the minimum banner frame items required prior to commencement of the design phase of the project. For example, Home, Search and Contact us buttons or Search fields, these elements are specified in the Design Brief. The banner frame will contain the majority of the graphical elements that provide a website s distinct presence. The design acts as a mechanism to convey a feeling and connection with the end-customer. Before a graphic designer can commence, care should be taken when conceptualising the banner. Thought must be put in to who is the audience and what do they like?. The Design Brief, produced by OCS staff with the client, is used to answer questions on audience and style. It should be noted that, graphic intensive sites may be detrimental to the viewing experience of clients on slower connections. c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 2 of 7

3 SPECIFICATIONS FOR BANNER FRAME The height of the top banner page elements must not exceed 150 pixels in height. Sites incorporating a content group strip can only have a maximum banner size of 123 pixels, as the strip is 27 pixels high. It is important to remember that the above dimensions are the maximum allowed, but banners can be less than 123 pixels (but no less than 70 pixels to allow for the DECS logo) if desired. The graphic must incorporate liquid design so as to always fill browser windows larger than 800 pixels wide The DECS logo must comply with the State Branding Standards. Any graphic elements in this frame must have appropriate Alt tags except in instances where this would confuse any screen reader technology utilised by visually impaired users. Designs must meet accessibility guidelines in regards to image use and colour contrast between text colour and background. Very graphic intensive banners may not load quickly on school or home computers, download times must be considered. The use of images of people be socially inclusive DECS LOGO REQUIREMENTS Online Communications Services (OCS) will provide an accurate and high quality electronic logo (editable eps format) prior to commencement of the design phase of the project. The DECS logo can also be accessed by DECS staff, through the Public Relations intranet site at In brief The DECS logo must be in the top left corner The DECS Logo can not be altered in anyway The roundel can not be smaller than 50 pixels high The logo must be on a solid background No graphical elements may encroach the logo within 25% of the roundel diameter The logo can be a PMS295 blue, black, white or full colour (The full colour version can only be used on a white background) The roundel has the ALT text Go to the Minister s home page and links to and the Logo text goes to and has the ALT text Go to the Department of Education and Children s Services Home Page For more information about using the DECS logo please visit the Public Relations subweb on the intranet; (Please note, this link is accessible only by staff with access to the DECS intranet.) ALT AND TITLE ATTRIBUTES OCS will ensure that the need for alternative tags (alt) and accessibility guidelines are discussed with the designers at project commencement. Accessibility guidelines are to be considered by taking into account non-graphic browsers, visually impaired and other minority user groups that may be utilising DECS websites. Alt and Title-tags are descriptions that appear as a Windows tool-tip upon mousing over an image, and are placed in the img tag during the coding process. The description should be accurate and succinct and be viewable on all graphics. Descriptive language should be c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 3 of 7

4 used when writing ALT tags. Any colours used should also provide a good contrast and allow viewing for colour-blind customers. Colour contrast should meet Level 2 standards using the Colour Contrast Analyser available as part of the Vision Australia Accessibility Toolbar; THE USE OF PHOTOS The Department of Education and Children Services is conscience of gender, age and race considerations, so when photos of people are used as graphical elements, an effort must be made to be inclusive and represent a wide range of the community. One solution is that a design can use a series of photos that are displayed one at a time, but change each time the website is loaded. In respect to technical aspects of using images, an effort needs to be made to ensure photos download quickly. NAVIGATION FRAME REQUIREMENTS The navigation frame runs vertically down the left side of the web page. It is the main navigation tool for the site, containing parent and child page items (the basic structure of pages in a Gener8 site). These items are sourced dynamically from a database. Tp provide more screen space for content, it is recommended that the left hand navigation frame elements do not exceed 200 pixels in width (standard width is 180 pixels). The navigation frame can contain a background image or other graphical elements but these elements can not interfere with the readability of the text based navigation items. The colour contrast between the font colour (of all hyperlink states; active, hover, visited) and background should meet Level 2 standards using the Vision Australia Accessibility Toolbar Contrast Analyser, While it is possible to have graphic based navigation in the Gener8 navigation frame, it is not advisable since it limits the control of the publisher over the content and hampers search engines. Graphic elements used as navigation will need to meet Accessibility standards such as having text alternatives and readability. The stylesheet for the navigation frame caters to defined elements such as the various states of hyperlinks (rollovers, active, visited, etc), as well as bullet types, as used by parent items, and general text colours. OCS will supply stylesheets to the designers. SPECIFICATIONS FOR NAVIGATION FRAME Graphic backgrounds for this frame have to function within a frame width between 175 pixels and 200 pixels (the standard width is 180 pixels). The Gener8 Content Management System permits vertical scrolling in this frame. If a background image is to be used in the Navigation frame, it must incorporate liquid design so as to always fill browser windows taller than 600 pixels high. The Business Unit or graphic designer can nominate (subject to approval by Online Communication Services) the colour of the text used for navigation items but it must be a colour that gives maximum visibility against the background colour/graphic of the navigation frame. The publishing system uses Arial font for navigation items. Navigation Frame Icons to indicate a drop down menu have a standard size of 12 pixels square which includes the space between the edge of the indicator element and the navigation text. c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 4 of 7

5 Examples that can be used are arrows, dots or stars with the colours used reflecting the hover and select state of the navigation text item colour styles. Content Frame Requirements Within the Gener8 CMS, a cascading style sheet (CSS) formats the content s visual presentation. This includes Headings, default text, hyperlinks, lists, margins, padding and other typographic classes and elements. Only Online Communications Services have access to these style sheets but they can be provided to designers upon request for customisation. Due to the nature of the DECS target audience it is recommended that designers refrain from using display or non-standard font families when designing content elements. A watermark, also known as content background, can be included on the content page. These are also controlled using the style sheet and can be fixed positioned or repeated according to designer requirements. Consideration should be taken to ensure that the watermark is not too dark to compromise the legibility of content text. A list of stylesheet elements that can be defined by designers can be supplied by OCS. SPECIFICATIONS FOR CONTENT FRAME The background colour must be white Font sizes must be relative and therefore resizable using browser settings Text and background must meet readability standards set out in this document, using the Vision Australia Accessibility Toolbar If relevant, the design must be liquid THE FOOTER As part of the required content, a footer dynamically added to the base of each content page. Standard elements include date modified, content enquiries (with a link to the website administrator s address), Copyright - Government of South Australia, Disclaimer (http://www.sa.gov.au/disclaimer.html), Copyright (http://www.sa.gov.au/copyright.html), Privacy (http://www.sa.gov.au/privacy.html) and Home URL. Optional elements may include Departmental logos positioned in the footer text. CREATION OF NEW LOGOS As per the Premier's Minute dated 26 November 2003, no new logos are to be created for existing Government entities or any newly created entity. "In the event that a new entity is created, a logo using the Government of South Australia brand together with the entity's name must be used. No new logo devices are to be created other than in exceptional circumstances, such as where a new logo device is required for a specific purpose* " c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 5 of 7

6 * A division or program within a government department would not be approved for an individual logo under the "specific purpose" criteria. If you have any queries about the use of logos please contact the Online Communication Services Unit on ADDITIONAL INFORMATION FOR GRAPHIC DESIGNERS ENSURE YOUR SOLUTION IS BASED ON A LIQUID DESIGN MODEL DECS Customers use different screen sizes, screen resolutions and browser window sizes - liquid design aids in making your interface as accessible and visually adaptive as possible on the various viewing options available in today s market place. Given this, it is appropriate to use the liquid design model to optimise the viewing experience of your target market on their monitor settings. The liquid design model is one in which the page elements will re-position to suit the viewing conditions of the client audience. To keep your interface liquid, avoid fixed width page elements such as tables, images and image maps. One possible solution is to use percentage measurements on layout widths, rather than fixed pixel width measurements. For example, using a 90% width on a table rather than 755 pixel fixed width, allowing the table width to automatically resize itself to 90% of the browser window size. Further information on liquid design can be read here: The Gener8 publishing solution is currently designed around a frame based liquid design model. Due to this, when creating an interface design, banner graphic, consideration must be taken to allow the interface design to be sliced and therefore allowing re-positioning of elements when implemented into the liquid design model. USE OF COLOURS All Government websites must: Use a consistent colour scheme throughout the site. Provide sufficient contrast between text and background to ensure good presentation on both screen and paper. Ensure consideration is given to the use colours that are safe for those visitors who are colour blind. Online Communications Services uses the Vision Australia Contrast Analyser in its design evaluation. looking for at least Level 2 compliance. SUPPLYING THE DESIGN FOR IMPLEMENTATION After concept approval has been given, the designer will be required to Online Communication Services the required interface design(s). It is preferable that the graphic not be sliced before implementation into the Gener8 publishing solution unless other arrangements have been made between the client and Online Communication Services. The Design Brief may require the Graphic Designer to provide the completed concept in HTML format. A template which includes the Gener8 frameset and related stylesheets will be provided to the graphic designer by the Online Communication Services Unit. c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 6 of 7

7 The designer will need to supply: 1. Photoshop (.psd) file created with layers (unflattened) this is the file that is used for the final implementation. Each layer should contain page elements used in the interface such as backgrounds, navigation menus and rollover/hover colours. Provision of this also aids if minor changes or alterations need to be made prior to implementation commencement. 2. Preview gif or jpg file for viewing the completed/signed-off interface. Both the above files assist in ensuring the interface retains the intended design concept and minimises the time from receiving the images to completion of the final implemented solution. The implementation team are very happy to communicate directly with the designer to ensure that requirements for the Gener8 publishing solution are considered. For more information contact Online Services Unit c:\documents and settings\selanm\desktop\visual standards factsheet.doc Page 7 of 7

The finalisation of the web design will be based on an indicative homepage design submitted by showpony Advertising.

The finalisation of the web design will be based on an indicative homepage design submitted by showpony Advertising. KD/0/5.5/0.1 Meeting Date: 7 June 2007 Agenda Item 3 Web design As part of agreements made between the University and showpony Advertising, the work required to finalise the web design will be undertaken

More information

Virtual Exhibit 5.0 requires that you have PastPerfect version 5.0 or higher with the MultiMedia and Virtual Exhibit Upgrades.

Virtual Exhibit 5.0 requires that you have PastPerfect version 5.0 or higher with the MultiMedia and Virtual Exhibit Upgrades. 28 VIRTUAL EXHIBIT Virtual Exhibit (VE) is the instant Web exhibit creation tool for PastPerfect Museum Software. Virtual Exhibit converts selected collection records and images from PastPerfect to HTML

More information

Joomla! 2.5.x Training Manual

Joomla! 2.5.x Training Manual Joomla! 2.5.x Training Manual Joomla is an online content management system that keeps track of all content on your website including text, images, links, and documents. This manual includes several tutorials

More information

Dreamweaver and Fireworks MX Integration Brian Hogan

Dreamweaver and Fireworks MX Integration Brian Hogan Dreamweaver and Fireworks MX Integration Brian Hogan This tutorial will take you through the necessary steps to create a template-based web site using Macromedia Dreamweaver and Macromedia Fireworks. The

More information

Terminal Four (T4) Site Manager

Terminal Four (T4) Site Manager Terminal Four (T4) Site Manager Contents Terminal Four (T4) Site Manager... 1 Contents... 1 Login... 2 The Toolbar... 3 An example of a University of Exeter page... 5 Add a section... 6 Add content to

More information

Applying the Corporate Identity to the Web WEB GUIDELINES

Applying the Corporate Identity to the Web WEB GUIDELINES $SSO\LQJWKH&RUSRUDWH,GHQWLW\WRWKH:HE Learning Technology Section WHY HAVE A WEB CORPORATE IDENTITY? 1 1. Competitive Market Place 1 2. Complex Target Audience 1 3. Usability 1 4. Maintenance 1 WHAT IS

More information

Web Style Guide. Columbia College

Web Style Guide. Columbia College Web Style Guide Columbia College Technology Services 11/2014 Table of Contents 1. Layout 1.1 Required Elements... 4 1.2 Page guidelines... 5 1.21 Navigation... 5 1.22 Data tables... 5 1.3 Accessibility...

More information

Creating Webpages in Dreamweaver MX for PC

Creating Webpages in Dreamweaver MX for PC Creating Webpages in Dreamweaver MX for PC Getting Started Before you can create a webpage you need to think about where the page will be stored both locally (i.e., hard drive, CD, disk) and remotely (i.e.,

More information

Fireworks CS4 Tutorial Part 1: Intro

Fireworks CS4 Tutorial Part 1: Intro Fireworks CS4 Tutorial Part 1: Intro This Adobe Fireworks CS4 Tutorial will help you familiarize yourself with this image editing software and help you create a layout for a website. Fireworks CS4 is the

More information

ADOBE MUSE. Building your first website

ADOBE MUSE. Building your first website ADOBE MUSE Building your first website Contents Chapter 1... 1 Chapter 2... 11 Chapter 3... 20 Chapter 4... 30 Chapter 5... 38 Chapter 6... 48 Chapter 1 Installing the software and setting up the sample

More information

KOMPOZER Web Design Software

KOMPOZER Web Design Software KOMPOZER Web Design Software An IGCSE Student Handbook written by Phil Watkins www.kompozer.net CONTENTS This student guide is designed to allow for you to become a competent user* of the Kompozer web

More information

Creating templates and slide masters in PowerPoint 2003

Creating templates and slide masters in PowerPoint 2003 Creating templates and slide masters in PowerPoint 2003 These days, it is not enough to create a presentation with interesting and exciting content; you have to create one with interesting and exciting

More information

Managing your Joomla! 3 Content Management System (CMS) Website Websites For Small Business

Managing your Joomla! 3 Content Management System (CMS) Website Websites For Small Business 2015 Managing your Joomla! 3 Content Management System (CMS) Website Websites For Small Business This manual will take you through all the areas that you are likely to use in order to maintain, update

More information

Creating Web Pages with Microsoft FrontPage

Creating Web Pages with Microsoft FrontPage Creating Web Pages with Microsoft FrontPage 1. Page Properties 1.1 Basic page information Choose File Properties. Type the name of the Title of the page, for example Template. And then click OK. Short

More information

Dreamweaver Domain 2: Planning Site Design and Page Layout

Dreamweaver Domain 2: Planning Site Design and Page Layout Dreamweaver Domain 2: Planning Site Design and Page Layout Adobe Creative Suite 5 ACA Certification Preparation: Featuring Dreamweaver, Flash, and Photoshop 1 Objectives Identify best practices for designing

More information

Go Kiwi Internet Content Management System Version 5.0 (K5) TRAINING MANUAL

Go Kiwi Internet Content Management System Version 5.0 (K5) TRAINING MANUAL Go Kiwi Internet Content Management System Version 5.0 (K5) TRAINING MANUAL K5 CMS The K5 Content Management System (CMS), previously known as Kwik-Az Updating, is a small downloadable program that permits

More information

The Essential Guide to HTML Email Design

The Essential Guide to HTML Email Design The Essential Guide to HTML Email Design Index Introduction... 3 Layout... 4 Best Practice HTML Email Example... 5 Images... 6 CSS (Cascading Style Sheets)... 7 Animation and Scripting... 8 How Spam Filters

More information

... Asbru Web Content Management System. Getting Started. Easily & Inexpensively Create, Publish & Manage Your Websites

... Asbru Web Content Management System. Getting Started. Easily & Inexpensively Create, Publish & Manage Your Websites Asbru Ltd Asbru Ltd wwwasbrusoftcom info@asbrusoftcom Asbru Web Content Easily & Inexpensively Create, Publish & Manage Your Websites 31 March 2015 Copyright 2015 Asbru Ltd Version 92 1 Table of Contents

More information

Microsoft Expression Web Quickstart Guide

Microsoft Expression Web Quickstart Guide Microsoft Expression Web Quickstart Guide Expression Web Quickstart Guide (20-Minute Training) Welcome to Expression Web. When you first launch the program, you ll find a number of task panes, toolbars,

More information

Client Admin Site Adding/Editing Content Under Site Builder/Site Navigation Tutorial by Commerce Promote

Client Admin Site Adding/Editing Content Under Site Builder/Site Navigation Tutorial by Commerce Promote SiteBuilder (Adding/Editing Content) Enable web pages on your website Add and format text and images Upload images Create Image Links Create Sub Levels Create Hyperlinks Upload Data files (ppt,xls,word

More information

Website Builder Manual

Website Builder Manual Fasthosts Customer Support Website Builder Manual This is a designed as a definitive guide to all the features and tools available within Website Builder. Contents Introduction... 4 Adding Content... 5

More information

USER GUIDE. Unit 4: Schoolwires Editor. Chapter 1: Editor

USER GUIDE. Unit 4: Schoolwires Editor. Chapter 1: Editor USER GUIDE Unit 4: Schoolwires Chapter 1: Schoolwires Centricity Version 4.2 TABLE OF CONTENTS Introduction... 1 Audience and Objectives... 1 Getting Started... 1 How the Works... 2 Technical Requirements...

More information

Guide To Creating Academic Posters Using Microsoft PowerPoint 2010

Guide To Creating Academic Posters Using Microsoft PowerPoint 2010 Guide To Creating Academic Posters Using Microsoft PowerPoint 2010 INFORMATION SERVICES Version 3.0 July 2011 Table of Contents Section 1 - Introduction... 1 Section 2 - Initial Preparation... 2 2.1 Overall

More information

WEBSITE BRANDING GUIDELINE

WEBSITE BRANDING GUIDELINE WEBSITE BRANDING GUIDELINE Policy Hierarchy link Website Policy Responsible Officer Executive Director, University Services Director of Communications, and Manager Central Web Unit Contact Officer David

More information

Aviva. Mobile Style guidelines v1.0

Aviva. Mobile Style guidelines v1.0 Aviva Mobile Style guidelines v1.0 Logo The Aviva logo represents our business to the wider world and is the most recognisable part of our brand identity. 1. Aviva landscape logo The Aviva logo is available

More information

Have you seen the new TAMUG websites?

Have you seen the new TAMUG websites? 4 For all Cascade Management System request for PUBLISHING please email cms@tamug.edu for the quickest response. For all Cascade Management System request for QUESTIONS or COMMENTS please email cascadeusers@tamug.edu

More information

ECDL / ICDL Web Editing Syllabus Version 2.0

ECDL / ICDL Web Editing Syllabus Version 2.0 ECDL / ICDL Web Editing Syllabus Version 2.0 Purpose This document details the syllabus for ECDL / ICDL Web Editing. The syllabus describes, through learning outcomes, the knowledge and skills that a candidate

More information

Hello. What s inside? Ready to build a website?

Hello. What s inside? Ready to build a website? Beginner s guide Hello Ready to build a website? Our easy-to-use software allows to create and customise the style and layout of your site without you having to understand any coding or HTML. In this guide

More information

Sage Accountants Business Cloud EasyEditor Quick Start Guide

Sage Accountants Business Cloud EasyEditor Quick Start Guide Sage Accountants Business Cloud EasyEditor Quick Start Guide VERSION 1.0 September 2013 Contents Introduction 3 Overview of the interface 4 Working with elements 6 Adding and moving elements 7 Resizing

More information

Table of Contents. What is ProSite? What is Behance? How do ProSite & Behance work together? Get Started in 6 Easy Steps.

Table of Contents. What is ProSite? What is Behance? How do ProSite & Behance work together? Get Started in 6 Easy Steps. The Beginners Guide Table of Contents 03 04 05 06 34 35 What is ProSite? What is Behance? How do ProSite & Behance work together? Get Started in 6 Easy Steps See Live Examples Need More Help? What is ProSite?

More information

Style Guide Provided courtesy of Innovative Emergency Management Inc.

Style Guide Provided courtesy of Innovative Emergency Management Inc. Style Guide 1. Introduction Louisiana.gov is an enterprise approach for state agencies to work together to provide citizen-centric digital government services and information. Key to achieving this goal

More information

Tasmanian Government Web Design and Navigation Guidelines

Tasmanian Government Web Design and Navigation Guidelines Tasmanian Government Web Design and Navigation Guidelines Version 2.1, July 2010 Office of egovernment Department of Premier and Cabinet Table of Contents Amendments in this release... 3 1 Introduction...

More information

This document will describe how you can create your own, fully responsive. drag and drop email template to use in the email creator.

This document will describe how you can create your own, fully responsive. drag and drop email template to use in the email creator. 1 Introduction This document will describe how you can create your own, fully responsive drag and drop email template to use in the email creator. It includes ready-made HTML code that will allow you to

More information

KB COPY CENTRE. RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ. Telephone: 0131 6505001

KB COPY CENTRE. RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ. Telephone: 0131 6505001 KB COPY CENTRE RM 2300 JCMB The King s Buildings West Mains Road Edinburgh EH9 3JZ Telephone: 0131 6505001 Email: kbcopy@ed.ac.uk martin.byrne@ed.ac.uk colin.doherty@ed.ac.uk Step 1. Set up page orientation

More information

+ Create, and maintain your site

+ Create, and maintain your site T4 Basics Version 1.0 + Create, and maintain your site With T4, you are in control of the content of your website. Feel free to be creative, and keep your site up to date. Few of T4 Features Media Library

More information

How to Build a SharePoint Website

How to Build a SharePoint Website How to Build a SharePoint Website Beginners Guide to SharePoint Overview: 1. Introduction 2. Access your SharePoint Site 3. Edit Your Home Page 4. Working With Text 5. Inserting Pictures 6. Making Tables

More information

Corporate Web CMS Quick Guide

Corporate Web CMS Quick Guide Corporate Web CMS Quick Guide August 6 2012 Version 1 The purpose of this document is to assist web authors in everyday tasks using the CMS. It can also be used as a training guide to ensure key tasks

More information

DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site

DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site Page 1 of 22 DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site Before you create your Web site, ask yourself these questions: What do I want the site to do? Whom do I want to visit

More information

To familiarise University Web administration staff with the capabilities of the University CMS and also introduce concepts of Web marketing.

To familiarise University Web administration staff with the capabilities of the University CMS and also introduce concepts of Web marketing. Web Training Course: Web Editing - How to use the Content Management System (CMS). Version 1.0 Draft October 2006 Version 1.1 March 2007 Version 1.2 April 2007 Course Rationale: The University is currently

More information

SellerDeck 2014 Responsive Design Guide

SellerDeck 2014 Responsive Design Guide SellerDeck 2014 Responsive Design Guide Version: 1.0.0 SellerDeck 2014 Responsive Design 1 Contents Introduction...3 Themes and Wireframe...4 Classic Theme...4 Smart Theme...5 Wireframe...6 How the Responsive

More information

Introduction 3. Getting Familiar With Presence Builder... 4. Creating and Editing Websites 6

Introduction 3. Getting Familiar With Presence Builder... 4. Creating and Editing Websites 6 Contents Introduction 3 Getting Familiar With Presence Builder... 4 Creating and Editing Websites 6 Importing Sites from SiteBuilder 4.5... 7 Editing Websites... 9 Structure: Pages and Navigation... 9

More information

State of Nevada. Ektron Content Management System (CMS) Basic Training Guide

State of Nevada. Ektron Content Management System (CMS) Basic Training Guide State of Nevada Ektron Content Management System (CMS) Basic Training Guide December 8, 2015 Table of Contents Logging In and Navigating to Your Website Folders... 1 Metadata What it is, How it Works...

More information

NDSU Technology Learning & Media Center

NDSU Technology Learning & Media Center 1 NDSU Technology Learning & Media Center QBB 150C 231-5130 www.ndsu.edu/its/tlmc Creating a Large Format Poster (Plot) Using PowerPoint 2013 Posters should be designed and created in a manner that best

More information

Edline Manual Design Guide Version: September 2011

Edline Manual Design Guide Version: September 2011 Edline Manual Design Guide Version: September 2011 Copyright Statements: Edline software is a trademark of Edline. Copyright 2011. Microsoft Windows names and logos are registered trademarks of the Microsoft

More information

SharePoint Basic Editing. Text. Creating List

SharePoint Basic Editing. Text. Creating List Text Putting Text on the Page 1. Entering text on the web page is just like typing in a word processing document. Lines will wrap within a paragraph. 2. Enter = Paragraph Break (leaves a blank line) 3.

More information

PASTPERFECT-ONLINE DESIGN GUIDE

PASTPERFECT-ONLINE DESIGN GUIDE PASTPERFECT-ONLINE DESIGN GUIDE INTRODUCTION Making your collections available and searchable online to Internet visitors is an exciting venture, now made easier with PastPerfect-Online. Once you have

More information

How-to Guide: MIT DLC Drupal Cloud Theme

How-to Guide: MIT DLC Drupal Cloud Theme How-to Guide: MIT DLC Drupal Cloud Theme This guide will show you how to take your initial Drupal Cloud site... and turn it into something more like this, using the MIT DLC Drupal Cloud theme. See this

More information

Create a Poster Using Publisher

Create a Poster Using Publisher Contents 1. Introduction 1. Starting Publisher 2. Create a Poster Template 5. Aligning your images and text 7. Apply a background 12. Add text to your poster 14. Add pictures to your poster 17. Add graphs

More information

WebFOCUS BI Portal: S.I.M.P.L.E. as can be

WebFOCUS BI Portal: S.I.M.P.L.E. as can be WebFOCUS BI Portal: S.I.M.P.L.E. as can be Author: Matthew Lerner Company: Information Builders Presentation Abstract: This hands-on session will introduce attendees to the new WebFOCUS BI Portal. We will

More information

Chapter 3: Quick Start Tutorial

Chapter 3: Quick Start Tutorial 1 Quick Start Tutorial Chapter 3: Quick Start Tutorial This chapter helps you become acquainted with the workspace, the commands, and the features that you use to create your own website. The step-by-step

More information

How to create pop-up menus

How to create pop-up menus How to create pop-up menus Pop-up menus are menus that are displayed in a browser when a site visitor moves the pointer over or clicks a trigger image. Items in a pop-up menu can have URL links attached

More information

Publisher 2010 Cheat Sheet

Publisher 2010 Cheat Sheet April 20, 2012 Publisher 2010 Cheat Sheet Toolbar customize click on arrow and then check the ones you want a shortcut for File Tab (has new, open save, print, and shows recent documents, and has choices

More information

Best Practice in Web Design

Best Practice in Web Design Best Practice in Web Design Irrespective of whether you are intending to use a flat 'brochureware' website or an interactive e- commerce site, the overall look and feel of your website will play an important

More information

CREATING WEB PAGES WITH MACROMEDIA DREAMWEAVER 8. University Computing and Information Services. Training Guide

CREATING WEB PAGES WITH MACROMEDIA DREAMWEAVER 8. University Computing and Information Services. Training Guide CREATING WEB PAGES WITH MACROMEDIA DREAMWEAVER 8 University Computing and Information Services Training Guide For additional help, contact the UCIS Help Desk at (910) 5216260 or helpdesk@uncp.edu, or visit

More information

SiteBuilder User Guide

SiteBuilder User Guide SiteBuilder User Guide Page 1 of 41 SiteBuilder Manual Table of contents SiteBuilder Manual... 2 Table of contents... 2 What is SiteBuilder?... 4 Tips for building a great site... 4 Getting started...

More information

JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA

JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA All information presented in the document has been acquired from http://docs.joomla.org to assist you with your website 1 JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA BACK

More information

History Explorer. View and Export Logged Print Job Information WHITE PAPER

History Explorer. View and Export Logged Print Job Information WHITE PAPER History Explorer View and Export Logged Print Job Information WHITE PAPER Contents Overview 3 Logging Information to the System Database 4 Logging Print Job Information from BarTender Designer 4 Logging

More information

Microsoft Publisher 2010 What s New!

Microsoft Publisher 2010 What s New! Microsoft Publisher 2010 What s New! INTRODUCTION Microsoft Publisher 2010 is a desktop publishing program used to create professional looking publications and communication materials for print. A new

More information

Web Standards. Chapter Organization To better organize this chapter, topics are grouped according to content, design and technical criteria.

Web Standards. Chapter Organization To better organize this chapter, topics are grouped according to content, design and technical criteria. Overview This chapter addresses the University of San Diego s web standards, which are used to create consistency among university web pages and tie the university s website to its printed materials and

More information

University of East Anglia Liferay Training Admissions, Recruitment and Marketing Department

University of East Anglia Liferay Training Admissions, Recruitment and Marketing Department University of East Anglia Liferay Training Admissions, Recruitment and Marketing Department i Version 3.4 Contents Overview...iii Introducing Liferay... iv 1. Logging in and accessing your site... 1 2.

More information

Dreamweaver. Introduction to Editing Web Pages

Dreamweaver. Introduction to Editing Web Pages Dreamweaver Introduction to Editing Web Pages WORKSHOP DESCRIPTION... 1 Overview 1 Prerequisites 1 Objectives 1 INTRODUCTION TO DREAMWEAVER... 1 Document Window 3 Toolbar 3 Insert Panel 4 Properties Panel

More information

Edline Manual Design Guide Version: November 2011

Edline Manual Design Guide Version: November 2011 a Blackboard company Edline Manual Design Guide Version: November 2011 Copyright Statements: Edline software is a trademark of Edline, a Blackboard company. Copyright 2011-2012. Microsoft Windows names

More information

HOW Interactive Design Conference 2013

HOW Interactive Design Conference 2013 HOW Interactive Design Conference 2013 Photoshop to HTML Chris Converse Use this QR code to get the mobile schedule for this conference. Get session and speaker info, lunch ideas, and links for getting

More information

Parallels Panel. User s Guide to Parallels Presence Builder 12.0. Revision 1.0

Parallels Panel. User s Guide to Parallels Presence Builder 12.0. Revision 1.0 Parallels Panel User s Guide to Parallels Presence Builder 12.0 Revision 1.0 Contents Introduction 3 Getting Familiar With Presence Builder... 4 Creating and Editing Websites 6 Importing Sites from SiteBuilder

More information

Using Adobe Dreamweaver CS4 (10.0)

Using Adobe Dreamweaver CS4 (10.0) Getting Started Before you begin create a folder on your desktop called DreamweaverTraining This is where you will save your pages. Inside of the DreamweaverTraining folder, create another folder called

More information

SoftChalk. Level 1. University Information Technology Services. Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production

SoftChalk. Level 1. University Information Technology Services. Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production SoftChalk Level 1 University Information Technology Services Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production Page 1 of 49 Copyright 2013 KSU Department of University Information

More information

Advertising Specifications

Advertising Specifications Advertising Specifications Standard Ad Specs Overview Pixel Max File Expandable Ad Unit Size Allowed 2 Accepted File Format SLA (working days) W x H Leaderboard 728 x 90 1 Yes JPG, GIF or SWF + (backup

More information

Google Sites: Creating, editing, and sharing a site

Google Sites: Creating, editing, and sharing a site Google Sites: Creating, editing, and sharing a site Google Sites is an application that makes building a website for your organization as easy as editing a document. With Google Sites, teams can quickly

More information

SKILL SET 1 BASICS...

SKILL SET 1 BASICS... ITQ Level 2 Presentation Software Contents SKILL SET 1 BASICS... 9 1 - PRESENTATIONS... 10 2 - CREATING A NEW PRESENTATION... 11 3 - SAVING A PRESENTATION... 13 4 - CLOSING A PRESENTATION... 15 5 - OPENING

More information

Web Design for Programmers. Brian Hogan NAPCS Slides and content 2008 Brian P. Hogan Do not reproduce in any form without permission

Web Design for Programmers. Brian Hogan NAPCS Slides and content 2008 Brian P. Hogan Do not reproduce in any form without permission Web Design for Programmers Brian Hogan NAPCS Slides and content 2008 Brian P. Hogan Do not reproduce in any form without permission Quick Disclaimers This is a crash course! Many topics are simplified

More information

Creating a website using Voice: Beginners Course. Participant course notes

Creating a website using Voice: Beginners Course. Participant course notes Creating a website using Voice: Beginners Course Topic Page number Introduction to Voice 2 Logging onto your website and setting passwords 4 Moving around your site 5 Adding and editing text 7 Adding an

More information

Web Design. www.ltscotland.org.uk/sustainabledevelopment/climatechange

Web Design. www.ltscotland.org.uk/sustainabledevelopment/climatechange Web Design www.ltscotland.org.uk/sustainabledevelopment/climatechange Web Design Personnel Web design involves a range of skills. Everyone in the class can be involved in planning the website structure

More information

USER S MANUAL JOOMLA! GOVERNMENT WEB TEMPLATE

USER S MANUAL JOOMLA! GOVERNMENT WEB TEMPLATE USER S MANUAL JOOMLA! GOVERNMENT WEB TEMPLATE 1 TABLE OF CONTENTS Introduction 3 Parts of the Government Web Template (GWT) 4 Logging In and Getting Started 5 GWT Joomla! Module Map 8 Editing the Top Bar

More information

EMAIL MARKETING BEST PRACTICES GUIDE

EMAIL MARKETING BEST PRACTICES GUIDE EMAIL MARKETING BEST PRACTICES GUIDE V12 Group s Best Practices Guidelines and recommendations were implemented to help clients create clean looking emails that improve delivery and overall performance

More information

Tips for clear websites

Tips for clear websites Plain English Campaign: Tips for clear websites Copyright Plain English Campaign Tips for clear websites This is only a basic guide. If you have any suggestions, corrections or improvements, please contact

More information

IAS Web Development using Dreamweaver CS4

IAS Web Development using Dreamweaver CS4 IAS Web Development using Dreamweaver CS4 Information Technology Group Institute for Advanced Study Einstein Drive Princeton, NJ 08540 609 734 8044 * helpdesk@ias.edu Information Technology Group [2] Institute

More information

CMS Basic Training. Getting Started

CMS Basic Training. Getting Started The (Content Management System), was designed to allow most people in an organization to contribute to or edit their website(s). Utilizing a set of templates and stylesheets, users can add or edit information

More information

Course Exercises for the Content Management System. Grazyna Whalley, Laurence Cornford June 2014 AP-CMS2.0. University of Sheffield

Course Exercises for the Content Management System. Grazyna Whalley, Laurence Cornford June 2014 AP-CMS2.0. University of Sheffield Course Exercises for the Content Management System. Grazyna Whalley, Laurence Cornford June 2014 AP-CMS2.0 University of Sheffield PART 1 1.1 Getting Started 1. Log on to the computer with your usual username

More information

Editing the Main Template Using Microsoft Front Page

Editing the Main Template Using Microsoft Front Page Editing the Main Template Using Microsoft Front Page This is the Solutions for Your Life main template. Below you will find information on how to edit each section. The first thing to realize about Front

More information

Fireworks 3 Animation and Rollovers

Fireworks 3 Animation and Rollovers Fireworks 3 Animation and Rollovers What is Fireworks Fireworks is Web graphics program designed by Macromedia. It enables users to create any sort of graphics as well as to import GIF, JPEG, PNG photos

More information

NDSU Technology Learning & Media Center. Introduction to Google Sites

NDSU Technology Learning & Media Center. Introduction to Google Sites NDSU Technology Learning & Media Center QBB 150C 231-5130 www.ndsu.edu/its/tlmc Introduction to Google Sites Get Help at the TLMC 1. Get help with class projects on a walk-in basis; student learning assistants

More information

Joomla Article Advanced Topics: Table Layouts

Joomla Article Advanced Topics: Table Layouts Joomla Article Advanced Topics: Table Layouts An HTML Table allows you to arrange data text, images, links, etc., into rows and columns of cells. If you are familiar with spreadsheets, you will understand

More information

SRCSB General Web Development Policy Guidelines Jun. 2010

SRCSB General Web Development Policy Guidelines Jun. 2010 This document outlines the conventions that must be followed when composing and publishing HTML documents on the Santa Rosa District Schools World Wide Web server. In most cases, these conventions also

More information

Development and Alumni Relations Systems (DARS)

Development and Alumni Relations Systems (DARS) Development and Alumni Relations Systems (DARS) BBIS (Blackbaud Internet Solutions) Part 1 (DARS Version 3.0) Manual Version 1.0 Part 1 of the BBIS Manual Covers: Interface and Navigation Website Design

More information

Websites for Small Business. Copyright 2005 Three Rivers Internet

Websites for Small Business. Copyright 2005 Three Rivers Internet Websites for Small Business Why your business needs a website Today, over 60% of Americans use the Internet. We use it to communicate, to learn, to shop and to buy. It is just as important in our lives

More information

Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade. Exercise: Creating two types of Story Layouts

Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade. Exercise: Creating two types of Story Layouts Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade Exercise: Creating two types of Story Layouts 1. Creating a basic story layout (with title and content)

More information

Basic tutorial for Dreamweaver CS5

Basic tutorial for Dreamweaver CS5 Basic tutorial for Dreamweaver CS5 Creating a New Website: When you first open up Dreamweaver, a welcome screen introduces the user to some basic options to start creating websites. If you re going to

More information

Penn State Behrend Using Drupal to Edit Your Web Site August 2013

Penn State Behrend Using Drupal to Edit Your Web Site August 2013 Penn State Behrend Using Drupal to Edit Your Web Site August 2013 Alternative Format Statement This publication is available in alternative media upon request. Statement of Non-Discrimination The Pennsylvania

More information

Web Training Course: Introduction to Web Editing Version 1.4 October 2007 Version 2.0 December 2007. Course Rationale: Aims & Objectives:

Web Training Course: Introduction to Web Editing Version 1.4 October 2007 Version 2.0 December 2007. Course Rationale: Aims & Objectives: Web Training Course: Introduction to Web Editing Version 1.4 October 2007 Version 2.0 December 2007 Course Rationale: The university is currently rolling out new Web publishing templates to all organisational

More information

UCL INFORMATION SERVICES DIVISION INFORMATION SYSTEMS. Silva Plus. More Advanced Features. Document No. IS-130

UCL INFORMATION SERVICES DIVISION INFORMATION SYSTEMS. Silva Plus. More Advanced Features. Document No. IS-130 UCL INFORMATION SERVICES DIVISION INFORMATION SYSTEMS Silva Plus More Advanced Features Document No. IS-130 Contents What is Silva?... 1 Requesting a website / Web page(s) in Silva 1 Building the site

More information

DREAMWEAVER BASICS. A guide to updating Faculty websites Created by the Advancement & Marketing Unit

DREAMWEAVER BASICS. A guide to updating Faculty websites Created by the Advancement & Marketing Unit DREAMWEAVER BASICS A guide to updating Faculty websites Created by the Advancement & Marketing Unit Table of content Tip: Click on the links below to go straight to the desired section The W (Web Services)

More information

Web Design Specialist

Web Design Specialist UKWDA Training: CIW Web Design Series Web Design Specialist Course Description CIW Web Design Specialist is for those who want to develop the skills to specialise in website design and builds upon existing

More information

File types There are certain image file types that can be used in a web page. They are:

File types There are certain image file types that can be used in a web page. They are: Using Images in web design (Dreamweaver CC) In this document: Image file types for web pages Inserting an image Resizing an image in Dreamweaver CSS properties for image alignment and responsiveness nigelbuckner

More information

Applying the Corporate Identity to the Web WEB GUIDELINES

Applying the Corporate Identity to the Web WEB GUIDELINES Applying the Corporate Identity to the Web WHY HAVE A WEB CORPORATE IDENTITY? 1 1. Competitive Market Place 1 2. Complex Target Audience 1 3. Usability 1 4. Maintenance 1 WHAT IS THE WEB CORPORATE IDENTITY?

More information

Please select one of the topics below.

Please select one of the topics below. Thanks for choosing WYSIWYG Web Builder! In this section we will give a short introduction to Web Builder so you can start building your web site in (almost) no time. Please select one of the topics below.

More information

Working with the new enudge responsive email styles

Working with the new enudge responsive email styles Working with the new enudge responsive email styles This tutorial assumes that you have added one of the mobile responsive colour styles to your email campaign contents. To add an enudge email style to

More information

Designing HTML Emails for Use in the Advanced Editor

Designing HTML Emails for Use in the Advanced Editor Designing HTML Emails for Use in the Advanced Editor For years, we at Swiftpage have heard a recurring request from our customers: wouldn t it be great if you could create an HTML document, import it into

More information

Creating forms in Microsoft Access 2007

Creating forms in Microsoft Access 2007 Platform: Windows PC Ref no: USER 166 Date: 14 th January 2008 Version: 1 Authors: Derek Sheward, Claire Napier Creating forms in Microsoft Access 2007 This is the fourth document in a series of five on

More information

KFUPM. Web Content Management System powered by SharePoint 2010. www.kfupm.edu.sa 1

KFUPM. Web Content Management System powered by SharePoint 2010. www.kfupm.edu.sa 1 KFUPM Web Content Management System powered by SharePoint 2010 1 Sample Department Site Site Actions Steps to login for administrators Navigate to your website and type in the url /admin.aspx

More information