I've been experimenting with font formatting (Thanks to whoever edited my MayDay entry I was able to see how it works, Thank you!). I can use it fine, now, but there are a few questions I have. First is, what are all the font types that are available? I know helvetica, ariel, and comic sans ms work, but I'm not sure what else does. Also, what colors are available? I've found a lot more here, but I'm sure there are more. The other issue I've encountered is the way the html tag is entered. When I use it on stories, apostrophes (') work, but quotation marks (") don't. When I use it on blogs, it's the other way around. It's a little confusing, and I'm guessing it's not supposed to work that way.
Any information would be appreciated!
Saless
P.S. I'll list below what I've found to work. The html tag is: <font face="fontname" size="#" color="colorname">
The font faces I know are:
- Ariel
- Comic Sans MS
- Helvetica
Sizes are between 1 and 7, anything higher than 7 looks to be the same size as 7. I think zero is the default size.
Colors I know work are:
- Pink
- Hotpink
- Magenta
- Red
- Blue
- Green
- Grey
- Silver
- Purple
- Lavender
- Brown
- Orange
- Yellow
- Violet
- Teal
- Turquoise
- SkyBlue
The default color is black, obviously.
Leaving nothing between the quotation marks results in the default font, color, or size.
Fonts and Colors
Just because a color name or font name work on your browser does not mean they work on other browsers at the other end of the net. There is no standardization across different browsers for what the color names are or what they mean. Red, green, blue, purple, black, brown, magenta, cyan, orange, gray and yellow are pretty safe to use but the last two or three are too light for lettering against the light background used here on BC. White also works on nearly all browsers.
It's much better to do colors like this (inside the HTML tag): color="#666666".
Red
That will produce a medium-dark gray. The first pair of digits in the color command are how much red in the color, the second pair control the green and the third pair, the blue. You can also use just three digits: "#60F" where the first is red, the second green and the third blue. The digits are hexadecimal zero to 9 plus A to F [012356789ABCDEF].
Fonts are also problematical. Whether they work depends on which fonts are installed on the READERS machine and browser. The following font names are usually safe: arial, helvetica, geneva, verdana, times, times new roman, palatino, georgia, comic sans, serif, sanserif.
The two best for legibility on monitors are Verdana and Georgia. (It doesn't matter if they are capitalized in font tags.) On BC, Verdana is used for titles, categories and the sidebars. Georgia is used for the text of stories.
Arial, Helvetica and Geneva look a lot alike and Verdana is a variation of Helvetica optimized for monitors. Sanserif is a placeholder, the reader's browser will pick one of the Arial group of fonts to use. Sanserif font faces look hard and distant but are readable at many more sizes than Serif fonts which are best at the middle range of sizes. The fine print on labels and the giant display type on newspapers are generally one of the sanserif faces. Here at BC, most faces are Verdana to make the stories, which are Georgia, stand out more. The editing boxes are also Verdana or Arial for no good reason at all.
Serif is another placeholder, the browser will pick either Times or Times New Roman to use. Times and Times New Roman are newspaper fonts, optimized for printing on cheap paper. They are virtually identical, one being the London Times version and the other being the New York Times version. They are solid and dependable looking, based on classic printing faces of the oldest types.
Palatino is a similar book face, optimized to look good on fine quality paper at a size of 10 to 14 pts. Georgia is similar to Times/Palatino but optimized for pixelized monitors. It works well on paper, too but is not as compact as Times nor as elegant as Palatino. Its readability is almost legendary, though and it or a similar face under another name has been used for centuries in schoolbooks. Stories on BC are displayed in Georgia, usually, because in my opinion it is the very best face for large blocks of type on pixel-based screens. The Vanilla-Peach color background on stories is also chosen to keep eyes from getting tired reading large blocks of type.
Garamond is similar to Palatino and is fairly common on browsers but really doesn't look very good on a screen. Many books are printed in Garamond though because it is compact, legible and elegant, especially in the 9 to 12 point (1/8 to 1/6 of an inch) sizes used in books. On a computer screen, Garamond looks gray because it is optimized for fine printing, not square pixels.
Times looks too black and heavy on screen and may even have a smeared appearance at large sizes. It looks good compared to most other faces when subjected to the cheap printing of newspapers and pulp magazines, though, and that is what it was designed for.
Georgia and Palatino are clean and legible on screen in most sizes with Georgia having an edge at the smaller sizes and Palatino at the larger ones. Unfortunately, Palatino is common on Macs but less common on PCs, or is there under a different name.
There are lots more font faces that are generally available on Macs and some of the newer Windows machines but would just be shown as Times or Arial or something on older machines.
Your problem with ' and " is nonsensical. What you think is happening is not what is happening. :) Look closer at your code. The two can be used 'this' or "that" interchangeable in nearly all situations except that inside single quotes you must use double quotes and vice versa.
Hope this helped. :)
Hugs,
Erin
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
Thanks!
Thanks Erin! That clears a lot up. I haven't dealt with html much, so I didn't think about how different programs would handle it different ways.
Saless
"But it is also tradition that times *must* and always do change, my friend." - Eddie Murphy, Coming To America
"But it is also tradition that times *must* and always do change, my friend." - Eddie Murphy, Coming To America
Fonts and Colors
Someone types faster than me. :-D
I did not know about the three digit color. Learn something new every day. Thanks.
Thanks again, I finally
Thanks again, I finally figured out what was going on with the quotes! Word was automatically changing them to what it calls "Smart Quotes". I guess the smart quotes weren't registering as quotes at all in the html tags, so of course they didn't work! I've changed the settings now, so that shouldn't be a problem anymore. Which will be nice, since I won't have to change them all manually in the +Fiction window anymore! ;)
Saless
"But it is also tradition that times *must* and always do change, my friend." - Eddie Murphy, Coming To America
"But it is also tradition that times *must* and always do change, my friend." - Eddie Murphy, Coming To America
Text Editors vs. Word Processors
When writing any kind of code, whether it be programming, HTML, XML, or whatever, you want to use plain old (ASCII) text. If you use something fancy like MS Office, Open Office, Abi Word, or whatever, you can get weird characters that look good in the word processor, but don't translate to a standard ASCII character. Common examples are the left and right quotes (tag thingie pointing up or down) vs. the standard quotation mark that is equally at home on either end of the quote. To make things more interesting, there is a left single quote, a right single quote, and an apostrophe. Then, we have the dash and the hyphen (which is longer, and often replaced by two dashes.)
The simplest way to accomplish this is to use notepad.
Alas, notepad doesn't have any speel chekr, and it craps out after a few thousand words.
Another way is to create a text (.txt) file using notepad or whatever method you like, then open it with your favorite word processor. When you save your work, the WP will warn you that you are about to save it as straight text. Of course, that's exactly what you want.
Finally, if you have something already written as a word file, you can copy and paste it (piece by piece, if necessary) into notepad.
If you want a better text editor, there is a free program called Notepad++. You can google for it, or get the portable version from http://www.portableapps.com.
Ray Drouillard
>> Your problem with ' and " is nonsensical.
Possibly more accurate to say that the problem isn't well-defined.
"Doesn't work" is a vague sort of description that can mean different things to different people.
Among the things that could be happening is that the software you use does automatic conversions of single and double typewriter (straight) quote marks to curly quotes (inverted commas) which may or may not display correctly in a particular environment.
I usually write using a programmer's text editor (BBEdit for the Mac) and insert every special (non-ASCII) character as an escape sequence, so this sort of thing rarely happens, but I see it happen all the time.
Most browsers these days allow you to choose what character set is being used in a given page, so it can be useful, if you find characters disappearing or turning into weird blotches or question marks, to try cycling through some of the most common.
Cheers,
Puddin'
-
Cheers,
Puddin'
A tender heart is an asset to an editor: it helps us be ruthless in a tactful way.
--- The Chicago Manual of Style
Here is a very good set of color charts for html
Toledo Bend
I like it better than the charts that mix everything together in what seems like a random fashion.
It groups all similar colors together as follows and gives the 6 character HEX values Erin mentioned.
Basic Black/Grays
Basic Blues
Basic Browns
Basic Greens
Basic Oranges
Basic Purples
Basic Reds
Basic Off-Whites
Basic Yellows
The chart Sephrena originally gave me, is here, too as Hex Color Chart
But remember, too many font changes or use of too many colors does not help readability.
And try for colors that have good contrast against the BCTS background.
Holly
Holly
It's nice to be important, but it's more important to be nice.
Holly
Font and color formatting
First, it's arial with an 'a' not ariel with an 'e'. The font shown on your example will generally not be arial on most people's computer (see 'face' below to find out why).
The font tag has several parameters that can be used separately or in any combination or order. The general format is < font PARAMETER=DATA {PARAMETER=DATA...} > where PARAMETER is one of size, face, or color.
size: size is an integer value from 1 to 7 with 1 being the default and smallest. Any number outside of this range will result in the default size. These sizes are relative to each other and defined in the user's web browser. If the user has his/her browser set the same as yours your size will look the same, otherwise ...
color: Besides the color values you have found, you can set a specific Red, Green, and Blue (RGB) color value by calling out the RGB hexadecimal code in the format #RRGGBB. The values for RR, GG, or BB are from 0 to 255 and represented as 00 to ff (#000000 is black, #ffffff is white). The digits go from 0 to 9 then a to f so #0d = 13, #10 = 16, #af = 165.
face: Each user's web browser has a default face setting. If you specify a face that is NOT available on the user's computer, the default will be used. Different operating systems come with different faces. Because the names are copyrighted, the same looking face can be named differently on different computers (i.e. arial on win is helvetica on mac).
Because of this, when calling out a face you may give a comma separated list of faces and the first one that is available on the user's browser will be used. Calling out face="comic sans MS, arial, helvetica" will end up with a sans serif face on most computers (comic sans MS on most). However, if neither of these three faces is available the browsers default will be used (generally a times/roman of some sort). That is why calling out ariel in your post generally yielded a different face on most user's browsers.
Now, before anyone gets too carried away, printing used to be a specialized field and one learned the ways to make things look good from more experienced printers. Since computers came along, there has been a great diminishing of good looking print because a bunch of amateurs don't know what they are doing. There are some general principles to looking good in print.
1) there are three types of faces; heading, body and symbol. Each has it's specific uses. BTW it's "face" for a style of text and "font" for a specific face/size/emphasis.
Heading faces are things such as Comic Sans MS, Broadway, Park Avenue, Star Trek, etc. They are used for titles, headings, etc. They should be used very sparingly.
Body faces are things such as Times, Roman, Arial, Helvetica, Courier, Bookman, Georgia, etc. These faces are designed to be easy to read and look good in large blocks (like, say the body of a post).
Symbol fonts a special characters designed for special tasks.
In any document it is by far best to use ONE and only ONE body face and optionally ONE and only ONE heading face. Same goes for colors, at most two. Also, it's generally best to have a high contrast between the text and the background; black text on a brown background is not a good thing.
2) There are serif and sans serif faces; serif faces have the little extensions at the end of lines, sans don't. Look at the same letters in times/roman vs. arial/helvetica, see the extra bits, say at the four corners of the x, those are serifs. Generally serif faces make your document look warmer and easier to read than sans serif fonts. Sans serif faces make your document look like a tax form, cold and hard. If the body face is serif, it's usually best for the heading face to be serif as well.
Some serif faces are designed to be even easier and warmer than others. Times/roman is the facet that newspapers traditionally used, it looks solid, truthful, carved in stone. Bookman/georgia is the face that was traditionally used in primary school textbooks. It's easy to read, warm, friendly.
Making printed words look good is not the easiest thing in the world, making them look bad is. If you can find a copy of "looking good in print" or a similar book, get it, understanding faces, sizes, white space, etc. will make your works look better let you avoid the disaster of an entire page done in comic sans MS.
Hope this helps.
P.S. never specify widths and heights in pixels for a web page (except for images). It makes ones pages look like garbage when someone adjusts the size of the way-too-small text one used.
nitpick
sorry to quibble, but while there's a superficial resemblance, helvetica and arial are most assuredly not the same font. helvetica is among the most elegant of sans serif fonts, but arial is the unloved bastard spawn of bill gates, clumsy and ever so slightly not right.
for print i favor headings in helvetica and text in garamond. for the screen, where there's little or no real control, i favor leaving the format to the user's browser default, on the basis that they're probably most comfortable with that.
i started life online using vi as my text editor, which makes me a special kind of masochist, but also means I'm used to plain ascii text. in fact I usually prefer it.
but then i'm odd, in so many ways.
not as think as i smart i am
Yeah
I'm confusing Arial with some other font face. Early versions of Helvetica screen fonts did not track well (the space between letters did not look right) and Arial was Microsoft's attempt to fix this. Verdana is a better effort but later screen Helveticas retain the look of the print face without having the original problems.
Hugs,
Erin
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
Colours and Fonts
Colours
The other problem with named colours is that different monitors, including flatscreen monitors, have different colour temperatures and characteristics, so the colours that may look great! on your PC with Windows and a Sony Monitor may look like absolute rubbish on an Apple Cinema Display.
Although it isn't as serious a problem as it used to be, high-resolution, "Tru-color" (millions of colours) monitors being almost ubiquitous these days, you should also be aware that most of the named colours aren't "browser-safe," which means that they may "dither" on some monitors, creating a Moiré pattern that distracts some users. Apple monitors are usually set to a higher "gamma" (brightness) level, so it's quite common for a page that looks fine on a Mac to be unacceptably dark on a PC. This is part of the reason that the "browser-safe" palette is crowded with highly saturated (some might say 'garish') colour values and both very light and very dark colours are scarce on the ground.
The only way to accommodate almost all potential users is to have at least two machines, a Mac and a PC, and serious Web designers have a few more of them available. The possibility that your pages will be viewed on a cellphone or e-text reader, most of which have a very limited colour space, if any, adds to the difficulty. One, four, or sixteen grey levels are common in these devices, and colour palettes tend to be limited, even when colour is available.
And if that isn't enough to juggle, a thoughtful web designer should take into account the more common forms of colour-blindness, and try to ensure that pages are still legible, at least, when viewed by different people.
It ain't easy.
Here's a little tool you can use to visualise the problem:
http://www.colorjack.com/sphere/
Fonts
Oddly enough, serif fonts — like Times Roman — in newspapers were actually more legible than san-serif fonts, because newspapers were (in the olden days) printed sculpturally, with ink pressed into the actual body of the paper, so you could actually see the edges glisten as you moved the page. This gave them a "sharpness" that cannot be duplicated using most modern technologies. These days, they're usually offset, leaving the ink sitting on the surface of the paper, but at a higher resolution than most monitors allow, so the sharp little points of the serifs become a little muddy when viewed at small sizes, and even in large sizes don't duplicate what the original designer carved into the matrices as the ancient Romans incised letters into stone.
Cheers,
Puddin'
-
Cheers,
Puddin'
A tender heart is an asset to an editor: it helps us be ruthless in a tactful way.
--- The Chicago Manual of Style
Newspapers
Puddin',
AFAIK, major publications still use stereotypes and rotary presses. The stereotypes are cast in resin, rather than metal, to allow for higher speed.
Letterpress is definitely a thing of the past for small job printing. Photo offset has become totally dominant.
G/R
Stereotype Printing
Stereotype printing is a variation of the hot lead process which requires the page to be set in lead, then a mould is made of the set page and that mould filled with lead (or resin) cast as a unit to form a solid sheet of lead (or resin) which is more durable than individual pieces and lines. The mould could also be made of a flexible material, which allowed it to be curved into the casting machine and form a solid lead (or resin) cylinder which could be used on a rotary press. The shop I worked at as a Mergenthaler Linotype (a type of hot lead linecasting machine, and the one that made the modern newspaper possible -- pre-Mergenthaler, no newspaper in the world comprised more than eight pages, which is why Sherlock Holmes was able to read so many newspapers every day.) operator sold their high-speed rotary press to a plant in South America because there was no market for these machines in the USA or Canada, and in fact we used, toward the end, a Goss rotary stereotype press. Before that, we'd used a lovely Heidelberger Druckmaschinen flatbed press. I can still remember the sound of it, especially starting up and slowing down, with perfect clarity.
The highest speed rotary presses in the world are based on the Rotogravure process, a type of offset printing which uses an engraved plate, usually copper, although other materials are possible, which is etched under computerised control. These days, the process is used primarily for postcards, fine art printing, and other applications requiring great accuracy and depth of colour. Although many newspapers used to have a Rotogravure section, these have declined over the years. I misdoubt me that many readers today even know the word, which is redolent of the turn of the last century, horse-drawn carriages, crinolines, and sun bonnets.
The vast majority of newspapers in the USA, Canada, the UK, Australia, Ireland, and Western Europe are printed on web offset presses which use photolithography to form the plates, which are in turn wrapped around cylinders to carry the ink which is transferred to the paper as it feeds through the press. I lived through this transition on the working end of the business, and know a tiny bit about the field of typography in general. There are so few Linotype operators (and other hot lead trades) these days that the International Typographical Union has been subsumed into the Communication Workers of America, the people who work on telephones. Because its members were typically highly educated and literate, the ITU was one of the most progressive trade unions in the world, allowing women into the printing trades as early as 1869, less than twenty years after they were founded in 1852 and, through strange coincidence, the very same year the first small advance was made for women's political power when (local) Woman Suffrage was enacted in Wyoming Territory in the USA.
The only place you'll find the stamped impressions of hot-metal technology today are the few remaining "art presses," some of which still set type by hand, each letter picked out of a "case" of type.
Cheers,
Puddin'
-----------
In your Easter bonnet with all the frills upon it,
You'll be the grandest lady in the Easter Parade.
I'll be all in clover, and when they look you over
I'll be the proudest fellow in the Easter Parade.
On the Avenue, Fifth Avenue,
The photographers will snap us
And you'll find that you're in the rotogravure.
Oh, I could write a sonnet about your Easter bonnet
And of the girl I'm taking to the Easter Parade.
--- Irving Berlin, The Easter Parade, as sung by Judy Garland
-
Cheers,
Puddin'
A tender heart is an asset to an editor: it helps us be ruthless in a tactful way.
--- The Chicago Manual of Style
Linotype vs Monotype
The paper I worked on used Monotype machines which were a two step process, the first operator producing a paper punch tape which was taken to another machine with another operator to produce the actual slug of metal. This was for their rotary presses.
In the back of the building, they had an old flatbed and a Linotype, which were used to do special printing for inserts. Whole 'nother crew. When the last Linotype operator retired, they retired the old press and a few years later went to web offset -- but kept a small rotary around with a couple of Monotype operators for a few years. :)
I'm sure when the Linotype machines were new they probably had a guy in the back working with casetype. :)
The hot type guys were generally acknowledged to be crazy as bedbugs from inhaling lead fumes all day. No kids were allowed in the hot type rooms. Even though the casting metal for the Monotype machines was a bismuth-tin-antimony alloy and had very little lead in it.
The Linotype/Monotype rivalry was part of the origin of typefaces having multiple names, like Times and Times New Roman or Arial and Helvetica.
I ran a small job shop for awhile, at first using the fancy German mimeo machines and later a small offset. I also took two years of Graphic Art & Design in college which included operating offset presses, among other things. :)
Hugs,
Erin
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
= Give everyone the benefit of the doubt because certainty is a fragile thing that can be shattered by one overlooked fact.
They always had case type...
Because Linotypes were limited to body text.
Headlines were either set from case type or cast (in my shop) on Ludlow Linecaster, which was set up manually using matrices selected by hand and then a single line of headline cast in lead. something like a regular line, but heavily undercut, so you had to set them on slugs.
Some special fonts (not much used on newspapers, but handy sometimes) were set from case type as well: Wedding Text, swash fonts, and the like. Linotype fonts couldn't be kerned, either, as they were limited to the width of each matrix, so fine typography had to be set by hand using case type. I still have my composing stick, but very rarely used it. Our shop had dedicated compositors who were much better and faster at it than any mere operator.
As for children, I grew up in a print shop. My father was a printer and my first "job" was separating leads and slugs from set forms so the Linotype metal could be remelted in a furnace and formed into large bars, ready to reloaded above the pot. I worked in print shops, intimately familiar with hot lead, from the time I was seven years old untiI the press went out of business and I went back to school at the age of thirty. Lucky thing my brain was destroyed, or I'd be too smart to talk to anyone but God.
Cheers,
Puddin'
-
Cheers,
Puddin'
A tender heart is an asset to an editor: it helps us be ruthless in a tactful way.
--- The Chicago Manual of Style
Printing
Puddin',
I guarantee you come into intaglio printed material on a daily basis. It's the paper money in your purse and my billfold.
Did you ever work with slugs made on a Ludlow machine? I don't think I ever was near Mergenthaler made equipment. I have juvenile memories of Intertype.
You mentioned Heidelberg. Along with the flatbed they made some fast platen presses. The chases were set up in an "unusual" manner.
G/R
>> Ludlow -- Yes.
I actually owned a Ludlow for a while, I bought some of the equipment from the San Francisco Examiner when it folded, finally selling my dear Ludlow to a high school in Mill Valley. I'd wanted to buy one of their Linotypes, but didn't have room in my garage, and Linotype itself was going around and buying them to keep them off the market, but all they did with them was take a sledge hammer to the major castings and call the ironmongers to haul them away as scrap.
Cheers,
Puddin'
-----------
Here's a movie of a Linotype in action:
http://smg.photobucket.com/albums/v718/rag451/Linotype/?acti...
It's an amazing piece of purely mechanical machinery. Some of the later ones were set up to use paper tape, because any idiot could compose on paper type, whilst a Linotype operator used to be able to type with one hand, sort out the pi matrices with the other, and operate the casting lever with the toes on their left foot, which left the other foot free for crochet work.
>> Intaglio printing is done from engraved plates and the ink is transferred from hollows in the plate onto the paper, which was pressed onto the non-inked surface. Hot metal or hand-composited letterpress printing is a relief technology in which the surface of the type or cut was inked and then pressed into the paper, the exact opposite of intaglio printing.
>> unusual manner...
I wouldn't know. I walked past the thing almost every day, but the pressmen were highly secretive and proprietary, so I never saw much of their Holy Mysteries, other than the incense and annual goat sacrifices, of course. The only thing I had intimate acquaintance with were the galleys and forms (chases), which last were rolled over to the side of the press and obeisance made to the pressmen, who would come over in their special sacerdotal hats and accept the offerings if the auguries were auspicious. I was told that one wasn't so much as to touch the presses, as the pressmen would know and blight your life forever after with curses and imprecations.
-
Cheers,
Puddin'
A tender heart is an asset to an editor: it helps us be ruthless in a tactful way.
--- The Chicago Manual of Style
always impressed...
you continue to amaze me with the depth of your knowledge on so many things!
not as think as i smart i am
Colors and Fonts? I think there is a font in the church, maybe?
I am going to look around this thread more, but meanwhile I will also stick in my four ha-penny also.
How I did this title
For titles I use the tool above the body block in the create fiction editor. That tool is the H icon, H being for headline and it puts a line of code at where the curser had been in your story.
The line looks like: <strong><font face='verdana,arial,geneva,sanserif' size='6' color='#A05'> How I did this title </font></strong>
At times I will change the first Font using one from MS-word, I just delete and retype with my first choice.
eg. 'verdana,arial,geneva,sanserif' becomes 'Algerian,arial,geneva,sanserif'
As for color I use a HTML Color Code Matching Chart that I found by using those five words in my search engine. I find my color and highlight the hex code for it, then copy and paste in place of the prior #A05 part of that headline piece of code.
eg. color='#A05' becomes color='#0fff00' which will do a second conversion when you preview and submit, becoming a nice green.
I Think Someone Pointed It Our...
...but the word you typed as "Ariel" is showing up onscreen in the default typeface (which isn't Arial on my machine, but something with serifs) because you misspelled it. Both the first and fourth letters should be "a".
Eric
Monospace text?
I want the text in "A House Divided" where the characters are chatting on IM to be in a monospace font. The standard way to do that in HTML is with the <kbd> element, but that gets filtered out by the Drupal software. So does the style attribute of the <p> element. Do I have to specify a particular monospace font with the <font> tag, and have it fail on machines that don't have that particular font installed, or is there a better way to do it?
---
http://www.smashwords.com/profile/view/trismegistusshandy
http://shifti.org/wiki/User:Trismegistus_Shandy
Monospace text
That works for me.That tip will definitely come in useful sometime. Thanks!
Penny