Hompagebaukasten?

[Isis]

Hallo Ihr Lieben

Ich wollte mal fragen welcher Homepagebauksaten einigermaßen gut ist?

homepage-baukasten.de und .beepworld.de Zum Beispiel ist absoluter Müll ...

Viel Werbung , kein FTP-Upload und dazu noch wenig Umgestaltungsmöglichkeiten, schlechte Designs und viele Ausfallzeiten. ... Für Anfänger okay aber es genügt meinen Ansprüchen.

Ich wollte eigentlich wieder meine Homepage umgestalten und aufleben lassen, die ich mal vor Jahren begonnen habe. (2006) Allerdings ist mir das komplette Wissen nicht mehr geläufig. ... Zumal ich auf meine alte Domain keinerlei Zugriff mehr habe, da mir die Passwörter fehlen. Einzige Möglichkeit, Post an den Anbieter.

Eigene HTML und CSS Programmierung wäre sicherlich von Vorteil, um mir das Wissen wieder anzueignen wird es einige Wochen dauern. ... Und soo viel Zeit um das wieder vorn Vorne zu lernen habe ich nicht.

Ich habe auch den HTML Editor Phase 5 heruntergeladen, komme mit dme Programm aber nicht zurecht, da mir eben das Wissen komplett fehlt.

Kann mir da jemand helfen?

Liebe Grüße
Isis

[Lunak]

Also bisher hab ich noch keinen Baukasten gesehen der besser ist, als jemand der sich mal ein Wochenende mit der Materie beschäftigt hat.
Normalerweise bist da gleich wieder drinnen is wie Fahrrad fahren.
Gutes Nachschlagewerk is z.b. http://www.selfhtml.org/

[Isis]

Hmm also komme ich wohl doch nicht drum herum mir das wieder einzuverleiben ...

Also vom Wissen her ist gar nix mehr da. Ich habe mich letzte Nacht über Stunden (genau mit dieser Seite) damit beschäftigt und ich peile da kaum was ...

Daher wollte ich ja auf diese Baukästen umschwenken ...
Aber die sind echt mies, zumindest was was ich so gesehen habe.

Schade das ich keinen kenne, der mir das erklären kann.

[Lunak]

Kleiner Tipp am Rande bau in deinen Code Kommentare und schöne Absätze sowie Tabschprünge ein.
Es ist natürlich klar das sich erstmal Keiner auskennt wenn einfach nur durcheinandergewürfelter Code vor einem steht.

[deamon]

Tabschprünge

Ey watt?

[Lunak]

jaja es gibt solche und solche
Also deamon ich meinte was in der Art:

 
<div class=div_menue_container>
 <form id=standard_iw_form method=post action="">
 <input type=hidden name="x_12" value=1>
 </form>
 <div class=div_menue_bg><img src="bilder/menue_v3/menu.png"></div>
 <div class=div_menue_defcon><img src="bilder/menue_v3/defcon_none.gif" id=img_menue_defcon></div>
 
 <div class=div_menue_kolosel>
 
 <form name=kolosel id=kolosel action="/game/index.php?action=msg" method=post>
 <select name=plaid id=menue_kolosel_select onChange="document.getElementById('kolosel').submit()" class="inp_st select_menue_kolosel"><option class=menue_kolosel_option_kolotyp_kolo value="24982"  >[13:81:10] Noctis<option class=menue_kolosel_option_kolotyp_kolo value="24990" style="color:#5E610B;"></select>
 </form>
 </div>
 
 
 <div class=div_menue_selectbox>
 <a href="/game/index.php?action=wirtschaft&typ=planiress&plaid=24982" target=_self >[13:81:10] Wi Parsen</a><br>
 </div>
 
 
 <div class=div_menue_button_container>
 
 

[-Admi-]

Dein Beispiel ist für Lernzwecke ungeeignet. Der Tipp mit SelfHTML ist aber sicher Gold wert, wenn man sich denn wirklich mit der Materie beschäftigen möchte.

