Web Styling 101: Quick Tips

Want to become a web fashionista? Or, do you just want some styling tips to help engage your audience? Look no further, because I've got some tips for you!

Web Services intends to offer a "Styling for the Web" course soon, but in the meantime, please make use of the following tips that I extracted from Hampshire College in Amherst, MA:

• Use short paragraphs. Large blocks of text can look like walls, and act as such to the user. Research has shown that short, concise paragraphs and bulleted lists work best for web use.

• Your first paragraph is the most important one. As such, it should be brief, clear, and to the point in order to quickly engage the user. One sentence paragraphs are encouraged.

• Write in an inverted pyramid style. Place the most important information at the top, extra info toward the bottom.

• In most cases, it's best to use subheadings to clarify the subject of various sections on a page. Users want to skim and scan for information. Headings help this process exponentially.
  
  
• Don't waste space "welcoming" people to the page. There is no need, and most users ignore any welcome text as filler. Get to the meat - that is what they came for.

• Just when you think you are done, look again. Cut, cut, and cut your text until it is the most essential message.

• Name your page clearly. The page title and the navigation title should match as closely as possible. They should also clearly articulate the subject of the page. Do not use "Welcome to Marketing & Communications!" Instead, say "Department of Marketing & Communications."

• Do not tell users to "use the links on the left." Put the information or links you are referring to right there instead, or just let them find the navigation on their own - if it is clearly visible on the page they will find it.

• Use bold and italics sparingly. Bold should be used for headings and then sparingly for any other emphasis. Too much bold makes text harder, not easier, to read and differentiate.

• Italics should also be used sparingly. Italics on the web are also hard to read. Try to avoid making long paragraphs italic - you are making the text harder to read, not giving it emphasis. Exceptions are book titles and other grammar stylings.

• Do not underline text. On the web underline = link. Giving a sentence an underline for emphasis is misleading. And again, you don't really need it.

• Use all caps very sparingly. Research shows all caps are harder to read than mixed case.

• Don't try to emphasize too much. If you use bolded headings, short paragraphs, and bulleted lists, you should not need to rely on italics, all caps, or underlining for emphasis. These styles can make the page look messy and compete for the user's attention.

• Avoid exclamation points. We know Tarleton is awesome! We love it! But exclamation points on websites make can make it look unprofessional! Let the content speak for itself.

Headers and other images

• Use a header image that is relevant to the subject matter.

• Avoid pictures of buildings without people. You may know that a picture of the exterior of the Welcome Center fits well for a page, but to most people, and especially to those who are not familiar with our campus, it is meaningless. Remember your users do not have your insider knowledge. Give them pictures of people interacting instead of abstract building pics whenever possible.

• Let the Web Services office help you put images neatly into your content area. Break up your text with relevant images.
  
  
• Make sure you have accurate copyright permissions to use any picture. Just because it is on the internet does not mean it is free to use. When in doubt, please contact Daphne Hunt at djhunt@tarleton.edu.

Miscellaneous

• Link, link, and link to relevant information. If you mention a program, link to it. If you include an email address, make it an email link. If you mention a faculty member, link to their bio page. Don't make people go and search for something that you mention if it already has a page somewhere.

• Make your links contextual. Avoid "Click here." Use part of the actual referencing sentence as the link. Research shows that users like them to be 4-8 words in length.

Do not use:
For commencement information for graduating students click here.

Do use:
Commencement information for graduating students is now available.

• Avoid jump (anchor) links except on long pages such as FAQs. Research shows that today's web users don't mind scrolling if the content is useful and easy to scan. Anchor points just make pages longer, and are used too often on pages that are already a reasonable length. If you are not sure, please contact Daphne Hunt at djhunt@tarleton.edu so we can discuss it. If you do want to use anchor links, then there are best practices that should be followed.

• Keep your content up to date. Out-of-date content reflects poorly on the user's overall opinion of the website and the university. It also degrades the trust of the user to later find information on the website. If you put up info that needs to be updated later, mark it on your calendar so you don't forget.

 -Daphne

Tips were extracted from Hampshire College's website.

