Colour Systems Inline HTML Email Tutorial

Colour Systems Inline HTML Email Tutorial

In undertaking the makeover for the Colour Systems web application of Colour Systems Primer Tutorial we were integrating Inline HTML Email functionality via Ajax/FormData techniques (entrenched as a favourite “midair” feeling email conduit approach) when we were surprised trying something that we did not expect to work. We have intimated that as far as email clients go it is touch and go whether much HTML5 works nor CSS3 when you try to get something going, so when we tried integrating …

• inline HTML email … with …
• HTML input type=”color” as per …
  
<input onchange="findc(this.value);" style='display:INLINE-BLOCK;' type="color" name="cinput" id="cinput" value="#000000"></input>


… we were really expecting “tears before bedtime” rather than an approach using the HTML input type=”color” element above that really made it good at the emailee end, in particular, as we …

• have an emailer start the ball rolling (with the changed cmyk_rgb.html) at this link … then …
• set up a colour of interest via any of the following approaches …
  1. fill out Red, Green, Blue … 0 to 255 … RGB Colour System numbers
  2. fill out Cyan, Magenta, Yellow, Key … 0.0000 to 1.0000 … CMYK Colour System numbers
  3. click our new HTML input type=”color” element and follow your nose
• and then, optionally, collaborate (or just share) with an emailee (textbox) they fill out and press the “Email to …” button … setting off …
• Ajax/FormData functionality sends off the document.body.innerHTML (heavily amended) HTML data directed via our Inline HTML Email “emailhtml.php” (usual PHP) helper …
• email arrives for the emailee who sees a lot of what the emailer last saw … and …
  1. we highly recommend clicking our new HTML input type=”color” element, then follow your nose (picking a colour , not your … ?) then … click RGB to CMYK button
  2. fill out Red, Green, Blue … 0 to 255 … RGB Colour System numbers … click RGB to CMYK button
  3. fill out Cyan, Magenta, Yellow, Key … 0.0000 to 1.0000 … CMYK Colour System numbers … click CMYK to RGB button

  … optionally adjusting the return email (as the original emailer’s email address, more than likely) … back out to “the net” with …

• the emailee’s web browser arrives at the same colour systems web application ready to, optionally, send more collaboration or sharing back to the emailer, as required

Colourful discussions can ensue! And don’t we know, lots of people have opinions about colour, even its spelling!

Previous relevant Colour Systems Primer Tutorial is shown below.

Colour Systems Primer Tutorial

We want to talk, today, about Colour (Space) Systems. There are, at least …

• additive colour systems … used in science … often used to define web colours … red, green and blue are the primary colours
• subtractive colour systems … used by artists (and often the way we learn colours in early school) … often used with regard to printing … red, yellow and blue are the primary colours
• the CMYK colour system … used by printing industry … cyan, magenta, yellow and black are the primary colours

You can read more about the comparisons and a description of these three at Colour Systems – RGB and CYMK.

We’ve got a small HTML and Javascript conversion program we call cmyk_rgb.html (and that you can use as a live run) which you can use today to convert a given colour to and from RGB and CYMK colour systems.

If this was interesting you may be interested in this too.

If this was interesting you may be interested in this too.