Home Fitness Ideas Photos Politics

About

Pete Matthews Jr
3nt.xyz
Printing Media J Documents
Further Publication Notes

Pete Matthews Jr

Under Construction!


3nt.xyz

The domain name 3nt.xyz is registered with Namecheap, namecheap.com, paid up thru April 2028 (at the time of this writing). Whenever they have a useful sale, I extend, aiming to keep ten years out.

This web site is hosted at Hostinger, hostinger.com, paid up thru August 2030. They have good sales. I first tried their free service, 000webhost.com, but they kept sending out "Are you there?" emails, which is not acceptable for a site that I plan to outlive me for a while. (This section defines how long that should be, unless my heirs extend it.)

Hostinger has automated web site building and other neat features, but I use few. Instead, I have an image of the site on my computer where I build, write and test new features, and upload them to the website. This approach has already allowed me to switch providers almost instantly — when I switched from 000webhost to Hostinger.

Design Overview

The site itself is build upon the W3.CSS cascading style sheet, www.w3schools.com/w3css/. It's clean and crisp, but (at least as I use it), it lacks fancier features found elsewhere. It does have plenty of good working examples, such as how to have a button to sort a table, which I did for my Balanced Beer Ratings. I use a common header and footer, maintained in separate files and copied into primary pages. Secondary HTML pages use a stripped-down header & footer that only know about the parent primary page.

In order to be able to test changes before putting them online, all references to files on this site, within files on this site, are relative. That is, no URLs refer to 3nt.xyz or start with a leading slash. Instead, they start with a file name, a subdirectory within the current directory, or a relative path using ../ to go up a level. This means I can open any menu-type file on my computer; that page and any links to other pages on my system should work — all on my computer — without using the external web.

Design Details

In order to make this work properly, some files must live in the top level directory. This includes index.html and all the primary pages referenced on it. All these pages include a copy of 0-header.htm and 0-footer.htm, as mentioned above. These pages can automatically find each other, as well as my copy of w3.css, favicon.ico, and the image on the home page.

Each of the primary pages has a corresponding directory that contains its secondary pages, photos, and whatever. Each of these directories contains a redirecting index.html file, such as this one in the photos directory:


<html>
<title>Redirect - Pete Matthews Jr.</title>
<head>
	<meta http-equiv="refresh" content="0,../photos.htm">
</head>
<body>
	<p>If this page does not redirect, click here:
	<a href=="../photos.htm>../photos.htm/<a>.
	</p>
</body>
</html>
      

A file named index.htm seems to be handled differently by Microsoft from all other .htm files. I don't remember the details, but I know enough avoid it. When I get to choose, I use the name index.html.

Photo Page Overview

We decided long ago to avoid proprietary methods for organizing photo files, for example, eschewing Photoshop Elements other than its editor. Our standard for file names is "yyyy-mm-dd %n description" where %n is a sequence number specific to the folder or application. This allows us to use normal Windows tools to organize and sort files by name. BreezeBrowser Pro, www.breezesys.com/, has been adding a lot to that approach since 2005. We use it extensively in sorting many thousands of pictures into folders, moving, copying, ordering, renumbering, renaming and batch renaming, jumping into the PSE Editor, and deleting to a Deleted folder.

HTML photo pages are generated automatically using BreezeBrowser Pro. We have found that very long file names work well with this process, which I have customized to turn the file name into the photo caption, among other changes. A few years ago, I bought three copies of ACDSee, hoping to gain fancy photo tagging features. We did not use it, and I eventually removed the software. Instead, I decided upon the Best by Year approach you see rolling out on the site. The tools are great; it's deciding which pictures make the cut that's the hard part. Slow!

BBpro also reduces the resolution of photos to at most 1100 x 900. [This feature builds on one for sending proofs to a client; I chose this resolution.] Photos will download faster, fit better onto screens, and take up less of the limited disk space on the web site. For each folder on the web site, there is a corresponding folder of full-resolution photos, in the Best By Year folder on my computer, that I would be glad to make available to family members.

Karen now mostly uses Google Photos, which provides her with immediate access anywhere (but expensive when using smartphone data). I periodically download copies of all her stuff, getting it ready to distill into Best By Year, as well as into our backup system.

