diff --git a/Makefile b/Makefile
index 6fdbbf4..ba40bce 100644
--- a/Makefile
+++ b/Makefile
@@ -1,26 +1,35 @@
 POSTS = $(shell find ./posts -mindepth 1 -type d)
+PAGES = $(shell find ./pages -mindepth 1 -type d)
 
 .PHONY: all
 all:
-	$(MAKE) posts
 	$(MAKE) index
 
 .PHONY: posts
 posts:	
 	for d in $(POSTS); do (echo $$d; cd $$d; $(MAKE) -f ../../m4/posts.mk); done
 
+.PHONY: pages
+pages:	
+	for d in $(PAGES); do (echo $$d; cd $$d; $(MAKE) -f ../../m4/posts.mk); done
+
 .PHONY: clean
 clean:
 	for d in $(POSTS); do (cd $$d; $(MAKE) -f ../../m4/posts.mk cleanposts); done
+	for d in $(PAGES); do (cd $$d; $(MAKE) -f ../../m4/posts.mk cleanposts); done
 	-rm -f toc.inc
 	-rm -f abstracts.inc
 	-rm -f index.html
 
 .PHONY: index
-index:
+index: posts pages
 	-rm -f toc.inc
 	-rm -f abstracts.inc
+	for d in $(PAGES); do (cd $$d; m4 -D URL=$$d/article.html ../../m4/macros.m4 article.m4 ../../m4/indexTOCEntry.m4) >> toc.inc; done
 	for d in $(POSTS); do (cd $$d; m4 -D URL=$$d/article.html ../../m4/macros.m4 article.m4 ../../m4/indexTOCEntry.m4) >> toc.inc; done
 	for d in $(POSTS); do (cd $$d; m4 -D URL=$$d/article.html ../../m4/macros.m4 article.m4 ../../m4/indexAbstractsEntry.m4) >> abstracts.inc; done
 	m4 ./m4/macros.m4 index.m4 > index.html
 
+.PHONY: install
+devinstall: index
+	rsync -av --delete . /var/www/html
\ No newline at end of file
diff --git a/abstracts.inc b/abstracts.inc
new file mode 100644
index 0000000..4a44ff3
--- /dev/null
+++ b/abstracts.inc
@@ -0,0 +1,23 @@
+
+
+
+
+
+
+
+<p>
+<h3>2013-06-26 - A Web-controlled Picture Frame</h3>
+A father-and-son weekend project with an Arduino, a stepper motor and a couple of family photos.<br/>
+<a href="./posts/2013-06-26.01/article.html">read more</a>
+</p>
+
+
+
+
+
+
+<p>
+<h3>2013-06-27 - Children Protection for Postfix-based EMail-Server</h3>
+<br/>
+<a href="./posts/2013-06-27.01/article.html">read more</a>
+</p>
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..ec3ebfb
--- /dev/null
+++ b/index.html
@@ -0,0 +1,71 @@
+
+
+
+
+<html>
+  <head>
+    <title>my homepage</title>
+  </head>
+  <body>
+
+
+<h1>Projects - just for fun</h1>
+
+<h2>Overview</h2>
+<ul>
+
+
+
+
+<li> - <a href="./pages/impressum/article.html">Impressum</a></li>
+
+
+
+
+<li> - <a href="./pages/keys/article.html">Keys</a></li>
+
+
+
+
+
+
+
+<li>2013-06-26 - <a href="./posts/2013-06-26.01/article.html">A Web-controlled Picture Frame</a></li>
+
+
+
+
+
+
+<li>2013-06-27 - <a href="./posts/2013-06-27.01/article.html">Children Protection for Postfix-based EMail-Server</a></li>
+
+</ul>
+
+<h2>Abstracts</h2>
+
+
+
+
+
+
+
+<p>
+<h3>2013-06-26 - A Web-controlled Picture Frame</h3>
+A father-and-son weekend project with an Arduino, a stepper motor and a couple of family photos.<br/>
+<a href="./posts/2013-06-26.01/article.html">read more</a>
+</p>
+
+
+
+
+
+
+<p>
+<h3>2013-06-27 - Children Protection for Postfix-based EMail-Server</h3>
+<br/>
+<a href="./posts/2013-06-27.01/article.html">read more</a>
+</p>
+
+
+  </body>
+</html>
diff --git a/index.m4 b/index.m4
index a76cb0b..94d3e88 100644
--- a/index.m4
+++ b/index.m4
@@ -1,9 +1,12 @@
 HEADER
 
