Archive for the ‘Web’ Category

apache virtual hosts mit ssl unter linux

Dienstag, Februar 2nd, 2010

Es wird immer wichtiger, dass man Daten nicht einfach so durchs Netz schickt, sondern die Daten verschlüsselt transportiert. Die Lösung ist ein apache, mit ssl und verschiedenen virtuellen hosts. Meine Grundidee ist folgende: schnell und einfach https://<dienstname>:<port> zu implementieren. Dazu braucht es natürlich erstmal eine funktionierende apache Installation. Aber das erkläre ich hier sicher nicht! Und wir gehen noch davon aus, dass wir nicht den Standard Port 443 nehmen wollen, sondern einen beliebigen. Das Ziel ist ja mehrere Seiten/ Dienste zu erstellen.

Zuerst kümmern wir uns um die Zertifikate:

  • sucht euch einen beliebigen Ort, z.B. /tmp/test um dort die Zertifikate zu erstellen und erstmal zu speichern
  • und los gehts:
    $ sudo openssl genrsa -des3 -out <name>-ssl-cert-private.key 1024
    

    ihr müsst nichts eingeben, außer dem Passwort und das natürlich gut merken!

  • ok, dann nehmen wir den erstellten Key und erstellen ein ‘certificate request’:
    $ sudo openssl req -new -key <name>-ssl-cert-private.key -out <name>-ssl-cert-file.pem
    
  • und jetzt erstellen wir noch das selbst-signierte Zertifikat:
    $ sudo openssl x509 -req -days 365 -in <name>-ssl-cert-file.pem -signkey <name>-ssl-cert-private.key -out <name>-ssl-server.crt
    
  • jetzt müssen die Zertifikate an den richtigen Ort kopiert werden:
    $ sudo cp <name>-ssl-server.crt /etc/ssl/certs
    
    $ sudo cp <name>-ssl-cert-private.key /etc/ssl/private
    

Das wars auch schon fürs Erste.

(weiterlesen…)

htaccess Links und HowTo

Samstag, Januar 30th, 2010

Hallo,

als Webmaster versucht man stets seine Homepages zu optimieren. Dazu gehört auch der korrekte Umgang einer .htaccess-Datei, v.a. wenn man eben keinen direkten Zugriff auf die Apache Konfiguration hat. Mit einer .htaccess-Datei könnt ihr relativ einfach Konfigurationsvariablen für den zugehörigen Apache Server setzen und einstellen. Dies setzt natürlich voraus, dass der Hoster die Einstellungen, die ihr vornehmen wollt auch selbst in seiner Konfiguration des Apache genehmigt hat. Normalerweise könnt ihr recht viel Einstellungen machen.

Ich will hier aber gar keine große Anleitung schreiben, was ihr alles machen könnt oder was ihr genau bei Wordpress machen solltet, sondern ich will euch ein paar hilfreiche und informative Links zur Verfügung stellen und ihr könnt dann selbst nachlesen, was ihr für sinnvoll haltet.

Ein paar Tipps gebe ich natürlich schon:

  • komprimiert eure Anfragen mit gzip (howto)
  • schützt eure htaccess-Datei & wp-config.php
  • verhindert, dass eure Bandbreite genutzt wird, in dem Bilder von eurer Seite in anderen eingefügt werden
  • versucht zu cachen
  • leitet http://<domain> anfragen an www.<domain> um

Und hier ein paar Links:

Es gibt sicher noch jede Menge Anleitungen, aber zu viel Informationen bringen auch nur Verwirrung. Ich denke mit der obigen Sammlung kann man schon so einiges aus seiner Seite raus holen.

Viel Vergnügen und falls ihr gute Links habt, postet sie in den Kommentaren.

CSS Divs statt Tabelle

Dienstag, Januar 26th, 2010

Hallo,

für diesen kleinen Beitrag könnte es viele Überschriften geben, z.B. Divs richtig anordnen, divs positionieren, divs in divs, divs nebeneinander, etc….

Ich habe schon des öfteren divs in divs benötigt und manchmal auch nebeneinander oder untereinander und so weiter, heute wollte ich euch mal zeigen, wie einfach dies gehen kann.

Hier erstmal der CSS Code:

<style>

#wrapper {
	height: 165px;
	width: 500px;
	border: 1px solid blue;
	padding: 25px;
}

#demo_div1 {
	float:left;
	width: 190px;
	height: 160px;
	background: green;
}

#demo_div1_sub1  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px; b
	ackground: red;
}

#demo_div1_sub2  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: black;
	color: red;
}

#demo_div2 {
	float:left;
	width: 190px;
	height: 160px;
	background: red;
	margin-left: 19px;
}

#demo_div2_sub1  {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: green;
}

#demo_div2_sub2 {
	float:left;
	margin: 5px;
	width: 170px;
	height: 70px;
	background: black;
	color: red;
}
</style>

Dann noch ein paar HTML Schnippsel:

<div id="wrapper">
   <div id="demo_div1">
		<div id="demo_div1_sub1">div1_sub1</div>
		<div id="demo_div1_sub2">div1_sub2</div>
	</div>

	<div id="demo_div2">
		<div id="demo_div2_sub1">div2_sub1</div>
		<div id="demo_div2_sub2">div2_sub2</div>
	</div>
</div>
<p>ready...</p>

und fertig ist das ganze:  Demopage

Vor allem ist das hier nützlich für Bilder, oder für kleine oder auch größere Formulare, wenn ihr eure label-tags über euren input-Feldern oder Checkboxen wollt. Natürlich muss man dann noch ein paar Größenanpassungen machen, mehr ist allerdings nicht nötig.

Have fun

Countdown for html5

Montag, Januar 25th, 2010

Hey ho,
for all the countdown lovers: http://ishtml5readyyet.com/

but that’s not important, what we need is browser support for html5 standard and we almost have it (more or less)

have fun

jQuery in neuer Version mit schönen neuen Features

Sonntag, Januar 17th, 2010

Hallo zusammen,

das berühmte JavaScript Framework jQuery ist in einer neuen Version erschienen und bringt so einige schöne Verbesserungen mit sich. Eine nette Liste aller neuen Features findet ihr hier, und hier. Und hier gibt es noch ein Video der Entwickler zu den Neuerungen und was man evtl. bei einem Upgrade beachten sollte.

Anbei möchte ich euch noch eine sehr gute Seite empfehlen, die viele nette Links zu Tutorials, Frameworks und mehr über Webentwicklung postet. www.scriptandstyle.com

Have fun