Dfg Intranet Development

DFG Intranet Development Using the DotNetNuke (DNN) Content Management System

Today’s Presentation

High-Level Design

Makes Use of the Standard DTS Templates

Consistent Look-and-Feel Throughout the Entire Site

Cascading Style Sheets

Leveraging Learning

Ergonomic Considerations

Human Factors Based Site Organization

Efficient Use of Real Estate

Consistent Navigation

Minimize the need to scroll

Make your site accessible (Section 508 Compliance)

Using a Content Management System (CMS)

Enforcing Standards

Access and Editing Control

User-Friendly “Semi-Technical” Interface

Numerous Out-of-the-Box Features

Intranet Content Considerations

Who is your audience?

Internal staff

The rest of DFG

Why do they come to your area of the site?

What do they want to accomplish there?

What resources do they need to locate?

What is the best way to organize your content?

What is the best way to present your content?

How do you determine if you’ve succeeded?

DotNetNuke Overview

Logging In

What to do if you forget your password

Showing/Hiding the Control Panel

Switching Between View/Edit Modes

Page Settings vs. Module Settings

Adding a New Page

Page Name

Page Title

Parent Page

“ Include in Menu” Checkbox

Setting View Permissions

Setting Edit Permissions

Saving/Updating the Page

Building Left-Hand Navigation

Adding the “I Need To…” Module (SSILinks)

Adding the “Additional Links” Module (SSILinks)

Adding Center Content

Choosing the right module

Overview of available modules

Adding a new module

The Default Module (Text/HTML)

Editing the Module Settings

Editing the Module’s Contents

Adding Links

Inserting Images

Adding New Text

Pasting Existing Text

Remaining Major DNN Modules

Rounded Corner Module

Tabbed Module

Announcements

Event Calendar

Frequently Asked Questions (FAQ)

Additional Modules

RSS Feeds

Reusing an Existing Module

Accessibility (section 508 compliance)

What is accessibility

Advantages of accessibility

It’s the Law!

Our role

Be simple and intuitive

10 accessibility tips

Creating accessible documents

Conclusion

DotNetNuke Resources

High-Level Design

DFG Intranet High-Level Design Search Box Left-Nav (links) Center Content Area (multiple content types) Top-Nav (tabs) Sub-Nav (links) Login Link Top Skip-Nav Intranet Logo

DFG Intranet High-Level Design Back to Top Skip-Nav Terms of Use Privacy Statement

Ergonomic Considerations

DFG Intranet Ergonomic Considerations Top-Nav Tabs and Sub-Nav Links Top-Nav (tabs) Sub-Nav (links) There are Currently 43 Destinations Reachable Just By Using the Tabs and the Sub-Nav Links!

DFG Intranet Ergonomic Considerations Left-Nav Links (“I Need To…” and “Additional Links”) Left-Nav (links) There are Currently 24 Destinations Reachable from This Page Just By Using the Left-Nav Links!

DFG Intranet Ergonomic Considerations Top-Nav and Left-Nav Tabs and Links Left-Nav (links) In total, there are Currently 67 Destinations Reachable from This Page Just By Using the Top-Nav and Left-Nav Links! Top-Nav (tabs) Sub-Nav (links)

DFG Intranet Ergonomic Considerations Center Content Area Center Content Area (multiple content types)

Accessibility

What is Accessibility?

"Accessible Design" calls for an Intranet that can be used as effectively by those whose physical, mental, or environmental conditions limit their performance as by anyone else. Designing and building accessible sites not only benefits individuals with disabilities, but also improves the overall usability of the site for everyone.

Advantages to Accessibility

Minimizes roadblocks to any employee in benefiting from our Intranet resources

Makes it easier for everyone to use

Requires less work to maintain

Improves search engine optimization

It’s the law!

The Law

“ In order to improve accessibility of existing technology, and therefore increase the successful employment of individuals with disabilities, particularly blind and visually impaired and deaf and hard-of-hearing persons, state governmental entities, in developing, procuring, maintaining, or using electronic or information technology, either indirectly or through the use of state funds by other entities, shall comply with the accessibility requirements of Section 508 of the Rehabilitation Act of 1973, as amended (29 U.S.C. Sec. 794d), and regulations implementing that act as set forth in Part 1194 of Title 36 of the Federal Code of Regulations.”

Application of the Law

The Rehabilitation Act Amendments (Section 508)

