monospaced-font « WordPress.com Tag Feed

inconsolata@CentOS !!

worker — Tue, 30 Oct 2012 06:05:51 +0000

http://levien.com/type/myfonts/inconsolata.html

http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&item_id=OFL_fonts

How beautiful !!!

New Font by Adobe: Source Code Pro

digulla — Thu, 27 Sep 2012 14:02:33 +0000

Some of us know that software not only has to work, it also should be beautiful.

One important aspect here is the font. How does this look:

1Il|iO0oB8

If you can’t tell for sure which character is which, you probably don’t use a good font.

Paul D. Hunt, a font designer working for Adobe, finally spent some time to make life for his fellow developer easier:

As a font developer, I spend a good chunk of each day coding in a text editor and reading output messages from a terminal window, so I can appreciate the importance of a good monospaced font. (source)

If you’re interested in font design, his blog post contains some of the ideas and decisions he made when designing the font. Btw, the text above looks like this in Source Code Pro:

Some potentially confusable characters

You can download the font on Sourceforge or look at the source at GitHub.

You should not use two spaces after a period. Ever.

Mac'N'Cheese Dinner — Wed, 11 Apr 2012 00:42:12 +0000

So, you hit the spacebar after a long day at Spacely Space Sprockets before you inevitably get home

More Minutiae ... Do You Favor One Space, or Two?

Mike Skotnicki — Mon, 13 Feb 2012 19:52:35 +0000

Image via Wikipedia Just as there is a movement to place citations of authority in briefs in footnot

Two spaces are not better than one.

agallantidea — Sun, 10 Apr 2011 14:00:37 +0000

People of Earth, enough with the double spacing at the end of a sentence!

If you learned to type on an actual typewriter, odds are you were taught to put two spaces at the end of a sentence. Why? It has nothing to do with grammar, and everything to do with typefaces and readability.

Back in the days of letterpress, printing text involved a typesetter placing individual letters into words, rows and eventually pages. The reversed letters were then inked, and pressed directly onto the page. (Think a giant, heavy, complicated, metal stamp.) For spaces between words and sentences, they used blank pieces of metal called type slugs. Printers would use larger type slugs between sentences to give an extra visual pause after a period. Everything was fine and dandy until the typewriter came along.

Typewriters used monospaced fonts. Monospaced typefaces are fixed-width. Each character — letters, numbers, punctuation and spaces — takes up the exact same horizontal width. There was concern that typewriter text would be more difficult to read since there was no extra space at the end of a sentence. BAM! LIke that, the double space after a period rule was born. It was an easy fix, problem solved.

This is a monospaced font. See how the letters all line up?

Now enter the computer.

Computers use proportional typefaces. Proportional typefaces automatically adjust the spacing between the letters — called kerning. A proportional typeface will recognize terminal punctuation, like a period, and automatically adjust the spacing.

This is a proportional font. The letters don't line up because the computer is adjusting the space between each character.

Let’s repeat that.

A proportional typeface will recognize terminal punctuation, and automatically adjust the spacing.

