Half-Elf on Tech

Thoughts From a Professional Lesbian

Author: Ipstenu (Mika Epstein)

  • Where Did Underline Go?

    Where Did Underline Go?

    As of WordPress 4.7, the visual editor no longer has a button for underline. There were a lot of reasons for this, but primary are two:

    1. Space is not limitless.
    2. Underlining looks like links.

    Naturally someone complained that we were breaking style guides:

    When referencing a source of information it is correct form to underline the title of the source.

    They happen to be wrong. Let me explain.

    The Web Is Not Print

    We use double spaces to indicate the end of a sentence in printed works. We don’t on the Internet. It took me a long time to get used to that, and if you look back on my older posts, you’d see it all over the place. The point here is that we know you don’t use the same punctuation and style you might use online as you do on paper.

    I look to the grandpappy of web, Jakob Nielsen, for some backup here. Your writing style for the web is different from print. A lot different. In Writing Style for Print vs. Web he says:

    In linear media — such as print and TV — people expect you to construct their experience for them. Readers are willing to follow the author’s lead.

    In non-linear hypertext, the rules reverse. Users want to construct their own experience by piecing together content from multiple sources, emphasizing their desires in the current moment. People arrive at a website with a goal in mind, and they are ruthless in pursuing their own interest and in rejecting whatever the site is trying to push. Banner blindness is only the most extreme manifestation of this selfishness.

    But that talks about the way we write and not the design of what it looks like. Web and print design are wildly different too. For newspapers, you have to consider the width of the columns. If you’ve never taken a journalism course, there’s as much about layouts as there is about writing a solid lede.

    Good Writing Has Rules

    I’m a huge fan of Strunk & White’s The Elements of Style. My wife has a copy and, when we met, she found my grammar to be deplorable and used to wave it at me a lot. Having read it multiple times (yes, I do re-read it) I’ve found my communication skills have been catapulted because of the directions. People ask me why I’m a good speaker and the answer is because I’m a good writer.

    One of the lessons from Strunk & White is to use the active voice, for example, which is something Nielsen points out as well. You need to engage your readers. You need to bring them on a journey and make it theirs as much as yours. To do that, you need to understand the rules of the language in which you’re writing.

    Content Must Not Confuse By Context

    Going back to the heart of the matter, why is it okay that WordPress killed the underline button? It was confusing.

    Originally we underlined links because it was easy and being consistent about a display reduced the chances for misunderstandings. Why were they underlined and blue? I actually have no idea. I looked it up but was unable to find a solid answer. My theory was that blue would stand out against the standard grey background as well as the black words so everyone knew what it was for. Similarly, on a monochrome screen, which was very common in the day, an underline would stand out (as it happens, Sir Tim Berners-Lee picked blue totally by happenstance).

    Why underline and not bold or italics? My guess is that since underlining is not actually standard practice for writers, it was a safe grab. Otto pointed out that old-old systems always had underlines, but not always italics or bold, so that weighed heavily into the decision as well, clearly.

    In a word, it wasn’t confusing. It was consistent.

    It’s Actually Italics

    Did you double take when I said underlining wasn’t standard practice? Surprise! Let me appeal to Misters Strunk & White on a few matters of form:

    Titles. For the titles of literary works, scholarly usage prefers italics with capitalized initials. The usage of editors and publishers varies, some using italics with capitalized initials, others using Roman with capitalized initials and with or without quotation marks. Use italics (indicated in manuscript by underscoring), except in writing for a periodical that follows a different practice. Omit initial A or The from titles when you place the possessive before them.

    The Iliad; the Odyssey; As You Like It; To a Skylark; The Newcomes; A Tale of Two Cities;Dickens’s Tale of Two Cities.

    Notice the direction to use italics? The talk of a manuscript is in reference to the fact that most people wrote manuscripts by hand or on typewriters that didn’t have italics. I remember having to type a line, and then backspace to add in the underline manually. Have you ever tried to write italics manually? It’s not easy!

    The web is not handwritten. Computers in 2016 can handle italics.

    And it’s not just Strunk & White. Harvard’s documentation on citation doesn’t recommend underlining at all. The MLA (Modern Language Association) says, as of this year, to use italics for large works like books and magazines, but quotes for short ones in titles. The Chicago Style Guide reads the same.

    Use Italics, Not Underline

    If you skip the whole post, let me make this simple for you: The title of a source should be italicized.

  • EasyApache 4, PHP, and WP-CLI

    EasyApache 4, PHP, and WP-CLI

    Way back in March, I upgraded my server to use EasyApache 4. I did this because I wanted to have multiple versions of PHP on my server and be able to segregate it by domain. I also wanted to be able to upgrade PHP without having to rebuild Apache.

    For the most part, it’s been great. There were a couple odd snafus, like when it accidentally installed the wrong wp-cli on a minor upgrade for me, but it magically fixed it.

    PHP Breaks WP-CLI

    The problem was when I ran wp-cli commands, I got this error:

    PHP Warning:  array_slice() expects parameter 1 to be array, null given in phar:///usr/local/bin/wp/php/WP_CLI/Runner.php on line 610
    PHP Warning:  Invalid argument supplied for foreach() in phar:///usr/local/bin/wp/php/WP_CLI/Configurator.php on line 132
    PHP Warning:  proc_open(): Descriptor item must be either an array or a File-Handle in phar:///usr/local/bin/wp/php/commands/help.php on line 111
    PHP Warning:  proc_close() expects parameter 1 to be resource, boolean given in phar:///usr/local/bin/wp/php/commands/help.php on line 111
    Content-type: text/html; charset=UTF-8
    

    Scary! I tried reinstalling and that didn’t work

    I took a note of what version of PHP I had running on command line and so something weird:

    PHP 7.0.10 (cgi-fcgi) (built: Aug 22 2016 20:34:53) Copyright (c) 1997-2016 The PHP Group Zend Engine v3.0.0, Copyright (c) 1998-2016 Zend Technologies with Zend OPcache v7.0.10, Copyright (c) 1999-2016, by Zend Technologies

    The Wrong PHP

    PHP 7.0.10 (cgi-fcgi) sounds like it should be okay, except I knew two thing:

    1. Fast CGI (fcgi) isn’t supported on EA 4 yet. It’s not even supported today. They’re working on it but it shouldn’t have been a thing installed.
    2. That should be cli not cgi-fcgi!

    I pinged a friend at cPanel who said “Oh no!” and promised to look into it for me. The next day I got an email that there was a minor PHP update to my server last night. I knew that meant PHP had been rebuilt. When I went to look, wp-cli was working again.

    Ergo – Something was wrong in PHP 7.0.10. It pushed the wrong version of PHP for command line somehow.

    Risk vs Reward

    Obviously this is a risk, having a server auto-update itself. It could install a rogue package or someone could typo or worse. At the same time, having PHP apply it’s own security patches for me means I don’t have to worry that I’m in Japan for a week and forget to do something. The risk, knowing that EA will roll out a fix for me, is less than the reward of being secure.

  • Damn You, Autocorrect!

    Damn You, Autocorrect!

    After the seventh time I shouted “stop autocorrecting cmb2 fields!” at my site, I knew I had to do something.

    When you run a website where you enter a lot of people’s names, Autocorrect is a curse more than a blessing. Of course I want it on my post content, but when I get to the field where I enter someone’s name, for crying out loud, some names like Nuñez just don’t meet a spell check. And don’t get me started on my friend’s names or my own. I’ve lost track of the number of times I ended up as “Mike.”

    This issue used to only be on phones and tablets. Then Apple introduced autocorrect to their MacOS, which resulted in a lot of tweets followed up by “Damn you, Autocorrect!”

    HTML Attributes

    If you’ve got a form and you want to tell autocorrect to go away, the code looks like this:

    <input autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
    

    For the most part, this will work. You don’t need all of them all of the time, but in my case I was adding names and “Debbie van Houten” was one problem and “Dr. el Farad” was another. I wanted it to just shut up and let me type the name as their parents intended, no matter what. I went whole hog.

    But as I mentioned, I use CMB2 and I needed to stop my site from autocorrecting CMB2 fields. It was time for some code.

    CMB2 Custom HTML Attributes

    This one is so straightforward I was delighted. When you create a new field, you can set arbitrary attributes.

    // Field: Actor Name
    $cmb_characters->add_field( array(
    	'name'				=> 'Actor Name',
    	'desc'				=> 'Include years (in parens) for multiple actors',
    	'id'				=> $prefix . 'actor',
    	'type'				=> 'text',
    	'repeatable'		=> 'true',
    	'attributes'		=> array(
    		'autocomplete'		=> 'off',
    		'autocorrect'		=> 'off',
    		'autocapitalize'	=> 'off',
    		'spellcheck'		=> 'false',
    	),
    ) );
    

    That was all I needed to do in order to get autocorrect to duck itself. Now I was free to write however weird a name I needed without worrying that autocorrect wanted to call me Mike. Again.

    Thanks, autocorrect. Thanks a lot.

  • Security: Do it the WordPress Way

    Security: Do it the WordPress Way

    Pretty regularly, people complain that I’m being pedantic and stubborn about security. They argue that their home-grown filters and regular expression checks are more than sufficient for sanitizing and validating data. Invariably I tell them “WordPress has a function for that. Please use it. Don’t create your own.”

    Most of the time, this gets a grumbling acquiescence. On the rare occasions it doesn’t I get a pretentious email telling me the developer has been working in tech and computers for 10 to 14 years (10 is most common) and they’ve released code before and they know what they’re talking about.

    You know what? You do. Most of the time the code you people come up with looks fine. But after 14 years working for a bank and around 7 of doing WordPress plugin reviews and nearly 5 of working for a web host, I’ve got a different point of view than you do. I have a mountain of experience that is hard to match. This doesn’t mean I’m the smartest person down the pike, don’t get me wrong. But I’ve seen a lot. I’m like that Farmer’s guy.

    We know a lot because we’ve seen a lot

    With all the things I’ve seen, I’ve developed a very different set of criteria for security beyond just “Is it secure?”

    I know the following:

    • Someone is always going to be smarter than I am.
    • Hackers are incredibly dedicated to being shits.
    • Users are incredibly inventive with usage.
    • People don’t look before they click.

    I ask the following:

    • Is this the fastest (most efficient) way to sanity check the data?
    • Is it being validated to prevent PEBUaK errors?
    • How easy will this be to fix when I find a problem?
    • How much damage will this cause if it breaks?

    To WordPress or Not to WordPress

    When I have a choice of reinventing the wheel or using what WordPress already sanitizes for me, I will always pick WordPress. Every. Single. Time. This is for a very practical reason.

    • People don’t upgrade plugins.
    • People do upgrade WordPress security releases.

    By default everyone using WordPress gets security releases and they get them within 12 hours (more or less). Yes, people can and do disable that, but they’re the minority. When you talk about securing 26% of the Internet, the ability to patch people quickly is paramount. WordPress knows this.

    If I’m using the sanitize_name() function from WordPress and not a hand-hewn regular expression, then if there’s a flaw in that function I know it will be patched and the patch pushed and my users made safe. If I make it myself, I have to pray everyone upgrades.

    Excellence Uses The Right Tools

    Think of it this way. If your plugin becomes a popular plugin and 2% of WordPress users use it, then that’s .5% of all sites on the Internet using your plugin. Which is better for them? Which is safer? Do you rely on the tried and true, tested sanitization via WordPress which will emergency self-update or your own code?

    Once you think of it not as “How can I make my code succeed?” but “How can I build trust for 27% of the internet?” it’s clearer.

    Rely on WordPress and not your own code whenever possible. It’s smarter. It’s safer. It has the long-term view to take you from a newbie to a well-known tool. If there’s a security hole in WordPress, everyone will work to fix it, and it will get out to more people than just your users.

  • Custom AMP Design

    Custom AMP Design

    The basic design of a page using AMP works for news articles. This is by design. It’s meant to be fast to load and fast to display, and that means removing the majority of cruft we shove in sidebars and footers. It means a streamlined website.

    A basic AMP page

    That’s a basic page but it works well for what it needs to be. The issue happens when you consider pages that aren’t your typical ‘news’ pages.

    Compare the information in a character page. On the left is the normal page and the right is the AMP page.

    An example character page with the regular on the left and the AMP on the right

    There’s some work to be done, obviously. Enter Custom Templates.

    Calling the Right Template for the Job

    The example code works great when you want to universally replace things. I don’t. I want to use a different template per-CPT, so my code is this:

    /*
     * AMP custom templates
     */
    add_filter( 'amp_post_template_file', 'lez_amp_post_template_file', 10, 3 );
    function lez_amp_post_template_file( $file, $type, $post ) {
    
    	$post_type=$post->post_type;
    
    	if ( 'post_type_characters' === $post_type || 'post_type_shows' === $post_type ) {
    		$file = get_stylesheet_directory() . '/amp-templates/shows-chars.php';
    	}
    	return $file;
    }
    

    That was the easy part.

    Making Your Template

    Now I need to make the template. It’s actually not as obvious as it might be. You can’t just copy the single.php file from the AMP templates folder and go. No, if you want to use it as-is, you will need to set up how to pull the custom templates.

    For the quick example, we have the Single Template and with that we have to replace all the calls to load_parts. They look like this:

    <?php $this->load_parts( array( 'header-bar' ) ); ?>
    

    We have to change them because the code for load_parts is relative to the file, and it doesn’t call .php so it’s a bit of a drama to call them. I replaced it with this:

    <?php include_once( WP_PLUGIN_DIR . '/amp/templates/header-bar.php' ); ?>
    

    This is pretty much what I tell plugin developers not to do. Never ever use WP_PLUGIN_DIR unless you absolutely have to. Always use plugins_url() and plugin_dir_path() please and thank you. But since I can’t use a URL in include_once() because it’s https) and I can’t use plugin_dir_path() because it’s relative to the file it’s called from, and this is called from the theme. So yes, here I have to use the one constant I tell you not to use. I’m aware of the irony.

    The rest of the template is mostly removing things I can’t filter out. I removed the feature image, I removed the byline (we don’t care who wrote the CPTs, authorship isn’t an issue), and I removed the taxonomies.

    Fix The Images

    Once the main file is loading properly, it’s time to address the two problems with the images: size and location. There’s, thankfully, some default code that can help with this that didn’t need a template. AMP comes with directions on changing your featured image but the example code had to be tweaked in order to handle multiple post types:

    add_action( 'pre_amp_render_post', 'lez_amp_add_custom_actions' );
    function lez_amp_add_custom_actions() {
    	add_filter( 'the_content', 'lez_amp_add_featured_image' );
    }
    
    function lez_amp_add_featured_image( $content ) {
    	global $post;
    
    	$post_type=$post->post_type;
    	$post_id=$post->ID;
    	$image_size = 'featured-image';
    
    	if ( $post_type === 'post_type_characters' ) $image_size = 'character-img';
    	if ( $post_type === 'post_type_shows' ) $image_size = 'character-img';
    
    	if ( has_post_thumbnail() ) {
    		$image = sprintf( '<p class="lezwatch-featured-image">%s</p>', get_the_post_thumbnail( $post_id, $image_size ) );
    		$content = $image . $content;
    	}
    	return $content;
    }
    

    But. This made double images! Why? Because this is a lie: “The default template does not display the featured image currently.”

    It does. This is why I removed the featured image in my template. If I can figure out how not to do that, I’ll be 90% of my way to not needing a custom template at all, because everything else I did in the filter.

    Add the Extra Content

    Remember function lez_amp_add_featured_image() above? Yeah I threw it out and made an insanely complex. I renamed it function lez_amp_add_content() and the if ( $post_type === 'post_type_characters' ) {} section became huge so that I could output the code the way I wanted.

    Filtered content for the AMP pages for characters

    In the image above, you can see I’ve not only added in a lot more meta content from the post, but I also tweaked the CSS to float the image to the left and resize the SVGs. I went super image light on this, loading the smallest image that would work, and the SVGs are very small sized.

    Overall? It should be easier

    The biggest issue I have with this is that I wish I could filter more. If I could turn off the featured images and remove the bylines, then I wouldn’t need the custom template at all. At least, not for the characters. The shows? That’s another matter.

  • You Are Not Your Code

    You Are Not Your Code

    This is not exactly what I said at WordCamp US 2016, but it is a great deal of it.

    I started my slides for WordCamp US so many times, I probably have enough content for a week of blog posts. The weight of what I was going to say there sat on my shoulders like I’m Atlas. Trying to dredge up the pain from the rejection and harassment I’ve felt over the years, all in order to write, reminds me of the carrion birds, ripping apart Prometheus, while he heals only to be torn anew each day, all for presenting humanity with the gift of fire.

    Perception: We Are What We Code

    Too often, when we think about our contributions to WordPress, we think of them in the literal terms. I have written code. I have fixed CSS. I have beta tested. I have created a plugin, a theme, a blog, a store, a book, a career. We make the fatal mistake of boiling down what we are to one thing. The contribution. The code.

    Reality: We Are What We Create

    We forget something crucial, that these creations are just that, creations! We have invented something out of nothing, purely with the power of our minds! We’re artists and dreamers and believers and builders. Anyone who’s studied art, music, journalism, knows that there’s a strange dissociation that we have to build in our hearts. The separation between what we create and who we are and what the reviews will be.

    We Can’t See the Forest For the Trees

    Artists are, often, seen as temperamental. Capricious creatures who fall to the whim of our desires and passions. People who obsess over one thing to the exclusion of others. Who trash hotels when frustrated. Who lash out. Who take the rejection of a bad review so closely, so personally, they cannot separate themselves from their art.

    If you saw my talk at WordCamp Europe earlier in 2016, or read my post about it, that sounds familiar. We, we contributors to open source, are exactly the same. Which is why it is hard, so so hard, to separate our hearts from our heads. We wanted to bring fire to earth. We wanted to share our joy. We wanted to do the right thing and change 26% of the Internet for the better. Give or take.

    Instead, we’re told our code sucks. If we don’t offer free help for our work, we’re called greedy and vain. Being driven to fix one part of WordPress is wasting our time, no one uses it. Creating new features? We should fix what’s broken, even if we don’t know how. We are pulled by a million masters, our users, and we can never do enough.

    And what about when our contributions are less visible? What about the people who spend hours making sure this WordCamp flowed smoothly? The ones who ensure funding? The one who fixed the inline documentation for core? The people in the support forums who help people for free? The people who review your themes and plugins and try and keep things fair for all. Oh, oh yes. I know that one.

    The problem here is that we all do things for good. Everyone you see at a WordCamp, everyone who is a speaker, a volunteer, a contributor, is doing this for good reasons. Maybe not entirely altruistic, we’re not all socialists and software communists like me, but I promise you, every single one of us who steps up and does things for the greater good of WordPress is doing so with the best intentions. We care.

    And they don’t see that.

    “Reputation is what other people know about you. Honor is what you know about yourself.”
    — Aral Vorkosigan in A Civil Campaign, by Lois McMaster Bujold

    One of the points I wanted to address in my talk was that there are a LOT of days when you know you’ve done the right thing, and your reputation tanks. While a lot of people here like me, appreciate my work, and respect me, I’m not so naive as to think that’s universal. I know very well that there are people who watched my talk, who read this blog, who dislike me for, say, closing their plugin or deleting their reviews. Or worse, not deleting a review.

    The Cost of The Greater Good

    I want to say the good of the many outweighs the good of the one, or the few. And there are days where you’re the one. You’re the 20% minority. These days, as my father taught me, will outweigh the ones where you are praised, thanked, lauded, and cherished. It’s the dark part of human nature. You will, you WILL do things for the best intentions, and you will NOT be appreciated for it.

    What you do when these things happen? Well you have choices, like I mentioned this summer. And there are downsides to each one. Otto, who’s somewhere around here, spends time talking me down from correcting people. I have a strong urge to “Well, Actually…” the people who insist I have evil in my heart and I’m power hungry. Other people listen to me vent a little. And sometimes I subtweet.

    But this is the part that hurts. You can’t win. It’s impossible. People won’t believe you if you defend yourself. They won’t accept your explanations, they’ll see them as excuses. Silence will be seen as proof they were right. Fighting back? A show of weakness or a cover up. There is, literally, no way to win it. Ever.

    Outsmart, Outplay, Outlast

    Outsmarting them can be a pyretic win. Outplaying? You can try but I wouldn’t. But what if you keep going. Then the win is not a win but sort of an eventuality. Awesome, I know.

    You can’t teach a pig to sing. It frustrates you and annoys the pig. That’s a Southernism from my inlaws. There are some people you just can’t reach, no matter what you do. That’s where the remark of “I’m sorry you feel that way.” comes from. When I say that, I’m not giving up, I’m accepting futility.

    And yet. You know that saying? The one about serenity and accepting what we cannot change? I hate it. I don’t believe there’s a single thing we cannot change, just perhaps not as quickly as we’d like. Accepting futility means I accept that there is no way I can, right now, explain myself well enough to change a mind. Yet.

    It’s not about being smarter than someone else, it’s about being smarter than yourself

    If you can convince yourself not to be stupid, you will protect yourself from just about everything. Outsmarting yourself is hard, though. You want to believe that you’re right. You have to remember that there is always someone smarter than you, somewhere. And no one is stupider than past you. That’s why we leave ourselves notes in documentation. To make sure future you remembers. Not being stupid means not picking fights. It means recognizing when you’re wrong.

    The secret behind outplaying is you’re outplaying your own tendencies and habits. You know yourself. You know when you snap off a reply you shouldn’t, or when your humor is more biting than it should be. You have to play yourself and not do those things. Fool yourself and you’re the fool, but play to your strengths and you can keep yourself humble while preventing your inclination to be stupid.

    If you outlive everyone, then you get to write the history. That takes a lot, A LOT of patience. More than most of us have. And it requires being able to tell someone you’re sorry you can’t help them, or you’re sorry they feel that way, and you walk away. And you wait. And wait. And wait. The being quiet part is the hardest, because people like to fill silence, especially you. But you must wait to survive.

    Survival is not about the Fittest

    I could tell you how I survive. I could tell you to subtweet, to blog, to scream, to ride your bicycle until your lungs feel inadequate and your legs are on fire and your blood pounds so much, your Apple Watch wonders if you’re having a heart attack. I could tell you to talk to someone, a loved one or a professional, and maybe to try meditation. The Breathe app? Pretty nifty.

    Remember how I said everyone at a WordCamp wants to make WordPress better? And remember how I said you’re not code? I lied a little. You ARE code in that you, me, everybody is WordPress. And while I cannot tell you the right answer for you and how YOU can survive the storm and the hate that you will face, I can tell you that you are not alone. That you are one of us. And that WE are here too.

    As a team we are stronger. We can rely on each other. We can lean on each other. We can take our shared love of sports, or food, or a same birthday, and find connections with each other.

    What I Don’t Know…

    The one thing I cannot tell you is why people hate. I don’t understand it myself. I suspect I never will. But what I can tell you is that we are better together. The way to make it past the hate is together. I am strong, mentally, because I turn to my community, sometimes quietly and sometimes loudly, and ask for help. There’s no shame in that.