“…agencies must ensure that this technology is accessible to employees and members of the public with disabilities…”

Our Role

Make our site accessible

Become an advocate for accessibility in the department

Gain an appreciation for Web accessibility by understanding the user perspective

Be as knowledgeable as possible on the subject when validating for accessibility

Test with people with disabilities (including Blackberryholics)

Be Simple and Intuitive

Do not design something differently from user expectations just to be different

Eliminate unnecessary complexity

Maintain consistency from page to page

Provide feedback to the user

Consider multiple browser compatibility

Ten Accessibility Tips

Images and animations: Use the alt attribute to describe the function of each visual.

Multimedia: Provide captioning and transcripts of audio, and descriptions of video.

Hypertext links: Use text that makes sense when read out of context. For example, avoid "click here."

Page organization: Use headings, lists, and consistent structure.

Page construction: Avoid Frames and Tables as much as possible

Ten Accessibility Tips (cont.)

Graphs and charts: Summarize or use the longdesc attribute.

Scripts, applets, and plug-ins: Provide alternative content in case active features are inaccessible or unsupported.

Style flexibility: Make the page equally readable with styles turned off.

PDA access: Remember that some users will be accessing the Intranet via Blackberry!

Check your work: Use tools, checklist, and guidelines at validator.w3.org , www.w3.org/TR/WCAG , www.cynthiasays.com and webxact.watchfire.com

Accessible Word Docs & PDFs

Review and complete the Document Properties

Apply tags to the document

Use tooltips and correct tab order for form fields

Create alternative text for figures, images, graphs and tables

Add bookmarks if document is over 10 pages

Use proper tags for table headers and rows

Entire document must flow in a logical reading order (top to bottom, left to right)

No scanned images of documents—real text!

Conclusion

We have an obligation to create an accessible Intranet

It’s much easier to do so if you plan this from the beginning

Not much more time nor effort is required

Accessibility benefits everyone!

Using a Content Management System

How Does a CMS Help?

Enforces look-and-feel standards throughout the site

Enables the average content owner to maintain their content

Easily controls viewing and editing access

Avoids “islands of information”

Simplifies site-wide modifications

Enforces Look-and-Feel Standards

Provides a universal template for all pages

Limits components/containers to agreed-upon standards

Helps conform navigation options

Helps control font choices, font sizes, font colors

Limits and enforces styles

Simplifies Content Management

Makes editing pages as easy as editing Word documents

Maximizes content management; minimizes presentation management

Increases likelihood that content will remain current

Controls Access

Roles define viewing and editing access

Assignment of users to roles is simple and straightforward

Provides content owners with clear parameters, i.e. what is editable, what is not

Reduces “Islands of Information”

Create content in one location; propagate to many locations

Avoids problems with static pages

Helps avoid content synchronization issues

Quick Site-Wide Modifications

Change content one place, updates everywhere

Change template one place, updates everywhere

Change style one place, updates everywhere

Conclusion

Enforces standards

Helps keep content current

Avoids content redundancy and synchronization issues

Advantages of dynamic vs. static content

Intranet Content Considerations

Intranet Content Considerations Who is Your Audience?

Internal Staff

Who will be coming to your site?

What interest groups do they represent?

How often will they make use of your site?

The Rest of DFG

What others in the department might be interested?

Who else might have some involvement in your programs or projects?

Intranet Content Considerations Why Do Staff Come?

What resources do staff need to locate that are otherwise hard to find or time-consuming to share?

What documents can you offer on-line to avoid clogging email inboxes and hogging bandwidth?

What methods of collaboration and cooperation are optimized in an Intranet environment?

What can you tell each other about who you are and what you do that will help everyone feel more connected and invested?

Intranet Content Considerations Why Do Others Come?

What do you want the rest of the department to know about who you are?

What do you want the rest of the department to know about what you do?

What resources can you offer for everyone’s benefit?

What do you do that may affect what they do?

Intranet Content Considerations What Do They Want to Accomplish?

Identify what tasks those who come to your site are most likely to want to accomplish there

Maximize the likelihood that they will be able to accomplish those tasks quickly, easily and fully

Organize content in such a way that makes it intuitive to find things

Minimize the number of steps it takes to reach and access related resources

Find out what you can do to keep people coming back

Intranet Content Considerations What Resources To They Need to Locate?

What documents, maps, photos, spreadsheets, audio or video files do you want to make available?

