Jul 102012

I have to admit that I am late. I was busy all day yesterday for the #Made4Math day, and the next two weeks I will be traveling to and from MathCamp. So, either I add in late, or I wait for for 3 weeks to contribute anything.

With that in mind here is my rather pedestrian contribution. I must say, I am blown away with how creative and imaginative you math teachers are. I feel very inadequate next to some of your submissions.

What I Made 4 Math is a complete revamping of my website, http://mrwaddell.net

I originally created the website using Dreamweaver and learned HTML and CSS and hard coded the entire thing from scratch. It was a major undertaking, and quite honestly took me around 3 months to do finish all the different sections. BUT, it had some major drawbacks.

  1. The only way to edit any page on my site was to make a note to myself, and when I got home remember to boot up my laptop with Dreamweaver on it, and do the edits.
  2. Things change. HTML5 comes out along with CSS3, and now I have to learn a whole new set of standards for recoding my site.
  3. Hard coding the site is not friendly to different screen sizes. On a cell phone, my site looks very small, while on a computer screen of 1000 pixels wide, it looks great. Not future proof at all.
  4. And finally, see #1. Most of the edits I wanted to do to my site are immediate, important uploads that need to be done right now, not in 6 hours.

With that in mind, I have systematically partitioned my site into folders, deleted all the files within certain folders, and installed WordPress in those folders I want to “upgrade”.

Now that I am running WordPress, the next choice is one of theme. A good theme can make a world of difference to how much work you have to do in the creation of your site and addition of content. I have chosen to standardize on the theme called Yoko by ElmaStudio.

Some reasons I chose Yoko: it is free, it is very nice and clean without a lot of clutter, it allows for good customization and is well documented, and it is built in CSS3, so it resizes based on the screen size of the device looking at it.

Some other plugin I use in order to make my life easier, in no particular order.

  • Add From Server – I love this plugin because it allows me to upload files such as worksheets, notes, etc. using FTP, and then add those files automatically to the WordPress database. It has saved me many hours of uploading files one by one.
  • W3 Total Cache – Speeds up my site by creating cache files. I noticed a difference immediately upon installation.
  • TNG Embed Everything – I have only started scratching the surface of this plugin.
  • Akismet – Because I hate spam as much as you do.
  • Google Analytics – helps keep track of how many hits and other details about my site. I don’t do anything with the info, I am not going to commercialize my site, but I do like the information. For instance, on my Stats site, I have had visitors from India and Europe! How cool is that?

I have found this combination of software / theme / and plugins has greatly sped up and made my site more friendly for learners and myself.

Now, I can upload files and content to specific areas of my site from any device, including my phone using the WordPress App. This solved a couple of problems right there.

On to the next step of redoing the site. Technically, each directory is a site of its own. This is very important. You can get to the site by going to http://mrwaddell.net and selecting the AP Stats link, or you can get there by going to http://mrwaddell.net/apstats. Either way works.

In the redoing of my AP Stats site, I first sat down with pencil and paper a made a drawing of what I wanted. I went through the hard coded site and looked at the content I had, and then asked myself what did I want to add. I ended up with this (after about 4 drafts):

2012-07-10 15.53.00  Each one of the menus is a separate page that I had to create. The pages are all built on a standard template, so I had to make sure I had the template that I wanted (which is part of the Theme).

I think this was the most important part of the process. Getting down the physical structure of the site first, so I knew what order the pages should go, as well as what content I wanted to add on each page.

All in all, it is 18 pages, but it is easier to manipulate and adjust things now that WordPress is handling the heavy lifting of page layout, database maintenance and search capabilities.

After this point, it was all uploading and editing. Yes, it is helpful to know HTML and CSS when doing this. All the experience I gained previously building my site was used, but now the site itself manages the layout. Yay.

The 2 sections of my site I have converted already are the AP Statistics and the Algebra 2 sections. Give them a look, tell me what you think.

You can’t hurt my feelings, so please be brutally honest!

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>