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.

From:
Anonymous( )Anonymous This account has disabled anonymous posting.
OpenID( )OpenID You can comment on this post while signed in with an account from many other sites, once you have confirmed your email address. Sign in using OpenID.
User
Account name:
Password:
If you don't have an account you can create one now.
Subject:
HTML doesn't work in the subject.

Message:

If you are unable to use this captcha for any reason, please contact us by email at support@dreamwidth.org


 
Notice: This account is set to log the IP addresses of people who comment anonymously.
Links will be displayed as unclickable URLs to help prevent spam.

Most Popular Tags

Style Credit

Page generated 2019-04-23 02:01 am
Powered by Dreamwidth Studios