Over the past month or so I've been making subtle tweaks to my theme on Scriptogr.am but I figured it was time for a larger update. Some of the changes made included a new HTML structure, slightly brighter color scheme, and the use of both SVGs and Animate.css CSS animations.

Although the site structure and layout didn't change, I thought I would take a moment and explain why I chose to use both an SVG for the logo (check it out at the top of each page) and Animate.css's CSS3 animations.

Animations with Animate.css

Animate.css is one of the many projects of Dan Eden that gives web designers to embed CSS3 animations on their website and use within their sites. Just add class names to your chosen elements and CSS does the rest.

Animate.css is a bunch of cool, fun, and cross-browser animations. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.

I chose to alter bounceIn under bouncing entrances so the effect plays as the mouse hovers over the logo. Depending on the animation your image(s) may distorted as the animation plays out but you can avoid fuzzy images.

The Magic of SVGs

SVGs (or scalable vector graphics) are unique image files that allow web designers to use vector shapes and designs on our websites compared to raster (.png, .jpg, and .gif) images. Raster images certainly have a place in web design but SVG files have become rather useful as HTML and CSS advances.

The reason I chose to use an SVG image as my logo to avoid the distorted look as the hover animation plays. New technology comes with a small price, however, as IE8 and lower does not support SVG files. The good news is there are ways to get around IE as explained by David Goss on his blog.

Add the following comments to your SVG image:

<!--[if gte IE 9]><!--><img src="logo.svg" alt="Creative Launch"/><!--<![endif]-->

<!--[if lt IE 9]><img src="logo.png" alt="Creative Launch"/><![endif]-->

Now you have a fool proofed SVG image that works for everybody. There's a good chance the fallback image will look fuzzy through the animation but you wouldn't know the difference unless you compared them side by side.

There you have it. The use of SVGs and Animate.css are the two notable changes to my custom Scriptogr.am theme. With possible new features there will most likely be updates in the future (later down the road).

Lately there's been a specific video being circulated by a handful of my teacher friends on Facebook. The video points out how important programming skills are today yet they're not taught in a large majority (“90 percent”) of US schools.

That's an interesting thing to think about. We live in a world where we use a computer (our smartphones, desktops, tablets) up to 34 times through the day. It's obvious we all know how to use these devices, they're so popular today. If I said knew how to program them, however, it would be a different story.

Part of me thinks this is a silly argument, then there's a part of me that can't believe programming hasn't become more important in education. It's not a language you'd hear out loud but it's very common today.

Video edited by Code.org, promoting programming education.

I'm not a fan of celebrity “endorsements” (I'm looking at you GoDaddy) but listening to Will.i.am and Chris Bosh, a musician and an athlete, talk about the importance of programming education was great. Hearing this message from tech CEOs is expected. Coming from two celebrities, not so much.

Here we are in 2013. We all depend on technology to communicate, to bank, [look for] information, and none of us know how to read and write code.

Programming may still be seen as nerdy for whatever reason but it's one of the ways of the future. If you can program a computer you could be the next Steve Jobs, Mark Zuckerberg, or Drew Houston. Everyone wants to hire programmers because they are (and will be) the creators of tomorrow.

Though I feel like I'm writing on a topic with mixed opinions, I feel like it's something that should be said. With such an array of different fonts on the web, we as web designers all have our own personal styles. Where we like to find our fonts and (most likely) our favorite font sizes varies greatly.

The big decison we face choosing fonts is the readability of the font or how easy it is for visitors to read the content on our sites comfortably (comfortably being the keyword). When I started coding small fonts were so clean. Several years and sites later my thoughts have changed slightly.

Big vs. Little

I can remember the first website I created. The site was for my school's TSA chapter and although we advanced through Regionals and State to the National TSA Conference and I chose to keep my small 10-point font size (though I was told numerous times I should consider something larger).

My friends and I won third place that year. Looking back at my decisions now I'm honestly surprised that we won a nationwide contest with 10-point type. Three years later, small fonts have lost their touch. It might have been all that time craning my neck to proofread my content…

Browser Defaults

Here's some food for thought: When we adjust the font size of our elements are we messing with the browser's default font size settings?

The font size you are reading right now is not big. It’s the text size browsers display by default. It’s the text size browsers were intended to display.

Information Architects has a great resource about their “Easy-2-Read” standard for font size on the web. Their first point being how font sizes (when using your browser's default settings) are meant to be big. If you opened any website and set the font size to 100%, the font size should be at 16 pixels.

I think browser developers are trying to tell web designers that small fonts aren't the way the Internet was meant to look. There are times when small font sizes have their purpose but your content should be read with ease.

I'm happy to say I'm not a small font person any longer. Large fonts make for easier reading and you can write fewer CSS styles by using browser defaults. Why else would the browser default be 16 pixels?

When I began thinking about my online presense, Tumblr seemed liked the ideal place to post my thoughts and share resources. There were a few problems along the way, Tumblr had been a great place to publish content with user interaction (i.e. following, tagging) and customizable pages.

Tumblr is still a very useful blogging platform fo ranyone who wants to start blogging quickly but there are a few issues that limit its usefulness. Spam has always been a problem (though not viewable to non-users) and certain pages that you could not customize (the 404 error and archive pages).

Enter Scriptogr.am

So there's this new kid on the block. A new blogging site that uses markdown and Dropbox to publish your posts, all on a customizable site that allows you to edit your files or theme on any device. Sounds like Tumblr, right?

Scriptogr.am is a relatively new site that gives users the ability to write posts using Markdown in separate files that are then synced to your account with Scriptogr.am and then published on your public site.

Scriptogr.am puts your words on the web as quickly and easily as can be. Working with your chosen environment, Scriptogr.am stays out of your way until the moment you're ready to publish.

What Makes Scriptogr.am Unique

• The creation of non-post pages is as easy as creating post pages. With a simple declaration at the top of your files, Scriptogr.am knows the difference.
• Your HTML and CSS is still handled through the Scriptogr.am website, but all your posts and pages are located in your Dropbox and not locked online.
• Scriptogr.am is just as customizable and easily customizable as Tumblr (even more with customizable 404 error and archive pages).
• While the process is impressive and often flawless, the load time of permalink pages can vary greatly (though not longer than three/four seconds).

Scriptogr.am is a service that I believe will prove to be just as enjoyable as Tumblr. If you're looking for an alternative more customizable than Tumblr that's not as confusing or complex as Wordpress give Scriptogr.am a try.