Skip to content

Tuum Est Administration ˇ

Leave a Legacy:  Publish a Website

Survivors of Injustice Transcend Grief


Tuum Est has 3 cookies: all relate to the universal, broad statistics program called Google Analytics. Our Cookie Policy Page has details plus an illustrated Cookie Audit. Cookie Policy x

The Tuum Est site will interest readers who in their own lives are aware of a grievous injustice, or who have experienced one themselves. The emails I receive illustrate that the more deeply one has been injured, the more one has to say. For such readers, I suggest the following course of action: Consider building a website of your own.

Computer Knowledge

To advance your computer skills, go to the Library in your town or city and ask for a schedule of internet classes which are free to the public. Attend and learn.

Web Design Template

You need a template package – a set of webpages which are styled, but are blank of content as yet. The minimum requirement is two templates: one to display your Home Page and portal pages; the other to display in-depth articles. You can purchase a ready-made template package, but these tend to be expensive, and may not have all the features you want in a single design. Be aware: these designs are purchased often, and are seen often on the internet.

Instead of marching to the same drummer, Tuum Est opted for original flair. If you, too, have an affinity for coding, you can custom-design your own templates.

  • Custom-Code a Template
  • Start with the tutorials at Mozilla Developer Network (MDN), an organization that upholds web coding standards. They teach all levels (novice to expert). There are two essential languages, HTML5 and CSS3. As well, be adventurous and learn a smattering of JavaScript.
  • When you are ready for in-depth study, look up specific HTML and CSS topics on tutorial sites such as TutsPlus or W3Schools. For especially well-written CSS answers, go to CSS Tricks. Find inspiration and animations at CodePen.
  • Master server-side includes. Certain elements are common to each page such as the Masthead and Footer. Store these discrete code segments in a separate folder, then embed pointers to them on each webpage. You can write updates once at the source; the changes automatically appear on each webpage.
  • If you have original video or audio, you can embed this multi-media content on a webpage to provide a more sophisticated user experience.
  • To debug typos or coding errors, use the W3C Validation Suite often.
  • The W3C Recommendations are the formal statements of coding standards. This resource is complex, but as you grow, take a look.

Administrative Webpages

Essential administrative pages include About this Website, Contact Us, and FAQ. You should prepare a Privacy Policy even if you collect no more visitor data than the email addresses of your correspondents.

No matter where you reside in the world, you likely want your site read by the people of Europe, which means that your Privacy Policy must comply with two relatively new directives:

  • The EU Privacy Directive, informally called the Cookie Law, requires that you tell visitors up-front whether you work with any app (such as Google Analytics) that employs tracking cookies. Your webpages should include a small but visible Cookie Notice which links to your full Cookie Policy page.
  • The GDPR Regulation, or General Data Privacy Regulation, sets out your duties for the collection and storage of personal data acquired through your website (such as email addresses or credit-card details). It also sets out the rights of customers who provide data to you (such as the right of correction).

As your site expands, you will need another type of administrative page called a Sitemap, which is a carefully structured list of all your page URLs. You need two versions:

HTML Site Map
Read by public visitors / Serves up alternate navigation for visitors who lack specific keywords for a standard search.
XML Sitemap
Read by search engines / Web protocol developed to help search bots find, crawl, and index new content on the web.

Content and Usability

When writing content, pay attention to usability. Visitors expect to find a well-organized page with good grammar and proper punctuation; legible fonts; workable links; clear navigation; and restraint with animation. Most web surfers are goal-driven, and seek a main article relevant to the title or snippet they clicked which led them to your page. Most sites accomplish these basics. If a reader encounters a baffling or hard-to-use site, they hit the Back button within seconds.

Fonts and Typography

Injustice triggers a grief reaction with traditional stages, including justifiable anger. An indignant person, aiming for emphasis, sometimes writes text in ALL CAPITALS. Avoid this, for these good reasons: The etiquette of the net has developed such that capitalized text is perceived as shouting. It goes beyond courtesy; it affects credibility. When the emotion lobe of the brain (the amygdala) gains mastery, it suppresses the cerebral cortex, and reasoning ability takes a backseat. Readers instinctively know this, even without the medical explanation. Also consider the mechanics of a typeface: An all-capital block of text is hard to read because the normal shape of words is lost. We rely on stems of characters going above and below the line (such as t and p) to assist rapid character recognition; such ascenders and descenders exist only in lower-case text. Save full capitals for titles or other special effects.