+<h1>Projects - just for fun</h1>
+
+<h2>Overview</h2>
 <ul>
 include(`toc.inc')
 </ul>
 
-
+<h2>Abstracts</h2>
 include(`abstracts.inc')
 FOOTER
\ No newline at end of file
diff --git a/m4/indexAbstractsEntry.m4 b/m4/indexAbstractsEntry.m4
index 8d35209..3d63b6c 100644
--- a/m4/indexAbstractsEntry.m4
+++ b/m4/indexAbstractsEntry.m4
@@ -1,5 +1,5 @@
 <p>
-<h3>TITLE</h3>
+<h3>DATE - TITLE</h3>
 ABSTRACT<br/>
-<a ref="URL">read more</a>
+<a href="URL">read more</a>
 </p>
diff --git a/m4/indexTOCEntry.m4 b/m4/indexTOCEntry.m4
index 90ee57a..3807782 100644
--- a/m4/indexTOCEntry.m4
+++ b/m4/indexTOCEntry.m4
@@ -1 +1 @@
-<li><a ref="URL">TITLE</a></li>
+<li>DATE - <a href="URL">TITLE</a></li>
diff --git a/m4/macros.m4 b/m4/macros.m4
index d66c1e5..1627a06 100644
--- a/m4/macros.m4
+++ b/m4/macros.m4
@@ -9,4 +9,5 @@ define(`FOOTER', `
   </body>
 </html>
 ')
-define(`ABSTRACT', `')
\ No newline at end of file
+define(`ABSTRACT', `')
+define(`DATE', `')
\ No newline at end of file
diff --git a/pages/impressum/article.html b/pages/impressum/article.html
new file mode 100644
index 0000000..e4b58d9
--- /dev/null
+++ b/pages/impressum/article.html
@@ -0,0 +1,26 @@
+
+
+
+
+
+<html>
+  <head>
+    <title>my homepage</title>
+  </head>
+  <body>
+
+
+Wolfgang Hottgenroth
+
+woho@hottis.de
+
+<a href="https://gitlab.com/wolutator">https://gitlab.com/wolutator</a>
+
+<a href="https://www.xing.com/profile/Wolfgang_Hottgenroth">https://www.xing.com/profile/Wolfgang_Hottgenroth</a>
+
+<a href="https://twitter.com/wollud1969">https://twitter.com/wollud1969</a>
+
+
+  </body>
+</html>
+
diff --git a/pages/impressum/article.m4 b/pages/impressum/article.m4
new file mode 100644
index 0000000..529aff6
--- /dev/null
+++ b/pages/impressum/article.m4
@@ -0,0 +1,12 @@
+define(`TITLE', `Impressum')
+define(`CONTENT', `
+Wolfgang Hottgenroth
+
+woho@hottis.de
+
+<a href="https://gitlab.com/wolutator">https://gitlab.com/wolutator</a>
+
+<a href="https://www.xing.com/profile/Wolfgang_Hottgenroth">https://www.xing.com/profile/Wolfgang_Hottgenroth</a>
+
+<a href="https://twitter.com/wollud1969">https://twitter.com/wollud1969</a>
+')
\ No newline at end of file
diff --git a/pages/keys/article.html b/pages/keys/article.html
new file mode 100644
index 0000000..70d5ac7
--- /dev/null
+++ b/pages/keys/article.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+<html>
+  <head>
+    <title>my homepage</title>
+  </head>
+  <body>
+
+
+My public keys.
+
+
+  </body>
+</html>
+
diff --git a/pages/keys/article.m4 b/pages/keys/article.m4
new file mode 100644
index 0000000..6bb9956
--- /dev/null
+++ b/pages/keys/article.m4
@@ -0,0 +1,4 @@
+define(`TITLE', `Keys')
+define(`CONTENT', `
+My public keys.
+')
\ No newline at end of file
diff --git a/posts/2013-06-26.01/article.html b/posts/2013-06-26.01/article.html
new file mode 100644
index 0000000..4e5e663
--- /dev/null
+++ b/posts/2013-06-26.01/article.html
@@ -0,0 +1,57 @@
+
+
+
+
+
+
+
+
+<html>
+  <head>
+    <title>my homepage</title>
+  </head>
+  <body>
+
+
+<h2>Ingredients:</h2>
+<ul>
+	<li><span style="line-height:14px;">an Arduino Ethernet board</span></li>
+	<li>a small stepper motor</li>
+	<li>a double full-H-bridge to drive the stepper</li>
+	<li>a reflexion sensor with LED and photo transistor</li>
+	<li>some plywood</li>
+	<li>four photos of your loved ones</li>
+	<li>a black self-adhesive plastic film</li>
+	<li>the <a href="http://code.google.com/p/webduino/" target="_blank">webduino library</a> from the Arduino homepage</li>
+	<li>the <a href="http://www.arduino.cc/playground/Code/Metro" target="_blank">Metro library</a> from the Arduino homepage</li>
+</ul>
+<a href="http://a385e-5.de/wp-content/uploads/2013/06/Foto-2.jpg"><img class="alignnone size-medium wp-image-20" alt="Foto 2" src="http://a385e-5.de/wp-content/uploads/2013/06/Foto-2-224x300.jpg" width="224" height="300" /></a>
+
+&nbsp;
+
+The Arduino drives via the double full-H-bridge the stepper to turn 90° three times, 15 minutes between each turn. The fourth time, to complete the 360° full turnaround, its drives the stepper until ...
+
+<a href="http://a385e-5.de/wp-content/uploads/2013/06/Foto-4.jpg"><img class="alignnone size-medium wp-image-24" alt="Foto 4" src="http://a385e-5.de/wp-content/uploads/2013/06/Foto-4-224x300.jpg" width="224" height="300" /></a>
+
+&nbsp;
+
+the white mark arrives of the reflexion light sensor.
+
+This mark and the photos on the other side of the round piece of plywood have to be adjusted carefully, that way, that one photo appear in a window in the frontside of the wooden box.
+
+<a href="http://a385e-5.de/wp-content/uploads/2013/06/Foto-3.jpg"><img class="alignnone size-medium wp-image-22" alt="Foto 3" src="http://a385e-5.de/wp-content/uploads/2013/06/Foto-3-224x300.jpg" width="224" height="300" /></a>
+
+&nbsp;
+
+(Consider the photos of your loved ones where you see colored rectangles above.)
+
+Thats it. Code is here <a href="http://files.a385e-5.de/files/Bilderrahmen-0.9.tar.gz">http://files.a385e-5.de/files/Bilderrahmen-0.9.tar.gz</a>
+
+&nbsp;
+
+&nbsp;
+'
+
+  </body>
+</html>
+
diff --git a/posts/2013-06-26.01/article.m4 b/posts/2013-06-26.01/article.m4
index f7a6f0c..3b90b2c 100644
--- a/posts/2013-06-26.01/article.m4
+++ b/posts/2013-06-26.01/article.m4
@@ -1,5 +1,6 @@
 define(`TITLE', `A Web-controlled Picture Frame')
 define(`ABSTRACT', `A father-and-son weekend project with an Arduino, a stepper motor and a couple of family photos.')
+define(`DATE', `2013-06-26')
 define(`CONTENT', `
 <h2>Ingredients:</h2>
 <ul>
diff --git a/posts/2013-06-27.01/article.html b/posts/2013-06-27.01/article.html
new file mode 100644
index 0000000..cb3ec4e
--- /dev/null
+++ b/posts/2013-06-27.01/article.html
@@ -0,0 +1,61 @@
+
+
+
+
+
+
+
+<html>
+  <head>
+    <title>my homepage</title>
+  </head>
+  <body>
+
+
+This small tool implements a whitelist on a Postfix mail-server. It prevents certain recipient addresses (your kids ones) from receiving mail from any not whitelisted address. Any mail from not whitelisted senders is redirected to a delegate (a parent).
+
+Code is here <a href="http://files.a385e-5.de/files/ChildProt-0.9.tar.gz">http://files.a385e-5.de/files/ChildProt-0.9.tar.gz</a>
+
+Configure it by adding this line into the <em>master.cf</em> of the Postfix installation:
+<pre>childprot unix  -       n       n       -       25      spawn user=mail argv=/opt/sbin/ChildProt</pre>
+and this to the <em>main.cf</em>:
+<pre class="brush: text; gutter: false">smtpd_recipient_restrictions =
+  [...]
+  check_policy_service unix:private/childprot
+  [...]</pre>
+The restricted recipients and the whitelists are stored in an SQLite3 database:
+<pre class="brush: sql; gutter: false">CREATE TABLE child_address_t (
+  child INTEGER REFERENCES child_t(id),
+  address TEXT
+);
+
+CREATE TABLE child_t (
+  id INTEGER PRIMARY KEY,
+  name TEXT,
+  delegate TEXT
+);
+
+CREATE TABLE whitelist_t (
+  child INTEGER REFERENCES child_t(id),
+  address TEXT
+);
+
+CREATE VIEW child_v AS
+  SELECT c.id as id,
+         c.delegate as delegate,
+         ca.address as address
+  FROM child_t c,
+       child_address_t ca
+  WHERE c.id = ca.child;</pre>
+Restricted persons together with their delegates are added to the table <em>child_t</em>, multiple addresses can be assigned to those persons in <em>child_address_t</em>. Whitelists per person are maintained in <em>whitelist_t</em>.
+
+The tool is querying the view <em>child_v</em>.
+
+&nbsp;
+
+&nbsp;
+
+
+  </body>
+</html>
+
diff --git a/posts/2013-06-27.01/article.m4 b/posts/2013-06-27.01/article.m4
index 0b69736..1c2caf2 100644
--- a/posts/2013-06-27.01/article.m4
+++ b/posts/2013-06-27.01/article.m4
@@ -1,4 +1,5 @@
 define(`TITLE', `Children Protection for Postfix-based EMail-Server')
+define(`DATE', `2013-06-27')
 define(`CONTENT', `
 This small tool implements a whitelist on a Postfix mail-server. It prevents certain recipient addresses (your kids ones) from receiving mail from any not whitelisted address. Any mail from not whitelisted senders is redirected to a delegate (a parent).
 
diff --git a/toc.inc b/toc.inc
new file mode 100644
index 0000000..d41cc08
--- /dev/null
+++ b/toc.inc
@@ -0,0 +1,25 @@
+
+
+
+
+<li> - <a href="./pages/impressum/article.html">Impressum</a></li>
+
+
+
+
+<li> - <a href="./pages/keys/article.html">Keys</a></li>
+
+
+
+
+
+
+
+<li>2013-06-26 - <a href="./posts/2013-06-26.01/article.html">A Web-controlled Picture Frame</a></li>
+
+
+
+
+
+
+<li>2013-06-27 - <a href="./posts/2013-06-27.01/article.html">Children Protection for Postfix-based EMail-Server</a></li>
