CISAT Creative Services Design Blogtag:creative.cisat.jmu.edu,2008-11-11:/designblog//22009-08-20T13:38:01ZMovable Type 4.24-enIs It Time To Upgrade Your Browser?tag:creative.cisat.jmu.edu,2009:/designblog//2.252009-08-20T13:26:09Z2009-08-20T13:38:01ZCreative Services is currently working on extensive testing to make sure the new department websites are accessible and usable in a wide range of web browsers and operating systems, from Internet Explorer (IE) to the newest browser on the web,...Theresa Thorne
Internet Explorer (IE) to the newest browser on the web, Google Chrome. If you are using a really old version of IE (version 6 or earlier) or any other browser, now would be a great time to upgrade!
Internet Explorer 6 is a widely used but severely outdated browser; it's
nearly 8 years old, which is practically ancient in Internet years! Popular websites like YouTube and Digg are starting to drop support for IE6 in favor of more modern browsers, and JMU's own recommended minimum computer configuration requires Internet Explorer 7.
When we build our websites, we strive to make them functional in the widest range of browsers possible. If you view our new websites in IE6, however, you will be greeted with a message
prompting you to upgrade your browser. Upgrading to a more recent browser,
like Internet Explorer 8 or FireFox 3.5, is important so that you may experience all of
the features of our new websites as they were intended. Essential
parts of the new department sites will still work in IE6 (with a
little help from Javascript), but everything looks better and functions optimally in modern browsers.
Updating your browser is easy and painless, and will allow you to enjoy the best the web has to offer, in both features and security. Here are a few links where you can find the most recent versions of popular web browsers, all as free downloads:
]]>
Design Theme Selectedtag:creative.cisat.jmu.edu,2009:/designblog//2.242009-07-01T18:19:19Z2009-07-01T18:37:33ZIn the spring, Leadership Council appointed a cross-department committee to advise Creative Services' graphic designer on the creation of a theme to be used for the 2009 college-wide web redesign effort.The work of that committee was completed and the theme...Christine Letsky-Anderson The work of that committee was completed and the theme was approved by leadership council.
We are pleased to share the new design for departmental level sites.
Our staff looks forward to working with each department in customizing the colors and design elements of the theme to best suit your needs.
]]>
Standard Outline for Departmental Websitestag:creative.cisat.jmu.edu,2009:/designblog//2.232009-03-16T18:15:36Z2009-03-16T18:38:33ZChristine Letsky-Anderson All pages will include near the top: Search, Contact Us, Find Us, Support Us
All pages will include in the footer: Date Last Updated, Email Address for Information Publisher, CISAT Logo, JMU Privacy Policy
The Home Page Will Include:
Feature Stories/Strong Photography
News and Announcements
Prominent List of Academic Programs - these will link directly to program level websites which will follow a second standard outline which is currently under development. View a working version of the program level outline.
Welcome from Department Head
An About Section Will Include:
Accreditation/Awards/Recognition
Mission/Departmental Values
History
Links to Departmental Research Labs/Projects
Links to Outreach Units/Projects
Department Organization Chart
Internal Information (Governance, Forms for Faculty, Committee Lists)
An Our People Section Will Include
Faculty/Staff Directory
Profile Pages
List of Program Related Contacts
A Job Opportunities Section Will Include
Job listings for Faculty, Staff, Students and G.A.s
]]>
Design Trends for Modern Websitestag:creative.cisat.jmu.edu,2009:/designblog//2.202009-01-26T18:29:01Z2009-08-20T20:36:09ZThe look of the World Wide Web is constantly changing and websites often become outdated and lose visual appeal. Fresh looking, well designed, easy to use websites generally share the following features:Simplicity Simplicity is key in modern web design. A...Josh See Simplicity
Simplicity is key in modern web design. A simple design not only looks better but is also more user-friendly. Web users want to get the information sought in as little time as possible. The more complicated a webpage, the longer it will take to find this information. A simple website design loads faster, is clear and easy to read, and is easier to navigate.
Animated content, splash screens, and other elements that move or blink can be distracting and should be used sparingly. Heavy use of icons, unusual fonts and overly flashy colors can overwhelm the eye and should also be avoided. Instead, professional looking photography and simple typography should be used to create visual appeal.
Subtle 3D Effects in Moderation
3D effects are illusions that make things appear more like they would outside of the computer in the real world. Some examples of these effects can be seen on the Google home page (www.google.com). The shaded area beneath the Google logo is a drop shadow, a popular effect that makes an object appear to be floating above the background. The input field below the logo is an example of a beveled edge created by subtle color changes along the edge of a shape. Beveled effects help distinguish elements from the rest of the page and strengthen container properties. The buttons below the input field appear rounded and glassy. This is an example of the glass effect.
These effects can add richness to a web page and can be powerful devices for directing attention to important information. Also, 3D effects can be used to suggest that an element is clickable or interactive. However, if overused 3D graphics can significantly increase file size and cause confusion, so these effects must be used sparingly.
Soft, Neutral Background Colors
Many websites have white or nearly white colors as backgrounds. This does not distract from the content and gives the page a soft, neutral base on top of which brighter colors can be used to direct attention to important information.
Plenty of White Space
On a web page the term white space refers to the blank space between elements such as columns of text, buttons or images. White space is an important part of any design. Properly used white space can give a page a stylish or sophisticated appearance. The balance between positive and negative space is vital to creating visual appeal. A page with too little white space appears cluttered and complicated while over use can give the impression the page is unfinished.
Hierarchy of Text and Big Typography
The size and boldness of text are used to control attention. The reader's eye will look first at the largest, most accessible information. The bulk of the information, the body of the text, should be the smallest. A clear contrast between font sizes is necessary to develop a clear hierarchy of information. Ideally, in any design there are three clearly different intensities of text.
There is a trend in modern Web Design toward the use of large font sizes beyond 36 pixels to draw attention to the most important information. Larger fonts are easier to read. Also, typography can be very attractive and making it large is a great way to show it off.
Professional Looking Photography
Using photos is a great way to make a website more appealing and improve the look. However, poor quality photos can ruin even the nicest looking design. Photos displayed on websites should be clear and in focus, with the proper lighting, and a clean, uncluttered background. They should also be dynamic and lively; a photo of students interacting at an interesting event for example, rather than a posed group or lecturer speaking. The colors in a photo should fit the color scheme the rest of the site uses and should never clash with the design. When suitable personal photos aren't available, almost any image imaginable can be purchased online. www.istock.com is a great place to find inexpensive, professional looking stock photography.
Consistency
Consistency is important in all areas of design. Repeating elements and consistent treatment of type within a design shows the viewer how the site navigation works and how to find the information they seek. Good websites have pages that share a consistent layout. Though the content changes from page to page, the way it is displayed should stay the same. Without consistency a web user might think they have landed on a different site when the main elements change. A great way to ensure websites have this consistency is to use a template. Consistency across departmental sites will be an important consideration as we go through the redesign process.
Our design team is currently brainstorming and laying out initial design ideas for this project. If you have any suggestions, concerns or ideas of your own, now is a great time to let us know. We would like faculty and staff from all departments to be involved in the graphic design process. Our goal is to design appealing departmental websites and incorporate the latest technology and trends in web design. Please do not hesitate to voice your opinion.
]]>
Reminder!tag:creative.cisat.jmu.edu,2009:/designblog//2.192009-01-15T16:09:45Z2009-01-15T16:14:23ZTeresa French The first is on Tuesday, January 20th at 2:00 p.m. in the nTelos room.
The following week an additional Open Forum will be held on Wednesday, January 28th at 10:30 a.m. in Taylor 304.
If you weren't able to join us for December's Open Forum we hope to see you at one of the upcoming events! If you aren't available for either session, we hope that you will take a few minutes to share your ideas in our online survey: http://www.surveygizmo.com/s/82478/initial-website-opinions.
Your thoughts and ideas will be shared with Leadership Council in the spring and will influence their decisions in this process. ]]>
Open Forum Addedtag:creative.cisat.jmu.edu,2008:/designblog//2.182008-12-10T19:20:32Z2008-12-16T19:58:47ZAn additional Open Forum will be held on Wednesday, January 28, 2009 at 10:30 a.m. in Taylor 304 to discuss the college's departmental website redesign project. As in the two previously scheduled Open Forums, the following topics will be on...Teresa French
Wednesday, January 28, 2009 at 10:30 a.m. in Taylor 304 to discuss the college's departmental website redesign project.
As in the two previously scheduled Open Forums, the following topics will be on the table for discussion.
What do you like or dislike about your current departmental website?
What do you think is the most important feature that your departmental website should include?
Who do you think is your primary audience for your departmental website?
What do you think is the purpose of a departmental website?
What are some other websites you like? Please share some examples and explain what you like about them. (we will be able to project site onto a screen for discussion)
It is our hope that by using an alternate location more people will be able to participate in this process.
]]>
Web Statistics and Analyticstag:creative.cisat.jmu.edu,2008:/designblog//2.172008-12-02T17:24:55Z2008-12-02T20:32:21ZAn important part of redesigning the CISAT departmental websites will be determining:Who the audience for each website is,What information they are looking for,and What software capabilities they have to view that information.The quickest and easiest way to gather this type...Theresa Thorne
Who the audience for each website is,
What information they are looking for,
and What software capabilities they have to view that information.
The quickest and easiest way to gather this type of information about website visitors is through a web statistics or web analytics program. These programs use one of two methods to track how many users visit the site, what pages they view, and even what browsers they use. Each method has it's pros and cons.
Web Server Log Analysis
One way a web analytics program can collect information on users is by reading and organizing server logs. Most web servers have the capability to record the number of visits a website receives, and possibly other information as well. The server stores that information in log files that are very difficult to read and understand. A web analytics program can automatically read through those log files, organize the information, and present it in easy to read charts, graphs and tables.
A major benefit of using a server log analytics type program is that it does not require extra code on websites to collect information. However, it is not possible to collect some potentially helpful information from users, like their browser size or Javascript capabilities, using this method.
Page Tagging
Another way web analytics programs can collect information is by using client-side script with a method called page tagging. Client-side script is code written to run in a users browser when they load a website. Javascript is most commonly used in this type of application.
The major drawback to using a page tagging form of web analytics is that it requires extra code to be placed on each and every web page that will collect information, creating extra work during development and possibly slowing page load times for the end user. However, with page tagging we can gather important information on users' browser sizes and capabilities that can dramatically influence website design and content decisions.
Choosing A Web Analytics Program
The nice thing about both types of web analytics programs is that they are not mutually exclusive, meaning there's no reason we can't use both types of programs at the same time. Of course, there are other factors that weigh into the decision of which program(s) we will ultimately use for the CISAT Departmental ReDesign Project other than those I outlined above, such as cost, program support and compatibility. We are currently in the process of reviewing several programs with the potential to meet our needs in CISAT. You can review a list of the pros and cons (PDF) for some of the programs we are considering.
If you would like to experiment with a web analytics program yourself, both Google Analytics and StatCounter are free page tagging type programs available to the public.
]]>
Exploring Trends and Techniques in Higher Education Web Developmenttag:creative.cisat.jmu.edu,2008:/designblog//2.162008-11-24T15:41:18Z2008-11-24T16:05:06ZTeresa French We looked at sites to evaluate not only the visual aspect but also looked at such elements as how content was arranged, how much continuity there was in the overall design between departments and whether the programming met federally mandated accessibility standards. We also considered such things as how the sites rendered in different browsers, how long pages took to load and how easy the site was to navigate. Another consideration was how other universities incorporated social networking into their sites to keep their users 'connected'. The challenge we face as a public university is to be compliant with ADA regulations while presenting relevant content in a visually satisfying 'readable' format. In other words, how do we make our sites look fresh and exciting and usable for everyone regardless of physical limitations?
Some of the college sites we reviewed met this challenge better than others did. Below are listed a few of our particular favorite sites and reasons why we liked them best. There were several sites that include parts that we both liked and disliked. You can download a longer list (PDF) of sites we felt met the criteria.
This is a good example of a well coded site from a technical point of view that still manages to be visually appealing and usable. As another public university they managed to successfully incorporate accessibility compliance with modern website features.
This site used color and different size fonts effectively to arrange information nicely. Lower level sites were consistent with the main site. They all seemed to 'fit' together but were distinctive.
We really liked the simplicity of this website's design. There's plenty of white space, and the design extends to fit any size window. A favorite part is the use of color to differentiate between areas of the site. (About Saxion, Programmes, and Study at Saxion) ]]>
Open Forums Scheduledtag:creative.cisat.jmu.edu,2008:/designblog//2.152008-11-19T18:03:05Z2008-11-19T18:15:14ZCreative Services will hold two open forums to discuss the college's departmental websites.Wednesday December 10th at 10:00 a.m. (nTelos room)Tuesday January 20th at 2:00 p.m. (nTelos room)The following topics will be on the table for discussion.What do you like or...Christine Letsky-Anderson
Wednesday December 10th at 10:00 a.m. (nTelos room)
Tuesday January 20th at 2:00 p.m. (nTelos room)
The following topics will be on the table for discussion.
What do you like or dislike about your current departmental website?
What do you think is the most important feature that your departmental website should include?
Who do you think is your primary audience for your departmental website?
What do you think is the purpose of a departmental website?
What are some other websites you like? Please share some examples and explain what you like about them. (we will be able to project site onto a screen for discussion)
]]>
CISAT's Departmental Websites Will Undergo a Major Redesigntag:creative.cisat.jmu.edu,2008:/designblog//2.142008-11-19T17:44:29Z2008-11-19T17:57:28ZChristine Letsky-Anderson On November 11th, Christine Letsky-Anderson (Creative Services, Director) presented an overview of the project to the CISAT Leadership Council. The presentation included stages of the project, some general ideas and a timeline for the process. A copy of the presentation is available online in PDF format.
Creative Services will be holding two open forums (details to follow) for CISAT faculty, staff and students to hear suggestions and feedback regarding departmental websites. A survey will also be made available for anyone who can not attend one of the forums. We hope that the blog will facilitate ongoing communication as we work through the project.
We're looking forward to working with everyone on this project and hope you will take the time to share your ideas. ]]>