What can you do to emphasize text? Options: brighten the text color or background color; tile a parchment image or other texture across the background; enlarge the font size or choose an ornamental font; use bold or italics (or both); indent or outdent the passage; or give the text a sense of dynamics by rotating it. As skills develop, experiment with creative typography and three-dimensional transforms.

Color Palette

Computers offer millions of colors – but each device displays them differently! A pure blue on one screen looks more saturated, and distinctly purplish, on another device. Pixel color depends on characteristics such as phosphor chromaticity, gamma, and white point of the monitor. As much variance exists within brands, as between brands. Future screens may reach uniformity. Until then, your task is to select colors so they all change tone in the same direction when viewed on different monitors.

Begin your education with tutorials on color theory and the psychology of color. If you want a complex palette from the color wheel – using complementary, triadic, or analogous colors – then try out the elegant Paletton. Other online tools which make your job easier are Color Hexa and the W3Schools Color Mixer. Alternately, if you want a monochrome palette, which looks polished if you do it right, then follow the steps below:

  • Monochrome Palette that Changes Tone in the Same Direction
    When Viewed on Different Monitors
  • First select a base color which you write in RGB mode as rgb(n1,n2,n3).
  • Find lighter colors for backgrounds: Create an HTML test-page and fill a box with your base color, using the CSS property color: rgba(n1,n2,n3,opacity).
  • Valid opacity values run from 1 (opaque) to 0 (transparent). To make the box semi-transparent, set the opacity somewhere between 1 and 0.
  • Now you have a box with a semi-transparent version of your base color. Layer it over three other boxes (these are opaque) filled with white, pale gray, and dark gray. Experiment: Adjust the opacity of your base color, and the lightness or darkness of the grays, until you produce neutral tones you like.
  • Want more vigor in your neutrals? In your computer Colors Tool, display your neutral in RGB mode, then change to HSB mode. While you keep the Hue on its exact degree setting, adjust the Saturation and Brightness by a few points.
  • Measure results with a digital color meter. Record them in a Color Glossary. Apply the neutrals to areas such as table headers, sidebars, or pull quotes. These tones harmonize with your theme better than pure gray.
  • For a strong accent, used sparingly, choose the color complementary to your base color (it will be directly opposite on the Color Wheel).

Links: Design Considerations

Originally, links were always underlined and blue in color. But as people grew familiar with links, a more flexible standard evolved. Today, the underline is optional. If you do underline, note the line will overlap and obscure the descenders of lower-case letters (g, j, p, q, and y). There are ways to prevent this (see our code samples). If you forgo the underline, then all links on a page should have a uniform color that differs from, and is brighter than, the text color. Aim to make links conspicuous. Don't underline anything that is not a link.

Social Media Icons

If you add social icons to your pages, select a very few to avoid overwhelming readers. Social networks, by their nature, collect troves of personal data. Take a position on security and fix your boundary. You are not obliged to upload a facial photo (even on Google+) but if you do, this heat-map study explains how to compose a web photo to influence where visitors look.

If you eschew social media you won't lose much: Genuine efforts get diluted by staged agendas. Advertisers flourish apace in the realm of Tweets and Facebook likes. On topics of community interest, astroturfers disgorge waves of fake posts to mimic grassroots support. Even the U.S. Military uses Persona Management to create the illusion of consensus on controversial topics.

Responsive Design

A responsive website is one which is readable and usable on every screen size ranging from the Apple iWatch (1.5 diagonal inches), to the smartphone (5 inches), the average tablet (10 inches), the laptop (15 inches), the desktop monitor (24 inches), and finally the widescreen (43 inches) which is built with a shallow curve so viewers can take in the entire display.

Definitions: A pure mobile site is optimized for small screens (up to tablet size). A desktop site is optimized for large screens (laptops, desktop monitors, and widescreens). A responsive site is a hybrid: it should work across the full array of screen sizes – which introduces compromises.

Mobile devices excel at displaying photos, with details sharp and colors glorious, because even the tiniest gadget boasts a high-resolution screen. At the same time, small screens curtail text: To display a large chunk of text at a readable font-size would require visitors to scroll horizontally as well as vertically – taking people beyond their comfort zone.

