Author Archives: Matthew Brabham

Images on the Web – When to Use What

Posted on by | Leave a reply

From the session “Images 101: File Types, Web Optimization, Retina Screens, oh my” (https://2016.badcamp.net/session/images-101-file-types-web-optimization-retina-screens-oh-my) by Jessica Tate (http://www.jessicatate.com/).

Overview and JPEG

I found this session very helpful in understanding how to prepare images for web use. I learned that while JPEG images are ubiquitous they should only be used as the final image export. They can contain millions of different colors while maintaining a smaller footprint. What this means is you can keep the image tiny for websites but at the same time keep the colors looking great. The reason Jessica said that you should use JPEG as your main source is that every time you run a save command in a Photo Editor passes the JPEG through the image compressor and loses quality.

PNG

Jessica talked next about PNG next and how PNG has two common formats, PNG-8 and PNG-24. The difference between them is that PNG-8 holds 256 different colors where as PNG-24 is called true color where it holds as many colors as JPEG, but with a larger format. The reason she gave for using PNG as your source image and make your edits there is that they don’t lose quality when you export, but are often too large for the web. Jessica also went on to say when to use PNG-8 and PNG-24 and really the 8 format is perfect when you don’t need many colors or transparency. The resulting file size is tiny and great for icons.

GIF

The next image format she discussed was GIF (jif as the creator wanted it pronounced) and although it was a competitor to PNG it’s primary use is in animations. So if you need something to be animated, use a GIF.

SVG

The last image format Jessica talked about was SVG and although SVG is new in comparison to other image formats it differs completely in how the image is created. This format uses Vectors to create the image, this helps with Icons and other logos you wish to create but only have one copy of the file. SVG does not require you to export out different versions of the same image at different sizes as they scale and do not look pixelated. SVG also can be used in animations but it has not grown in popularity yet. A few fun things with SVG is you can use CSS and Javascript to alter the color and behavior of the image. SVG works across all browsers and there are many different free image creation tools out there that can create and work with SVG.

To wrap this up, use JPEG when you need lots of colors, but never use it as your RAW source. If you do not have access to RAW use PNG-24 for your images. GIF’s for animations or start playing with SVG’s for animations as well as Logos.

WordPress Plugin Updates Update

Posted on by | Leave a reply

WordPress received a set of plugin updates today.  The Jetpack plugin was updated to version 2.5 resolving an issue of the Twitter widget not displaying tweets.  The issue had to deal with the Twitter widget ID not being saved properly in Jetpack’s Twitter widget.  A Twitter site owner needs to create a Twitter widget first in twitter.com as a pre-requisite to using this WordPress widget.  The widget works properly now.

You know there’s a however coming next, right?

However, certain browser add ons or extensions may prevent it from displaying properly.  In the event that you still do not see the Twitter timeline, then first clear the browser cache and settings (Google it if you don’t know how), and see if it works.  If that does not work, then disable your add ons and figure out which add-on was preventing it from being displayed by re-enabling the add-ons (Firefox) or extensions (Chrome) one at a time to figure out which one.

The other plugins that were updated were:  SI Captcha, WordPress SEO, and WP-PostRatings.  Please go to the respective plugin sites to look at what was updated for these.

In between terms, we will be looking to upgrade the WordPress version to the latest, as that change will be more involved and require a longer period of downtime.

As always, if you have any questions, feel free to contact us.

It is time to Connect

Posted on by

Another year, and we are ready for another round of Connect.  What is Connect?  Connect is the 4 days before fall term classes begin. It is a chance for new students to begin to “connect” to OSU. There are a range of activities that help to connect you to academic resources, discover all the ways to get involved, learn about traditions and meet other new students.  With this year’s connect we are launching version 2 of our OSU Connect App.

 

Connect Events Screen     This version, available for Android and iOS, will feature the OSU Scholar Symposium events, and the ability to “favorite” events, by dotting the O.  What you don’t see is all the work put in behind all of this to adapt to an upgrade in the framework we are using by Appcelerator.  The Alloy framework introduced MVC programming into Titanium, and with the help of staff and one of OSU’s very own computer science students, Seth Toda, we’re refactoring the code to make it more modular.  This will enable OSU to be able to launch our apps faster and add features faster as well.

 

So look for the apps and app updates in the iTunes Store and Google Play store, and don’t forget to keep your apps up to date.  To the new students arriving at OSU, it is time to Connect.

Don’t Smiley At Me: A Jetpack Tip

Posted on by

smiley face at a bottom of a page pictureIf you have turned on Jetpack on your site, and are collecting stats, at the very bottom of your site you might notice a little smiley face.  If you are like me, you will find this just a little bit annoying.  How did it get there?  Is this a bug?  Is there something wrong with one of my posts?  The answer is no.  It goes back to using Jetpack and collecting stats. Since you are using the power of the WordPress cloud at wordpress.com when you connect Jetpack, WordPress inserts this to indicate stats are being collected.  Well and good, but if you are not in a smiley frame of mind, it’s very easy to fix.

jetpack-stats

To take the smiley off your page, go to the Jetpack dashboard, and click on the Configure.  In the configuration options you will see a checkbox to “Hide the stats smiley face image.”  Just check that and save and you are smiley free, and free to smile.

configuring jetpack smiley on or off images

 

Takeoff! with Jetpack by WordPress

Posted on by

With this next update of WordPress, we have updated WordPress core as well as plugins, and have introduced a new plugin called Jetpack.

What is Jetpack?  From the makers of Jetpack, they say “Jetpack supercharges your self‑hosted WordPress site with the awesome cloud power of WordPress.com.” 

From our standpoint it is a number of WordPress modules that will add some benefit to your site, including site subscriptions, posting a blog post via email and more.  But to use Jetpack you have to understand the peculiarities and actually see if some of the features will work with the theme that is being used.  In a nutshell, the theme has to be able to support Jetpack.

Jetpack Modules

We are outlining some of the steps and peculiarities that we have encountered in our testing with the OSU Responsive theme which is the primary theme we are testing against at this time.  All other themes are unsupported for Jetpack at this time.

Steps to use Jetpack

1.  First you will need to connect to wordpress.com, which means you need a wordpress.com account.

Best practice for departments and organizations.  Create a wordpress.com with a generic account.  That way it can stay with the organization rather than with an individual.

Why do you need a wordpress.com account?  The plugin itself uses wordpress.com’s cloud infrastructure to do some of the processing, and where we can offload some of this is a good thing.

2.  Then connect to Jetpack from the Jetpack Dashboard.  Once you connect to a wordpress.com account, you will see the Connected in your Jetpack screen navigated to from your Dashboard.

 

 

 

3.  Next is to look at the variety of options and activate the ones you would like to use.  Please note that not all of these might work with the theme that is being used.  For OSU Responsive, WordPress.com Stats, Subscriptions, Carousel, Like, Post by Email, Sharing, Contact have all been tested in our limited testing capabilities.

Please note the Contacts feature of Jetpack is not compatible with the Sociable plugin.

You can disable Sociable under Plugins menu located on the left in your administrative menu.

So you get all that done and you decide you don’t want to use one of the features any more.  But where to turn it off?  It wasn’t intuitive when I first went looking for it, that was certain, but a quick Google search found the answer.

Jetpack Configure Button for Deactivating

Once a Jetpack feature is activated, there might be a configure button there.  If it is clicked, it will expand the area, and it is in that expanded area that the Deactivate button will be.  Why there?  I don’t know but after using it a few times, I was able to manage remembering where it was the next time around.

Overall it looks like some good pieces are there.  As you are using this, remember to keep in mind everyone.  There are accessibility policies to keep in mind, as well as just a general sense of if you really will be using  a a feature that is activated.  As we get more information we will put up, but the best thing right now is to visit the Jetpack site for more information.  We’ll be writing more as we use the features ourselves.  As always we would love to hear your feedback, so try out the contact form that we’ve just put in as part of the Jetpack feature set and send us some feedback about your experience with Jetpack.

In the intervening time between our blog posts, we still have some work to do to fix the Responsive menu structure.  More than one level deep in a menu and it isn’t too useful and on the mobile side, the mobile menu has a bug we know about that does not expand it beyond a certain length, making part of the menu not visible.  That fix is in the works.

At this point, however, we want to give you the ability to take off with Jetpack.

Let’s Talk Drupal 7

Posted on by

So let’s talk Drupal 7, and some bits and bytes about Drupal in general.  Central Web Services maintains a central Drupal installation.  Like any piece of software, it has multiple versions.  Drupal 5, 6, 7, and 8 which is in development.  The CWS stable version is Drupal 6.  Drupal 5 is no longer supported.  Right now we are getting numerous requests for Drupal 7.

We want to let you all know that we are actively working to get Drupal 7 tested, documented, and functional for the needs of OSU.  Well, why can’t I just get it now, it’s just a download, you ask?  The answer is, while if you were hosting on your own ISP this would be the case, the OSU infrastructure is such that we have to ensure security, reliability as well as integrations with other solutions, such as authentication, themes and modules in use by OSU CWS Drupal sites.  We have a number of concurrent activities happening to make progress toward rolling this out for the University, including actively working on the theme necessary for Drupal 7 (yes we have to rewrite the theme to work for new Drupal versions).  This is in partnership with the rock-star team over in Web Communications.

Now more importantly, what we are trying to do with Drupal 7 is reduce our site footprint and number of individual sites.  Can you believe we have over 400 sites?  That becomes a maintenance and support headache.  With Drupal 7, there will be a new feature called Organic Groups.  This will allow us to have a smaller subset of sites, and areas and departments within the same site but still allow the finer grained control that some of you desire.  With Organic Groups, you will be able to take control of the portion of the site that is your relevant content, and have control so others cannot access that portion of the site as a Drupal administrator to modify something in error.  This is where we want to go and what makes sense for Oregon State University.

So when will this be done?  With Organic Groups, we are in the pilot stage with Information Services, and then we are going to ensure we have it done right by piloting the College of Liberal Arts.  Doing this we will ensure we understand the technology well enough to teach, document, and support it going forward so people are not left out on their own to figure things out.

Individual main colleges in working with Web Communications can look at Drupal 7 with the Doug Fir Theme (the theme that we have available for Drupal 7), and then incorporate changes for Organic Groups as we roll that out.  Science and Liberal Arts main college sites are already in Drupal 7.

Departments however, we will not be rolling out with Drupal 7 at this time, as they are to be incorporated into Organic Groups, working with your colleges, once we roll out Organic Groups.

For those sites that are in Drupal 6 and want to look like the main college sites that are using Drupal 7 Doug Fir, we are working on a version of Doug Fir for Drupal 6.

What is Doug Fir?  So besides being an evergreen confier species, Doug Fir is an OSU responsive Drupal theme.  This means that the site resizes depending on the device that you are on.  Liberal Arts is a good site to see using this theme.

For us it is imperative that we do this right and do not add to the overhead and support it would take to enable OSU.  This is why you might hear us say that we are not providing Drupal 7 to individual sites at this time.

Our rough timeline as of now is:

  • Spring and Summer to test and roll out Organic Groups.
  • Winter:  Migrate Drupal 6 sites to Drupal 7
  • 2014 Drupal 6 moves to maintenance fixes only
  • 2015 End of Life (EOL) Drupal 6

With all of this we are re-architecting the infrastructure, and then we will have Drupal 8 on the Horizon.

We hope this information helps you to be aware of the progress we are making.

A New Media Space Release

Posted on by

On Monday, February 18th, if you hadn’t seen information about or attended the training sessions, Central Web Services and Media Services released a new version of Kaltura’s MediaSpace.  This is version 4 of MediaSpace.

The new version of MediaSpace, OSU’s open source and cloud-based media solution, integrates many requested features and some important new functionality, including privacy / access control, captioning, HTML5 support, and improved layout.

One of the best ways to understand the new features is to watch the video in MediaSpace about the new version.

OSU Blogs are Responsive

Posted on by

OSU Responsive ThemeWe have rolled out a new blog theme which is named OSU Responsive.  Why Responsive?

Responsive really means responsive web design.  The goal behind responsive web design is to have the design of a given web page be adjusted dependent on the size of the screen.  So on a phone, the look and feel changes to be more of a mobile experience where reading a full web page doesn’t necessarily make sense.

The theme is a two column theme, with only a main sidebar, and the bottom contact area as available areas to put widgets in.  Remember, not all widgets will look good in different areas so you will have to see what works and doesn’t.

Who can use OSU Responsive?  Responsive is available for everyone, however, there are some things to note.  The use of the OSU logo or tag is restricted to certain use.  The theme will display the tag or not based on the Organization Type as specified by the table below.

Organization Type Can Use Branded Theme?
Student No
Staff No
Faculty Yes
Department Yes
Sponsored Student Organization (SSO) Yes
Voluntary Student Organization (VSO) No
Non-Affiliated Student Organization (NSO) No

Student Organizations are governed by the policies of Student Leadership and Involvement.  If you are a student group and do not know which type of organization you are, please visit the Student Leadership and Involvement site.

What do you need to do to use it?

1.  If you are switching over from an existing theme, and you switch it immediately, it might seem that your site is broken in layout.  It isn’t.  It is simply that the widgets need to be removed and put back into the areas available for it.  So we recommend first removing all the widgets in use from the sidebars.

2.  Go to Appearance -> Themes in your WordPress dashboard, and select the OSU Responsive theme.

3.  Put your widgets back into the sidebar.

4.  Deactivate the Sociable Skyscraper plugin if you are using it.  Use of this inserts a thin horizontal line and makes the theme look broken.  Go to Skyscraper Options in the Select Sociable Plugin expanded menu to deactivate.

Skyscraper Option in Menu Settings

And that’s it.  Good blogging to you all.

Accessibility and Brand Guidelines

As part of the OSU Responsive use, the use of a different background image or color must adhere to OSU’s policies regarding Accessibility and Brand.  Any failure to do so may cause your blog to be disabled.  The net takeaway here is don’t change it if you don’t understand the policies, which is why we at Central Web Services, take care of these things for you in creating the default theme.  However, do remember within your articles, accessibility policies still apply if this is used in any official capacity for students, staff, or faculty or OSU.

Bringing Home the Silver – Design and Development

Posted on by

 

Case Award Silver Team

No oops, but we did it again.  Add another award winning design and implementation for the category of Overall Website in the CASE VIII 2012 Communication Awards.  Oregon State University proudly brought home the Silver for the OSU College of Public Health and Human Sciences Website.  If you don’t know by now the work of Web Communications and Central Web Services, you should.  For the Central Web Services team of Sher Fenn, Paul Lieberman and Mauricio Cordoba, congratulations!  Congratulations to Web Communications and CPHHS team members.  It was a truly a team effort and another win-win-win for OSU in its collaborative efforts.  This could not have happened by any of us individually and reflects what comes from working together.

Worldwide Release: iOSU Version 1.2

Posted on by

 

iOSU Flash Screen

It’s here!  Central Web Services and the iOS App Development Club have been busy over the last several months getting the next version of the iOSU App for iPhone ready to release to the Apple store.

So…why did it take us such a long time for our next release?  In the initial release, we identified a number of items that needed further investigation to fix some quirks that existed.  It also took us a little time to get the specifics going with the iOSU App Development Club.  If  you are a student and don’t know about the club and are interested in iOS App Development, you should visit the Student Leadership Site and search out the group.

Why did we wait and not just put up to the store a while ago when we  did our initial beta release? It was important that the App be of a quality level high enough for us to put up, and we were waiting for the budget to have additional training to enhance our skills so we could move in a knowledgeable and purposeful direction.  We were able to go forward with the training in August of 2011.

After the onsite training by a company named Appcelerator we learned a few better methods to develop for their Titanium platform, so we have taken that to incorporate a couple new features with the addition of Videos and iTunesU to the App. While we were in our beta phase, we received some good feedback, through the use of the feedback method available directly in the App!  We also received some small praise on its value, with one person even using it from India to look up contact information back at OSU.

iOSU Dashboard

For the current release, we’ve incorporated some of the feedback, and made some additional changes, such as the removal of the mobile site button, and a few other other enhancements.  And of course what would a release be without fixing some previous bugs.

What was the process we went through for this release, you ask?  We planned for a release prior to class start as part of our roadmap and strategic planning.  After releasing 1.1.0 to our Enterprise customers (that is everyone at OSU), we discovered a few additional bugs that delayed our originally scheduled pre-start-of-classes launch.  So we went on to version 1.1.1 to do some additional fixes, and then on to 1.2.0 for a few more feature changes.  After checking against iOS5 and those pesky last minute fixes, we were ready to go.  The next step was to go through the various steps to get an App submitted to the Store.  For those who don’t know, it’s a step process, where we have to enter all the various information you see, submit images that you see on the store, and then submit the built app for Apple to review.  Once Apple reviews, and the App meets Apple standards, they send us a notification that it was accepted.  At that point it is ready for the World to download!

iOSU Dashboard 2Now saying all this do we, as a Software Organization, expect a 100% bug free application?  Not at all.

However, we will fix the issues that we see or hear about, as we did with version 1.2.1 which came out shortly after to fix some bugs that came directly from your feedback, and some accessibility issues that we noted ourselves.

There is of course still more to do working with partners around campus to deliver more features, and for all the Android fans, we haven’t forgotten about you. The purpose of the training was also to take what we have and deliver an Android app in the near future. So that will be coming. Stay tuned!