In other words, the computer will add extra space at the end of a sentence for you. Putting your own double space at the end of a sentence adds too much space. This stands out like a sore thumb to designers. We either have to go through pages of copy manually removing the spaces or do a blanket find/replace, and hope we don’t seriously jack up your text elsewhere. (Yeah, that’s right. We get rid of your extra spaces anyway.

So please, don’t push a designer to the brink. Unless you’re typing on an old IBM Selectric, stop double spacing at the end of a sentence.

When a font...

sickk — Mon, 18 Oct 2010 16:07:25 +0000

For two hours I didn’t see the font problem: Monospaced Font

Basic HTML Formatting:

alphaorganic — Mon, 22 Jun 2009 00:17:53 +0000

This tutorial will be useful for anyone who does not plan to use CSS to format there web page but is still good practice. But if you are reading this tutorial it is most likely that you are new to web development so I would advice reading through this tutorial which may provide some useful techniques for HTML formatting. For previous lesson click Starting a Web Page in HTML.

[images coming soon]

Lets start with making text bold or italic. To make a text bold type  followed by the text you wish to be bold the close the tag with . To make a text italic type followed by the text you wish to be italic and close the tag with .

Changing the size of the text is pretty simple as well. To make the text bigger or smaller than the surrounding text type <big> or  then type the text you wish to make big or small and close the tag with </big> or . If you want to make a text even bigger or smaller continue with more tags like so, <big><big> or <small> and again close with </big></big> or .

Sometime when creating text in your HTML page you may want to demonstrate that a certain text is a code or monospaced text. To format text with a monospaced font use the opening tags <code>, <tt>, <kbd>, or <samp> followed bu the text you wish to make monospaced and close with the approporiate tag </code>, </tt>, </kbd>, or </samp>. It should look something like this.

This is monospaced font.

Usually browsers collapse all extra returns and spaces and automatically break lines according to the size of the window. To prevent this you can use the preformatted text to enclose a group of text that you would like to display as is. To create a preformatted text type <pre> before and </pre> after the text you wish to preformat.

To quote text there are to special tags, blockquote and inline quote. Blockquote are generally indented by browswers where inline quotes are supposed to be automatically enclosed in quotation marks. To quote block-level text type <blockquote to begin and if desited type cite=”url”, where url is the address of the source of the quote and type > to complete the opening tag. Type the text you whish to appear in the blockquote and close the grouped text with </blockquote>. Here is an example.

Alpha Organic is a creative multimedia design and production shop. We are a small team of independent designers and artists with a lot of talent and a bold new approach to media marketing. Something that sets us apart from the rest is that we specialize in music production and with this particular skill we are able to marry music with interactive media creating fresh and innovative multimedia products all from the same shop!

Alpha Organic has grown from an experimental partnership to a full blown studio capable of taking on the most challenging projects you can imagine. How is this possible you might ask? Following the failed attempt to become rock stars, Adrian Maurer and Tak Yamada from the original partnership, took their passion and skills to the silver screen! This may seem brilliant but the truth is no matter where you make music your still come up broke!

But as it turns out, Adrian has a strong background in business; and on his spare time practices his skills in design and audio/video production. And as for Tak, he is a level 2 “Reiki” practitioner, he is certified in “feng shui”, and best of all he has been working in the communications industry for over 9 years as a flash developer

The truth is, it wasn’t easy going out into the incredibly overpopulated agency world but with a little determination and a fresh approach to our trade, Alpha Organic has helped businesses and artists meet success. In turn we have felt success through the growth of our business and the growth within our team. We are excited to see our small studio grow and are looking forward to our second birthday!!

Inline quotes begin with <q and if desired can include xml:lang=”xx” where xx is the language in which the quote is in. This will help the browser determine what the quotes will look like as for many other langugers ” ” may appear differently. Close the opening tag with > and type the text you wish to quote and close the tag with <q>. If there are further <q> tags nested within another <q> tag the browser will automatically determine whether to use “double curly” or ‘single curly’.

To create superscripts or subscripts around a text type <sup> for supperscript or  for subscript followed by the text you wish to offset and close with  or </sup>. The result should look something like this.

Alpha Organic¹ for superscript and H₂0 for subscript.

Another logical tool for formatting HTML text is by marking it. To mark a text you can either underline it or cross a line through it. To underline a text like so type <ins> before and </ins> after the desired marked text. To cross a text like so type <del> before and </del> after the desired marked text.

Often times you may want to include abbreviations or acronyms in the text of your page which you viewers may not understand. So it may be useful to explain the abbreviations with a title. To explain an abbreviation type <abbr then type title=”explanation” and close the tag with > Next type the abbreviation and close the element with </abbr> This works the same for acronyms which would replace abbr with acronym. Here is an example of an abbreviation.

Put mouse here:
AO

The final basic tool for formatting HTML is centering elements on a page. To center text on your webpage simply open a tag with <center> followed by the text you wish to center and close the tag with </center> The center element can also be applied to an entire div section of your page. To do this following the <div tag type align=”center” and close the tag with >

That concludes this tutorial. Click Images in HTML for next tutorial or click Here for a list of all HTML tutorials.