mdlbear: (technonerdmonster)
[personal profile] mdlbear

Here are a couple of little tricks that may keep you from tearing your hair out in frustration, and in any case will make your posts look better.

Tip the first: Make beautiful poetry with no effort.

There are two obvious ways to post poetry: enclose it in <pre>...</pre> tags (which tells the browser that it's preformatted, so it should leave your line breaks alone), or tediously add a line break tag -- <br> -- to the end of every line. Unfortunately, preformatted text uses a monospaced font, which is great for code and concrete poetry, but really doesn't look very good. And adding line breaks is just tedious.

There is a third way: use

<blockquote style="white-space: pre-wrap;" >to wrap your poem. </blockquote>

This tells your browser to keep spaces and line breaks the way you want them, but continue using the same font as the rest of your page.

There's one subtlety: that start tag is pretty long, but if you start your poem on the following line there will be an annoying extra blank line at the top. So do what I did up there, and start a new line before the >. It turns out that you can replace spaces with newlines anywhere outside of quotes.

That brings me to the next tip:

Tip the Second: Don't let your word processor try to help.

A lot of people compose their blog posts using a word processor, and paste them into the "post" form. If you don't, and aren't using some kind of posting client that lets you save your work any time you want to, you should. Especially if you have cats. But there's a problem. Word processors want to help you create great-looking documents. And that's a problem if you're trying to write HTML.

One thing word processors may try to do is to replace all your quotation marks with “curly” quotes (also called “smart” quotes), instead of using "straight" quotes. That's great except for when you're trying to enter a link, or one of style attributes I just showed you up above. A browser won't recognize them. So instead of

<a href="https://steve.savitzky.net">this</a>

you get

<a href=“https://steve.savitzky.net”>this</a>

See the difference? You may have to zoom in a little. Hover over the links. You'll see that your browser thinks that it's looking at a local link, because it doesn't start with https://, it starts with “https://! Oops!

Another thing I've seen word processors and some other programs do is, behind your back, replace "<" and ">" characters with "&lt;" and "&gt;". Those weird things are called "character entities", and they're HTML's way of forcing the browser to show something that looks like "<" without letting it interpret it as part of a tag. That probably isn't what you wanted, unless you're trying to write math inequalities or an article about how to write HTML.

Yet another problem happens because word processors use proportional spacing, so that your post looks to you the way it's going to look in a browser, more or less. The problem happens because some characters are really small in proportional-spaced fonts, so it's hard to select exactly the text you wanted to, and easy to overlook stray spaces and periods if they get pasted into your links by mistake.

That's why programmers use text editors with fixed-width fonts, and rely on programs like web browsers and LaTeX to make their pages look good when you read or print them.

 

By the way, I did a little searching and found The Mandelbear's Rough Guide to HTML, from back in 2006. It's still mostly good advice.

Another fine post from The Computer Curmudgeon.

Date: 2018-06-19 11:45 pm (UTC)
madfilkentist: Photo of Carl (Default)
From: [personal profile] madfilkentist
Nice! I hadn't even known about the white-space CSS property!

Date: 2018-06-20 04:08 am (UTC)
archangelbeth: An anthropomorphic feline face, with feathered wing ears, and glasses, in shades of gray. (Default)
From: [personal profile] archangelbeth
One of the first things I do in a new version of Word is to disable "smart quotes." Then I have to go through its autocorrect, replacing each word with quotes... with the same word, freshly-typed in the disabled-smart-quotes mode, because the default thing stored in autocorrect is... SMARTQUOTE VERSION! *headdesk*

I really hate changing versions of Word for this reason.

(And when I compose offline, I use TextEdit, generally, because Word might try to... "help.")

The linespace trick is VERY NEAT. I must Memory this post.

Date: 2018-06-20 04:23 am (UTC)
archangelbeth: An anthropomorphic feline face, with feathered wing ears, and glasses, in shades of gray. (Default)
From: [personal profile] archangelbeth
For various reasons, I've needed Word templates for actual writing -- and once I beat a version of Word into shape, it's the absolute best I've ever found for my purposes. (Page-splitting and very robust Search abilities, mostly.) Believe me, I've gone looking for replacements, because beating versions of Word into shape is a PITA. >_>

Mostly I attempt to Never Upgrade the computer (and thus the version of Word) that I'm using to work on... <_<

And, because I forgot: thank you for the CSS/HTML trick that I stuck in my Memories under 3 different tags so I'll have a prayer of finding it again! ^_^

Date: 2018-06-20 09:20 am (UTC)
madfilkentist: Photo of Carl (Default)
From: [personal profile] madfilkentist
Hypocrisy usually isn't one of my vices, but as I writer on tech I keep telling people to keep their computers upgraded for security reasons, and in my own life I avoid upgrades because of the stupid new "features" I'll have to fight with.

I use OpenOffice, but it strives to replicate every annoyance in Microsoft Office.

Date: 2018-06-21 03:10 am (UTC)
archangelbeth: An anthropomorphic feline face, with feathered wing ears, and glasses, in shades of gray. (Default)
From: [personal profile] archangelbeth
I try to upgrade security stuff on my Macs, but I'm not doing some system upgrades because, well... I'd lose applications!

I also hate UI redesigns on higher-number versions of apps. Like Painter. I was used to Painter 7. Now I'm stuck using Pixelmator, which is inferior and has some non-intuitive stuff that drives me batty, but at least it was hugely cheaper for having to learn a totally different UI and it does what I need it to, for now.

Most Popular Tags

Style Credit

Page generated 2019-02-20 04:05 am
Powered by Dreamwidth Studios