Text Styles  Calls to Action  Content Organization  Form Styles


What is a Style Guide? (This is an H1 heading.)

The style guide is your handy-dandy reference guide to the details of your website. Our designers and developers will create a palette of colors, fonts, and styles specific to your website.  Additional Resources are located at the bottom of this page.

Note the use of headers, which are an important structural element of your site. The first sentence, "What is a Style Guide" is formatted as an H1. Headers help break up the text so your content is easy to read. They also are important for good Search Engine Optimization (SEO), which helps search engines like Google understand how you organize your content. Read more about headers in our blog post about guidelines for content structure. Make your most important keyword, content or headline an H1 (usually we will do this for you.). H1s can be the same as the title of your page. 

H2: Continue to structure your content as needed with headers. 

H3: Just maintain the numerical order (don't skip) and include a keyword

H4: Contact us at LRS for help structuring your content

H5: This is a Header
H6: This is a Header

Read our blog post about how to structure content. 

 

Images

This is a caption. Don't forget alternative text!

Images are just as important than text when it comes to your website. Images can be the difference between a fast loading site and one that drives your users away. Read our blog post about how to optimize images. It includes a video for LRS Antilles users about how to upload photos. Happy images = happy website = happy users.

Large Images: Typically, if you're using a background image, keep the max size at about 1920 x 1080 pixels. This will make sure the image scales nicely across all screen sizes.

Smaller Images: If you are inserting images as content within the copy of your website, a good rule of thumb is somewhere around 500–650 pixels wide.

Use these websites to easily edit your photos:

Content List with Images

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin eu mauris. Vivamus posuere, tortor vitae volutpat accumsan, mauris urna vehicula nisi, nec pretium felis ligula in velit.

Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin eu mauris. Vivamus posuere, tortor vitae volutpat accumsan, mauris urna vehicula nisi, nec pretium felis ligula in velit.

Block Quote

Use keywords in block quotes.

Blockquotes give distinction and draw attention to quotes, facts, and statistics you want the reader to notice. Choose these carefully and don't overuse them. Keywords included always help.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Nullam sodales elit luctus venenatis euismod. Quisque augue tortor, commodo eu luctus et, sagittis vitae turpis. Proin id tellus tempus, ullamcorper elit id, placerat orci. Fusce quis placerat turpis, at venenatis diam. Nulla mattis venenatis elit, sit amet euismod enim dapibus in. Morbi sagittis gravida nunc ullamcorper rhoncus lectus.


Emphasis Text Block

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Emphasis Text Box

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

2 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Nullam sodales elit luctus venenatis euismod. Quisque augue tortor, commodo eu luctus et, sagittis vitae turpis. Proin id tellus tempus, ullamcorper elit id, placerat orci. Fusce quis placerat turpis, at venenatis diam. Nulla mattis venenatis elit, sit amet euismod enim dapibus in.

2 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at, sollicitudin.

Nullam sodales elit luctus venenatis euismod. Quisque augue tortor, commodo eu luctus et, sagittis vitae turpis. Proin id tellus tempus, ullamcorper elit id, placerat orci. Fusce quis placerat turpis, at venenatis diam. Nulla mattis venenatis elit, sit amet euismod enim dapibus in.

3 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

3 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

3 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

4 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

4 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

4 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.

4 Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sus pendisse pellentesque, felis nec sollicitudin condimentum, tortor nibh tincidunt urna, ut efficitur risus leo ac purus. Phasellus quam metus, dignissim at tincidunt at.


Resources for LRS Antilles Users

If you need assistance, you can submit a ticket to our Customer Support:

https://support.lrswebsolutions.com/Tickets/New