Introducing Headstart

It took a while to finally get around to building out a theme/framework, but it is about that time. It is still a work in progress, but you can now view, borrow, take, fork, add to or do whatever you’d like with Headstart. Headstart is a theme/framework combo I guess you’d say, so I’m calling it a themework. I think it is a framework, but I put a little bit of effort into it so that you can install it and feel like you are starting out with a theme.

Head over to Github to take a look and maybe take it for a test drive.

What’s in it?

Headstart is based off of the _s (Underscores.me) starter theme, which by itself is pretty amazing. I got into a habit of starting all of my theme and development projects with a new _s download and then start customizing it with all of the same things I put in every theme. I realized after a few that I was using the same (or close to it) Sass variables, mixins, and basic layouts, as well as calling the same external stylesheets to use. So rather than risk missing a step or forgetting anything, I started putting together a master theme that I would use from then on out. This is that theme.

Why not a taskrunner start a new project?

Good question. The answer is that internally, I do use them to start most of my projects and automate my workflow. But you can’t really tap into my computer whenever you want now, can you? This was created for people like me that aren’t me. Not everyone wants to get to know those things and that is fine. This theme does however have Sass baked right in, so if you aren’t using Sass in your workflow, can I recommend changing your workflow?

So What is in it?

Underscores

First and foremost, this is an extension of the _s starter theme. I took what they started and gave it some more bells and whistles. I also went in and did a bit of work on some files. If you’ve ever used _s, you know that out of the box it is a bit rough and tough to work with. It has no layout and no style added. I added a very, very small amount to get you going. I added a little padding and spacing so it looks a little cleaner and easier to digest.

