I’m going to publish my weird borked edited web page for the
evil awful horrid honestly quite educational Storytelling Within the Web assignment right now so that the code is at the very least out there and accessible before the storm robs me of my interwebs. Here’s what it ought to look like (flaws and all):
Read on for the full writeup…
This assignment basically decimated my brain. And the sad thing is, I was super excited for this week when it all began:
But I got freaked out by the amount of stuff I wanted to do and how unfamiliar the coding language was and Firebug not working and me being more or less unable to make heads or tails of it anyway, and before I knew it I had zero time and less plan.
My first thought was to turn Prof. Levine’s blog into a bunny sanctuary (the new title was going to be BunnyButtsBlog. GENIUS), but I couldn’t figure out how to edit the header image behind the very first navigational menu. After failed attempts with Hackasaurus, the Firebug extension failing to show up in my browser even after extensive troubleshooting and some unsuccessful prodding with a 30-day free trial of Dreamweaver, I gave up and moved on to sillier, lamer things.
Expanding on my original idea of invading Prof. Levine’s blog with pictures of adorable fluffy bunny rabbits, I decided to edit my Goodreads.com recommendations page to do something similar. Instead of a site that suggests awesome books, my thought process went, how about a site that recommends cute little animals to hug and squeeze and love (but nobody is calling them George). Here’s what my rec’s page looked like originally:
Because you can never have enough poetry in your life. Never ever.
I discovered that to make the images look reasonable and not squished and malformed, I was going to have to edit them myself. Desperate as I was by that point, I did a few quick image searches and grabbed whatever images I could find of “cute puppies,” “chinchillas,” “bunny rabbits” and “cute reptiles” (yes, snakes are adorable. Yes, I will fight you on that point). After snagging five from each category I’d made up, I opened them all in GIMP and cropped them to more or less the right dimensions, then got the aspect ratio perfect with the “Scale Image” tool. Finally I uploaded all of the images (including a modified Goodreads logo) into a private, unsearchable folder in my Flickr account to prevent the images from being recirculated too widely and then went image-crazy with Hackasaurus.
Several hours later when I thought I was finished it barfed up some completely unusable code that I had to look up tutorials in order to save properly, because Notepad is pure evil. I have no idea why the HTML I got from that program was borked, if it had something to do with me saving the file improperly or if the Coding Gods are just particularly cruel and capricious to newbies, but whatever the case, I couldn’t use the web page I’d worked so hard to edit.
The one good thing Hackasaurus did was familiarize me with code in a way that wasn’t entirely overwhelming. I decided to just save the source code of the Goodreads page I wanted to alter, open it up in Dreamweaver and see what there was to see. With the split-screen view I was able to click on elements visually and see which lines of code corresponded to them, and pretty soon I was editing the code alone (also necessary, as the split-screen view makes the program freeze up on my craptop every other minute).
After several more hours of painstakingly editing the same lines of code over and over again, copy+pasting image locations from Flickr and uploading the file every now and again to see if it looked presentable, I once again had a more or less working web page. Despite all my issues with this assignment, I am kind of impressed that I mostly just muddled through it myself without looking at tutorials or coding guides. I just sorta looked at stuff and figured out what needed to go where, which suggests that coding websites is actually not that difficult at all.
Regarding the story behind my altered web page, I feel like Cutebreeds (See? SEE WHAT I DID THERE?!?!) is a site that someone would visit if they really needed to calm down after a long, stressful day at work. Maybe it would crop up as an extension of Tumblr or Pinterest, where you can share content extremely easily across user spaces. The cutest animal images and videos would be determined by user ratings and the reach of any individual piece of media would be dependent on how far users were willing to share it, thereby determining its popularity.
Or maybe it’d just be a hangout for wannabe crazy cat ladies. I’d be into a website like that.