Small Screens Banner & Navigation Bar Fix

Banner & Nav Bar For Small Screens

Minimal Nav Bar

• Parse navbar.php
• Create individual files ( in includes/NavPages)
• AboutUs
• LocHours
• SvcProg
• BksArt
• GetHelp
• YrRecord
• QLinks
•  Create sub Includes (includes/NavPages)
• Create pages in appropriate folders
• example page: About-Nav.php in /Gen-Info/ folder
• Use only minimal info
• Include appropriate includes/NavPages file
• Create nav-minimal.php
• no drop menu
• link to new minimal pages
• may need to reduces font size
• See also: Script that works

Banner: header-minimal.php

• =    Smaller ACC Logo
• =    Reduce space over LS logo
• =    Modify ACC Links
• =    Delete ACC Links
• =    See also: Script that works

Script that works

    <header2 class="show-for-small">
<!-- This next section contains header for small screens. -->
<?php include("http://library.austincc.edu/includes/header-minimal.php"); ?>
    </header2> <!-- end of minimal header -->

    <header class="show-for-medium-up">
<!-- This next section contains header for medium up screens. -->
<?php include("http://library.austincc.edu/includes/header.php"); ?>
    </header>
 
 <topnav2 class="show-for-small">
<!-- This next section contains top navigation bar for small screens. -->
<?php include("http://library.austincc.edu/includes/nav-minimal.htm"); ?>
</topnav2> <!-- end of minimal nav -->

 <topnav class="show-for-medium-up">
<!-- This next section contains top navigation bar for small screens. -->
<?php include("http://library.austincc.edu/includes/navbar.php"); ?>
</topnav> <!-- end of drop menu nav -->

• Gather into one file (HeaderNav.php)
• Replace current separate lines of code with HeaderNav php include

Minimal Nav Bar Menus

Things that would  make the smaller screens look and work better, maybe:

• Use the same mechanism as with hiding the left side bar on 2nd tier pages to hide the navbar.php and show the minimal nav bar file.  (http://foundation.zurb.com/docs/v/4.3.2/components/visibility.html)
• To be created nav-minimal.php
• each entry 
• no drop menu
• link to a page with nothing but links that would be on the drop menu
• make all equal size so will display neatly
• note: they are already of equal size
• maybe need fewer?? or smaller font
• Think also about making the banner smaller by hiding and showing
• smaller ACC logo
• reduce space over LS logo
• leave ACC home off ACC links??
• See mind map (http://irtstaff.austincc.edu/peloquin/a-web/SmallScreensNavBanner.pdf)

Banner for Campus Guides

I've been working on banners for Campus Guides.  Here are examples of two different banners using the different guide groups:

http://irtstaff.austincc.edu/peloquin/CampusGuides/NewBannerEG.htm

I am now able to add the navigation bar and have an example here:
http://researchguides.austincc.edu/BestEBN
Some things to note:

• This is an abridged nav bar because the original construct is too wide for the Campus Guides platform.
• I had to create a separate style sheet to link to called CG-nav.css
• This nav bar can be used with whatever banner we decide on.
• I'd like to reduce the vertical space the bar occupies.  I'll work on this.
• I'd also like to do the same with the banner so will work on that as well.

Amendment to entry:

• I did add the nav bar to all of the test groups 
• I did reduce the vertical space on both the nav bar and the banner.
• Reduces the cell height to 35 and then reduced all instances of 50px to 35px on nav bar.
• Resized the graphics height to 88px and reduced padding to align properly in banner.

Website Launch set for 20 July 2014

EVENTS:

• Student testing of the home page was done the second week in July. 
• Information gotten from the survey was incorporated into the home page.

• Launch is planned for 20 July 2014.  
• A sneak peek slideshow is available for Library Users and posted on the home page.  See below.

---

Coming Soon -- 20 July!
Take a SNEAK PEEK at the new look of the Library Web Site.

Very soon, Library Services will be moving to a new look to match the new design of ACC Web Site. All the usual features and services are still there.

---

• The structure, folders, files, reviewers, editors are being compiled to maintain the redesigned site.
• Training sessions for editors will be held

•   The time before classes begin for the fall will be used to tweak and correct the new site.

Logo, icons, directories

Directories subsume Campus Pages

What's on the page:

• campus library address
• link to map
• hours of operation
• checkout and ref desk phone numbers
• list of staff -- email, etc.
• photos of both library staff and facilities added to the slider on the page 
• links to other directories

Note:  Links to campus pages on other pages (like hours/loc) have been changed to directory pages

Info Lit Logo
The IL Team has a new logo.
The nature of the new logo makes creation of an icon problematic. This is my latest attempt.  I have asked Paula Ribeiro for advice.
Hmmm... another attempt Blue too close in color to the Question mark.