
You have a content management system, a CMS.You got your CMS specifically so that you would be able to make your own small updates, rather than paying for them. And yet, when you put in content on your own, it just doesn’t look right.
The example below shows what can happen when you put text into the text box, or visual editor. The spacing is off, the paragraphs look odd, and the client whose CMS this is has tried to fix it by hitting the space bar, but it just hasn’t worked.
The example at the top of the post is what you get when you clean up the code with the HTML editor. It looks cleaner and more intentional.
So are you going to learn HTML? Let me answer that for you: no, you aren’t. Would you learn Italian just so you could order correctly at the local trattoria once a month? It would be much the same thing. The whole point of a CMS is that you can make little changes without having to learn HTML.
So let me just tell you a few little bits of HTML that will help you get a better look and do the small tasks you want to do:
- When you go into the HTML editor, you may see <br/> between all your lines. That will not look nice — in fact, that’s what gave the top example the messed-up spacing it had. Civilize the spacing by replacing the <br/> with <p> at the beginning of the sentence and </p> at the end.
- That business of putting something at the beginning and ending of a sentence? That’s useful to know. That’s called an opening tag and a closing tag. Use opening tags and closing tags to make your headers convey the right message about the importance of your information. Put <h1> and </h1> around the most important thing: just one thing per page. Put <h2> and </h2> around the next most important subheadings. Depending on your CMS and your CSS, you can go clear to <h6>.
- Remove any underlining, italics, boldface, colored fonts, or anything else you were previously doing to show that things are headers.
- The sentences between the <p> and </p> should look like normal sentences. Unless you have emphasized something in the middle of your sentence with italics, you shouldn’t have little <span> and similar markers. Sometimes you end up with these — sometimes lots of these — if you cut and paste text or change your mind about something as you write. At best, this gives you what is known as bloated code, and it can make your page misbehave on some browsers.
Will this give you elegant code and beautiful pages? Not necessarily. But it will allow you to make your changes without messing up your website.