An XHTML 1.0 für Auszeichnung und CSS 2 für die Formatierung kommt man nicht herum. Von HTML 5 und CSS 3 würde ich mangels durchgehender Browserunterstützung erstmal absehen. Höchstens für "Farbtupfer", die aber ohne fähigen Browser (unfähig = IE) die Seitenbetrachtung nicht behindern.

Diese beiden Standards reichen für eine einfache Website völlig aus. Wenn du Inspiration benötigst, dann schau dir bei Gelegenheit CSSZengarden mal an. Die Seite hat nur ein einziges XHTML-Gerüst. Die Designer lassen dieses aber mittels CSS immer wieder in anderem neuen Glanz erstrahlen.

PS: Für Tabsprünge in Formularen gibt es ein eigenes Element namens "tabindex".

[.deviant]

Dein Beispiel ist für Lernzwecke ungeeignet. Der Tipp mit SelfHTML ist aber sicher Gold wert, wenn man sich denn wirklich mit der Materie beschäftigen möchte.

An XHTML 1.0 für Auszeichnung und CSS 2 für die Formatierung kommt man nicht herum. Von HTML 5 und CSS 3 würde ich mangels durchgehender Browserunterstützung erstmal absehen. Höchstens für "Farbtupfer", die aber ohne fähigen Browser (unfähig = IE) die Seitenbetrachtung nicht behindern.

Diese beiden Standards reichen für eine einfache Website völlig aus. Wenn du Inspiration benötigst, dann schau dir bei Gelegenheit CSSZengarden mal an. Die Seite hat nur ein einziges XHTML-Gerüst. Die Designer lassen dieses aber mittels CSS immer wieder in anderem neuen Glanz erstrahlen.

PS: Für Tabsprünge in Formularen gibt es ein eigenes Element namens "tabindex".

Ich glaub weniger, dass er den tabindex als viel mehr das Einrücken meint

Und es geht nichts über HTML lernen. Diese Baukästen sind per se crap.

[Lunak]

Job war nur mal kurz copy paste für deamon, ging nur ums einrücken und da ich dafür nur auf den freundlichen Tabulator hämmere nenne ich das Tabsprünge^^

[deamon]

Job war nur mal kurz copy paste für deamon, ging nur ums einrücken und da ich dafür nur auf den freundlichen Tabulator hämmere nenne ich das Tabsprünge^^

mir gings lediglich um deine lustige Schreibweise

[Lunak]

[Isis]

Was auch immer ihr mir da sagen wolltet, ich habs nicht verstanden.

Ich kann nichtmal zwischen HTML, XHTML oder CSS unterscheiden ...

Was haltet ihr von Dreamweaver? Kann ich damit gut lernen und was anfangen?

[deamon]

jaein, du kannst dir damit äußert umfangreiche seiten zusammenklicken, d.h. wenn du ahnung hast. Ansonsten werden dich die ganzen buttons, checkboxen und auswahlmöglichkeiten vermutlich überfordern, und den kaufpreis von 100-270€ nicht rechtfertigen.
Ein Buch zum Thema Html halte ich für sinnvoller. z.B. http://books.google.de/books?id=oAYS...age&q=&f=false

[Isis]

ALso ich habe jetzt 2 Homepagebaukästen ausprobiert und bin maßlos enttäuscht. Was für Schrott doch immer im Netz angeboten wird. Getestet habe ich Repage und Npage ... beide ziemlich scheiße. ...

Ich habe Microsoft Expression Web auf meinem Rechner gefunden, auch bekannt als Frontpage, nur eine Version neuer. ... Nettes Programm aber auch da bin ich maßlos überfordert.

Entweder ich lerne das von Grund auf neu ... oder ich muss es leider lassen, wie mir scheint.

[Macross]

Dein Beispiel ist für Lernzwecke ungeeignet. Der Tipp mit SelfHTML ist aber sicher Gold wert, wenn man sich denn wirklich mit der Materie beschäftigen möchte.