Highlights from the HighEdWeb 2014 Conference - Daphne's Perspective

Oh, Oregon...do I miss thee. Your gigantic trees, your rolling hills and towering mountains, your soft never-ending rain. Oh - and the 700+ congregation of higher ed web professionals!

Morgan and I had the opportunity to attend this year's HighEdWeb conference in Portland, Oregon which was just last week. This is one of the best conferences in the country for those in our profession. Savvy speakers, seven different tracks, networking and collaboration sessions/events, workshops, and a WHOLE lot of enthusiasm.

Popular session at #heweb14 (#mpd3) with Morgan and Daphne sitting on the floor! Courtesy +Lougan Bishop

Morgan and I split up for many of the sessions and I attended quite a few management and professional development ones in addition to some in marketing, accessibility/usability, and development/architecture. I have to say, some of the most interesting sessions were in the management/professional development track.

The best of conference winner is Dave Cameron's HUMAN at work presentation about how to deal with "all the things" at work, including tasks, people, stress, and information overload.

His five goals for being a productive human being are so simple yet brilliant.

1. Be honest - with yourself and others, subjectively and objectively. Pay attention to your internalized priorities, be real with yourself when interpreting your own performance levels, and don't live in denial. But also measure and capture data, develop reports and analyze your progress - facts speak volumes. Admit to your mistakes with others and give the feedback you would want to hear yourself.
   
   
2. Be unafraid - mistakes are just a part of life. Have confidence, and don't be intimidated by those rock stars! Let go of those irrational fears like change and gossip. And don't be overwhelmed by complexity - take it one step at a time.
   
   
3. Be mindful and focused. Tools to help your workday are AWESOME but don't let them rule your life. We can easily get overwhelmed by email, tasks, calendars and meetings. Use email just for communicating to groups, documenting info, and sending files - don't let it be the boss of you. Turn your email push notifications off and commit to checking your email just twice a day. Review your outstanding tasks daily and prioritize, place them in a project management system like Asana (that is what Web Services uses!) Use your calendar to schedule work tasks and breaks, and consider things like "no-meeting Mondays." Speaking of meetings, don't sit on your phone during them and be sure to take notes and report/share with your team.
   
   
4. Be active - walk and get up periodically. Build a work-out routine. Staying active helps your focus and energy throughout the day. Start your day with a "focus" activity such as a card game, puzzle, or drawing to get your brain going. Keep your workspace clean and organized and consider a more ergonomic desk set-up such as a standing desk. Listen to music with headphones while you are trying to concentrate.
   
   
5. Be nice to your fellow humans! Be a proud member of your team. Support your co-workers, be social, take ownership of your role, and give them a heads-up when you can. Show up to work with a positive attitude - if you are having a bad day, just put on a smile and bear it. Treat others the way you want to be treated.

 

So in summary we have:

Graphic extracted from Dave Cameron's slide deck.

Isn't that a nifty acronym?

To view the whole slide deck, check out Dave Cameron's Tumblr. To view related tweets, look up #heweb14 and #mpd9 on Twitter.

-Daphne

"Meet the Staff" Series - Daphne Hunt, Director

Web Services would like to share with the community a bit about our team such as what we do, "a day in the life", and other interesting things about the make-up of our team members. Each Web Services member contributes something very important (and very different) to the overall team. To start off with, here is a little bit about myself! -Daphne

Full name: Daphne Jo Hunt

Title: Director of Web Services
Length of time in Web Services at Tarleton: 8 years
Top three areas of expertise: Web strategy, web team/project management, graphic design
Topic Interests: Same as expertise, with additional interests in video production, photography, and web analytics
Favorite thing about my job: Working with such a talented group of staff members each and every day!
Favorite hobby: Making crafts! I have a craft room at home and have recently made hair bows, a fall wreath, and a "fairy garden" for my bird bath.

A "Day in the Life":