Photo Page Details

[(IMAGE) BBpro HTML Page Generation]

This Breezebrowser Pro window shows the settings I used to generate the photo directory for "Sole E95 Assembly in Captioned Pictures" on the Fitness page on this site.

The parent of each photo directory on the site, the photos directory containing Sole_E95 in this example, must contain these files:

A photo directory can be relocated at will, so long as these two files are copied into the parent directory.

BBpro uses templates to generate a directory for the web from a folder containing photos. I pointed the tool at my own directory and heavily modified the template used for all the full size image pages. Among the improvements was recognizing the left, right and up arrow keys, and the left and right swipes. I tried three different methods from the web before I found an acceptable one for swipes, using hammer.js. How I did it is documented at https://stackoverflow.com/questions/62076076/operate-on-swipe-left-right-leave-all-other-swipes-pinches-and-taps-alone

Trapping the arrow keys was relatively easy, but I was not able to trap the Escape key.

On a touch device, hammer.js, as I employed it, moves to the next or previous image for left or right swipes, respectively. However, this solution blocks Chrome/Android from resizing an image in response to pinches — an acceptable price, but I'm hoping for better.

If you are interested in my template for BreezeBrowser Pro, here it is, in a 7-zip file.


Printing Media J Documents

Most articles on this site are presented in Junior size, half an 8.5 by 11-inch letter sheet, in Portable Document Format (PDF). This format is noted by J in the Media column. On a small screen, this format works much better than a full letter size PDF especially if you rotate your screen to horizontal. However, if you print what you see in your web browser, it will usually print in the upper left corner, with half the paper wasted.

To print such a document properly, first download it, and then open it with Acrobat Reader. You then have the choice of expanding the print to fill the sheet (large type), or printing 2-up (two pages per side, saving paper). The current version of Acrobat Reader is available at https://get.adobe.com/reader/. Keep the box checked to install the Acrobat Reader extension for your web browser, if applicable. Definitely uncheck the boxes, so that the optional offers from McAfee do not get installed.

Caution: Various browsers and/or print drivers may be able to do what you want, but Acrobat reader is more reliable. For example, if you use Windows 10, the default handler for PDFs is the Edge browser, which cannot print 2-up. However, Edge should be able to do large printing for Media J documents: select the Scale option of Fit to page (not actual size).

Large Printing for Media Code J:

  1. Download the PDF to your system (or save it as PDF from MS Word).
  2. Open the PDF using Acrobat Reader, and invoke the print dialog (Ctrl-P on Windows).
  3. Select Portrait orientation, the Size option, and then the Fit to page option.
  4. To print on both sides of the paper, check that box and then click Flip on long edge.

[(IMAGE) Dell 3760-PS Multiple, 2 pages per sheet, print both sides]

2-up Printing for Media Code J:

  1. Download the PDF to your system (or save it as PDF from MS Word).
  2. Open the PDF using Acrobat Reader, and invoke the print dialog (Ctrl-P on Windows).
  3. Select Portrait orientation, the Multiple option, and then 2 pages per sheet.
  4. To print on both sides of the paper, check that box and then click Flip on long edge.
[IMG: Dell 3760-PS Multiple, 2 pages per sheet, print both sides]


Further Publication Notes

Some of the material on this page originally appeared on the MIT/DL Bridge Club site, on the page http://web.mit.edu/mitdlbc/www/contrib.html.

