Tips & Tricks – HTML, Graphics & WordPress



Regardless of what we’re doing, most of us try to find shortcuts along the way to help make the job easier. Maintaining a website and blog are no different.  However, if you haven’t started thinking about shortcuts, I’ve listed some of my favorites below to help get you started.


HTML Time Savers

  1. Create templates for HTML pages, tables or blocks of text you plan on using repeatedly.
  2. Use the      tag to embed information in the web page. This information can be anything – inventory number, location of item; information relevant to your advertisers, or you may want to save page details such as alternate background color, font names, etc.
  3. Use
    for each block of text, table, etc. that is to be centered. This may seem excessive, but when I want to move or delete something, I don’t have to worry if doing so will impact the overall layout of the remainder of the page.
  4. Use pixel shims or transparent images as spacers– or when needing visual help in laying out a table.
  5. Use ‘Control + A’ to view everything on a page. This is helpful if you’ve used hidden letters, numbers or punctuation marks in the same color as the background to create negative space.      Note:  Do not use this technique to place ‘hidden’ links – those links to your other pages or websites that are the same color as the background so as not to be visible to the eye – to try and boost your search engine rankings. It’s a definite no-no.
  6. If you’re having trouble laying out a table, using a border to see where the columns and rows are makes finding mistakes easy. Once you’ve fixed the problem and have the table like you want, remove the border.


  1. Use layers for building complex images or graphics with multiple elements. It is much easier to change one layer than re-create the whole graphic.
  2. Save both the multi-layered original and one-layer finished images. And while you’re at it, use the same name for both only end the layered image with a unique notation such as psp. (This is the file extension for Paint Shop Pro that designates a layered image.) Using the same name makes it easy to find both images if you need to make changes, and at the same time be able to easily tell the difference.
  3. When using layers, include one informational layer that contains the hexidecimal colors and the font names used. By doing this, you’ll always have the correct information for making any changes. Unless you only use one font or are very familiar with the font names, it can be difficult to remember which font was used.

Word Press Tips

  1.  Use HTML tables to include rows, columns in a post. To do this you will need to select HTML rather than Visual.
  2. Use tables to include sections with a different background color. This is good to highlight a section or advertisement.
  3. Use dots for additional spacing or lines in your WP blog. To do this, place the dots where you want the extra spaces or additional lines, and then make them the same color as the background. This allows you to include extra lines to space pictures or text – or place more space between words if desired.

This is a non-spaced line, do you see any dots?

This is a spaced line. ……..Do you see the dots?

[Note:    To see the dots I used to put space in the second line above, hold the Control key + A at the same time and the dots will appear. ]


Develop your own shortcuts and time-savers and put them in a single folder where you will be able to find them quickly and easily. If you prefer keeping the shortcuts and templates in multiple folders, you may find keeping a single Word Pad document with notes and locations helpful.

Comments are closed.