An XHTML 1.0 für Auszeichnung und CSS 2 für die Formatierung kommt man nicht herum. Von HTML 5 und CSS 3 würde ich mangels durchgehender Browserunterstützung erstmal absehen. Höchstens für "Farbtupfer", die aber ohne fähigen Browser (unfähig = IE) die Seitenbetrachtung nicht behindern.

Diese beiden Standards reichen für eine einfache Website völlig aus. Wenn du Inspiration benötigst, dann schau dir bei Gelegenheit CSSZengarden mal an. Die Seite hat nur ein einziges XHTML-Gerüst. Die Designer lassen dieses aber mittels CSS immer wieder in anderem neuen Glanz erstrahlen.

PS: Für Tabsprünge in Formularen gibt es ein eigenes Element namens "tabindex".

CSSZengarden sieht mit den vielen Designmöglichkeiten echt hübsch aus. CSS Ist ja vollkommen ausreichend wenn man sich eine Homepage basteln will ne?!

[.deviant]

Naja nein. HTML und CSS sollten es schon sein Und es ist echt nicht schwer zu lernen, wenn man schrittweise vorgeht.

[$martey Delux]

jaja auch für mich ein leidiges thema - bin bisher immer gescheitert beim basteln, aber die csszen-site is teilweise echt schnike...

da bekommt man echt lust auch sowas zu haben. sollte mich vielleicht doch nochmal ranwagen...

[Osbes]

Gut, dann klären wir zunächst erstmal die Grundbegriffe (HTML / CSS).

HTML (= Hypertext Markup Language)
Mit HTML baut man das "Gerüst" einer Seite. Eines der einfachsten HTML Gerüste ist

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Titel der Seite</title>
</head>
<body>
Seiteninhalt
</body>
</html>
 

Dies würde wie folgt aussehen:


Derzeit gibt es für den Seiteninhalt nur einen Bereich, welcher durch "<body>" definiert ist.
Im folgenden ist der Bereich den der <body>-Tag derzeit einnimmt rot umrandet:


Wenn ich nun den Inhalt meiner Seite in einen linken und rechten Bereich unterteilen will, müsste ich dazu mein Gerüst um zwei neue Bereiche erweitern.

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Titel der Seite</title>
</head>
<body>
<div>
	Linker Bereich
</div>
<div>
	Rechter Bereich
</div>
</body>
</html>
 

Der <div>-Tag hat dabei die Eigenschaft imGegensatz zu Tags wie <a> (Link), <b> (Fett), <u> (Unterstrichen), <img> (Bild), ... keine vordefinierten Eigenschaften zu haben, d.h. wir können damit Bereich erzeugen, ohne dass diese für den Browser eine spezielle Bedeutung hätten, welche wir ggf. nicht wollen.

Wenn man sich dies einmal anschaut, sieht es nun wie folgt aus (der Bereich des <body>-Tags ist wieder Rot umrandet, die der jeweiligen <div>-Tags sind Grün umrandet):


Wie man sieht haben wir nun zwar zwei Bereiche geschaffen, aber ie sind nicht wie erhofft links / Rechts angeordnet. Um nun die Darstellung dieser Bereiche zu beeinflussen kommen wir zu CSS.

