Tag Archives: website design

Website design

I had been struggling a bit with how to present the list content on the website. If I were to just “list” the posts in a category (e.g. skills lab tutorials), then they just show up in the order that I write them. This isn’t ideal. It would be better if there were some logic to the order in which they appear. Last night I had a couple of ah-ha moments: (1) to organize the skills labs by checklist, (2) include a discussion on search.

(1) Organize the skills labs by checklist

I found I disliked the layout of the skills lab tutorials, but couldn’t easily find a way to put it together. Last night I realized I could (and should) create a page and then create lists of tutorials. These lists can be used by the presenter in the workshop, as a list of things to cover – demonstrate, and talk about. Then, on the website, a future instructor, or workshop participant, can go to the site to see/review the content. It will all be there.

Now, the next question becomes, how do I organize the case vignettes and ice breakers? I may just do a bulleted list, with titles, and links to the various items. Their order is not relevant.

(2) Include a discussion on search

The discussion on search was inspired by what I was reading:

Gilster, P. (1997). Digital literacy. Toronto: John Wiley & Sons, Inc.

In chapter 2, “The Nature of Digital Learning”, Gilster talks about the evolution of the printed book – talking about how when a book moved from being on a scroll to being on pages, then the page number mattered, and became a way to access information. Suddenly you no longer needed to read it in order, and you could look things up much faster by using an index. The Internet has changed this too. We no longer need the index, we can now look things up by search – which is often faster and more effective. More importantly, as authors of content, we no longer need to spend the time building the indexes, as searches can be creating automatically in the content.

For me, the ah-ha moment was the opportunity to teach about the digital literacy. We start with organizing icons into folders. We do this because some people find organizing things this way is effective. However, this aligns with “indexing” – it is more inline with older methods of organizing content. Today, we need to learn to be effective at searching – rather than indexing. That being said, I think there is a large personal preference at play here – and like teaching & learning – I don’t think there is a single answer for everything. For example, I put some “like” apps in folders – mostly my TV apps, and anatomy apps. I usually only access these apps when I’m doing a specific task, so it helps to “go to” the folder when I know what I want to do that activity. Now, there are times when I’m looking for a specific app. When I want to do that, then I use the search functionality and go directly to the app. I have a few apps that I have no clue which screen they are on, I can never find the icon – but I don’t need to. I know the name of the app (actually I only need to know a couple of characters) – so I just search for it. With iOS7, the search is available on every screen – so by searching I can find what I want faster than if I had to look it up by folder.

Endless tweeking

I had decided to buy a theme for this website because I wanted it to look professional but also work well on mobile and desktop. With Scott’s help, I chose to purchase Strappress, which has implemented the theme based upon the Twitter Bootstrap APIs. I liked that it came with a plugin tool that allows you to use the various elements in your posts and pages – giving more flexibility.

After installing I quickly discovered that this is going to be more work than I had planned. The nice layout they show on their website doesn’t seem to be what I have once installing on my site. I’m going to have to go through their YouTube tutorials to figure out how to make my site look the way I want it to look.

One thing that I find interesting is that they appear to have little or no documentation, rather they point you to a series of videos on their YouTube channel. I think this is interesting because I have said for a while now that YouTube is the new generation of technical documentation. If you don’t need to write it down, it will be a lot faster and likely more effective to just do a quick video clip. Personally, I use Screencast-o-matic to make video clips all the time – this website will have a lot of tutorials built using Screencast-o-matic and uploaded to YouTube. It is a lot less work to build, but also seems to be more effective too. Mental note – need to look up if there is any literature on the use of screen cast video versus technical documentation for learning to use software.

I reviewed the two videos on the theme and spent most of the day setting up the website. I also decide to ask a graphic artist to create a logo for me. I will probably also ask for some icons for the front page.

I’m struggling a bit with a couple of my menus. I want to be able to create menus based upon categories (no problem), but also have different pages show the category results based upon different page templates (not so clear). I sent an email off to the folks who I bought the template from in hopes that they can tell me how to do it. In many ways, I think this is just a WordPress issue – in that I think there is a standard way to do this in WordPress – but I’m not 100% certain. I may also end up adding a “list category” plugin and then creating a page the way I want.

After spending much of today playing with the look and feel of the site, it is time for me to stop. I need to get some other work done today. I may get back at it later today. It seems that tweaking the theme is something that I could spend endless hours doing … wasn’t that the reason that I bought a theme in the first place???

Website design

I very much debated about whether I’d create this site using WordPress or Dreamweaver. Initially, I very much leaned towards Dreamweaver, but the reality was that it would take me a lot more time to manage a Dreamweaver site. I’m more familiar with WordPress, but also I like some of the content management system (CMS) features that I get with WordPress that I don’t get with Dreamweaver. If I wasn’t so file inept (see blog post), then Dreamweaver might work – but having to manually manage posts, and not being able to take advantage of various plug-ins made the decision difficult.

In the end WordPress won out. I needed a solution that met my needs, where I wouldn’t be spending all my time implementing the design and layout. I need to be spending my time creating content, not figuring out how that content is going to be displayed.

WordPress was also a personal preference. I knew that if I had a WordPress site, I would be able to blog. I know that I am able to blog, that I can write blog posts. I understand the workflow, but  I also have the muscle memory associated with blogging in WordPress. I can do back to my bike touring days. I blogged at http://goingeast.ca almost every day. So I know that if I setup the process, I can blog daily as needed. I think the ability to do that, and giving myself permission to write stream of consciousness (bad first draft) style, will allow me to just get it done … and I really need that right now.

My ‘to do’ list for today contains an item on my website design. Specifically, that is to write down all the content that needs to go on my website. So, here goes:

  • Workshop content, specifically: Icebreaker Activities, iPad Skills Lab, iPad Case Vignettes
  • Stuff to run a workshop: workshop agenda, administrative checklist, workshop evaluation sheets, facilitator guide
  • This blog
  • About this website, How to contact me, how to submit a case vignette (or other site content), credits for the site and site design (this assumed that I was using a graphic artist – I may not – I may just buy a theme and customize it myself.