To avoid horizontal scrolling, early mobile sites had photo-rich, information-depleted layouts, which had the potential to dumb-down the internet, and did for several years. Tuum Est held off going mobile until coding methods were invented to allow our desktop site to display fully on small screens. Our most thorny challenge was our footer, discussed on this code pen.

  • Responsive Site:  Pros, Cons, and eBooks
  • To build a responsive site, you will start a journey with media queries and code adaptation. An excellent resource is the free Udacity Responsive Design tutorial with hands-on assignments that made the concepts fall into place.
  • To determine whether search engines approve your responsive design, use the Google Mobile-Friendly Test and Bing Mobile Friendliness Test Tool.
  • Pros: Are you a photographer? Is text subordinate on your pages? If so, then a mobile-first site is the correct vehicle, and will display your material well.
  • Cons: Is your dream a scholarly site? Do you combine in-depth articles with complex visual evidence (elaborate charts, graphs, and tables)? If so, then the old-style desktop site is the best vehicle. Mobile screens don't display intricate pages well. Take a scientific table: responsive design can bring a single column to the forefront, but visitors can never view the full table at readable size. An alternative: Publish your article or series as an EPUB or MOBI eBook.

Take Your Webpages Live

When ready to display your site, if funds are limited, try a publishing vehicle such as Blogger. It is free, requiring only a Google Gmail account. This platform shares the enormous bandwidth of Google, thus is impervious to DDoS attacks. On the other hand, features are limited, making site management onerous; for example, Blogger does not recognize server-side includes.

Alternately, you could sign a contract with a paid Web Host. Corporate giants (news media and national retailers) purchase the right to a dedicated (stand-alone) server at a cost up to $300 per month. In contrast, small websites purchase space on a shared server at a cost ranging from $4 to $10 per month. Be aware in advance: Most dedicated servers have firewalls strong enough to withstand a DDOS attack; but shared servers decidedly do not.

Search Engine Optimization

To raise your search ranking, follow best practice guidelines for Search Engine Optimization (SEO). The web has no shortage of devotees who offer expert advice on this topic. Stay in the white hat realm and guard the good reputation of your site.


For survivors of injustice:  Reach down inside yourself until you figure out and can articulate what happened, why it happened, and why it is wrong. As you write about your experience, that knot of grief gradually begins to dissolve. You are part of humanity's timeline. What happened to you has happened to others, yet your story and your insights are worth preserving because your individual circumstances are unique. Writing will tax your strength, but as well it is catharsis. And if your web content is well-organized, fully authenticated, and crystal clear – then you will have a forum for Justice.

Georgena S. Sil
Saskatoon, Canada
Physicist & Technical Writer
Alumnus: University of British Columbia
Twitter Facebook Linked In Google+

Portland Lighthouse, Maine

Few will have the greatness to bend history itself; but each of us can work to change a small portion of events. In the total of all those acts will be written the history of this generation.

Robert F. Kennedy

Day of Affirmation Address


Whistleblower Pioneers

Tom Devine, legal director of the Government Accountability Project (GAP), has insider knowledge of what makes whistleblowers tick:

Whistleblowers are pioneers who change the course of history. They keep us from getting stagnant.

  • Exercising the freedom to protest, they are the agents of accountability.
  • Exercising the freedom to warn, they prevent avoidable disasters before it is too late for anything except finger pointing and damage control.

Devine has worked with over 5,000 whistle­blowers. Motives range widely, but he also found central truths:

  • The common factor is they have to act on their knowledge to live with themselves. They'd be haunted by their silence.
  • Most are trying to play it straight doing their jobs, then learn something they wish they hadn't, and find themselves at the intersection of valid but conflicting life values — such as loyalty to supporting their families versus loyalty to the law when their employer is breaking it.
  • They have to decide whether to risk their career, or whether their values stop at lip service.

The term whistleblower may originate from roles such as a policeman whistling to stop, or a sports referee whistling a foul. Some nations use the term bell ringer or lighthouse keeper.

Tom Devine:  Corporate Whistleblower's Survival Guide (OpEd News)

Copyright © 2008-2019 Georgena Sil. All Rights Reserved.