How To, humor

Trust, But Verify

Ronald Reagan’s remark about arms control is not an oxymoron, as I learned while coping with the discovery that my phone-friendly blog was not so friendly after all.  Able to handle mobile calls with a simple flip phone (and unable to type with my thumbs), I had seen no reason to have a smartphone and had trusted the WordPress previewer to warn me if a blog post would look bad there.  But then I bought a smartphone.
– Gray button (upper left corner) reveals widgets, –
– above post (on phone) or beside it (on desktop). –

Until recently, I used a desktop computer for all my online activities.  I surrendered to modernity in 2021-05 and bought a smartphone with a stylus that would make hunt-and-peck typing tolerable in short stints.  Now I use the new phone about 1% of my time online and have backup for coping with hazards like extended power outages.

Aware that many people do use their phones the way I use my desktop, I am careful to preview my blog posts as they would look on a phone.  Previews cannot be perfectly accurate, but I leave some pixels of wiggle room whenever I want everything in a line of text on my desktop to appear as a single line on the narrower screen of a phone.  The WP previewer displays a plausible phone rendering, and I change my draft as needed to make posts look OK on both desktop and phone.

Wanting to get used to my new phone w/o accidentally buying junk or installing malware, I installed my usual browser (Firefox) and browsed some familiar sites, including this blog.  Oops.  The fonts actually used were much larger than what I expected from the WP previews.  My posts were awash in weird line breaks and required absurdly much scrolling.

13204746 - dinosaur and comet, vector illustration

© Evgenii Komissarov | 123RF Stock Photo

I tried the popular Chrome browser and found that it also rendered text much too big.  After much thrashing around, I stumbled onto a simple way to make many of my posts look almost the same on my actual phone as they do in the WP phone preview.  Many, yes.  All, no.  Here is a screenshot of part of a recent post as viewed in phone mode on WP from my desktop:

PerpendicularPreview_phone-on-2014a_2021-06-18_Firefox_Framed

Here is the corresponding screenshot as viewed on the actual phone:

PerpendicularActual_phone_2021-06-18_Firefox_674x399_Framed

Yuck.  After comparing the screenshots, I revised the post to avoid rogue line breaks (and demystify how to access my blog’s widgets) on a phone.  Tentatively, I trusted the WP phone preview on my desktop.  When the revision seemed ready to go live, I switched to the phone, tweaked the revision (by hunt-and-peck typing) as needed to work on the actual phone, and only then hit the [Update] button.  Likewise with the [Publish] button for this post.  Trust, but verify.

Is there anybody else who uses a desktop (or tablet) and has been blindsided by a clash between how things should look on a phone and how they do look?  Here is the simple partial fix I stumbled upon.  Us dinosaurs gotta stick together.

The [Appearance] item appears most of the way down in the menu on the left side of WP site pages.  The click sequence

        [Appearance]
                [Customize]
                        [Fonts]

gave me a chance to change font sizes used to display posts.

Both [Headings] and [Base Fonts] had defaulted to [Normal] size.  I set them to [Small].  While this might make text too small in some browsers on some desktops, I am sure that anybody using a desktop has already gotten used to pressing Ctrl-Plus or Ctrl-Minus as needed.

engineering, humor, philosophy

How My Blog Became Phone-Friendly

The tweetable answer is that I switched to the Satellite theme.  U can get a wry take on the sometimes quirky path of progress by reading the rest of this post.
(BTW, the [Menu] button atop the vertical black bar reveals the widgets.)

The tweetable answer is that I switched to the Satellite theme.  There are more things in heaven and earth than are dreamt of in Twitter’s philosophy (and I don’t tweet anyway), so U can get a wry take on the sometimes quirky path of progress by reading the rest of this post.

When I started blogging, I wanted a genuinely uncluttered theme that would leave me free to concentrate on content and decide whether I wanted to continue, w/o paying upfront with $ (for a premium membership) and with time (spent customizing).  I wanted black text in a sans serif font on a white background, with lines long enough and vertically separated enough for a readable brief essay w/o too much scrolling.  I also wanted something that was (and still is?) rare among uncustomized themes: I can print out a preview of a draft, get hard copy that looks very much like what the browser displays, and scribble notes about revisions.  Yes, I am that old.

