Fine Typography 0.1

Fine Typography is sharp and clear font settings for:

  • Ubuntu font family.
  • Liberation fonts.
  • MS core fonts.


Fine Typography

Fine Typography

It also sets font aliases like this:

  • Sans: refers to ‘Ubuntu’ font.
  • Serif: refers to ‘Georgia’.
  • Monospace: refers to ‘Ubuntu Mono’.
  • Cursive and Fantasy: refer to ‘Elegante’.
  • Arial: refers to ‘Ubuntu’ font.
  • Traditional Arabic: refers to ‘Amiri’ font.

You can download it from here.

Icon Addressing and Naming

The embed fonts technology has paved a new way for web developers to represent icons using characters in the embedded fonts instead of using the regular image formats in the web, such as PNG, GIF… etc, which represents an important step for “icon addressing” in software industry.

This step coincided with another important step as important as its previous one, which is the adoption of Unicode 6.0 for a broad spectrum of visual symbols (icons) and embedding it in its table, which means providing a standard way for icon-addressing.

A few years ago, Tango Icons project have tried to set a standard for icons naming for Linux, in order to be addressed in a standard way. However, I think that Unicode 6.0 now represents a great alternative to be adopted as a standard for addressing the icons within the software process.

New icon naming specifications

New icon naming specifications

RichStyle font represents an attempt to implement the idea of ​​ icons-addressing in the web pages through the Unicode 6.0, but this project revealed a lack of some icons and visual symbols that are not addressed yet by Unicode. These icons are the ones that have a label in this demo page, the most important are: printer, image, tag, FAQ… and others.

RichStyle font represents

The Noun Project + Unicode 6.0 = RichStyle Font!

Finally, a set of essential icons for web pages, stored in a Unicode 6.0 font file.

RichStyle Icons Font (sample)

RichStyle Icons Font (sample)

It was developed for RichStyle project. It includes:

  • Icons from The Noun Project.
  • HTML5 Technology Icons.
    … and much more.

You can take a look to these icons in this demo page, or download it from here.

الخط الأميري

أخيراً أنجب عالم المصادر المفتوحة على يد الدكتور خالد حسني الخط العربي الذي طالما افتقده المستخدم العربي في واحة لينكس. فعلى الرغم من توفر نموذجين في بيئة لينكس حتى الآن للخط النسخي الطباعي الذي لا غنى عنه لكل (طابعة عربية)، وهما خط KacstBook من تطوير مدينة الملك عبد العزيز للعلوم والتقنية، وشهرزاد من معهد SIL، إلا أنهما ظلا دون طموحات رواد الطباعة والخط العربي، نظراً لافتقارهما للتراكبات الغنية التي طالما تغنت بها يد الخطاط العربي.

فيما يلي مقارنة بين الخطوط الثلاثة إلى جانب خط Traditional Arabic المعروف من مايكروسوفت فيما يتعلق بالتراكبات.

تراكبات الخط الأميري

تراكبات الخط الأميري

بقي أن أشير إلى أن هذا الخط لا ينطوي على أي محارف لاتينية، وهو ما يقد يربك المستخدم عند إدراج نصوص لاتينية في سياق نص عربي كتب بالخط الأميري.

نقاط على الحروف العربية، واقع الخط العربي في ظل عصر الحوسبة

لوحة فنية هادئة، متناسقة العناصر والألوان، صادفتني في مكتب أحد العاملين في حقل التصميم الفني والإعلاني، ردت إلي – على تواضعها – شيئاً من الإحساس برونق الخط العربي البديع وسحره، والذي تبدد أو كاد مع زخم التيار التقني الجارف الذي حصد فيما حصد روح الفن البشري في كثير من مناحي الحياة.

الخط العربي…

فن خلدته أوابد الحضارة الإسلامية، وازينت به جنبات المتاحف الغربية، لينتهي به المطاف أسير قوالب تقنية صماء لا روح فيها ولا حياة، تصلبت فيها شرايينه وتيبست فيها أوصاله، فغدا هو الآخر عليلاً بدائها… صورة ميتة لا نبض فيها ولا حياة! Continue reading

Ideas for HTML5

These ideas are outcome of my experience in developing my project RichStyle.

A Unified Label Attribute

Think of using label="" as a unified naming attribute; as an alternative to all naming tags and attribute:

<caption> , <label>, <legend>, alt="", for="", title="", summary="".

Tile text (the mouseover-text) could be displayed using a CSS rule like this:

{ title: attr(label) | attr(accesskey) | attr(label) attr(accesskey) | none }

The standard way for label presentation is to use :before and :after pseudo elements.

Command Representation

<command> should have an href="" attribute (link attribute) as an optional attribute, since a command could be simply a link.

icon="" attribute should be deprecated in favor of CSS icon attribute, which , in turn, should have an additional value called glyph(), e.g.:

command.go_up {icon: glyph(↑)}

And just like <input>, command should accept text as a type beside “command”, “checkbox”, and “radio”:

<command type="text">

Think of “search” and “zoom” fields in a toolbar.

Time Representation

Time, as a tag, should be used as a part of a context in an article or so on, the purpose here is to give the developer enough flexibility in time presentation (time-zone, time format) using CSS.

For articles’ time-stamp, and any other embedded content like
audio, video, or image, there should be two attributes: published, and
modified (last-modification date).

article:time {
	time-format: dd-mm-yyyy;
	time-zone: +5;

A “Window” Tag

Unlike Window object used in JavaScript, such a tag might be easily maintained and customized using CSS like this:

window {
	position: fixed;
	left: 50%;
	top: 50%;
	buttons: close || maximize || minimize;

Standardizing jQuery

jQuery is the most popular alternative to JavaScript, it’s a powerful “meta-language” tries to circumvent the raw-javascript limitations. I think this language should be standardized.

Isolating events from the the HTML code the way CSS does regarding presentation attributes should be enough reason for W3C to adopt it.

RichStyle Software Process

This is a revision of a paper submitted on 27-06-2010 to the Arab Academy for Banking and Financial Sciences.


According to ISO, in order to produce a high quality product, organization needs a high quality producing process, which means a well defined and organized process. Generally speaking, this is true in variant industries, but not in software industry, since production process in software industry is a creative process, not an industrial process, so that one can’t imagine that there are a list of input items from one side, that could produce a software product out of the other one, automatically, without any human factor involvement.

Software Engineering tries to convert software process from a creative process to an industrial process.

As a solution, an ISO-alternative standard emerged for software industry, called CMM, developed by Carnegie Mellon Software Engineering Institute (SEI). Later on it has developed and expanded its scope and cover other industries, it is called now CMMI.

Since 1987, when CMM emerged, CMM/CMMI has been always focusing on documentation. The reason is that organization doesn’t have an automated process, so, all it can do is to organize process using documents.

In fact, as one can see, CMM emerged before web era; the era in which database systems weren’t mature enough and used widely like nowadays, client/server architecture wasn’t common in business world. That’s why CMM/CMMI was always focusing on documents.

The objective of this paper is to build a software process using database, rather than document a software process using documents. Continue reading

Linux vs. Windows, An Abstract View

It’s been a while since I post a paper titled “Linux vs. Windows, Software Engineering Perspective“. Nowadays, when I call it back, I always say that the must important idea out of it was what I can call it an age-old conflict between user’s requirements and developer’s requirements.

I believe that the weight of this conflict in Windows world, comparing to it in Linux world, is the critical factor that lays out the bright Linux future.

Imagine that user’s requirements are represented by just a hot-air-balloon, and developer’s requirements are represented by the basket’s content. Take a look!

Linux vs. Windows

Linux vs. Windows

Believe me, penguin, sometimes, can fly better than a flag! :)

GWrite as a RichStyle Front-End

GWrite, from my point of view, represents the best choice to implement my vision for the perfect word processor; an HTML5/CSS3-powered word processor, as a front-end for RichStyle library.

I’ve developed a custom version of TinyMCE, called rsTinyMCE, as a prototype to illustrate this vision as much as possible.

Things that I couldn’t represent in this prototype, had drawn in the following fake screenshot.

rsTinyMCE: A GWrite prototype

rsTinyMCE: A GWrite prototype

The differences, as you see, are:

  • “Active Languages” combo box: To add lang=”” attribute to any tag or string. RichStyle library will take care of the appropriate font and directionality of the selected language.
  • Views: Screen, Print, Source, Split.

“Find and Replace” fields should appear as a tool bar, not as a pop-up window, just like Firefox.

There’s a discussion on Launchpad about GWrite as an alternative word processor for elementaryOS: