Tips and Snips: Creative Website Hacks for Creative People
ImageandAspect
About
Work Examples
Contact
Privacy
Terms
Subscribe
Tips and Snips: Creative Website Hacks for Creative People
  • ImageandAspect
  • About
  • Work Examples
  • Contact
  • Privacy
  • Terms
  • Subscribe
Browsing Category
HTML
Design•Entrepreneurs Creatives•HTML

What’s the difference between RENTING and OWNING your site?

Handing over the keys
July 6, 2021 by Diane Metcalf, M.S.I.T. No Comments

Renting or Owning: What’s the difference?

Many people don’t even realize that there is an issue of “ownership” to be considered when they think about building a website.

As with anything else, there are pros and cons to consider.

A big consideration is that when you own your site, you possess the “source code” that was used to develop the site. Without these code-files, (or WordPress files) it would not be possible for you or another developer to edit the pages, or to troubleshoot issues in the future.

To maintain control over your site, you need to have these source files.

When you contract with Image and Aspect, you always get your source files at the end of the project. You own them. Just sayin’.

Here are some pointers to help you learn the difference between renting and owning your site.

Renting

When you use a “hosted platform” package-solution, (Do-It-Yourself) it’s considered to be “Software as a Service” (SaaS) and you are renting your website from them. It’s usually a monthly or annual subscription and it has a lower up-front investment cost. Examples: Wix and Shopify.

Owning

Owning requires a custom solution, and there’s a higher up-front investment for this dedicated development. Owning allows for customization and integration with 3rd party services, provides greater flexibility plus there’s room for expansion. There is also less of a chance that you’ll pay for services that you’re not using. Basically you own your piece of web real estate and you can do what you want with it. Let’s think “keeping it within legal parameters .”


What Renters Can Expect

  • Easy for Do-It-Yourselfers.
  • Lower cost of entry.
  • Various paid subscription levels (free, starter, pro, etc.)
  • Add-on modules, plugins or extensions purchased from a dedicated “marketplace”.
  • One combined service for hosting, payment processing, and website administration.
  • Maintained infrastructure & automatic security updates.
  • New features introduced on a regular basis.
  • Technical support in articles, tutorials, videos.
  • A wide selection of design templates (some are free).

The Downside of Renting

  • No equity! When your subscription ends, the time, money and effort you put into building the website are lost.
  • Incremental costs add up. With every add-on, a new cost emerges that is often higher than the original subscription fee. There will be a monthly fee for that one item for the rest of the duration of the website.
  • Possibly little flexibility on the required services for payment processing, hosting, data warehousing.
  • Limited customization for design.
  • If you leave the platform, all the investment in design and development is lost. You can’t take it with you when you move to another hosting provider/webserver. You have to start over.


What Owners Can Expect

  • Customization tailored to specific business requirements.
  • Scalable for future growth.
  • Integration with external services.
  • Open architecture allows for development, the code is portable and not tied to an organization.
  • Freedom of choice for your web hosting, payment processing, and website administration.
  • Important as sales volume increases and competitive processing and transaction fees become critical.
  • Accommodates creative innovations as opposed to waiting for the hosted platform to release updates or fixes.

The Downside of Owning

  • A higher cost of entry.
  • Must be actively maintained – if the site is not maintained through a web developer, (or someone who knows how to code or how to develop with WordPress) there will be no innovation, no new features, no security patching. Eventually, a website will become obsolete as code and formats change over time.
  • Time constraints – building a custom site requires a collaborative effort and considerable thought and engagement from the site owner.

As with everything, there are costs either way. Financial costs, opportunity costs, perceived value costs. The best way to decide on whether to rent or own your website is to look at your long term business goals.

When you’re business takes off and you’re renting your site, will you want or be able to take the time to stay current on how to use the platform? Will you be able to set aside time to update the content, or be on the phone with technical support or Billing? Do you feel comfortable making scheduled full-backups and storing them off-site where they’ll be secure but still easy to find when you need them? Will you feel comfortable restoring your site from a backup if you make a mistake on the site and don’t know how to fix it? Will you have the time and the inclination to research the latest Google SEO changes or the newest security threats? Will you feel comfortable making these changes? Will you be able to quickly and easily find your log-in information, your API keys, and/or your font or photo licenses if a component of your site stops working? Will you keep up with all expiration dates for your domain name, SSL certificates, sub-domains, etc, so nothing accidentally expires? If something expires would you know what to do or who to contact? Do you feel comfortable troubleshooting and fixing text formatting, images, or email issues? If you can do these things, and more importantly you’d ENJOY doing them, well that’s just swell! 🙂