Browsing the theme catalog was a dreary experience, and I found that the only good way to see what my own stuff would really look like was to adopt a theme temporarily and hope nobody was turned off by how ugly my blog was before I found and switched to something better.  After several false starts, I settled on Academica.

A post on Horizon Feedback on 2015-09-14 asked users to beta test changes to “the” WordPress.com editor (the “Beep-beep-boop” editor reached from the WordPress interface with a blue top bar).  Tho I usually used the other editor (the “Classic” editor reached from the WordPress interface with a black top bar), I decided to help out a little.  Improvements in “the” editor might lead me to use it more and enjoy the nice colors.

I started drafting a post, observed the result of clicking the [Preview] button, and submitted a comment including the complaint that

What comes up … is horizontally truncated, with the 1st letter of each line flush against a sky blue border on the left and the last few letters of each line hidden under a vertical scroll bar for the frame containing the draft purportedly being previewed.

Sheri at WordPress looked into the problem promptly and found that it was 2-fold.

  1. The preview was coming up in tablet mode, with no provision for changing the mode to either desktop/laptop or phone.
  2. My theme was not responsive to the kind of device (desktop/laptop, tablet, or phone?) in use.

Sheri and friends fixed #1 soon after, adding buttons that would let a blogger working at (say) a desktop/laptop see how the previewed post would look on (say) a phone:

PreviewButtons

Fixing #2 by switching to a responsive theme would of course be my responsibility, and now I could see how utterly unreadable my posts were to anybody browsing on a phone rather than a real computer.  Remembering how dreary theme shopping was, my initial reaction was curmudgeonly.  I was writing for people who use real computers, not people who surf while standing in line at Starbucks, so I would stay with Academica.

On the other hand, I can remember when the only real computers filled rooms with refrigerator-sized boxes and ran up huge electric bills for power and cooling.  I have also been a frequent visitor to a nursing home and noticed that the aides could sometimes get a brief respite from their jobs by enjoying things like cat videos on their phones.  However unlikely it was that an aide might want to read my blog on a quick break, they should not be forced to look elsewhere just because I am an old fart with an unresponsive theme.  So I resolved to fix #2.  Someday.

When someday finally came in 2016-04, I found that theme shopping is easier now, with a preview capability that lets me see how one of my own posts would look on a phone rather than just how a demo would look on a computer.  I also had plenty of my own posts to play with.  With some experience in blogging, I was willing to forego printed previews.  I could tolerate crappy printing and be content with a theme whose perversities in displayed pages either were minor enough to ignore or could be worked around by adding attributes to a few HTML tags.  (As a frugal Yankee, I still wanted to avoid paying for extensive customization unless I actually needed it.)  Several themes looked OK until I saw what they did to block quotes: they maimed them with an ugly distracting decoration.  I was a big user of block quotes and did not know how to work around this sin.  I did know how to work around Satellite’s sin of using an absurdly light font color for block quotes, and I can bypass the use of a similar font color for my tag line by not having a tag line.

So I switched to Satellite and went over all my posts, retrofitting them with a few workarounds, a few small unrelated updates I had been intending to do someday, and a few small wording changes to make the flow of text around narrow images look good on all devices.  Only 1 post required nontrivial rearranging to look good on a phone.  The whole process took roughly 4 times longer than I had expected, as is common in software engineering.

MenuButton

There is a great virtue of Satellite that should be mentioned: the retractable sidebar.  Apart from the click-me-for-a-menu button at the top, the retracted sidebar is an unobtrusive black band along the left side of the post.  Clicking that button reveals widgets like the [Follow] button and the Search box.

SearchGreenFuzz

Press the [Enter] key after entering a few words, and U will get a display of that search’s hits.  There is just 1 hit for the specific words illustrated here:

TrojanHorse

Clicking on the title of that search’s single hit will visit a whimsical introduction to one of the 20-th century’s epistemological earthquakes.  It’s OK if U don’t give a rat’s ass for epistemology; the secret revealed at the end is useful in daily life and does not depend on anything else in the post.  Even if U skip the post’s mental exercise, please do consider why I displayed a screen shot with the search words instead of putting them in the text of this post.  Extra credit for all who can explain how the answer to that question relates to the earthquake.