This page (http://3nt.xyz/about.htm) is now the official home of this material. Look for updates here.

Media Codes

To describe attributes of the intended media, PDF documents are noted with these Media Codes:

Media Orientation Columns Size Description
P Portrait 1-2 8.5"W x 11"H US Letter, usually single column, best for printing and viewing on a moderate to large screen. Articles published before July 1, 2018 and most other bridge material is in this format.
L Landscape 2 11"W x 8.5"H US Letter, print using less paper for proofreading or making notes, or view on a large screen. This version is seldom provided on the site. With 2-up printing, format J covers most of the function of format L, so this format should seldom be used.
J Portrait 1 5.5"W x 8.5"H US Junior (Half Letter), best for large print on letter paper, printing a book or booklet on Junior size (or larger print on larger paper). Best viewing on small screen. See Printing Media J Documents above. All articles published after July 1, 2018 should be in this format.

Note: I invented these three codes for use on this page.

Formatting for Small Devices

In MS Word 2010, select the Page Layout tab.

Once these required settings have been established, they should not need to be changed:

  1. Click the little corner-arrow in the bottom right of the Page Setup section.
  2. Margins tab: Top, left, bottom, and right all 0.3". Gutter 0.
    For page numbers in the footer, set the bottom margin to 0.4".
  3. Paper tab: Height 8.5".
  4. Layout tab: Header 0.0", Footer 0.2".

Switch to Media Code L:

  1. Orientation: Landscape
  2. Size: Letter (8.5 x 11 in)
  3. Columns: Two
  4. References Tab - Table of Contents Section - Update Table - (select desired option) - OK.
  5. Also do the Index, if there is one.

Switch to Media Code J:

  1. Columns: One
  2. Click the little corner-arrow in the bottom right of the Page Setup section.
  3. Paper Tab - Width: 5.6" - OK. [This switches Orientation to Portrait.]
  4. References Tab - Table of Contents Section - Update Table - (select desired option) - OK.
  5. Also do the Index, if there is one.

Acrobat Reader is recommended for printing such a document, first saving it as a PDF. See Printing Media J Documents above.

Book Info

Hey, I'm writing a book! I'm sticking special formatting info in this section.

On Jan 1, 2019, I changed the header and footer dimensions above, and noted using a bottom margin of 0.4" with a one-line footer.

Headings

Each chapter is a "Heading 1" and has a number preceding its name (16-point bold Arial). Usually, the first topic in the chapter begins without further ado.

Each topic is a "Heading 2" (14-point bold italic Arial). To assure nothing else lands in the Table of Contents, "Heading 3" is not used.

Each topic starts with the main points to be discussed (11-point Calibri). "Heading 6" (12-point bold Calibri) is usually the only heading type in this section, although some run-in headings may begin paragraphs. I'm reluctant to change the 11-point default in my copy of MS Word to make "Heading 6" 12-point. Accordingly, I need to set one heading to 12-point, and then right-click on Heading 6, and select Update Heading 6 to Match Selection I keep having to do this, so it might be per-file, per-inserted-file, or per-section.

Each topic contains Backstory and Alternative Methods sections; each is a "Heading 4" (14-point bold Calibri). Within each of these sections, paragraphs may begin with run-in headings (11-point bold Calibri). This secondary material does not merit larger headings.

Line Endings

As much as possible, I attempt to follow Richard Pavlicek's Bridge Writing Style Guide. This means spaces normally appear between card symbols, suit symbols, and bid levels. Unfortunately, in flowing text, this can cause something such as "2 S" to be split across a line ending. To avoid that, use Ctrl-Shift-Space to insert a Nonbreaking Space between the "2" and the "S" (or spade symbol). We can also find this with Insert > Symbol > More Symbols... > Special Characters > Nonbreaking Space. Similarly, use Ctrl-Shift-Dash to insert a non-breaking dash.

Section Breaks, Footers and Page Numbers

Each topic starts a new page. To obtain that effect, we use Page Layout > Breaks > (Section Breaks) Next Page (or occasionally, Odd Page).

Now things start to get sticky. The first section of the book includes the front matter that will not have footers or page numbers. However, those pages are invisibly numbered.

Make sure there are no footers, or footers are empty, in this section. Alternatively, do this on the very first page, and then number the front matter as described below.

To start numbering within the front matter, section break to the next odd page. Open up the footer for the first page to be numbered, which brings up the "Header & Footer Tools" (green tab). IMPORTANT: make sure "Link to Previous" is NOT highlighted (yellow). It must be gray, or anything we do here will affect the previous section.

We want the page number on the right of the page for odd pages, and on the left for even pages. Use Page Layout > Page Setup > Layout, and select both "Different odd and even" and "Different first page."

Insert > Page Number > Format Page Numbers, in the front matter, and set the Number Format to i, ii, iii. Continue page numbering from the previous section. However, do not number the very first page.

To start numbering the main body, section break to the next odd page. Open up the footer for the first page to be numbered, which brings up the "Header & Footer Tools" (green tab). IMPORTANT: make sure "Link to Previous" is NOT highlighted (yellow). It must be gray, or anything we do here will affect the previous section.

Page Number > Format Page Numbers... Set the Number Format to 1, 2, 3 and Start at 1.

On the first even page to be numbered: Insert > Page Number > Bottom of Page, and select the first footer, simple page number on the left. In the footer for the page, put 10 spaces after the page number, and follow it with the book title.

On the first odd page to be numbered: Insert > Page Number > Bottom of Page, and select the footer to put a simple page number on the right. In the footer for the page, put 10 spaces before the page number, and precede it with the section or chapter title.

On the footer for the footer on the first odd page for each subsequent section, position the cursor at the right of the previous topic title, which should be there, and backspace over it. Then type the new topic title.

To start the next topic, section break to the (odd) next page. On the footer for the first odd page in the topic, position the cursor at the right of the previous topic title, which should be there, and backspace over it. Then type the new topic title. IMPORTANT: make sure "Link to Previous" is NOT highlighted (yellow). It must be gray, or anything we do here will affect the previous section. However, we do want "Link to Previous" for the even page footer.

Note: A single-even-page topic won't get into a footer. If the topic expands to a second page, then that footer will need to be fixed. Also, if the title of the book is changed, the even page footer will need to be fixed in every section.

Formatting for Kindle

All the information above is about formatting for a PDF file, especially Media J, which should display acceptably on any small device, including a smartphone or a Kindle.

However, I may need to publish in Kindle format. That may wreak havoc on carefully formatted tables. Pagination control is out the window, for sure.

Worse is my use of the Cards font. A Kindle certainly does not have that. Even if it's possible to install it, it might not work as desired. (It's fine in a PDF that contains a copy of the whole font.)

