As I looked at the homepage, I thought that we might try to dampen warring colors a bit more. So, I amended the link color so that all the links are the same color basically. Then if we feature something, it might stand out a little more.
I saved both the homepage and the stylesheet with different file names so we could compare.
http://library.austincc.edu/mp4-LibHome-X.php (yesterday)
http://library.austincc.edu/mp4-LibHome-XBB.php (today)
Information exchange about the purpose, philosophy, and design of the Library Website.
30 July 2009
Styling changes made
I made some style changes on some converted pages to a standard style that can be used by everyone. examples:
See the styles that I added to csslayout-page4.css below.
Remember that you can always view the styles pages by putting the url to it in your browser address bar and then using View Source if you can't see it as a web page. (http://library.austincc.edu/scripts/csslayout-page4.css)
Note: I made red styles to fit different occasions. Mostly for title kinds of things, we want to consistently use #800000. However, there are some times when one just wants to make a statement or a phrase plain old red so I made instances of that, too.
If you need for me to add other styles like this, let me know.
................................................
span.Red { color: red;}
span.RedBold { color: red; font-weight: bold;}
.styleRed {color: red;}
.styleRedBold { color: red; font-weight: bold;}
span.Red80 { color: #800000;}
span.RedBold80 { color: #800000; font-weight: bold;}
.styleRed80 {color: #800000;}
.styleRedBold80 { color: #800000; font-weight: bold;}
.indentboth28 {padding-right: 28px; padding-left: 28px;}
hr {color:#ccc; background-color:#ccc;height:.1em; border:1px solid; text-align:left;/*this will align it for IE*/
margin: 0 auto 0 0; /*this will align it left for Mozilla*/
}
#hangright {float: right; margin: 4px 5px 20px 20px;
border: 2px solid #ccc; background-color:#E5ECF4;
padding: 10px 10px 10px 10px ; font-size: 90%;line-height: 1.6em;
}
#hangright h4 {color: #800000;}
See the styles that I added to csslayout-page4.css below.
Remember that you can always view the styles pages by putting the url to it in your browser address bar and then using View Source if you can't see it as a web page. (http://library.austincc.edu/scripts/csslayout-page4.css)
Note: I made red styles to fit different occasions. Mostly for title kinds of things, we want to consistently use #800000. However, there are some times when one just wants to make a statement or a phrase plain old red so I made instances of that, too.
If you need for me to add other styles like this, let me know.
................................................
span.Red { color: red;}
span.RedBold { color: red; font-weight: bold;}
.styleRed {color: red;}
.styleRedBold { color: red; font-weight: bold;}
span.Red80 { color: #800000;}
span.RedBold80 { color: #800000; font-weight: bold;}
.styleRed80 {color: #800000;}
.styleRedBold80 { color: #800000; font-weight: bold;}
.indentboth28 {padding-right: 28px; padding-left: 28px;}
hr {color:#ccc; background-color:#ccc;height:.1em; border:1px solid; text-align:left;/*this will align it for IE*/
margin: 0 auto 0 0; /*this will align it left for Mozilla*/
}
#hangright {float: right; margin: 4px 5px 20px 20px;
border: 2px solid #ccc; background-color:#E5ECF4;
padding: 10px 10px 10px 10px ; font-size: 90%;line-height: 1.6em;
}
#hangright h4 {color: #800000;}
28 July 2009
Styling checks to do
Some styling things to do:
==============================
span.Red { color: red;}
span.RedBold { color: red; font-weight: bold;}
.styleRed {color: red}
.styleRedBold { color: red; font-weight: bold;}
.styleRed80 {color: #800000}
.styleRed80Bold { color: #800000; font-weight: bold;}
=================================
.indentboth28 {padding-right: 28px; padding-left: 28px;}
=================================
Change the instances that Adrian uses her red styles to one of these.
Check for the "indentboth" in all files to see what's where.
Check Teresa's box to amend "hangright" a little. [i.e., Use some of message-box, but keep to original concept for consistency.]
=================================
#message-box {
background: #fff;
padding: 5px 5px 5px 5px;
font-family: helvetica, sans serif; color:#000;
font-size: 11px;
font-weight: normal;
line-height:18px;
text-align:left;
}
#hangright {float: right; margin: 4px 5px 20px 20px;
/* border-top: thin solid silver;border-right: thin ridge silver;border-bottom: 2px groove silver;border-left: thin solid silver; */
border: 1px dotted silver; background-color:#E5ECF4;
padding: 6px 6px 6px 6px; font-size: 90%;line-height: 1.6em;
}
==============================
span.Red { color: red;}
span.RedBold { color: red; font-weight: bold;}
.styleRed {color: red}
.styleRedBold { color: red; font-weight: bold;}
.styleRed80 {color: #800000}
.styleRed80Bold { color: #800000; font-weight: bold;}
=================================
.indentboth28 {padding-right: 28px; padding-left: 28px;}
=================================
Change the instances that Adrian uses her red styles to one of these.
Check for the "indentboth" in all files to see what's where.
Check Teresa's box to amend "hangright" a little. [i.e., Use some of message-box, but keep to original concept for consistency.]
=================================
#message-box {
background: #fff;
padding: 5px 5px 5px 5px;
font-family: helvetica, sans serif; color:#000;
font-size: 11px;
font-weight: normal;
line-height:18px;
text-align:left;
}
#hangright {float: right; margin: 4px 5px 20px 20px;
/* border-top: thin solid silver;border-right: thin ridge silver;border-bottom: 2px groove silver;border-left: thin solid silver; */
border: 1px dotted silver; background-color:#E5ECF4;
padding: 6px 6px 6px 6px; font-size: 90%;line-height: 1.6em;
}
21 July 2009
Latest version Libhome
So as not to have too many warring colors on the page, I've toned it down a little. This may change. Here is the url for this version:
http://library.austincc.edu/mp4-LibHome-box4-bigLTRS.php
http://library.austincc.edu/mp4-LibHome-box4-bigLTRS.php
18 July 2009
Moving on to the rest of the /eresources/ pages
I'll begin/finish the rest of the eresources pages.
-->> Change links to php files
-->> Add engines
- AtoZ.htm -- done >> AtoZ.php (formerly mp4-page4-AtoZ-2.php)
- AtoZ-sans.htm
- ebooks.htm -- done >> ebooks.php (formerly mp4-page4-ebooks-2.php)
- engines.htm
- Findarticles.htm -- done >> findarticles.php (formerly mp4-page3-ERES-x4.php)
- index.htm -- ditto above file is this -- will rename index.php when launch
- OtherLibs.htm
- pubmed-pop.htm [don't need to change]
- searching-tips.htm (linked from engines page)
- searchsite.htm
- SubGen.htm -- done >>SubGen.php (formerly mp4-page4-SubGen-2.php)
-->> Change links to php files
-->> Add engines
Library directories finished
All the new directories are in
http://library.austincc.edu/DirNEW/
They are all linked from the base page at
http://library.austincc.edu/gen-info/DirNEW/LS-Dir.php
Some notes:
-- For the most part, I was able to use the campus library staff photos in the /campuses/ directory. When the photos were too high, I trimmed them to a shorter size when I could. I had to resize the entire NRG photo because I couldn't trim it at all. Perhaps when we have new photos, we need to rethink how we place people.
-- For the Administrative Offices photo, I just linked to the campus photo on the RGC campus web site. That worked pretty well.
-- I used no photo on the FAX number directory.
http://library.austincc.edu/DirNEW/
They are all linked from the base page at
http://library.austincc.edu/gen-info/DirNEW/LS-Dir.php
Some notes:
-- For the most part, I was able to use the campus library staff photos in the /campuses/ directory. When the photos were too high, I trimmed them to a shorter size when I could. I had to resize the entire NRG photo because I couldn't trim it at all. Perhaps when we have new photos, we need to rethink how we place people.
-- For the Administrative Offices photo, I just linked to the campus photo on the RGC campus web site. That worked pretty well.
-- I used no photo on the FAX number directory.
15 July 2009
Adding a Feedback section to the homepage
At Teresa's suggestion, I've added a Feedback section and graphic to the homepage. See the result at
http://library.austincc.edu/mp4-LibHome[white]-box3Feed2.php
I'll work on the preferred Search Box (with the square corners) and play around with the color a little. (Adrian prefers not having a color different from the colors currently on the page.)
I want to have people see it so it shouldn't disappear into the page. However, I don't want it jump out at you so much that students will think that you can find articles by entering information here.
http://library.austincc.edu/mp4-LibHome[white]-box3Feed2.php
I'll work on the preferred Search Box (with the square corners) and play around with the color a little. (Adrian prefers not having a color different from the colors currently on the page.)
I want to have people see it so it shouldn't disappear into the page. However, I don't want it jump out at you so much that students will think that you can find articles by entering information here.
12 July 2009
Some thoughts about LS Directory Pages Redesign09
-------------------------------------------------------------
1 LS-DIR
-------------------------------------------------------------
1.1 Page leading to other directories
1.2 Use rotating campus graphics as we do on the current library home page.
1.2.1 See code from current home page
1.2.2 [[a href="http://library.austincc.edu/gen-info/campuses/"][img src="http://library.austincc.edu/graphics/campusPIX/rotate.php" hspace="5" align="center" alt="See our Featured Campus" border="0"/][/a]]
-------------------------------------------------------------
2 OTHER DIRECTORIES -- mostly campus directories
-------------------------------------------------------------
The thought is that the content is OK, but we could use the picture of the staff for each campus library somewhere on the page. We'd get these pictures from the /campuses/ folder which we currently link to from each directory page under the address. Example: More about the RGC Library
2.1 ls-dir-admin
2.1.1 no image to use here
2.2 ls-dir-cyp
2.2.1 Use campus staff image
2.3 ls-dir-evc
2.3.1 Use campus staff image
2.4 ls-dir-nrg
2.4.1 Use campus staff image
2.5 ls-dir-pin
2.5.1 Use campus staff image
2.6 ls-dir-rgc
2.6.1 Use campus staff image
2.7 ls-dir-rvs
2.7.1 Use campus staff image
2.8 ls-dir-sac
2.8.1 Use campus staff image
2.9 ls-dir-tsa
2.9.1 Use campus staff image
2.10 ls-dir-fax
2.10.1 no image to use here
2.11 Probably content is pretty much transferable
-------------------------------------------------------------
3 Alphabetic List of all staff
-------------------------------------------------------------
3.1 Use rotating campus graphics
3.1.1 See code from current home page
3.1.2 [[a href="http://library.austincc.edu/gen-info/campuses/"][img src="http://library.austincc.edu/graphics/campusPIX/rotate.php" hspace="5" align="center" alt="See our Featured Campus" border="0"/][/a]]
3.2 Probably content is pretty much transferable
1 LS-DIR
-------------------------------------------------------------
1.1 Page leading to other directories
1.2 Use rotating campus graphics as we do on the current library home page.
1.2.1 See code from current home page
1.2.2 [[a href="http://library.austincc.edu/gen-info/campuses/"][img src="http://library.austincc.edu/graphics/campusPIX/rotate.php" hspace="5" align="center" alt="See our Featured Campus" border="0"/][/a]]
-------------------------------------------------------------
2 OTHER DIRECTORIES -- mostly campus directories
-------------------------------------------------------------
The thought is that the content is OK, but we could use the picture of the staff for each campus library somewhere on the page. We'd get these pictures from the /campuses/ folder which we currently link to from each directory page under the address. Example: More about the RGC Library
2.1 ls-dir-admin
2.1.1 no image to use here
2.2 ls-dir-cyp
2.2.1 Use campus staff image
2.3 ls-dir-evc
2.3.1 Use campus staff image
2.4 ls-dir-nrg
2.4.1 Use campus staff image
2.5 ls-dir-pin
2.5.1 Use campus staff image
2.6 ls-dir-rgc
2.6.1 Use campus staff image
2.7 ls-dir-rvs
2.7.1 Use campus staff image
2.8 ls-dir-sac
2.8.1 Use campus staff image
2.9 ls-dir-tsa
2.9.1 Use campus staff image
2.10 ls-dir-fax
2.10.1 no image to use here
2.11 Probably content is pretty much transferable
-------------------------------------------------------------
3 Alphabetic List of all staff
-------------------------------------------------------------
3.1 Use rotating campus graphics
3.1.1 See code from current home page
3.1.2 [[a href="http://library.austincc.edu/gen-info/campuses/"][img src="http://library.austincc.edu/graphics/campusPIX/rotate.php" hspace="5" align="center" alt="See our Featured Campus" border="0"/][/a]]
3.2 Probably content is pretty much transferable
Sunday - 12 July - htm to php links cleanup FAQs
I'm cleaning up the ".htm" links on the FAQs this morning.
There are some pages with that extension that probably don't need to be changed at this time since they are what I term end pages. That is, they are a group of pages that don't need the banner or php includes of any kind. They are mostly informative about a specific thing like wireless laptops, or maybe even the textbook collection.
There are a few links that I am not sure will be finished by the time we go live, like the reserves pages. I've left those links alone, too.
There are some pages with that extension that probably don't need to be changed at this time since they are what I term end pages. That is, they are a group of pages that don't need the banner or php includes of any kind. They are mostly informative about a specific thing like wireless laptops, or maybe even the textbook collection.
There are a few links that I am not sure will be finished by the time we go live, like the reserves pages. I've left those links alone, too.
10 July 2009
Progress on the homepage
After our conference call yesterday, I've implemented some of the changes we talked about. Since Pam Spooner needed something for an orientation for the fall, I put together this page. [I did warn her that it might not end up looking exactly like this; but she was satisfied that it would do.] Two of the links are live for her purposes -- online tutorials and Get Help.
The first example -- the one Pam used -- uses a rounded corner box that uses images. ( I got the original box code and style from Ryan Thrash.) The color is set because of the images colors. I can play around a bit with the size. See this example at
http://library.austincc.edu/mp4-LibHome[white]-box.php
The second example isn't as pretty but I can change the color and play around a lot with this one.
http://library.austincc.edu/mp4-LibHome[white]-box3.php
The first example -- the one Pam used -- uses a rounded corner box that uses images. ( I got the original box code and style from Ryan Thrash.) The color is set because of the images colors. I can play around a bit with the size. See this example at
http://library.austincc.edu/mp4-LibHome[white]-box.php
The second example isn't as pretty but I can change the color and play around a lot with this one.
http://library.austincc.edu/mp4-LibHome[white]-box3.php
09 July 2009
Converting links to php extension
When converting pages to the new look, many if not most pages will have a "php" extension. These pages will probably have the same filename but the new extension. For example,
We will need to check all the links to library web pages within our new look pages for links to the old "htm" pages.
Note: The template we must use when we are doing most of the remaining pages -- especially, pages that have links to anchors -- is m4-page4.php which resides in the root directory.
(http://library.austincc.edu/mp4-page4.php)
- faq-ACC-contact.htm will now be faq-ACC-contact.php
- ask.htm >>>>> ask.php
- studyguides.htm >>>>> studyguides.php
We will need to check all the links to library web pages within our new look pages for links to the old "htm" pages.
Note: The template we must use when we are doing most of the remaining pages -- especially, pages that have links to anchors -- is m4-page4.php which resides in the root directory.
(http://library.austincc.edu/mp4-page4.php)
05 July 2009
Progress on Help Pages & E-Resources pages
General Note: Any time "link to anchors" is needed on a page, we have to use the page 4 template even if it is what we might think of as a page 3 level.
I've done the major HELP pages:
Have been working on a general template for ERESOURCES pages. Have completed
I've done the major HELP pages:
- Ask a Librarian
- Library FAQs (not sure of progress on individual FAQs)
- Research Shortcuts [Note: working on general subject list to shortcuts; need to revise SubGen with new links when finished.]
- Documentation guides
- Study Guides
- Online Tutorials
- Off-Campus/Distance Learners
- Research/Reference Help [Note: will be the index page for the breadcrumbs.]
- Library Widgets & Tools
Have been working on a general template for ERESOURCES pages. Have completed
- AtoZ [Note: I've created an alternate list emulating the navigation left sidebar to look at. We need to decide if this is the way to go. I don't favor it but I am open.]
- SubGen
- Find Articles & Research Info [Note: index page for breadcrumbs.]
- e-Books
Subscribe to:
Posts (Atom)