And here’s a little pen of my self-portrait’s animation:

There are a lot of fun technologies that have matured since I took my ski-bum sabbatical over the winter, and I am doing my best to bring my skills back up to speed. They weren’t all that far behind, but given my newfound motivation and availability for side projects, I’m really excited to delve into new stuff for notlaura.com v3. I’ve been whipping up a few Pens to test out different features for this storytelling mission.

My plan is to have a set of panels on the homepage, each outlining an important point in my so-called developer journey. I want it to feel like I am telling a reader my story. Here’s how I’m planning to do that:

Animated Panels and Content / Stoked on Grid

Since “Content is King Leader”, I started my process with that before getting into too much design or development detail. This is a rough outline of the panel copy, structure, and how I’d like the animations to build in (GreenSock for the win!).

Also, CSS Grid is one of the more exciting developments since sliced bread, so I will be doubling down on that! This article helped me get started.

Typed.js

Typing effects have been somewhat on trend for the last couple of years, mostly in a salesy context, or on portfolio sites to add multi-dimensionality to a person’s role. It looks like the plugin Typed.js by Matt Boldt is responsible for this effect in most cases.

Rather than typing out a single word or phrase though, I want to use the plugin to type out each panel as it comes into view, sort of like a chat room. Using my newfound JavaScript know-how, I made a Pen of just that!

Illustrations, specifically Llamas

I grew up on a llama farm. Although it was a source of mortification in my high school years, revealing this information seems to yield positive results in my adult life, so I aim to capitalize on it. Here is a sweet llama illustration/animation that will manifest somewhere on the homepage of notlaura.com v3:

Bye-bye Museo

You know that feeling when all of a sudden you can’t stand the typeface you’ve committed to all over the place? It’s been a long time coming, to be honest. Museo Sans and Slab have served me well for several years and for that I thank them, but a typographic refresh is past due.

I’m in the process of a light rebranding effort, primarily updating this site to be less oriented around attracting business and more oriented to me as a developer/individual. This site’s design has been the same for almost five years and, although I still love it, my goals have changed significantly; I’m currently looking for a full-time job, and the “I teach fishing” motif no longer needs to be front and center. I want this site to be a friendlier place for me to create content, less formal and more personable, geared toward an audience of fellow developers rather than potential clients.

My plan is to tell the story of my journey as a developer. In addition to the My JavaScript Story episodes of JavaScript Jabber, I was inspired by this Twitter prompt and its ensuing thread:

Friends, what is your tweet-sized tech origin story? Mine is: while 19 & living in Brazil, a friend said I should try CS. I did, loved it!

— Jamison ヽ(⌐■_■)ノ♪♬ (@jergason) July 19, 2017

I love hearing these stories. Everyone arrived at the web in their own way, and there’s no way we would know these things about each other without asking. Online interactions are 99% of the time about XYZ framework and <insert #hotdrama here> rather than our personal lives, and our stories bring the humanity and relatability back to an otherwise results-driven industry.

Additionally, I am excited about delving back into design and illustration for this site re-do. I have pretty much removed design from my professional repertoire, but I do still enjoy it! Since I am more comfortable in HTML and CSS than in Illustrator or Sketch, my design process happens in tandem with development. Now that I feel more confident in my JavaScript skills, I’m anxious to see where they come in!

Stay tuned!

Of all the talks I've given, the "The Five-Figure WordPress Website" is my favorite. It's a thorough look at the process I use to make WordPress websites in my freelance practice, and I'm really happy to share the process it's taken me many years to fine tune. With that in mind, here are a bunch of resources that I've found particularly helpful over the years and hopefully you will too!

Plugins

• Timber - Allows you to use Twig in your WordPress themes.
• Advanced Custom Fields - It's worth buying the Pro, particularly for the Flexible Content Field.
• WP Migrate DB Pro - for syncing databases
  Read More →

If I had a nickel for every time I heard this question:

"I want to make a website, but I know nothing about websites. Should I use Squarespace or WordPress? Something else?"

In reality I'd have less than a dollar, but I hear it enough that it's time to write a serious post answering the question. Here's the quick version:

Your website is primarily photo and image content: Squarespace.

You have mostly text/blog content and limited time/money: WordPress.com.

While my few month ski-bum sabbatical was enjoyable and revitalizing, I now realize that mountains, fresh air, and care-free living are totally overrated. Err…what I’m trying to say is I took my break and am ready to get back to business (and away from frustrating Utah liquor laws)!

I moved to LA. Yes, that’s true.