1. Check homepage for any out-of-date information and make sure important information gets posted. (Tarleton's homepage is my "baby" that I must keep nurtured.)
2. Check and respond to emails throughout the day (which as you know can take a while here at Tarleton!)
3. As the day rolls along, check in with all the members of my team to see how they are doing. Since we are all in the same office area, it doesn't take too long to figure out what's going on!
4. Go to meetings. We love to collaborate and share information with other departments, so I do spend a lot of my time in meetings. Anywhere from 2-4 hours a day on average. I meet with Marketing & Communications, Information Technology Services, and many other teams on campus. I get to meet a lot of people in my position!
5. Monitor my team's projects & tasks on Asana. We enter all of our projects and tasks to this system in order to keep track of and prioritize all of our outstanding projects and tasks. At any given time, my team can have over 100 pending tasks in the queue as a whole! We each get several tasks done each day so we are constantly making headway.
6. Develop strategies for improving our web presence and for improving how we communicate changes to campus. Making policies and guidelines for the web is one thing, but communicating those things to campus is just as important. I also give guidance to my staff about how to communicate to our colleagues, because I believe strongly in transparency, respectfulness, timeliness, and reinforcement.
7. Give feedback and advice on projects and tasks. I help to ensure we are still moving in the right direction and at an appropriate speed to get things done.
8. Team meetings: We usually have an official team meeting one or two times a week to discuss major projects and other topics that have come up during the week. We also have several "unofficial" team meetings during the week as needed - if nothing else, to just be able to share a joke and keep everyone in high spirits on a stressful day!
9. Design graphics such as homepage highlights and advertising banners. I love graphic design so I section off a sliver of my day to work on these types of tasks.

Southern Hospitality and Hannon Hill

Last week, I went to Atlanta for the annual Cascade Server Users Conference hosted by Hannon Hill.  In true southern form, we received the best in hospitality, and in true Cascade Server User form, everyone contributed in some way to the learning of all the other conference attendees.

In fact, the XSLT guru Jason Aller (to whom I bow down to with great respect, since I program in the XSLT language to make Cascade work), from University of California, Davis - School of Law, gave Tarleton State University kudos for our content management procedures in his presentation "In Pursuit of the Grand Unified Template." Consistency is important to provide a professional marketing and communications tool. If there are deviations from the branding, the style and tone, they look like mistakes and have the potential to push away our constituents.

Jason Aller and Karole Schroeder after his presentation "In Pursuit of the Grand Unified Template"

During another presentation by Fran Zablocki, Strategist for mStoner, called "Information Architecture and User Experience: The Journey, The Destination, The Return Trip," I could only imagine Morgan, our Web Content Specialist, smiling wide-eyed as she consumed exciting new information at some points and nodding her head in agreement on others concerning many of the strategies used to make content work on a web page if she had been with me.

Sometimes it feels good to hear that others are thinking about things the same way we are because while we may be working on the technical aspects, very rarely do people outside our occupations truly understand the trials we go through to improve web design to increase usability for all our constituents. Conferences like these both teach us and build us up as a community. I appreciate what Hannon Hill does to constantly bring us all together working towards the benefit of all.

-Karole

Student Employee of the Semester for Summer 2014!

We awarded the Student Employee of the Semester for Summer 2014 last night, and the award went to Maria Guillen!

Left to Right: Daphne Hunt, Maria Guillen, Morgan Hammond

Maria is a very hard-working student, taking much initiative to get work done for the College of Business Administration (COBA) on her own. She is skilled at organizing information on the web and collecting student testimonials for COBA's website. Maria works with faculty in order to get information needed for the college's websites. She will be graduating with her B.S. in Computer Information Systems in December, therefore moving on to new horizons. We are going to miss her!

We also had the opportunity to take a group photo of all the Web Services employees last night. I'm so proud of this team and all of their accomplishments and talents. Every single person is valued and appreciated in this office and I am so looking forward to working with this team this year!

Left to right: Josh Roelofs, Maria Guillen, Danielle Dunigan, Katie Taylor, Silvia Fuentes, Karole Schroeder, Tori Jones, Morgan Hammond, Daphne Hunt, Jennifer Kiggins, Ernesto (Ernie) Martinez

-Daphne :)

Tarleton Mobile App