The trick will be to write the whole book in a single Unicode font. The two fonts that I found on Windows 10 to include the required outline (white) heart and diamond symbols, in addition to the solid (black) space and club symbols are:

Arial Unicode MS — symbols slightly smaller; text bolder than Calibri
Cambria Math — symbols significantly smaller; serif
Yu Gothic — symbols slightly larger; text fainter than Calibri
Yu Gothic UI — symbols significantly larger; text sl. bolder than Calibri

Yu Gothic UI is a User Interface font that has been compressed so that it can seamlessly replace other such fonts. Arial Unicode MS looks like the best bet. If the symbols are slightly larger than the rest of the font, they may cause extra space between lines when used in a paragraph.

Anyhow, the point is to produce the entire book in the same font, including the suit symbols. The fonts above have the symbols we need at the prescribed locations:

U+2660 = black spade suit
U+2661 = white heart suit
U+2662 = white diamond suit
U+2663 = black club suit

In MS Word 2010, use Insert - Symbol - More Symbols, and scroll way down. You'll see the Unicode number from the chart above, for the correct symbol. Of course, once you have the correct symbol in the book, just copy it around. These symbols are acceptable, but inferior in appearance to the non-Unicode Cards font symbols.

Unfortunately, although most fonts are Unicode, most of those do not contain the required four symbols. Many contain the black spade and club symbols, but not the white heart and diamonds. (Many fonts do contain a white diamond at the wrong location; avoid those fonts.)

Using a single Unicode font should enable the document to display reasonably on the end user's Kindle — if the kindle has a Unicode font containing our symbols — and if the user selects that font. This is reportedly possible on all recent Kindles, with the Georgia font appropriate for a first try. The appearance of the symbols is wholly dependent on the Kindle font. It would be appropriate to a documented test in the front matter of the book.

More info is out on the web. I found the work of Tim C. Taylor to be helpful, for example, https://timctaylor.wordpress.com/2014/02/24/kindle-support-for-unicode-pt2-how-to-use-unicode.

For a while I had a Kindle, but I gave it to my daughter. I got it to read library books, for which it was kind of a PITA. I like that better on my new Pixel 3 smartphone.

Most photos © Karen C. Matthews. Unless specifically attributed otherwise, all other content © Pete Matthews Jr.