I write from my new home in sunny Los Angeles, West Hollywood to be exact. New York City treated me well the past few years, but the time has come for tamales, sunshine, and something a little different. Plus I get to be with some of my very favorite people and a little dog named Zoe.

I’m looking for work! Here’s how I get work.

When people ask me “How do you get work?” my response is:

I tell people I’m looking for work. Then, while I wait for referrals, I do a bunch of stuff for free. That includes talking at meetups, doing free workshops, and writing blog posts. Finally, I cross my fingers and have faith that it will come when I need it. It’s a very exact science, let me tell you.

So far that’s worked out just fine, and now is the ultimate test! I’m starting from scratch here on the west coast. Let’s see if my own advice applies. If you or anyone you know is looking for part-time or project-based WordPress and front-end work or private tutoring help with a project, send them my way.

Can I help you with anything? Get in touch.

I currently write from my new home at Goldminer’s Daughter Lodge in Alta, UT. I’ve made quite the transition from life in New York City. After a few months back at home in Pittsburgh, I have migrated to Utah for a ski bum sabbatical at Alta, a ski resort outside of Salt Lake City. I’ll be working as a bartender at Goldminer’s and fulfilling my bucket list item of skiing 100+ days in a season (today will be number 1!).

I had planned to write a long, heartfelt post about burnout and working too hard and how I’m totally over New York, but instead I will simply bid my web presence adieu for the time being and head for the slopes. Actually, it is currently 2°F, so I will take my time getting out there…

Oh yeah, during this time all Tackle Box classes are $10 each! So, for the cost of a decent sandwich you can learn web development. Check them out here.

I’m currently working on a style guide for a Rails app (fun!). The documentation is built as a baby Rails app of it’s own, thus in Haml, an HTML pre-processor (think Sass, but for HTML). Like any style guide worth it’s salt, I wanted to have a block of the markup for each element alongside a representation of the element itself (example). That way, a person could grab that block of code to use that element.

The problem of syntax highlighting is easily solved with the amazing Prism JS library, but it took me forever to figure out how to not render the Haml inside the Haml <pre> and <code> tags. The answer is a filter called :preserve. Other than this blog post by the wise Chris Eppstein, I have found 90% of Haml documentation incredibly cryptic, at least by my standards which, granted, as a front-end and WordPress developer may be quite high.

That being said…

In the hopes of saving someone somewhere a bit of time and headache, here, officially, is how to render a code block of Haml in Haml:

See the Pen A Code Block of Haml in Haml by Lara Schenck (@laras126) on CodePen.

In the coding classes I’ve taught (which, for the record, have been part-time, not bootcamps) students’ intentions are often to make their own websites, work on existing ones, or to incorporate web development into a freelance practice. Regarding bootcamps, I’ve met several graduates who began their careers with freelancing, where a lack of WordPress competence quickly becomes an issue.

Freelance WordPress projects are a fantastic way for novice developers to gain the problem-solving skills and portfolio they need to transition into a full-time tech job, yet ‐ to my knowledge ‐ proper attention to WordPress is rarely allocated more than a day in coding courses, if that.

There’s no doubt that knowledge of JavaScript, frameworks, and the like is valuable in a product-focused tech industry, and that WordPress is not a particularly “cool” technology. But WordPress also powers at least 25% of the web, and it is undeniably a skill set in high demand with a relatively low barrier to entry.

Am I missing something? Why don’t more code schools take this into account?

I genuinely enjoy reading other people's updates, and it was depressing when my 2015 Facebook "Year in Review" was, like, three posts, two of them Instagram repeats. What happened to original content and life updates? This isn't Facebook, but there is no better place for life updates than your very own blog. Plus it's healthy to intersperse the tech-y posts with personal ones.

Timber is a library for WordPress that allows you to work with object oriented templates using the Twig templating engine. I've written about it before, and have used it on just about every project I've done in the last year and a half. I'm even teaching a class on it!

Anyhow, although Timber ultimately simplifies templating in WordPress, there's a bit of a barrier to entry. If you haven't worked in a templating language before, it takes some time to get a handle on what's possible. The following are some introductory Twig concepts and snippets I've found particularly useful when working with Timber and Advanced Custom Fields.

Conditionals

Let's say you have an ACF option for the display of the header that is either an image or text. You could check like this:

