Style Guide
This page shows all the layer options on your site!
Important content entry note! Don’t copy and paste text from Word or another program directly into the WYSIWYG. You have to “clean” the formatting off first by copy/pasting it into a plain text program (we like Sublime Text), then copy/pasting it into the WYSIWYG. If you don’t, Word can carry over its own inline styles that will override our CSS stylesheets and make the text look weird (wrong color, wrong font, wrong size, etc.).
Writing User-Friendly Web Content
- Use pronouns. The user is “you.” Auben is “we.” This creates cleaner sentence structure and more approachable, conversational content.
- Use active voice. “The board proposed the regulation” not “The regulation was proposed by the board.”
- Use the words your users use. By using keywords that your users use, you will help them understand the copy and will help optimize it for search engines.
- Chunk your content. Chunking makes your content more scannable by breaking it into manageable sections.
- Front-load the important information. Use the journalism model of the “inverted pyramid.” Start with the content that is most important to your audience, and then provide additional details.
- Use short sentences and paragraphs. The ideal standard is no more than 20 words per sentence, five sentences per paragraph. Use dashes instead of semi-colons or, better yet, break the sentence into two. It is ok to start a sentence with “and,” “but,” or “or” if it makes things clear and brief.
- Use bullets and numbered lists. Don’t limit yourself to using this for long lists—one sentence and two bullets is easier to read than three sentences.
- Use clear headlines and subheads. Questions, especially those with pronouns, are particularly effective.
- Use images, diagrams, or multimedia to visually represent ideas in the content. Videos and images should reinforce the text on your page.
Contact Form Layer Example
Text here
Regional Markets
- Columbia, South Carolina Columbia, South Carolina
Inquire Layer
Intro Text
This is a CTA
Contact our Team-
Owners
49,723
Homeowners Represented
-
Passive income
129M
Dollars Earned
-
Occupancy
< 3%
Average Vacancy
Details Layer
What is a Details Layer?
Details are very useful for when you have a lot of information, but you want the user to be able to review it at-a-glance.
Why Use One?
Users can see all the headings at once, and click to expand the details for those that they are interested in. Details are great for FAQs!
Paragraph Layer
- This is a bulleted list item
- This is a bulleted list item
- This is a numbered list item
- This is a numbered list item
Header Styles
This is an H2
This is an H3
This is an H4
This is an H5
This is a Quote
| Table Cell One | Table Cell Two |
Columns Paragraph Layer
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Provident qui quasi nisi quaerat nostrum magnam inventore beatae dolore distinctio porro impedit ad, dignissimos voluptate possimus obcaecati officiis ratione laborum neque.
Autem qui minus aperiam ea laboriosam dolorem voluptatem dolorum ipsa porro ut in nihil magni incidunt, id impedit tempora reiciendis nesciunt commodi sed eligendi? Ratione laborum officia numquam beatae quae!
Voluptates, dolore reiciendis? A labore quo, fugiat, sapiente tempora, illum ratione consequuntur error nihil autem debitis? Dicta, animi at. Similique maiores, perferendis consequatur sint inventore libero iste est asperiores consectetur.
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Provident qui quasi nisi quaerat nostrum magnam inventore beatae dolore distinctio porro impedit ad, dignissimos voluptate possimus obcaecati officiis ratione laborum neque.
Autem qui minus aperiam ea laboriosam dolorem voluptatem dolorum ipsa porro ut in nihil magni incidunt, id impedit tempora reiciendis nesciunt commodi sed eligendi? Ratione laborum officia numquam beatae quae!
Voluptates, dolore reiciendis? A labore quo, fugiat, sapiente tempora, illum ratione consequuntur error nihil autem debitis? Dicta, animi at. Similique maiores, perferendis consequatur sint inventore libero iste est asperiores consectetur.