CSS (= Cascading Style Sheets)
Mit Hilfe von CSS kann man die Darstellung bestehender HTML Bereiche beeinflussen.
Damit dies vom Browser erkannt wird muss man den CSS Quelltext mit dem HTML Quelltext verbinden. Wir werden dazu den HTML Tag <style> verwenden (weitere Möglichkeiten gibt es hier: http://de.selfhtml.org/css/formate/einbinden.htm).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Titel der Seite</title>
 <style type="text/css">
		// Hier kann man nun CSS verwenden
 </style>
</head>
<body>
<div>
	Linker Bereich
</div>
<div>
	Rechter Bereich
</div>
</body>
</html>

Nun wollen wir dazu kommen unsere Bereiche in einen linken / rechten Bereich aufzuteilen.
Damit ein Bereich einen anderen Bereich umfließen kann gibt es in CSS den Befehl float;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Titel der Seite</title>
 <style type="text/css">
		.links
		{
			float:			left;
		}
 </style>
</head>
<body>
<div class="links">
	Linker Bereich
</div>
<div>
	Rechter Bereich
</div>
</body>
</html>

Da wir jedoch zwischen den Bereichen unterschieden müssen haben ich einem class="links" gegeben, wodurch die CSS-Definition unter ".links" nur den Bereich dieses <div>-Tags betrifft.

Die Ausgabe sieht wie folgt aus (mit Ränder um die Bereiche):


Nun könnten wir z.b. die Bereite des Linken Bereiches vergrößern, die Hintergrundfarbe ändern, usw.
Dies läuft jedoch vollkommen über CSS.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>Titel der Seite</title>
 <style type="text/css">
		.links
		{
			float:			left;
			width:			50%;
			background:		green;
			height:			50px;
			padding:		10px;
		}
 
		.rechts
		{
			background:		blue;
			color:			red;
			height:			100px;
		}
 </style>
</head>
<body>
<div class="links">
	Linker Bereich
</div>
<div class="rechts">
	Rechter Bereich
</div>
</body>
</html>

Dies würde dann wie folgt aussehen (diesmal ohne Ränder):


Ich hoffe dieser Crash-Kurs hat das Zusammenspiel / den Aufgabenbereich von HTML / CSS nochmal in Erinnerung gerufen.

Ansonsten würde ich ebenso http://de.selfhtml.org/index.htm empfehlen und von "Clicky-Bunty"-Internetseiten massiv abraten.

Der Grund dafür ist, das fehlerhafter Quelltext, welcher oft von diesen Seiten erzeugt wird, nur dazu führt, dass er auf vers. Browsern nicht korrekt dargestellt werden kann und dies mit der Zeit auch nicht besser wird.

Man lernt HTML / CSS sicherlich nicht in 30min geschweige denn innerhalb eines Tages, wenn man dies ganz neu lernt, aber je nachdem wieviel Zeit man hat kann man dies schon nach 2-3 Tagen weitesgehend verinnerlicht haben und kennt sich damit dann auch sehr gut mit HTML / CSS aus.

[Macross]

Würde dich ja positiv bewerten wenn ich könnte. Aber deine kinderleichte Beschreibung ist mir dennoch zu hoch

[$martey Delux]

ich glaube osbes wollt damit sagen, dass man mit html das grundgerüst sprich die inhalte einer website festlegt und css benötigt um den inhalten spezifische eigenschaften zuzuweisen. er hat ja mi css eine klasse "links" festgelegt in der beschrieben ist wie sein text ausgerichtet sein soll, also die eigenschaften unter dem begriff "links" für den edito festgelegt. und eben in dem html bereich div, der den inhalt der seite festlegt einen verweis auf diese klasse gemacht, sodass der editor "weiß" dass dieser text auf die linke seite soll. im nächsten inhaltsbereich, der wieder mit div markiert ist hat er auf die klasse rechts verwiesen, sodass der text auf die rechte seite kommt. wie hier im forum bei den tags für beispielsweise schriftartoer farbe werden die einzelnen bereiche durch <div> </div> (um ein beispiel zu nennen) markiert, damit der editor weiß wo ein bestimmer inhalt anfängt und wo er endet. das ganze hat er 2 fach gemacht um den text einmal links und einmal rechts ausrichten zu können indem er jeweils auf die zuvor festgelegte css klasse verweist. somit gibt html mit seinen div-tags lediglich den textinhalt wieder, die optische wiedergabe wird über css mit den in den <style></style> tags eingeschlossenen inhalten festgelegt, also die farbe, die textausrichtung die bereichsgröße etc.

hoffe ich hab das jetzt richtig nachvollzogen - ob es jetzt einfacher geschildert ist, sei mal dahingestellt