I also created and set up a few variables in the SCSS files. I added some color variables (see below), some typography variables for you to use (add your font-family choices in _typography.scss and then add them to the preset $sans and $serif variables. Then you just need to call them elsewhere in the code as those variables and you are good to go. Or change them. Make a $sans-title and a $serif-pullquote variable and add totally different fonts. Do whatever makes your life easier and makes you happy. Once you download it, it is yours. But I started a few variables off so if you haven’t used this theme or Sass before, you can see how it works.

Sass!

If you are used to using Sass/SCSS, you’re in luck. Just open up the project and the files are already set up for you. First time you compile it, you will have a fancy style.css file in your root folder that is ready to make your site all pretty. No work needed here except you will need some way to compile your Sass. I’ll recommend Codekit if you want something awesome that costs money and LiveReload if you are looking for really good and free. Both will compile, both will refresh your browser on Save and both are awesome.

Bootstrap Grids

In the Sass part of the theme, there is already a few stylesheets baked right in. First is Bootstrap grids. I didn’t include all of Bootstrap because I didn’t want to take a starter theme and make it giant, but I did want to make it usable without a ton of work. So you can use your normal Bootstrap syntax to create your containers, rows, columns, etc. right out of the box.

Animate.css

Almost all of us use it, so why bother dealing with getting it set up for every project? The minified version is already in the theme and linked in header.php (I know there is a better way to enqueue scripts, but right now this is how it is set up. Once I get around to finishing the right way of doing the functions.php file, I will delete this sentence and you won’t have to worry about it. If anyone wants to fix that for me on Github, I’ll be your pal. If not, I’ll get to it in a few days/weeks/whenever.)

Material Design Colors

In the Sass files, there is a _colors.scss file with all the color variables and whatnot. What I did is go ahead and add all the Material Design colors with named variables. I got it from someone on Github or elsewhere and for the life of me I can’t find where right now. Once I find it, I’ll credit them properly. It’s just a bunch of variables, but it is pretty cool. Once I have time (or you do if you want to fork and help…), I would like to change this to a Material Design mixin. On the to-do list… But for now, variables are still cool.

Media Queries

I found an awesome Sass media query mixin that I added to this that allows us to set a few breakpoints as variables, then call nested media queries. Example:

@include media(">medium", "<=large") { width: 100%; }

So you can just nest this media query inside the class or id and do responsive design and media queries on the fly. I for one hate having to deal with an extra media query file and feel like I am essentially recoding a whole site just to get the breakpoints right. This mixin is amazing. Here is more information on it so you can add it to your own project or if you use mine, you know how to handle media queries.

What to do?

The code is all out there for you on Github. Do what you'd like with it. I'm not a heavyweight with Github, so if anyone wants to work with me on this or sees anything I did wrong putting a theme on there, let me know or jump in and help out. Otherwise, take this Headstart and hopefully it will help you get your next project going a bit faster.


Reigniting the Blog

Hey there. It’s been a while. Sorry to not keep in touch, but I haven’t updated the blog in a long time for a good reason. I’ve been busy with clients and that is always a good thing. But I’m coming back and going to keep this thing updated going forward.

I haven’t stopped with client work, I’m just making an effort to prioritize blogging again. I am in the process of writing a large piece on how the redesign happened for this site and will be as thorough as possible. But from here on out, thoughts, tips, code and anything else is fair game and I’ll be updating regularly. Wish me luck…


Cloud HQ Review: All Your Files Anywhere

I am an avid user of the cloud and cloud storage. Dropbox, having been synced to my external hard drives on two computers, is my default “hard drive.” I am also an avid user of Evernote. I mean to use Google Drive and my other cloud accounts more, but the hardest thing is to remember where my “current” versions of files are. So I stuck with just Dropbox for files and Evernote for notes.

What I kept looking for and needing was a way to have everything stay connected. I thought about adding my Dropbox folder inside my Drive folder, but I was afraid of what would happen to the several machines that I only sync certain folders with.

As you can see, I spend quite a bit of time contemplating file management setups! So naturally I was interested when I read a review of Cloud HQ and decided to give it a shot. Here’s what I learned about their cloud storage solutions:

You start with creating a free trial account on one of their tiers that vary by the number of accounts and paired connections you need. Then you pick what services you would like to sync with one another.

I began with Dropbox, as it is my lifeline to my world and my work. Since I wanted to have more access to my Google Drive files and have them up to date, as well as having better access to my Dropbox files on my Chromebook, I paired these two first.

Once in the Synchronization Pairs screen, simply select which accounts – and which folders in those accounts – to pair together. In addition, I selected my SkyDrive account to one-way sync with Google Drive, and to have it convert my documents to Drive documents upon sync. With both pairs, I also chose to create backup archives in the process.

I have far more cloud storage accounts then I know what to do with. Being able to use them and sync things allows me to take advantage of them. Now, instead of always changing where I am saving my Microsoft Word documents, I can actually use the cloud service that they offer, then just sync it to where I am more familiar. At the end of the day, what I really have is more options and more comfort.

Really, if you are someone who cares about file management and/or data safety, this is a service you should look into. I work from multiple places and the idea that I can just hit save in my office to save something to Dropbox, then go open it on my laptop, then save it again and be able to open that same file in Google Drive on my Chromebook and have each time be the most recent version of that file, is an amazing feat in technology.


A New Coat of Paint With Thesis

Imperomedia.com has a new look. Over the past two weeks or so, we have taken the design of our website and repackaged it to better optimize our message and our overall look. Perhpas most significantly as web designers, the new look was created entirely with the Thesis theme. While there is certainly a learning curve with Thesis, this is now the second site I have built with it and it is feeling more and more like it will be my default theme of choice for future sites and clients with no other requests.

I am certainly happy with how the site looks, but it is and will continue to be a work in progress. I will try to post more articles on using Thesis and what I have learned along the way. I was able to discuss some of my issues via Twitter with Chris Pearson, the creator of Thesis as I built my first site with Thesis and found ways to make the difficult things easier. Essentially, the site is built with boxes upon boxes inside of boxes, each styled uniquely and holding different functional powers. We are running a lot of widgets and also a lot of custom functions, but in the end, I feel the site has a cleaner look and vastly improved functionality. I like clean and I like easy. This site is now both of those things to me.

I’m excited to present this new look and I am equally excited to see where it evolves to next.

Image: Flickr user Amiefedora


2013 In One Infographic

2013-In-One-Image

Illustrator Mario Zucca was able to put into one drawing what many people would struggle to put into an entire full-length article. In his words, “Miley twerked! Snowden talked! Healthcare.gov tanked!”

And that’s just the tip of the iceberg. Zucca crammed 90 different stories into one graphic and takes you on a short journey of how on his blog. It’s a wonderful graphic and a great way to review the year.

As far as I’m concerned, any image with Walter White and the Bluth Stair Car in it are alright by me.


Six Ways to Get Over Writer’s Block

Writers BlockAnyone who has ever needed to write something -= for work, school or leisure — has run into writer’s block. It sneaks up on you and leaves you staring at a blank page feeling hopeless. It can be extremely frustrating. The good news is that just as well as it will surely arrive, it will also surely pass.

Before you give up on writing due to writer’s block, here are a few ways to try to fight through the difficulty and end up with a productive writing session after all.

Change The Scenery

Sometimes snapping out of writer’s block is all about changing your environment. Perhaps you always write at the same computer in the same room at the same time. Try packing up your laptop or a notebook and head out to a coffee shop or the library. There are many places to set up shop to try to write and picking some new scenery can often jump start the creative process for you.

Start with the Conclusion

The part that people get stuck on with writer’s block is the beginning. Getting started at all can be the hardest thing in the world. So don’t start at the beginning. Start writing at the end or in the middle. Anything that gets words flowing is a step in the right direction. Once you have something going, you can go back and fill in the blanks or the beginning.

Get Motivated

Lack of motivation can be a killer to a writer. You don’t always feel like writing when you know you need to be writing. But when you have to write, you have to write. So just write! Sounds easy, right? Write anything to get writing, even about a different topic. Try some free-writing and see if the juices start flowing. Write a review of a book or a product. Once the wheels get going, you might find that it is much easier to tackle the writing that you actually sat down to do.

When it comes to writing or productivity in general, starting gets you so much further than you might think. Tell yourself to write for five minutes or to write one page. You will likely find that you just keep on going and end up with a good session. Baby step your way to a long walk.

Get Inspired

Inspiration is a large part of the writing process. What are you going to write about? Why are you writing today?

Being creative, you know that inspiration can strike anywhere. Put yourself in situations conducive to creativity. Put on your favorite album and listen to the creativity in it. Read a chapter of a book you love. Take a walk and daydream. Take things in and allow your brain to relax. Once you are in this state, you may find that inspiration hits you and the words just start flowing.

Have a Ritual

If you play golf, you may be familiar with the importance of a pre-shot routine. You may get your yardage, take a look at the hole, take two practice swings, waggle once and swing. Every. Single. Time. It builds a routine and takes the thinking out of things. The same thing can apply to the creative process and writing.

Create a routine where you do the same thing to prepare yourself for the work ahead of you. Perhaps you brew a pot of coffee, jot down some bullet points, put on some music or go for a jog before you start writing. If you keep a good ritual, you will find that the process gets simplified and allows you to think only about the project at hand. A better work environment and eased mind creates better work.

Put Pen to Paper

It can be so easy to stare at a blank computer screen. Or be distracted by the Facebooks and Reddits of the world. Eliminate this atmosphere with the old fashioned trick of picking up a pen and paper! You can write anywhere with a pen. And you can also doodle and draw. There are many ways to allow your creativity to start flowing with a pen and paper. Sometimes going old school can take away the block that staring at the screen can create. Start writing anything on a piece of paper and keep going until the writer’s block has been defeated.

Conclusion

Everyone has their own way of writing and their own creative process. My ways might not work for you and yours may not woke for me. But we both know that writer’s block will hit us both and that when it does, we will feel lost. Anything new may help jump start the creativity and get you out of the rut. When writer’s block inevitably hits, try one of these techniques and see if it helps you out of your jam.

Photo Credit


The SEO of Tolstoy: A Guide to Effective Content Strategy

The SEO of Tolstoy: A Guide to Effective Content Strategy (via Wallaroo Media)

The SEO of Tolstoy: A Guide to Effective Content Strategy In order to run an effective content strategy for yourself or a client, you need to keep in mind that your audience requires specific, useful information in order to make an informed decision…


Continue reading “The SEO of Tolstoy: A Guide to Effective Content Strategy”