Web Services, Information Technology Services (ITS), and the Digital Media Advisory Committee have been working for several months to prepare and implement a new mobile app for Tarleton.

The app is created by Ellucian, the company which also brings us MyGateway (Luminis), Ducktrax (Student Self-Service), and Banner. Becky Gray, CIO and Executive Director of Information Technology Services at Tarleton, saw a demo of the app at a conference during spring of 2013. Because Tarleton did not have a primary app for the institution AND there was a need to provide a mobile-friendly way to access student services, Becky investigated Ellucian's app further and made the decision to purchase.

The Digital Media Advisory Committee began discussing the app's look and feel as well as content to be placed in the app during the spring of 2014. One of the deciding factors about content was whether or not it is "mobile-friendly".  Currently, there is no "free" mobile-friendly interface for Blackboard, so the decision was made to not link to Blackboard from the app. However, since TexanSync already had a mobile-friendly interface, we decided to include a link to that website.

We also included links to student email, Tarleton's news and events, social media, emergency contacts, campus maps and directory, athletics, and several more items. And of course, students are able to access their grades and schedules from the app as well!

-Daphne Hunt

From a Student's Perspective
Tori Jones, Assistant Intern in Web Services:

From my perspective this app has really made my life a little bit easier. My favorite part of the app is when you click on courses - it shows you what courses you have, what time they are at and even has them all laid out in a schedule. You are also able to access your grades in classes from past semesters, which I found was really convenient because sometimes I like to look back and see what my grades are looking like as a whole, and being able to see that I had a B in that class, or an A in another class really helps things stay organized.

Another thing that the app comes in handy for on a student's perspective is the link to TexanSync. Being a student worker for Web Services, as well as a Residential Leader, I use TexanSync quite a bit. Having that direct access from the app to TexanSync allows me to have access to important things that I need to know and event times with a touch of a button, literally.

As a Residential Leader, there comes times that call for emergency contacts needing to be reached. With the new app, not only are the University Police Department's number available at the click of a button, but the Erath County Sheriff's Office, and Stephenville Police Department numbers are programmed in as well.

This app was something special for Tarleton that was long awaited, with all the new technologies coming into play, it was just a countdown to when we would finally get this app. It's got a really good look to it, and not only that it's extremely easy to use - from having links to student email, TexanSync, Emergency Contacts, and everything in-between, it's definitely a must have!

New Workshop: Making Updates in Cascade Server

Web Services invites you to attend our August Workshop:
"Using Cascade Server to Make Timely Web Updates,"
led by Morgan Hammond, Web Content Specialist for the Office of Web Services.

The workshop will be @ 3:45P on August 15, immediately following the Cascade Training.  It will be held in the Library Training Center, which is accessible from the new Library Commons area on the main floor of the Dick Smith Library. 

This workshop will allow you to spend an hour making your web updates alongside other web maintainers and Web Services Employees. You can ask questions and get one-on-one help with those hard to make edits. This is a great way to get out of your office and away from distractions to make those much needed updates!

Should I attend this workshop?

Yes:

1. If you regularly write and make updates to a Tarleton site, you will learn about the latest updates to Cascade Server, the effective use of Cascade tools and get solutions to common problems you have struggled with over and over while making updates to your site.
2. If you have been tasked as a Web Maintainer and already attended training this workshop is an easy way get a jump start on those edits, or build your confidence.

No:

1. If you have not already attended training, this workshop will leave you with more questions than answers.
2. If you want a course in HTML writing, Web Services does not provide training or courses in HTML.
3. If you want to redesign or change the layout of your pages, please contact Web Services to schedule a consultation.

Take Aways

While our one hour training sessions are a great start, we realize that most learn from doing. You will be able to build your confidence, get advice from the experts, and be able to make updates faster after attending this one hour workshop.

Cascade Training

If you are interested in attending a training session, you can see a list of scheduled training sessions on our website. To RSVP to a scheduled training, send an email to mhammond@tarleton.edu. Please be sure to have your immediate supervisor request your access to Cascade and fill out the Cascade Server User Agreement prior to your training.