What external Web sites need to be regularly accessed?

What other areas of the Intranet do I want to connect to?

What collaborative resources (calendar, blog, Wiki, document library) would be productive?

Intranet Content Considerations How Should Your Content be Organized?

Prioritize tasks and prominently display the most common or important

Keep related resources together in one place

Divide related resources into intuitive groupings

Redundancy is fine if it improves efficiency

Maintain consistency throughout your site

Keep it simple--usability studies confirm this!

Intranet Content Considerations How Should Your Content Be Presented?

Keep the content that is accessed the most in the most prominent position--top or left side

Choose the best module/container for the type of content it will contain

Try and get into the mind-set of your visitors in order to determine “what” and “where”

Avoid unnecessary fonts, colors, styles, etc.—keep it simple, consistent and attractive

Intranet Content Considerations How Do I Know If I’ve Succeeded

Ask!

Keep your ear to the ground

Provide a feedback or contact link on your area of the site, requesting questions or comments

Use the “Survey” module to solicit feedback

Request statistics reports from ITB

DotNetNuke Overview

DotNetNuke Overview Login Link

DotNetNuke Overview Login Account

Note:

You must have a GEO account in order to log in to DotNetNuke. You can obtain an account by having your supervisor submit a “Request New DFG Account” form to the Help Desk. The form is available by clicking the top “I Need To…” link on the Help Desk’s Intranet home page.

DotNetNuke Overview Login Page

DotNetNuke Overview Forgot Password?

DotNetNuke Overview Logged In

DotNetNuke Overview Control Panel - Left Side

DotNetNuke Overview Control Panel - Center

DotNetNuke Overview Control Panel - Right Side

DotNetNuke Overview Editing and Settings Icons

DotNetNuke Overview Page Settings vs. Module Settings

Adding a New Page

Adding a New Page Add Icon

Adding a New Page Editing the Page Settings

Adding a New Page Saving the Page Settings

Adding a New Page New Blank Page

Building Left-Hand Navigation Adding the “I Need To…” Links

Adding the “I Need To…” Links Adding the “I Need To…” Module

Adding the “I Need To…” Links Selecting the SSILinks Module

Adding the “I Need To…” Links Adding Links to the “I Need To…” Module

Adding the “I Need To…” Links Adding Link to an External Web Site

Adding the “I Need To…” Links Link Added

Adding the “I Need To…” Links Adding a Link to Another Intranet Page

Adding the “I Need To…” Links The Intranet Page Hierarchy

Adding the “I Need To…” Links Adding a Link to Another Intranet Page

Adding the “I Need To…” Links Adding a Link to a File

Adding the “I Need To…” Links Selecting the Correct File Directory

Adding the “I Need To…” Links Uploading a File

Adding the “I Need To…” Links Saving Your File Link

Adding the “I Need To…” Links File Link Created Successfully

Building Left-Hand Navigation Adding the “Additional Links” Module

Adding the “Additional Links” Module

Adding Center Content

Adding Center Content Choosing the Right Module

Adding Center Content Available Modules

Adding Center Content Announcements Module

Announcements

Used to announce time-sensitive events, news, meetings, problems, etc.

Announcements disappear when they expire

Individual announcement can link to a document or Web site

Adding Center Content Events Module

Events

Create a shared calendar for posting meetings, events, vacations, RDOs, etc.

Month, week or list view

Handles recurring events

Email notifications

Link events to documents or Web sites

Adding Center Content FAQs Module

FAQs

Short for “Frequently Asked Questions”

Display common questions and their answers

Click on question to reveal answer

Click again to hide answer

Questions can be organized by category

Adding Center Content Feedback Module

Feedback

Solicit feedback about your site or about specific issues

Sends feedback as email to designated recipient(s)

Can set up feedback categories in advance

Display all feedback in report format

Adding Center Content Form Master Module

Form Master

Create powerful, full-featured Web forms

Add edit boxes, drop-down lists, checkboxes, radio buttons, etc.

Submit form data via email, save it to a database, or both

Excellent reporting capabilities from the database

Adding Center Content News Feeds (RSS) Module

News Feeds (RSS)

RSS = “Really Simple Syndication”

Dynamically display news from any RSS source

Dynamically display document collections from the DFG Document Library

Tailor news feeds by type

Limit news feeds by number

Adding Center Content SSILinks Module

SSILinks