But do yourself a favor and hire a professional. You’re not a web developer already! (unless you are) LOL!

If you choose the DIY route and you get in over your head, you can always call me. I promise not to say I told you so. 🙂

Other articles you might like:

–Things to consider before building your website

–6 Ways to Use Storytelling in Your Blog Posts

–Balancing Consumer Personalization with GDPR Regulation

Questions?

[email protected]

My Contact Page

About the author

diane-author-300x181 What’s the difference between RENTING and OWNING your site?

I developed Image and Aspect because I believe that professionals need to have an impactful web presence. One that showcases their unique talents, skills, and abilities as well as their values and style. A presence that focuses on social engagement and connection.

I’m passionate about what I do; I like helping fellow humans, I like having all kinds of social connection with others, and I want to give back, to make the world a better place.

I do much of the designing and coding myself, and I also have a wonderful network of professionals that may contribute as well; photographers, copywriters, branding experts.

I love designing and coding beautiful, elegant and responsive web creations. I ALSO teach and help others who want to learn how to do it themselves.

‘Tips and Snips’ is my blog, and it’s full of information and inspiration to help transform any online persona from “meh” to AMAZING! Sign-up HERE to get blog posts right to your in-box every Friday! I write about Design, Marketing, Search Engine Optimization, Branding, Vlogging, Color Theory, HTML5, CSS3, Bootstrap, WordPress, Social Media…anything you’d want to know to get yourself noticed online.

Visit Image and Aspect to learn more about your web presence options

Diane M. Metcalf, M.S.

Read more

Reading time: 5 min
HTML

How to substitute HTML when using characters

Photo of Character Codes Downloadable sheet
April 12, 2021 by Diane Metcalf, M.S.I.T. No Comments

Sometimes symbols like ©, @ and “&” frequently don’t display properly in browsers. It usually happens when they’ve been inserted in the webpage via character keys or a word processor. For certain symbols and characters to display properly in browsers, you need to use symbol and character codes.

Download here

Questions?

[email protected]

My Contact Page

Other articles you might like:

-How your personal brand makes the difference

-Using images: Tips to improve your SEO rankings

-5 Tips to Stay Sane when Working from Home

 

About the author

diane-author-300x181 How to substitute HTML when using characters

I developed Image and Aspect because I believe that professionals need to have an impactful web presence. One that showcases their unique talents, skills, and abilities as well as their values and style. A presence that focuses on social engagement and connection.

I’m passionate about what I do; I like helping fellow humans, I like having all kinds of social connection with others, and I want to give back, to make the world a better place.

I do much of the designing and coding myself, and I also have a wonderful network of professionals that may contribute as well; photographers, copywriters, branding experts.

I love designing and coding beautiful, elegant and responsive web creations. I ALSO teach and help others who want to learn how to do it themselves.

‘Tips and Snips’ is my blog, and it’s full of information and inspiration to help transform any online persona from “meh” to AMAZING! Sign-up HERE to get blog posts right to your in-box every Friday! I write about Design, Marketing, Search Engine Optimization, Branding, Vlogging, Color Theory, HTML5, CSS3, Bootstrap, WordPress, Social Media…anything you’d want to know to get yourself noticed online.”

Visit Image and Aspect to learn more about your web presence options

Diane M. Metcalf, M.S.

Read more

Reading time: 1 min
CSS•Design•HTML

6 Tips for Using Bulleted Lists for Online Content

Lists emphasize important points and help readers follow a sequence
March 5, 2021 by Diane Metcalf, M.S.I.T. No Comments

Using vertical, bulleted lists is a very effective way to make crucial points stand out, because bullet points are easy to scan and understand. Research shows that vertical lists attract a readers’ eye, and that readers of digital content prefer writing that’s formatted for easy scanning, because it allows them to skip through large chunks of text and get to the stuff that interests them.

There are several formatting methods that can achieve the goal of breaking up dense paragraphs of text; there’s bolding, line-spacing, indenting and even color-coding. But I think bulleted lists are the most powerful method to encourage reading content on a digital device.
Web readers typically want to absorb content quickly, and bullets are perceived as “shortcuts” to the concise and important content they’re looking for. In usability studies, readers gravitated towards bulleted lists first.

In the following examples, you can see that number 2 is much easier and faster to read, because the important points are clearly listed on short, individual lines:

Example 1
Our Secret Sauce: We limit our current project-load to three clients, so we can do our best work and be available to you to provide personal attention. We believe
You’ll get one-on-one personal support throughout the entire design and development process. You’ll learn “website anatomy” so you’re better equipped to ask questions and give feedback. We use plain language, not technical jargon and you’ll ALWAYS know what’s happening with your project at any given point.
Your contract will explain exactly what’s included and what to expect. You’ll have your own project timeline, and you’ll know the cost, upfront.

Example 2
Our Secret Sauce

• Projects are limited to three at a time, so we do our best work
• We educate & empower our clients by teaching as we go
• You get one-on-one personal support throughout
• We use plain language, not technical jargon
• Project management tools allow us to collaborate easily
• Your contract explains what’s included and what to expect
• You know the cost and timeframe, upfront

Studies also show that the amount of vertical space used in a list, is irrelevant. Readers don’t mind scrolling if they’re getting the info they want.
An interesting research finding shows that websites perceived as “inviting” often use bulleted lists, making content easier to read and understand. Users are more likely to scroll through a website containing lists than a website that mainly consists of text-heavy paragraphs.

6 Tips for Using Bulleted Lists

1. Write bulleted lists of similar length and related items.
Items in a bulleted list should include related elements of similar importance. This makes the shape of the list easy on the eye; it includes lots of white space.

2. Don’t use numbered lists unless the sequence or item-count is important.
Numbered lists are used when items occur in a specific order, for example, steps in a recipe, or a “top 10” list. Or like this list of 6 tips!
Numbered long lists can get confusing. In one particular study, people mistakenly thought they had to complete all of the steps in a numbered list, but they really only needed to complete just one. Don’t number if your list makes sense without it.

3. Be consistent in phrasing and grammar.
Each bulleted-list item should start with the same part of speech (i.e.: verb or noun) and all bullet points should be either fragments or complete sentences. Don’t mix them together.

4. Be consistent with formatting.
Use the basic rules of capitalization and punctuation:
• If the list items are sentences, capitalize the first word and use correct ending punctuation.
• If the list items are fragments, don’t use end punctuation.
• For hierarchical lists, use a different style of bullet for each group, for easier reading and comprehension.

5. Use discerning keywords at the beginning of each line and avoid repetitive phrasing.
Omit parts of speech like “the” and “a”. Use action-words at the beginning of the line.

6. Introduce the list with a clear, descriptive sentence or phrase.

The introduction tells the reader what the list is about or why it’s important. The intro doesn’t have to be a complete sentence if each item in the list makes sense on its own.

To make a bulleted list in HTML:

1. An unordered (not numbered) list:

starts with the <ul>tag, and each item within the list starts with an <li>tag. Remember to close the tags.

The list items will be marked with “bullets” by default. You can style the bullets by using the CSS list-style-type: 

and choosing one of these properties: disc, circle square, or none.

Example: 

<ul style=”list-style-type: disk”>

 <li>Bananas</li>
  <li>Oranges</li>
  <li>Apples</li>

</ul>

Looks like:

  • Bananas
  • Oranges
  • Apples

2. An ordered list

starts with the <ol>tag and each item within the list starts with an <li> tag. Remember to close the tags.

The list items will be marked with numbers by default. You can style the bullets by using the CSS type attribute: 

and choosing one of these properties:

type=”1″ The list items will be numbered with numbers (default)
type=”A” The list items will be numbered with uppercase letters
type=”a” The list items will be numbered with lowercase letters
type=”I” The list items will be numbered with uppercase roman numbers
type=”i” The list items will be numbered with lowercase roman numbers

Example: 

<ol type=”1″>
  <li>Bananas</li>
  <li>Oranges</li>
  <li>Apples</li>
</ol>

Looks like:

  1. Bananas
  2. Oranges
  3. Apples

3. Description lists

A description list is a list of terms, with a description of each term.

The <dl>tag defines the description list, the <dt> tag defines the term (name), and the <dd>tag describes each term:

Example:

<dl>
  <dt>Bananas</dt>
  <dd>- Sweet, yellow skinned fruit</dd>
  <dt>Oranges</dt>
  <dd>- Sweet, orange skinned fruit</dd>
 <dt>Apples</dt>
  <dd>- Pungent, red-skinned fruit</dd>
</dl>

4. Nested Lists:

List can be nested (lists inside lists):

Example:

<ul>
  <li>Bananas</li>
  <li>Oranges
    <ul>
      <li>Naval Oranges </li>
      <li>Mandarin Oranges</li>
       <li>Blood Oranges</li>
    </ul>
  </li>
  <li>Apples</li>
<ul>
      <li>Red Delicious Apples</li>
       <li>Granny Smith Apples</li>
    </ul>

</ul>

 Have fun trying these yourself! 

 
 

Questions? 

[email protected]

My Contact Page

Other articles you might like:

-Using images: Tips to improve your SEO rankings

-Use a customer thank-you page to avoid missed opportunities

-6 Tips to Make Your Blog Post SEO Friendly

 

About the author

diane-author-300x181 6 Tips for Using Bulleted Lists for Online Content

I developed Image and Aspect because I believe that professionals need to have an impactful web presence. One that showcases their unique talents, skills, and abilities as well as their values and style. A presence that focuses on social engagement and connection.

I’m passionate about what I do; I like helping fellow humans, I like having all kinds of social connection with others, and I want to give back, to make the world a better place.

I do much of the designing and coding myself, and I also have a wonderful network of professionals that may contribute as well; photographers, copywriters, branding experts.

I love designing and coding beautiful, elegant and responsive web creations. I ALSO teach and help others who want to learn how to do it themselves.

‘Tips and Snips’ is my blog, and it’s full of information and inspiration to help transform any online persona from “meh” to AMAZING! Sign-up HERE to get blog posts right to your in-box every Friday! I write about Design, Marketing, Search Engine Optimization, Branding, Vlogging, Color Theory, HTML5, CSS3, Bootstrap, WordPress, Social Media…anything you’d want to know to get yourself noticed online.

Visit Image and Aspect to learn more about your web presence options

Diane M. Metcalf, M.S.

Read more

Reading time: 7 min
HTML

Embed a TWEET THIS image + URL in your emails

Photo of Twitter TWEET THIS button to add to emails
January 3, 2021 by Diane Metcalf, M.S.I.T. 2 Comments

This tutorial will demonstrate how to create a TWEET THIS link that contains a Tweet, whatever image you want tweeted, and a URL to the web-page you want tweeted with it.

To put this in an email, you must be able to access your default email template or create a new template. I made mine by creating a new template in an automated email program that I use.

Here we go:

1. If you’re including a URL to a website in the TWEET THIS link, go to bit.ly  (it’s free) to shorten the URL so Twitter will use it. Copy and paste the new short URL to a blank doc or text file so you can easily find it in a few minutes.

2. Tweet the image that you want embedded in the TWEET THIS link.

This is necessary because Twitter will store the image and you need the specific path to where it’s stored. (If the image isn’t on Twitter, then it won’t show up when using the TWEET THIS link.)

Here’s how to do that:

twittershot-300x102 Embed a TWEET THIS image + URL in your emails

Sign in to Twitter, click “Tweet”, then click “add photo or video”, browse for and Tweet the image. (You can delete the tweet later if you want. The image will still be saved.)

Now for the fun part: You need to find the URL (path) to that image, and there are TWO of them.

You’ll use the URL that starts with “pic”.

Stay in Twitter and right-click the Tweeted image you just posted. “Inspect” it with web developer tools, like the one in CHROME. (TOP RIGHT on Chrome, 3 vertical dots)

twittershot4-300x259 Embed a TWEET THIS image + URL in your emails

To find the correct URL, hit Control+F and search for “pic“. When you find it, copy the whole line pic.twitter.com/XXXXXX.

Paste it where you can find it again in a few minutes.

twittershot2-300x202 Embed a TWEET THIS image + URL in your emails

3.To create the Tweet This link in HTML:

<a href=”https://twitter.com/intent/tweet?text=THIS IS WHAT I WANT TO TWEET > </a>

There can’t be spaces in-between words in a URL, so replace all those spaces with %20, like this:

THIS%20IS%20WHAT%20I%20 WANT%20 TO%20 TWEET%20

Next, continuing on the same line, right after the 20, we add the link for the Twitter image (red) that we just tweeted , and the bit.ly shortened URL (blue) for our chosen website.

Remember, no spaces, and close the tag >.Don’t forget the quotes. The whole href needs to be in quotes.

(I’m condensing the code here for easier display)

pic.twitter.com/CfORwODo%20http://bit.ly/2oxajij“>

Now add some text to make a clickable link: (again condensing the code for easier display)

