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

Today’s Presentation 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?

Today’s Presentation 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

Today’s Presentation 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

Today’s Presentation The Default Module (Text/HTML) Editing the Module Settings Editing the Module’s Contents Adding Links Inserting Images Adding New Text Pasting Existing Text

Today’s Presentation Remaining Major DNN Modules Rounded Corner Module Tabbed Module Announcements Event Calendar Frequently Asked Questions (FAQ) Additional Modules RSS Feeds Reusing an Existing Module

Today’s Presentation 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

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

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)

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 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 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 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 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)

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 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 an Announcements Module

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 Center Content Adding a FAQ Module

Adding Center Content Adding an RSS Feed Module

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

Adding Center Content Adding an RSS Feed Module 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 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 Resources 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!

DotNetNuke Resources You can also join the DotNetNuke forums at: http://www.dotnetnuke.com/Community/Forums/tabid/795/Default.aspx

DotNetNuke Resources You can join the DotNetNuke user group at: http://www.dotnetnuke.com/Community/UserGroups/tabid/1074/Default.aspx

DotNetNuke Resources The DotNetNuke FAQ is located at: http://www.dotnetnuke.com/Resources/Knowledge/FrequentlyAskedQuestions/tabid/546/Default.aspx

DotNetNuke Resources Forms Master Module For those using the Forms Master module, here is a good resource, the Forms Master User Guide: http://www.code5systems.com/default.aspx?tabid=211

DotNetNuke Resources For those using the Forms Master module, here is a good resource, the Forms Master User Guide: http://www.code5systems.com/default.aspx?tabid=211

Accessibility Resources http://www.webtools.ca.gov/Accessibility/ http://www.webaim.org/ http://www.digital-web.com/articles/accessibility_from_the_ground_up/ http://www.hisoftware.com/uaen/WebHelp/uaen.htm http://www.webreference.com/authoring/design/usability/accessibility/index.html http:// jimthatcher.com/whatnot.htm http:// www.adobe.com /accessibility/

Dfg Intranet Development

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to Dfg Intranet Development (20)

More from California Wildlife Conservation Board (11)

Recently uploaded (20)

Dfg Intranet Development