• We are STAs
    • Daniela Caballero
    • Leilani Cabello
    • Lorena Chiles
    • Marissa Devivar
    • Luisa Matzner
    • De’sha Bass-McClellan
    • Adrian McKee
    • Thang Truong
    • Carrie Wang
  • We were STAs
  • STA Presentation
    • STA Presentation 2017
    • STA Presentation 2016
  • Testimonials
  • Resources
  • Home

STA Blog

Week II: Pages and Banners

September 2, 2021 By Adrian McKee

Week II: Pages and Banners

Project: COLA Website Refresher
Client /Prof: N/A (College of Liberal Arts)
completion status: Started on August 30, 2021
staff guidance: Michelle Vanhoose, Chris Rankin
STA team members: Rahul, Ingrid
description/plans: Learn Pages and begin to transfer COLA website content into new CMS
To be completed: TBD (long-term)

A lot to cover today!

Cascade

At the very start of the week, I wrapped up the last part of my Cascade test site, adding buttons I had drawn in Photoshop the previous Friday.

Pages

Most of this week was spent working on my Pages training for the COLA Web Refresh Project. Pages, as you may know by now, is a new CMS the COLA website is being migrated into from Cascade. The first part of this involved creating a personal site about an interest or hobby, and much like my Cascade page, I chose a natural science theme. Though for this one, I started with a homepage providing some basic information about myself.

Nested below this, I created six other pages for a paleontology-themed info portal (sorry for the plagarism, Rahul, but I did do a different era). This included a “hub” with links to five other pages, mostly in order to use all the text and image formatting features of Pages without cluttering them all into one page.

Hub page

Species subpage

I found the limitations of Pages quite apparent, such as the difficulty displaying images with much freedom. I tried embedding an image into a tab using html which promptly deleted itself, as well as creating an image button with a single line of text (this will show up again later!) to no avail. I will say I got everything done much faster than I probably would have in Cascade, albeit with less creative freedom.

 

My next assignment was to compose a formal writeup email on my project so far, which doesn’t have much information not already in this blog post, so I’ll omit it.

 

After that I began practicing transferring content from the old COLA site into pages, rewriting ten in total. 80% of it was very straightforward (copying bodies of text and reuploading header images) but 20% was quite time-consuming in that it took a lot of mental energy to rework complicated pages into the more limited framework of Pages. One page (shown below) included a slideshow of different images, links, and embedded videos at the top of the page, of which no analogy exists in Pages.

 

The most tedious part was finding a way to insert two images with single-sentence captions (There it is again! Grrrrrr!). Since Pages has no option for a single image with a single line of text, my attempts included:

  • Using “Image Buttons” to display the images with one line of text (but this feature has a minimum of 3 buttons, and each has to be a hyperlink)
  • Using the “Two Cards” Feature with the captions as the body text, but I had no way to remove the title, or split the text between the body and title
  • Using the “Text & Image” feature with each image’s caption as the main body of text (but the spacing created a huge gap
  • Using the “Text & Image” feature with each image’s caption below the image and other text in the main body (also created a spacing issue)
  • Using the “Text & Image” feature with one image made by combining both in Photoshop

Several of my miserable attempts.
Finally, I settled on using the Photoshop-combined image as a single “Callout” card, with one caption as the title and one as the body. Note the differences in the final site layout from the original.
Housekeeping
I’m also including brief coverage of two basic trainings I forgot to cover last week.
One of these was a brief read on professional email communication, which I don’t have much to report on.
The other was an exercise in understanding web accessibility standards. Part of this involved finding two sites and contrasting accessible and inaccessible design, so I contrasted a Norwegian garden store site so messy it became an internet meme, and a very Web1.0 science fiction blog dating to 1995 which, though gaudy, met most of the basic standards.
I’m still getting through a lot of different small assignments, so hopefully future blog posts will be more streamlined. One very last note: on Wednesday, I took some time to draw a caricature for the STA banner, as well as my own banner entry, which will remain secretive for now since I don’t know if the ballot is blind or not, but I might demonstrate my process in a future blog post. I’m excited to see everyone else’s entries! Signing off.

Filed Under: Fall 2021 - Spring 2022

link to LAITS home page

Video STA Home

© 2023 Liberal Arts Instructional Technology Services | Production Credits