<header class="single-header">
    {% if post.header_display == 'Image' %}
        {# Markup for header image #}
    {% else %}
        {# Markup for plain text header #}
    {% endif %}
</header>

Shorthand Conditional

That's all well and good, but what if you want to put a class on the <header> tag that indicated the display choice? It's pretty gross looking to do it this way:

<header class="single-header {% if post.header_display == 'Image' %}header-image{% else %}header-text{% endif %}">

Luckily, we can use shorthand conditionals!

<header class="single-header {{ post.header_display == 'Image' ? 'header-image' : 'header-text' }}">

I’ve made a few websites over the past year or so, and I finally feel like I’ve nailed down the process. Of course there’s a lot more to it, but potentially the most useful, simple, and adorably named part has been a typography mixin I call upperspace:

@mixin upperspace {
    letter-spacing: 1px;
    text-transform: uppercase;
}

I’ve been jamming on a class called .meta lately as well, and they work together nicely:

$size-base: 1.1rem;
$size-sml: $size-base*0.8;

$color-text-meta: #999;

.meta {
    color: $color-text-meta;
    font-size: $size-sml;  
}

.meta--upper {
    @extends meta;
    @include upperspace;
}

I’ve been a little anti-extends lately, but after reading Una Kravet’s post on Atomic OOBEMITSCSS (nice), I’ve opened up to them again.

Anyhow, just a simple Sassy snippet for your viewing pleasure.

I'm usually not one for non-fiction, but the times have changed. I'm currently reading Predictably Irrational: The Hidden Forces that Shape Our Decisions by a cool dude named Dan Ariely. In short, we humans are constantly influenced by "hidden forces" that cause us to make decisions that don't always make logical sense. Can't say I'm surprised.

I'm only about a third of the way into the book but the content is super applicable, particularly if you deal at all with pricing. I'm so excited about it, in fact, that I've regressed to college student mode and wrote a nice, summary/commentary of a few points for your reading pleasure. First up:

The Decoy Effect

I like this one. Here's a chart:

Imagine you are choosing to go on a romantic vacation to either Paris or Rome (something I am not doing, unfortunately). They are both very romantic locations with delicious food and drink, and it would be hard to choose between the two. Say you have three options for hotels:

1. Rome, breakfast included (A)
2. Rome, no breakfast (A-)
3. Paris, breakfast included (B)

There should still be no difference between Paris and Rome but because of how we respond to relativity, the Rome without the breakfast package makes the Rome with a breakfast package more attractive, and Paris is cast aside. This is completely irrational; the decision between Rome and Paris should still be as challenging.

The lesser Rome is the "decoy", or the A- option, and exists to make A look better. But then there's B (Paris) or the "comparison" option. It may be of the same quality as A, but has slightly different characteristics. The relativity of A to A- makes A the most attractive option. If B had a decoy, or a B-, a similar effect would take place.

Let’s be done with impostor syndrome.

I think we've gotten to a point where non-impostors, myself included, are using impostor syndrome as a way to describe ever-human insecurity. It's not productive anymore, and belittles the experience of those who really are dealing with it.

If I was a fake, I wouldn't be able to make websites. But I do make websites, and I'm paid to make them and teach people to make them. That's not to say I don't feel like a fake every five minutes, but a lot of cooler and smarter people than me have admitted to feeling the same.

I think there's another word for what we web people are calling impostor syndrome: identity crisis.

The web is in its awkward twenties.

And so are many, many of the people working on it. Fortunately or unfortunately, with your twenties comes the inevitable, quarter-life identity crisis. I'm living it, and it's not that fun.

I've been jamming on WP Super Cache these days. As great as Super Cache is (and it is great), however, you will consistently be failing in YSlow's "Expires Headers", Web Page Test's "Cache Static Content", and Google Page Speed Insights' "Leverage Browser Caching". Shouldn't a plugin with name "Super Cache" take care of all things caching? Not necessarily.

"Supercaching" vs. Browser Caching

Super Cache stores copies of your posts and pages in static HTML in wp-content/cache/. These are then loaded instead of querying the database and processing a PHP file every time. So, when you update a post and don't see the changes reflected immediately, that's because the cached, static HTML file hasn't been updated. You then delete the cache to make sure the new content is reflected when its rebuilt. That's "Supercaching".

There's another thing called browser caching that's also pretty cool but not accounted for in WP Super Cache. Browser caching means saying, "Hey, browser, remember what this file is until I tell you to forget it". For example, when you cache your stylesheet, the browser won't need to load it again when you go to another page that uses the same stylesheet because it remembers it from last time.

This is where CDNs (Content Delivery Networks) can be awesome, too - if many sites use and cache jQuery from a CDN (which they do), linking your site to jQuery on that CDN means the browser likely will already have it memorized i.e. cached.