LAB #2 Part A

1. Describe media management as it is implemented in the framework.  



I started looking into the default media manager for WordPress which is displayed in the screenshot above, I found it very easy to navigate and upload the pictures I had collected for my site.

It retains rather simple functionality, you can search, bulk select, sort via date added or media types. The main purpose of this tool is to store media items in the same folder your website lives in for convenient usage. For example if you had your website hosted on a cloud server you could upload your media items to your media manager & access them from anywhere you can login to the admin page.

Describing this to a customer I would use a more real world analogy such as: "Storing media in the media manager is similar to keeping a surplus of stock stored out the back of the shop rather than having to order in every time you run out of something on the shelf"

While this may not prove to be entirely accurate the main purpose is to convey that the items are handy to the website and don't require as much effort to implement then if they were located elsewhere.

I have glanced over plugins that manage media but to a more customization extent, if I felt the need to categorize or sort my media further I would definitely explore some plugins as options. With only a small amount of pictures currently though there is no need.




2.  Add a single media: images, video and audio. 


Displayed here I am testing pictures out for the landing page of my website, my main goal is to create a feeling of comfort as soon as someone lands on the page, drawing them into exploring the site further.


In terms of being friendly to other devices I am using the option to switch the preview display to the other two modes available(tablet & mobile view), using these I can see how my pictures look on these devices before confirming my choice. It is crucial to have a suitable image size that adapts across devices comfortably.

Swapping between view modes for the website along with editing some custom CSS as showed by Craig in a previous lesson it's possible to heavily customize the website depending on its current pixel count or width/height. As the site gets smaller I can reduce font size, make colors more friendly for a smaller view size and change the type of menu the site uses, my site already defaults to a burger style menu until it reaches a certain pixel count, burger type menus are really good for conserving white space and stands as a universal sigh for a condensed menu that most users recognize from their favorite websites already.

3.  Manage  multiple media, for example using a media "gallery"

First things first I thought to myself, "there must be a plugin for this" and right I was. I found a nifty little plugin that pictures below, it has not been updated for several months but along the process it seemed to still operate fine with my current version of WordPress and still maintains 20k+ active installs at the current time.

 Here is the settings page for Unite gallery, it holds a heavy set of customization with more options as I scroll down and an option to chose from different types of gallery displays, I chose a slideshow type one over something else like a grid because with my types of pictures it felt more right to me to show one at a time before moving onto the next, this leaves more white space on the page and allows the user to enjoy the current photograph more.

Below I just paste a small line into my page editor to add it to any page or post that I want, very simple to use and implement.



Below is the final view of my gallery implemented into it's own page, I feel the color scheme could use a bit of work, possibly slightly more brown to go with the wood/coffee type theme.


Below is the current page adapted to mobile/tablet views, here I have encountered an issue with the gallery being pushed down the page in order to make space for the header image, at the time of writing this blog I am unsure of which way I will tackle this issue as removing the header entirely would make my regular website display look very underwhelming, perhaps I can implement some CSS code that is activated only during tablet & mobile view that hides the header to make way for the gallery to come up the page?

As it stands right now, users having to scroll down the page to find the main call to action of this page is not something I would let go live.

Tablet View

Mobile View 


Comments

Popular posts from this blog

Post 4 | Implement navigation for the website | Project 3

Post 6 | Add a Contact form | Project 3