Earlier this year I wrote that any digital marketer must know how to write a blog post in HTML.
I caught a little flak for that. I earned it. I should’ve been clearer: There are four HTML elements every digital marketer should know. If you know them, you can write a post using the code view of whatever CMS you use.
Here they are:
1: Paragraphs
Paragraphs are easy:
p> starts a paragraph.
/p> ends one.
Becomes
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
That’s it.
2: Headings
A “real” heading formats correctly, creates the right structure for browsers to work with, and (arguably) helps with SEO. It’s also one of the easiest bits of HTML to learn:
h1>[your text here]/h1> creates a level one heading.
h2>[your text here]/h2> creates a level two heading.
And so on.
3: Lists
These get a little more complicated. Lists actually use three different tags: OL, UL and LI.
This is a numbered (ordered) list:
This is a bulleted list:
Most content management systems have shortcuts to insert the code for a list:
A bulleted list, in HTML
WordPress is particularly good at this. As you click, it provides the closing tag:
Wordpress closes list tags for you
That’s lists.
4: Links
On the web, links are kinda the point. You need to know how to make them. In WordPress, click the “link” button and fill in the fields. But they’re pretty simple, and knowing how to create one from scratch always helps:
a href=“http://capybarakingdom.com”>Capybara Kingdoma>
will create
Capybara Kingdom
Done.
Lexicon
Knowing a little of the lingo doesn’t hurt, either. You may sometimes hear about “tags” and “elements” and “attributes” and other randomness.
A tag describes the code used for a heading, a list, a link or whatever else. For example, an “h1” tag.
An opening and closing tag, with content, is called an “element.” This entire bit of code is an element:
h1>Stuff/h1>
An “attribute” is a bit of extra information added to a tag, like this:
a href="http://capybarakingdom.com">Capybara Kingdoma>
In that anchor element, the href is an attribute telling the browser where to go if I click the link. In this case, the href attribute is ‘http://capybarakingdom.com.’
Responsive Design
I also said that, ideally, any digital marketer should be able to code and launch a responsive web page. I’m sticking to that. It’s a high bar because what we do is hard. But it’s easier than it sounds. You can download one of a kajillion frameworks and get the job done with very little coding. I like Bootstrap and Foundation. Base and Skeleton are good if you want simplicity.
Stay Sane
Don’t go nuts. Learn what you have to. Understand the basic HTML ingredients. After that, you make the call. I’ve found that once you learn the basic four, the rest starts to make sense.
Pssst: You can skip all of this if you learn to use Markdown.
Additional discussion via comments appreciated.
The post Four HTML Tags Every Digital Marketer Must Know appeared first on Portent.