ODo%20http://bit.ly/2oxajij“>ADDED Clickable Text</>a

If you’d rather have a clickable image instead of text, then add the path to the image in an img tag, before the closing anchor </a> tag, like this:

ODo%20http://bit.ly/2oxajij“><img src=”path to image here”></a>

And here’s the end result in an outgoing email!

twittershot7-300x155 Embed a TWEET THIS image + URL in your emails

Here’s what clicking on it does:

twittershot5-300x93 Embed a TWEET THIS image + URL in your emails

Here’s what happens when I click TWEET:

TA -DAA!

twittershot6-287x300 Embed a TWEET THIS image + URL in your emails

Questions?

[email protected]

My Contact Page

Other articles you might like:

-Using images: Tips to improve your SEO rankings

-Use a customer thank-you page to avoid missed opportunities

-6 Tips to Make Your Blog Post SEO Friendly

 

About the author

diane-author-300x181 Embed a TWEET THIS image + URL in your emails

I developed Image and Aspect because I believe that professionals need to have an impactful web presence. One that showcases their unique talents, skills, and abilities as well as their values and style. A presence that focuses on social engagement and connection.

I’m passionate about what I do; I like helping fellow humans, I like having all kinds of social connection with others, and I want to give back, to make the world a better place.

I do much of the designing and coding myself, and I also have a wonderful network of professionals that may contribute as well; photographers, copywriters, branding experts.

I love designing and coding beautiful, elegant and responsive web creations. I ALSO teach and help others who want to learn how to do it themselves.

‘Tips and Snips’ is my blog, and it’s full of information and inspiration to help transform any online persona from “meh” to AMAZING! Sign-up HERE to get blog posts right to your in-box every Friday! I write about Design, Marketing, Search Engine Optimization, Branding, Vlogging, Color Theory, HTML5, CSS3, Bootstrap, WordPress, Social Media…anything you’d want to know to get yourself noticed online.

Visit Image and Aspect to learn more about your web presence options

Diane M. Metcalf, M.S.

Read more

Reading time: 4 min
Page 2 of 3«123»

Find Topics

 Image and Aspect is a solution-based web presence development service for creatives, entrepreneurs and solopreneurs. We create impactful online presences that showcase your talents, skills, values & style, while focusing on influencing, engagement & connection.

 

It’s a collaborative process; we use streamlined project-management & communications tools so you’ll always know what’s happening with your project. And by adding personalized service, you get  one-on-one support. We want you to feel equipped, educated & empowered to ask questions & make decisions about your web presence & web platform.

 

Tips and Snips was born from the desire to give back; to support anyone who has an interest in learning the art and science of  web design and coding.

 

Thanks for your interest!

~Diane Metcalf, MS

Image and Aspect logo

Connect with me on Twitter!

Follow @MetcalfDiane

Categories

  • bootstrap
  • CSS
  • Design
  • Entrepreneurs and Creatives
  • HTML
  • Marketing
  • security
  • SEO
  • Thoughts
  • WordPress

Recent Posts

  • 6 Tips to make your Blog Post SEO Friendly May 6, 2022
  • The correct order for using Bootstrap tags April 4, 2022
  • Basic HTML (Hypertext Markup Language) Vocabulary Rules March 4, 2022
  • How to make a hover-able drop-down menu February 23, 2022
  • 10 things to do after creating your site January 8, 2022

Older Posts

  • May 2022
  • April 2022
  • March 2022
  • February 2022
  • January 2022
  • December 2021
  • November 2021
  • October 2021
  • August 2021
  • July 2021
  • June 2021
  • May 2021
  • April 2021
  • March 2021
  • February 2021
  • January 2021
  • December 2020
  • November 2020
  • October 2020
  • September 2020
  • August 2020
  • July 2020
  • June 2020

Tags

  • bootstrap
  • CSS
  • Design
  • Entrepreneurs and Creatives
  • HTML
  • Marketing
  • security
  • SEO
  • Thoughts
  • WordPress

Image and Aspect on Instagram

To see the Instagram feed you need to add your own API Token to the Instagram Options page of our plugin.
Oops, something is wrong. Instagram feed not loaded

recent posts

  • 6 Tips to make your Blog Post SEO Friendly
  • The correct order for using Bootstrap tags
  • Basic HTML (Hypertext Markup Language) Vocabulary Rules
  • How to make a hover-able drop-down menu
  • 10 things to do after creating your site

ImageAndAspect.com © 2021 Designed by ImageandAspect