HTML: A Beginner’s Guide For Creative Writers | Web Design Relief

by | Uncategorized | 0 comments

HTML: A Beginner’s Guide For Creative Writers | Web Design Relief

An author website acts as a creative writer’s online information hub—it’s where readers, fans, literary agents, and editors will first look for details about you and your writing. If you’re thinking about building your own author website but know more about commas than coding, the experts at Web Design Relief recommend learning a few basics about HTML. Here’s a brief beginner’s guide about the ins and outs of HTML for creative writers.

HTML Beginner’s Guide For Creative Writers

What Is HTML?

HTML (Hypertext Markup Language) breaks down the structure of a website using words—also known as tags or codes. For example, the technical side of your website’s design elements, like sections, paragraphs, and headings, can all be interpreted and organized using the HTML language.

Why Do We Use HTML?

Basic HTML is useful for casual Internet users as well as advanced programmers and engineers. By learning HTML, you can understand your web pages and edit them effectively. Website builders are terrific tools, but their design capabilities can be limited. Having a solid grasp of HTML will give you more control over the visuals and presentation of your website.

What Are HTML Tags?

HTML tags are like “containers” or that collection of Tupperware everyone has—and whether it’s delicious strawberries or web design info, a container needs a top and a bottom in order to hold content. In HTML, the tag <html> represents the top of the container for your content, or the “beginning,” while </html> represents the bottom of the container, or “ending.”

Basic HTML Tags And What They Mean

Headings: <h1> – <h6>

The text you are using for your heading can be tagged with text and number sequences in order from most to least important. For example, the <h1> tag should be applied to the text you want for your biggest, boldest headline. This tag works well for organizing page titles, publication names, calls-to-action, and more.

<h1>This will be your biggest heading.</h1>

<h2>This is your second biggest heading.</h2>

Lower heading tags can be applied to text you still want to draw the reader’s eye to without taking away from more important text. For example, the <h2> tag is great for subheadings or taglines, and <h3> works well to separate different points in larger bodies of text.

Paragraph: <p>

The paragraph tag indicates a large body of text, such as an author bio, book excerpt, blog post, and more.

<p>Everything in here is a paragraph.</p>

<p>This is another paragraph.</p>

Italic / Emphasis: <i> or <em>        

Similar to using the italic button on your word processor when you’re writing, the <i> or <em> tags can indicate or shift regular text to italics for proper stylization and emphasis, respectively.

<em>The text in here will be italicized.</em>

Bold/Strong: <b> or <strong>

Just like the HTML tags above, the <b> or <strong> tags are used to bold your text and highlight important words and phrases.

<b>The text in here will be bold.</b>

Blockquote: <blockquote>

The blockquote tag implies that text located in the block is taken or quoted from another source. The quote will be indented and separated from the rest of your text. This can be used to post reviews of your writing or to display excerpts from your work that have already been published.

<blockquote>This quoted text will be separated from the rest of your text.</blockquote>

Image <img>

Images are a staple for any author website and are represented by the <img> tag. The image is not actually inserted into the web page but rather linked to the page. The <img> tag creates a holding space for the referenced image. Using the <img> tag allows you to place an image exactly where you want it on your web page. For example, you might want your author headshot image placed below a bold version of your name (header <h1> tag), but above your biography text (paragraph <p> tag).

Unlike the other tags we’ve reviewed, the image <img> tag does not have a closing tag. Instead, it holds information that specifies the path to the image using the letters “src.”

<img src=”img_headshot.jpg”>

Lists: <li>

The <li> tag represents an item in a formatted list, which is a great way to outline your publications or upcoming events. You can break down lists into many categories, but the two most important are Ordered Lists <ol> (marked with numbers) and Unordered Lists <ul> (marked with bullets). It’s as easy as 1, 2, 3!

Unordered list:

<ul>

<li>Coffee</li>

<li>Juice</li>

<li>Soda</li>

</ul>

Ordered list:

<ol>
<li>Coffee</li>
<li>Juice</li>
<li>Soda</li>
</ol>

To learn more about HTML, you can watch in-depth tutorials here: https://www.w3schools.com/html/

Some tech-savvy writers may be eager to try using HTML—but if you’d rather leave HTML and the many detailed tasks of building an author website to the experts, Web Design Relief is ready to help. Schedule a free consultation today!

 

Question: Have you worked with HTML? Did you find it easy or frustrating?

 

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

GET YOUR FREE 4-PART REPUTATION-BUILDING GUIDE!

  • This field is for validation purposes and should be left unchanged.

FIND AN ARTICLE

RECENT ARTICLES

Reviews

If you need help nailing your brand, you’ve come to the right place. The designers know what questions to ask, what imagery translates best to the screen, and how to make your original idea come to life on your webpage. Conventional or quirky, your idea is in good hands with the Web Design Relief team.

—Darlene Eliot, Writer
Read more reviews!

Working with the Web Design Relief team was a total pleasure. They made the process easy, in-depth, professional, and lyrical. I wanted a site that leaned toward the bohemian and yet held an edge of minimalist sophistication. I couldn’t be happier with my very inviting and creative site! We should win awards with this one!

—King Grossman, Writer
Read more reviews!

I cannot possibly detail how professional and helpful Web Design Relief has been in helping me launch my collection of short stories—there are just too many things they have done! They’ve been there for me all along the way, guiding me in developing my book and into the 21st century of web design and social media platforms. It could have been a bewildering journey; Instead it was one that was organized and so pleasant. Truly, Web Design Relief has blown me away by what they have created. The first time I watched my book trailer (who knew there were book trailers?), I cried. That team perfectly imaged what my book is about. I want to thank the whole team for their skill and creativity. I appreciate it so much.

—Cyndy Muscatel, Writer
Read more reviews!

I’m pleased with the look of my website. The team at Web Design Relief listened to my suggestions and added a few of their own to make my website look exactly how I envisioned it. I would definitely recommend using Web Design Relief if you are looking to create a website.

—Marion Hill, Writer
Read more reviews!

Sign up to receive our FREE four-part series, The Writer’s Essential Guide To Reputation-Building In A Digital World—the ultimate resource for building your online author platform.
YES! Send Me My FREE Guide!
  • This field is for validation purposes and should be left unchanged.

close-link

Pin It on Pinterest

Shares
Share This