SSI = “Server-Side Include”

Used for all Left-Navigation links (“I Need To…” and “Additional Links”)

Can link to other Intranet pages, documents or external Web sites

Adding Center Content Survey Module

Survey

Use to create simple surveys for people to complete and submit

Create either yes/no or multiple-choice questions

Results emailed to specified recipient(s)

Adding Center Content Text/HTML Module

Text/HTML

Default module on all newly-created pages

Use for text, links, images, etc.

Can contain any HTML

Can contain Javascript

Basis for creating Rounded Corner containers

Basis for creating Tabbed Module containers

Adding Center Content What’s New/What’s Hot Module

What’s New/What’s Hot

Used only on DFG Intranet Home page

Dynamically changes based on Intranet activity

“What’s New” automatically displays all newly added or modified pages

“What’s Hot” automatically displays the most frequently visited pages

The Default Module (Text/HTML)

Text/HTML Module Edit Settings Link

Text/HTML Module Editing the Module Settings

Text/HTML Module Saving the Module Settings

Text/HTML Module Edit Text Link

Text/HTML Module Editing the Contents

Text/HTML Module Rich Text Format

Text/HTML Module HTML “Source” Format

Text/HTML Module Formatting Text in the Rich Text Editor

Text/HTML Module Unformatted Text

Text/HTML Module Modifying Text Format

Text/HTML Module Selecting Text Format

Text/HTML Module Text Format Modified

Text/HTML Module Creating a Hyperlink

Text/HTML Module Creating a Hyperlink (continued)

Text/HTML Module Hyperlink Created

Text/HTML Module Save Text Formatting Changes

Text/HTML Module Text Formatting Complete

Text/HTML Module Inserting Images

Text/HTML Module Saving Your Changes

Text/HTML Module Image Successfully Added

Text/HTML Module Adding Additional Text

Text/HTML Module Copying and Pasting Web Content

Text/HTML Module Viewing a Web Page’s Source Code (HTML)

Text/HTML Module Copying a Web Page’s Source Code (HTML)

Text/HTML Module Pasting a Web Page’s Source Code (HTML)

Text/HTML Module Saving a Web Page’s Source Code (HTML)

Remaining Major DNN Modules

Adding a Rounded Corner Container

Adding Center Content Adding a Rounded Corner Container

Adding Center Content Adding Link Lists to a Rounded Corner Container

Adding Center Content Adding a Link to an Email Address

Adding Center Content Adding Link Lists to a Rounded Corner Container

Adding a Tabbed Module Container

Adding Center Content Adding a Tabbed Module Container

Adding Center Content Adding a Tabbed Module Container The default is a two-column display on each tab. You can force a 1-column display, 3-column display, or (if you have short labels) more, but using curly brackets and specifying the column number between them. Locate this tag before the tab name.

Adding Center Content Adding a Tabbed Module Container

Adding an Anouncements Module

Adding Center Content Adding an Announcements Module

Adding an Event Calendar

Adding Center Content Adding an Event Calendar

Adding Center Content Adding an Event Calendar When you hover your mouse over the event, its description pops up

Adding Center Content Adding an Event Calendar If you click on the event, the full details appear

Adding a FAQ Module

Adding Center Content Adding a FAQ Module

Additional Modules

Adding Center Content Adding an RSS Feed Module

This is the URL in the “Location” field:

https://nrmsecure.dfg.ca.gov/documents/RSS/SecureRssHandler.ashx?Cat=LSAHeadquarters&Sub=TechSummariesArchives&ItemLimit=7

https://nrmsecure.dfg.ca.gov/documents/RSS/SecureRssHandler.ashx (URL to the Document Library)

?Cat=LSAHeadquarters (limit to a certain category)

&Sub=TechSummariesArchives (limit to a certain sub-category)

&ItemLimit=7 (Limit to a certain number of items)

Here’s how it breaks down:

Reusing Existing Modules

Reusing Existing Modules Module Default

Reusing Existing Modules Add Existing Module

Reusing Existing Modules Select Page With Existing Module

Reusing Existing Modules Select Correct Module

Reusing Existing Modules Choose Its New Location

Reusing Existing Modules Module Added

DotNetNuke is “open source” software which means that it is available at no charge to anyone who wants to use it. Having the largest install base of any open source content management systems, it is widely supported throughout the Web. The main Website at www.dotnetnuke.com is a rich source of information and support!