Building History Websites: Software and Technical Tips Presented by Dave Lester National History Day June 15 th , 2008

Things Covered in this Presentation WYSIWYG editors W hat Y ou S ee I s W hat Y ou G et Example: Google Pages Improving a Simple Web Page Embedding Video and Maps Examples: YouTube and CommunityWalk

WYSIWYG editors

W hat Y ou S ee I s W hat Y ou G et

Example: Google Pages

Improving a Simple Web Page

Embedding Video and Maps

Examples: YouTube and CommunityWalk

W hat Y ou S ee I s W hat Y ou G et Allows you to see webpage as you edit it No knowledge of HTML code is needed The simplest way to build a webpage

Allows you to see webpage as you edit it

No knowledge of HTML code is needed

The simplest way to build a webpage

WYSIWYG Example: Google Pages Web-based editor that doesn’t require a download Free Your site is published with the click of a button

Web-based editor that doesn’t require a download

Free

Your site is published with the click of a button

Google Page Creator: Templates

Formatting and Adding Content WYSIWYG editors use toolbars similar to Microsoft Word to format text and add images/video

WYSIWYG editors use toolbars similar to Microsoft Word to format text and add images/video

Examples of WYSIWYG Editors Microsoft Expression Web (formerly FrontPage) KompoZer http://www.kompozer.net Adobe Dreamweaver Google Page Creator http://pages.google.com

Microsoft Expression Web

(formerly FrontPage)

KompoZer

http://www.kompozer.net

Adobe Dreamweaver

Google Page Creator

http://pages.google.com

Embedding Content in Webpages Videos, images, and maps are easy to embed into a webpage Copy and paste embed HTML codes into WYSIWYG editor

Videos, images, and maps are easy to embed into a webpage

Copy and paste embed HTML codes into WYSIWYG editor

Embedding A YouTube Video

Maps using CommunityWalk CommunityWalk is a website dedicated to creating simple and easy to use interface for creating informational, interactive, and engaging maps. (http://comunitywalk.com) Add Images to plotted points Map paths of travel between points Embed maps into your site

CommunityWalk is a website dedicated to creating simple and easy to use interface for creating informational, interactive, and engaging maps. (http://comunitywalk.com)

Add Images to plotted points

Map paths of travel between points

Embed maps into your site

Example of CommunityWalk Map

Additional Places to Visit Web Monkey, HTML Tutorials ( http://www.webmonkey.com/tutorial/ ) CHNM’s Timeline Builder ( http://chnm.gmu.edu/tools/timelines/ ) Additional History Video Content Internet Archive ( http://www.archive.org )

Web Monkey, HTML Tutorials

( http://www.webmonkey.com/tutorial/ )

CHNM’s Timeline Builder

( http://chnm.gmu.edu/tools/timelines/ )

Additional History Video Content

Internet Archive ( http://www.archive.org )