Styleguide
mercredi 9 mai 2012
Un guide de style ou styleguide est un ensemble de normes pour l'écriture et la conception de documents, que ce soit pour un usage général ou pour une publication, organisation spécifique ou dans un domaine. La mise en œuvre d'un guide de style procure une uniformité dans le style et le formatage d'un document. (Wikipédia)
Depuis un certain temps, j'avais envi de faire un guide de style pour mon site afin de pouvoir rassembler et documenter les styles que j'utilise plus ou moins fréquemment. En effet, il m'arrive souvent de créer un jeu de styles spécifiques pour un truc en particulier, et de devoir le réutiliser des mois bien après. Parfois même il m'est même arrivé de dupliquer des styles... Ainsi, un styleguide est très pratique pour :
- Présenter tous les styles disponibles ;
- Documenter l'utilisation des styles et du HTML qui va avec ;
- Faire une sorte de plate-forme de test, permettant de faire la comparaison d'affichage sur plusieurs navigateurs ;
- Conserver une trace dans le temps de ce qui a été fait, notamment en signalant les classes dépréciées.
Ce guide est inspiré par l'article Style Guide sur A List Apart.
Ce document est un guide pour l'utilisation des styles et des balises sur ce site. Pour info, la plupart de ces styles ne sont actifs
que dans la zone de contenu principale du site, qui est désignée en utilisant la classe post-content. Version 3.6 du 02/04/2018.
Sections
Le titre de le page utilise un élément h1 avec la classe post-title.
Le titre seconde juste au dessus utilisé un élément h2, qui doit être utilisé pour tous les sous-titres du document.
Il est possible d'en utiliser plusieurs par page.
Les classes chapter, astuce et step permettent d'afficher un sur-titre en petit,
comprenant une numérotation spécifique.
Chapitre
Astuce
Etape
En-tête de 3ème niveau
Le titre du dessus est un h3, qui doit être utilisé pour les sous-titres à l'intérieur d'un h2 dans la hiérarchie du document.
En-tête de 4ème niveau
Le titre du dessus est un h4, qui doit être utilisé pour les sous-titres à l'intérieur d'un h3 dans la hiérarchie du document.
En-tête de 5ème niveau
Le titre du dessus est un h5, qui doit être utilisé pour les sous-titres à l'intérieur d'un h4 dans la hiérarchie du document.
En-tête de 6ème niveau
Le titre du dessus est un h6, qui doit être utilisé pour les sous-titres à l'intérieur d'un h5 dans la hiérarchie du document.
Groupement de contenu
Paragraphes
Tous les paragraphes doivent être entourés par des balises p. Les éléments p peuvent eux-même être insérés entre des balises
blockquote.
Blocs de citations
Les éléments blockquote représentent une section qui cite une autre source. Historiquement, les balises blockquote ont été
utilisée pour forcer le retour à la ligne, mais ce n'est pas valide syntaxiquement.
Many forms of Government have been tried, and will be tried in this world of sin and woe. No one pretends that democracy is perfect or all-wise. Indeed, it has been said that democracy is the worst form of government except all those other forms that have been tried from time to time.
Winston Churchill, in a speech to the House of Commons. 11th November 1947
De plus,vous pouvez indiquer la source de la citation, comme dans l'exemple précédent. La méthode valide utilise la balise cite à l'intérieur de la balise blockquote.
Il est aussi possible de lier la citation à la source en utilisant l'attribut cite de la balise blockquote, même si aucun navigateur n'utilise cette information
pour le moment.
Séparateur horizontal
L'élément hr représente une césure dans un ensemble de paragraphes. Par exemple, le changement d'une scène dans un script, ou une transition entre deux
sujets au sein d'une même section.
Exemple de hr par défaut:
Exemple de hr avec la classe clb:
Exemple de hr avec un attribut title:
Texte Préformaté
L'élément pre représente un bloc de text au formatage spécifique, où la structure du texte est représentée par les éléments de typographie (espaces,
tabulations, retours à la lignes, ...) plutôt que par les éléments HTML. Par exemple, il sert à représenter des emails (où les paragraphes sont séparés par des
lignes vides, et les lignes des listes commencent par un tiret); les morceaux de codes informatiques (où la structure repose sur les conventions du langage); ou
pour afficher du texte en ASCII.
Voici un exemple des caractères ASCII imprimables:
! " # $ % & ' ( ) * + , - . /
0 1 2 3 4 5 6 7 8 9 : ; < = > ?
@ A B C D E F G H I J K L M N O
P Q R S T U V W X Y Z [ \ ] ^ _
` a b c d e f g h i j k l m n o
p q r s t u v w x y z { | } ~
Listes ordonnées
L'élément ol représente une liste ordonnée, où chaque élément comporte un numéro. Il y a plusieurs shémas de numérotations directement en CSS
(comme 1,2,3… a,b,c… i,ii,iii… et d'autres). Chaque item doit être entouré par les tags <li> et </li>, qui indique chaque item de la liste.
Par défaut, la numérotation est automatique et est relative à chaque liste :
- This is an ordered list.
-
This is the second item, which contains a sub list
- This is the sub list, which is also ordered.
- It has two items.
- This is the final item on this list.
Pour que la numérotations continue de manière récursive, il faut ajouter la classe num à la balise ol initiale :
- This is an ordered list.
-
This is the second item, which contains a sub list
- This is the sub list, which is also ordered.
- It has two items.
- This is the final item on this list.
Dans ce cas, la numération est réinitialisée par les balises de heading h1, h2, h3, h4,
h5 et h6; ainsi que par les billets (classe .post).
Enfin, pour certaines listes, la numérotation en chiffres romains peut être utilisé en ajoutant la classe roman à la balise ol initiale :
- This is an ordered list.
-
This is the second item, which contains a sub list
- This is the sub list, which is also ordered.
- It has two items.
- This is the final item on this list.
Listes non-ordonnées
Les éléments ul représentent des listes sans numerotations (par exemple une liste d'items à puces). Comme la liste ol, chaque item
doit être entouré par les balises <li> et </li>.
-
United Kingdom of Great Britain and Northern Ireland:
- England
- Scotland
- Wales
- Northern Ireland
- Republic of Ireland
- Isle of Man
-
Channel Islands:
- Bailiwick of Guernsey
- Bailiwick of Jersey
Les éléments de listes li peuvent contenir des paragraphes ou des citations.
-
The British Isles is an archipelago consisting of the two large islands of Great Britain and Ireland, and many smaller surrounding islands.
-
Great Britain is the largest island of the archipelago. Ireland is the second largest island of the archipelago and lies directly to the west of Great Britain.
-
The full list of islands in the British Isles includes over 1,000 islands, of which 51 have an area larger than 20 km2.
Liste de définitions
Les listes de définitions dl servent à faire une énumération des termes dt (Definition Term) et de leurs définitions dd (Definition
description) qui vont de paire. Bien que l'élément dl signifie “definition list”, il peut être utilisé dans d'autres situations où il est possible
de mettre en relation parent/enfant. Par exemple, pour mettre en place une discution, chaque balise dt contiendra le nom du locuteur, et chaque balise
dd contient le contenu du dialogue.
- This is a term.
- This is the definition of that term, which both live in a
dl. - Here is another term.
- And it gets a definition too, which is this line.
- Here is term that shares a definition with the term below.
- Here is a defined term.
dtterms may stand on their own without an accompanyingdd, but in that case they share descriptions with the next availabledt. You may not have addwithout a parentdt.
Figures
Les figures sont le plus souvent des images qui viennent illustrer le contenu d'une page. Le fait d'en faire des figures permet d'y faire références dans le texte, pour que le lecture puisse s'y reporter. Les figures peuvent aussi être des tableaux, des listes, ou n'importe quel élémént.
.jpg)
Titre de la figure
Une légende peut être ajoutée à la figure pour l'expliquer.
Balises en ligne
Il y a plusieurs balises HTML qui se mettent en ligne à l'intérieur de n'importe quel élément.
Liens et ancres
L'élément a permet de faire des liens hypertextes vers une autre page, une partie du document (ancre) ou n'importe quel ressource
sur le Web.
Go to the home page or return to the top of this page.
Les liens externes sont signalés par une petite icône : Exemple. Si le lien pointe vers Wikipédia, l'icône représente un petit point d'interrogation : Exemple.
En fonction de l'extension du fichier pointé par le lien, un libellé s'ajoute automatiquement pour les fichies PDF au mouseover : Exemple de lien vers un fichier Adobe Reader.
Emphase
La balise em permet de mettre une portion de texte en emphase, par exemple quelque chose qui est dit de manière appuyée. Il ne faut pas
utiliser cette balise uniquement pour mettre le texte en italique, c'est à dire uniquement de manière visuelle. Pour cela, il faut utiliser la balise
i. La balise em a un sens sémantique. Exemple:
You simply must try the negitoro maki!
Important
La balise strong est utilisée pour indiquer qu'une portion de texte est importante. Pour simplement mettre un texte en gras
sans lui apporter une importe syntaxique, il vaut mieux utiliser la balise b. Exemple:
Don’t stick nails in the electrical outlet.
Petits caractères
La balise small est utilisée pour représenter les avertissements, les mises en garde, les restrictions légales ou de droits d'auteur (qu'on désigne communément par ‘small print’). Il peut aussi être utilisé pour attributer un contenu à ses auteurs, ou bien pour spécifier la licence appliquable au contenu. Exemple:
Copyright © 1922-2011 Acme Corporation. All Rights Reserved.
Text barré
L'élément s est utilisé pour indiqué visuellement qu'une portion de texte ne fait plus partie du document. Il s'agit d'une représentation visuelle,
pour indiquer qu'une partie de texte a été supprimé logiquement, il faut utiliser la balise del à la place. Exemple:
Recommended retail price: £3.99 per bottle
Now selling for just £2.99 a bottle!
Extrait
L'élément cite est utilisé pour représenter le titre d'un ouvrage (Ex: un livre, un essai, un poême, une chanson, un film, etc...)
dans une citation. Example:
Universal Declaration of Human Rights, United Nations, December 1948. Adopted by General Assembly resolution 217 A (III).
Citations en lignes
L'élément q est utilisé pour indiquer une citation en sein d'une phrase. Cet exemple montre comment on peut imbriquer les citations:
John said, I saw Lucy at lunch, she told me
Mary wants you to get some ice cream on your way home
. I think I will get some at Ben and Jerry’s, on Gloucester Road.
Définition
L'élément dfn est utilisé pour expliquer un terme lors de sa première occurence. L'attribut title peut être
utilisé pour expliquer le terme. Exemple:
Bob’s canine mother and equine father sat him down and carefully explained that he was an allopolyploid organism.
Abbreviation
L'élément abbr est utilisé pour donner la définition d'un terme abbrévié, lorsqu'il s'agit d'un signe, d'un acronyme. Généralement, il est plus simple
de donner la définition de la première occurence du terme et de ne pas le faire pour les suivantes. Le texte inscrit dans l'attribut title sera affiché
si l'utilisateur passe son curseur au dessus (malheureusement cela ne fonctionne pas sur les anciennes versions d'Internet Explorer). Exemple :
BBC, HTML, and Staffs.
Heure
L'élément time permet de représenter un temps sur une horloge à 24 heures, ou une date précise dans le calendrier Grégorien (passée ou future).
Queen Elizabeth II was proclaimed sovereign of each of the Commonwealth realms on and , after the death of her father, King George VI.
Code source
Ce site utilise la librairie JavaScript SyntaxHighlighter pour afficher les codes sources avec la coloration syntaxique.
html { height: 100%; font-size: 100%; -webkit-text-size-adjust: 100%; }
Plusieurs brushes sont disponibles : css, js, html, xml, php.
Variable
L'élément var permet d'indiquer une variable mathématique ou informatique. C'est aussi un moyen d'indiquer un emplacement où le contenu sera remplacé
par une valeur propre calculée. Exemple :
If there are n pipes leading to the ice cream factory then I expect at least n flavours of ice cream to be available for purchase!
Sortie de programme
L'élément samp est utilisé pour afficher la sortie d'un programme ou d'un système informatique. Utilisé principalement sur les sites de nouvelles
technologies ou de programmation. Sinon, ce n'est pas particulièrement utile. Exemple :
The computer said Too much cheese in tray two but I didn’t know what that meant.
Touche de clavier
L'élément kbd permet d'indiquer des touches de clavier que l'utilisateur doit utiliser pour effectuer une opération précise. Exemple:
To take a screenshot on your Mac, press ⌘ Cmd + ⇧ Shift + 3.
Indice et exposant
L'élément sup représente une portion de texte en exposant, alors que le texte en indice est associé à la balise sub. Ces éléments doivent
être uniquement utilisés pour indiquer une signification spécifique (Ex: mathématiques) et non pour modifier la représentation typographique. Pour faire le distinguo,
il ne faut utiliser cet élément que si son absence modifie le sens du contenu. Exemple :
The coordinate of the ith point is (xi, yi). For example, the 10th point has coordinate (x10, y10).
f(x, n) = log4xn
Italique
L'élément i est utilisé pour représenter une portion de texte qui doit être interprété avec une voix ou une humeur différente. Il peut aussi
être utilisé pour bien identifier des termes spécifiques, comme des indications de taxonimie, des termes techniques, des phrases idiomatiques une autre langue
que celle du document, ou pour représenter du texte qui doit spécifiquement être présenté en italique.
Ce logo fait un peu cheap non?
Gras
L'élément b est utilisée pour du texte stylistiquement décalée par rapport à la prose normale, sans pour autant indiquer une importance particulière, comme les mots clés dans un résumé de document, les noms de produits dans une revue, ou d'autres textes dont la présentation typographique est généralement mise en gras.
Vous entrez dans une pièce petite et sombre. Votre épée se met à briller. Un rat se précipite derrière un mur.
Texte surligné ou mis en avant
L'élément mark est utilisée pour représenter une série de texte marqué ou mis en évidence à des fins de référence. Lorsqu'il est utilisé dans une citation, il indique un point culminant par rapport au contexte acutel, destiné à attirer l'attention du lecteur sur cette partie du texte. Lorsqu'il est utilisé dans la prose principal d'un document, il indique une partie du document qui a été mis en évidence en raison de sa pertinence par rapport à l'action de l'utilisateur.
I also have some kittens who are visiting me these days. They’re really cute. I think they like my garden! Maybe I should adopt a kitten.
Pour mettre des éléments en avant visuellement mais pas syntaxiquement (Highlight), il est possible d'utilise la classe hl (sur un élément span de préférence).
Attention de bien placer la face inférieure sur le support papier.
Editions
L'élément del est utilisé pour représenter le texte supprimé ou rétractée qui doit encore rester sur la page pour une raison quelconque.
Son homologue, l'élément ins, est utilisé pour représenter le texte inséré, à la place ou non. Les deux éléments del et ins peuvent avoir un attribut datetime, qui permet d'inclure un horodatage directement dans l'élément. Le format de date est YYYY-MM-DDThh:mm:ssTZD.
Elle a apporté deux six paires de chaussures.
Références
A l'image de Wikipédia, il est possible de faire des références dans le contenu de la page, et ce pour indiquer la source d'une information ou pour faire un lien vers du contenu supplémentaire en rapport avec la référence.
Ducatillon indique dans une autre conférence1 que 850 c'est le nombre de l'atome de Silice. Premièrement, l'atome c'est le Silicium, ensuite il ne porte ABSOLUMENT pas le numéro 850 dans AUCUNE classification. Le nombre 850 n'apparait MÊME PAS sur la page Wikipédia2, ni sur la Britannica Encyclopedia ! Je ne vois vraiment pas d'où ce nombre provient.
- ↑ Retranscription d'une conférence sur la PMT faite par Ducatillon en 2005, en ligne sur net.addr.com Copie
- ↑ Article Wikipédia sur le Silicium.
Tableaux
Les tableaux doivent être utilisés lors de l'affichage des données tabulaires. Les éléments thead, tbody et tfoot correspondent respectivement à l'en-tête, le corps et le pied du tableau, et permettent de regrouper les lignes au sein de chaque table.
L'élément caption peut aussi être ajouté dans un tableau pour définir un titre. Il est aussi possible d'englober le tableau dans une figure.
Par défaut, les tableaux ne sont quasiment pas mis en formes :
| Name | API | |
|---|---|---|
| John | j.dorian@sh.com | V2.0 |
| Ted | ted@sh.com | V2.2 |
| Marc | m.patt@sh.com | V2.0 |
La classe api-js-table peut être utilisée sur les tableaux pour qu'ils représentent des données
d'interfaces API pour des librairies en JavaScript.
| Paramètre | Type | Description |
|---|---|---|
| success | function(Position) | Une fonction appelée en cas de succès de la géolocalisation. Le paramètre contient les données de géolocalisation. Pour plus de détails, voir cette section. |
| error | function(PositionError) | Une fonction appelée en cas d'erreur lors du processus de géolocalisation. Pour plus de détails, voir cette section. |
| options | PositionOptions | Un objet contenant la configuration. Pour plus de détails, voir cette section. |
La classe receipt permet d'avoir la mise en forme suivante :
| Ingredients | Serves 12 | Serves 24 |
|---|---|---|
| Milk | 1 quart | 2 quart |
| Cinnamon Sticks | 2 | 1 |
| Vanilla Bean, Split | 1 | 2 |
| Cloves | 5 | 10 |
| Mace | 10 blades | 20 blades |
| Egg Yolks | 12 | 24 |
| Cups Sugar | 1 ½ cups | 3 cups |
| Dark Rum | 1 ½ cups | 3 cups |
| Brandy | 1 ½ cups | 3 cups |
| Vanilla | 1 tbsp | 2 tbsp |
| Half-and-half or Light Cream | 1 quart | 2 quart |
| Freshly grated nutmeg to taste |
Le tableau précédent montre aussi comment utiliser l'élément colgroup pour mettre en forme l'intégralité des cellules d'une colonne, sans avoir à répéter les styles pour chacunes. Attention, son utilisation n'est pas recommandée en
raison du fait que cela ajoute du code HTML de mise en forme, alors que c'est déconseillé par le paradigme de séparation des données et de la mise en forme. Néanmoins, cet élément peut
servir dans certains cas particulier où les styles sont une forme de données.
Enfin, la classe data peut être utilisée pour représenter des tableaux de données standards :
| Age | Date | Item |
|---|---|---|
| 21 | 06/11/05 | Self |
| January | 10/05/07 | Parent |
Portée des en-têtes
L'attribut scope qui s'applique aux éléments th (ainsi qu'aux td mais ce n'est pas recommandé) permet de spécifier comment les cellules d'en-têtes (th) sont associées aux données.
C'est principalement dans le cas où l'en-tête s'applique à une ligne. Notez que les navigateurs prennent en compte cet attribut mais ne l'indiquent pas visuellement.
| Month | Savings | |
|---|---|---|
| 1 | January | $100 |
| 2 | February | $80 |
Formulaires
Les formulaires peuvent être utilisés lorsque vous souhaitez recueillir des données des utilisateurs. L'élément fieldset vous permet de mettre en relation des champs du formulaire, et chacun devra avoir un attribut legend correspondant. L'élément label permet de donnéer une description à un champs, et d'assurer la relation avec le composant graphique du champ.
Par défaut, les fieldset n'ont pas de mise en forme particulière contraitement à ce qui se produit normalement sur les navigateurs.
En raison principalement du fait qu'il s'agisse d'une association logique entre plusieurs champs. Pour que le fieldset s'affiche
avec les styles habituels, il faut utiliser la classe legended et utiliser un legend :
Snippets
Plusieurs effets et comportements sont disponibles.
Le mode « Lightroom »
Le mode lightroom permet de visionner une image sur un fond noir. Cette petite fonctionnalité s'utilise sur les images
en rajouant la classe lightroom-effect. Une petite icône représentant une ampoule (
)
s'affiche à côté de l'image et permet de switcher entre le mode lightroom et le mode normal.
Le lien avec l'ampoule sera automatiquement rajouté au parent le plus proche de l'image, à l'exception des liens:
Smooth Galerie
Pour intégrer facilement une galerie d'image à défilement, il faut utiliser la classe smooth-gallery.
Microstyles
La classe todo indique les éléments qui ne sont pas terminés, à traduire, ou en construction. Par exemple : Traduire en Anglais.
Les classes deltaUp et deltaDown permettent afficher des progressions. Par exemple : +5 et -3.
Pour insérer du texte dans un paragraphe, l'élément ins doit être utilisé. Par défaut, le text à l'intérieur des balises est inséré directement.
Pour que le texte inséré le soit entre crochets, utiliser la classe comp. Exemple : C'est le cas notamment de la restauration d'un système, ou le clonage sur différents postes.
Pour masquer du texte, utiliser la classe pwd : le contenu ne sera lisible que si le texte est sélectionné
à la souris par l'utilisateur. Exemple: La réponse est ... rouge !
Pour le positionnement des images, les classes imgLeft et imgRight sont assez explicites : elles permettent de fixer
les images à droite ou à gauche en float.
Videos
<script language="javascript" type="text/javascript" src="videoplayer/swfobject.js"></script>
<div id="video1"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</div>
<script type="text/javascript">
var s1 = new SWFObject("videoplayer/player.swf","ply","640","480","9","#FFFFFF");
s1.addParam("allowfullscreen","true");
s1.addParam("allowscriptaccess","always");
s1.addParam("flashvars","file=http://evolya.free.fr/public/video.flv&image=http://evolya.free.fr/public/video.jpg");
s1.write("video1");
</script>
Dialog speech bubbles
Oh non ça sent l’UML ça…
Et oui petite salamandre !
Orientation du pointeur triangle :
Tests A/B
Un système de test A/B est mis en place sur ce site pour permettre de tester deux versions. Voici le code HTML pour mettre en place un test :
<div id="abtestN" class="abtest"></div>
<script type="text/javascript">
window["_ga_delegateTrackPageView"] = true;
$("#abtestN").load(
"//blog.evolya.fr/proxy.wg.json.php?w=abtest&id=N&ts="
+ new Date().getTime(),
function () { ga_trackPageView(true); }
);
</script>
Parts of this markup guide attributable to Dave Shea, and licensed under a Creative Commons License.
Commentaires
I was curious if you ever thought of changing the layout of your blog?
Its very well written; I love what youve got to say.
But maybe you could a little more in the way of content so people could connect with it better.
Youve got an awful lot of text for only having
one or two pictures. Maybe you could space it out better?
Write more, thats all I have to say. Literally, it seems as though you
relied on the video to make your point. You definitely know what youre talking about,
why throw away your intelligence on just posting videos
to your blog when you could be giving us something enlightening to read?
This is really fascinating, You are an excessively professional blogger.
I've joined your rss feed and stay up for searching for extra of
your great post. Additionally, I have shared your site in my
social networks
I am really loving the theme/design of your web site.
Do you ever run into any browser compatibility issues?
A small number of my blog readers have complained about my blog not operating
correctly in Explorer but looks great in Opera.
Do you have any recommendations to help fix this issue?
I am sure this paragraph has touched all the internet users,
its really really fastidious piece of writing on building up new web site.
Hey there just wanted to give you a quick heads up. The
words in your article seem to be running off the screen in Internet
explorer. I'm not sure if this is a format issue or something to do with web browser compatibility but I thought I'd post to let you know.
The layout look great though! Hope you get the problem solved soon. Many thanks
I needed to thank you for this great read!! I certainly loved every little
bit of it. I have you saved as a favorite to check out new stuff you
post…
Hi there, constantly i used to check blog posts here early in the daylight, for the
reason that i enjoy to gain knowledge of more and more.
You are so awesome! I don't suppose I've truly read through a single thing
like this before. So great to find another person with genuine thoughts on this subject
matter. Seriously.. many thanks for starting this up. This site is one thing that is
needed on the web, someone with a bit of originality!
Hey I am so glad I found your webpage, I really found you by accident, while I was
looking on Yahoo for something else, Anyways I am here
now and would just like to say thank you for
a incredible post and a all round exciting blog (I also love the
theme/design), I don’t have time to browse it
all at the moment but I have bookmarked it and also included your RSS feeds, so when I have time I will be back to
read a lot more, Please do keep up the great b.
Hello there! This blog post couldn't be written any better!
Reading through this article reminds me of my previous
roommate! He always kept talking about this.
I will send this article to him. Pretty sure he'll have a
great read. Many thanks for sharing!
Great beat ! I would like to apprentice while you amend your web site, how can i subscribe for a blog web site?
The account aided me a acceptable deal. I had been tiny
bit acquainted of this your broadcast provided bright clear concept
What's up, of course this piece of writing is really good
and I have learned lot of things from it about blogging.
thanks.
When I originally commented I clicked the "Notify me when new comments are added" checkbox and
now each time a comment is added I get three e-mails with the same comment.
Is there any way you can remove people from that service? Thanks!
Do you mind if I quote a few of your posts as long as I provide credit
and sources back to your webpage? My website is in the very same area of interest as yours and my
users would really benefit from a lot of the information you present here.
Please let me know if this ok with you. Thanks a lot!
Wow, this post is good, my younger sister is analyzing such things, therefore I am going to let know her.
This article will assist the internet visitors for setting up new blog or even a weblog from
start to end.
Please let me know if you're looking for a author for your
site. You have some really good posts and I feel I would be a good asset.
If you ever want to take some of the load off, I'd really like to
write some articles for your blog in exchange for a link back to mine.
Please send me an email if interested. Thanks!