Will Bontrager Blogs Website Techniques

On web pages, there are various space widths that can be specified between words and characters or images.

The normal or default space is the spacing you see between the words in this paragraph. The spacing is generally referred to as medium spacing. There are also hair spacing, thin spacing, and thick spacing.

Here is a list of various spacing that is available. Each is specified by a named character.

⁽¹⁾When a medium space is specified with   and the text is justified, the medium space adjusts its width to match the adjusted default spacing between words for that line. Here is an example.

Publish as space with a named character when you want a specific amount of space or when two words must stay together on one line.

I generally use &thinsp between radio buttons and their label text. Also checkboxes and text. Radio buttons and checkboxes generally have margins, so I remove those first.

Here is an example of that, followed by the source code:

<style type="text/css">
input[type="checkbox"], input[type="radio"] { margin:0; }
</style>

<input type="checkbox">&thinsp;For a label

As another example of use,   can be used between images to insert a twitch of space between them — so they don't bang up against each other yet don't have the normal amount of space.

Here is an example and the source code:

 

<div>
<img src="https://willbontrager.com/coverimages/Truffles-22-recipes/20201122-cover-200w.jpg" style="max-width:125px;" 
alt="book #1 cover">&hairsp;<img src="https://willbontrager.com/coverimages/First-candy-book/BookCoverARccc(200w).jpg" 
style="max-width:125px;" alt="book #2 cover">
</div>

(The books repesented by the example images can be found at WillBontrager.com.)

When additional space is needed, the named characters can be doubled or tripled or more. As an example, A      B      C      D      E      F uses        for each space between the letters.

A      B      C      D      E      F

When spacing is important, one of the named characters for publishing space may be exactly right for the situation.

(This content first appeared in Possibilities newsletter.)

"CSV" stands for "Comma-Separated Values". CSV is a popular plain text format often used especially for exporting and importing data to and from various spreadsheet software.

This article is for PHP programmers. I'll show you how to format CSV with PHP.

Do it with a function. Here is one that will do the trick.

function MakeCSVline($array)
{
   $formattedarray = array();
   foreach( $array as $chunk )
   {
      if( preg_match('/[\"\'\r\n\,]/',$chunk) )
      {
         $s = str_replace('"','""',$chunk);
         $formattedarray[] = '"' . $s . '"';
      }
      else { $formattedarray[] = $chunk; }
   }
   return implode(',',$formattedarray);
} # function MakeCSVline()

In a PHP script, call the function with an array of values. The function returns a line of CSV-formatted text.

Here is an example.

<?php
$testarray = array( 'chocolate', 'Tom "Smiley" Thumb', 'The fortune, the freedom' );
$CSVline = MakeCSVline($testarray);
echo $CSVline;
function MakeCSVline($array)
{
   $formattedarray = array();
   foreach( $array as $chunk )
   {
      if( preg_match('/[\"\'\r\n\,]/',$chunk) )
      {
         $s = str_replace('"','""',$chunk);
         $formattedarray[] = '"' . $s . '"';
      }
      else { $formattedarray[] = $chunk; }
   }
   return implode(',',$formattedarray);
} # function MakeCSVline()
?>

The example script turns this array:

Array
(
    [0] => chocolate
    [1] => Tom "Smiley" Thumb
    [2] => The fortune, the freedom
)

Into this CSV line:

chocolate,"Tom ""Smiley"" Thumb","The fortune, the freedom" 

The MakeCSVline() function handles multi-line values as well as values that contain quotation marks or commas.

The CSV-creating function is a handy little tool for you PHP programmers.

(This content first appeared in Possibilities newsletter.)

Even on a secure web page, tapping a link can result in compromised information.

There are two ways data is insecure even when you are viewing a secure web page with the browser's lock icon closed.

1. The URL in the browser's address bar is visible and not encrypted. Therefore, if the URL contains any information for the destination web page, the information will not be secure.

   Here is an example URL with information:

   https://example.com/page.php?person=Will&email=will@example.com
   

2. The server log that records the arrival of a browser at the destination web page will record the URL. If the URL contains any information, it will be recorded in the log.

   For an example URL with information, see the previous list item.

The above example requests the destination web page with method GET, which is the method generally used when a link is tapped.

When the destination web page is requested with method POST instead of method GET, both of the above insecurities are eliminated.

1. With method POST, the URL in the browser's address bar contains only the protocol and domain name. With an SSL connection, any information is sent securely to the destination web page.

2. With method POST, only the protocol and domain name are recorded in the server log. Any information sent to the destination web page is not recorded in the server log.

Tapping a link to another web page generally is method GET. Submitting a form generally is method POST.

The Willmaster.com library's Posting Links article describes how to make links that submit method POST. A link with information that must be secure when tapped can be made with the information described in that article.

Usually, links don't need to be secure, even when they contain additional information. But when the information must not be compromised, sending it method POST is the prudent thing to do.

(This content first appeared in Possibilities newsletter.)

The audio tag can be used to listen to live audio streams directly from the source. Putting the tag on your own web page makes it available from any device or computer with a browser.

All audio stream websites I've seen (music streams, mostly) offer a browser-based app to listen to their music. But there is one drawback to that, you have to change web pages if you want to listen to another site's stream.

With your own web page, it can have an audio tag for every one of your favorite streams. There is no need to send your browser to a different web page.

With more than one audio tag on your own web page, and one already playing, 2 clicks changes the stream.

1. Tap the "stop" icon of the stream you want to stop.

2. Tap the "start" icon of the new stream.

(If you start a new stream without stopping the other, you'll hear both streams.)

Here is an audio tag to play music from Easy Hits Florida, a classic rock music stream.

Here is the source code for the above Easy Hits Florida stream audio tag.

<audio controls src="https://das-edge11-live365-dal03.cdnstream.com/a80304"></audio>

To listen to a different stream, change the src value to the new stream's URL.

How to Get Audio Stream URLs

Some audio streaming websites provide their stream URLs, in addition to their app. For others, it may work to use the browser's "view source code" menu item to find the audio tag and copy the src URL.

The streamurl.link/ website can be used to help find streaming URLs you can't locate on the stream-source websites. (Their "Stream URL" icon puts the URL onto your clipboard ready for pasting.) Caveat: Many of their audio stream URLs point to locations no longer available. Test the URLs.

Another way is to use an AI chat bot to find streaming URLs. A prompt something like "provide the audio-stream URL for WCRB 99.5 radio station to use in an HTML audio tag's src value" might work. This also comes with the caveat that URLs provided by the AI might no longer be available.

Of course, a person could do the obvious, use the website's contact form and ask for the URL.

Making Your Own Audio Streams Web Page

In essence, this is a regular web page. The content of the web page is an audio tag for each of your favorite streams. For clarity, the name of each stream can be published with its audio tag.

Consider putting your web page at a location with an HTTP URL instead of HTTPS. The reason is so you have a larger selection of streams to choose from. Some audio stream URLs have only HTTP URLs. The browser might complain if you put an audio tag with an HTTP URL on an HTTPS page.

Others may find your web page of audio streams. If they listen to the streams, the resources are provided by their browser and the stream source server, not by your server. In other words, the audio streams do not go through your server.

If your audio streams web page contains confidential information, it may be prudent to put it in an access-restricted directory.

Most of the music I listen to while I am working is through my own web page of audio tags. It's quick and simple to change stations whenever I feel like it.

Now you know how to make your own.

(This content first appeared in Possibilities newsletter.)