Homepage "bauen"

[AwesomSTUFF]

Naja HTML und CSS kann man doch quasi in einem Schwung "lernen" das geht doch ineinander über.
Das "lernen" würd ich drauf beschränken mir nen Webspace zu suchen..wo die HTML Seite drauf kann und dann einfach im Editor anfangen zu coden.
Zuerst mal Kopfbereich und diese ganze Annotationssache und dann einfach loslegen. Wichtig sind da imo doch nur Tabellen und div-Container. Farben, Hintergrundbilder, Wasserzeichhen, Schriftarten und Grössen und dann wars das auch schon mit HTML/CSS. Nur das mans mal gesehen macht und weiss wie es funzt. Merken is eh Kismet- steht ja alles im Netz^^ Was will man da gross lernen? Das ist an einem Nachmittag durch. Wenn man noch den Abend dazunehmen will kann man sich ja gerne mit JavaScript befassen aber im Grossen und Ganzen...

Dann als nexter Step wäre eine MySL DB gut (evtl aufm Webspace wenns geht) und dann kann man sich die folgenden 2-5 Tage mit PHP befassen und MySQL. Also einfache Daten aus einer Tabelle abfragen und in die Tabelle reinschreiben.

Dann hat man nach ca einer Woche die Grundlagen auf die man aufbauen kann. Zwar reicht das lang nicht um ein eigenes CMS zu bauen, aber für erste Schritte und Ergebnisse reichts allemal.

Für schnelle Erfolge wäre sicherlich ein CMS ganz okay. Ich würd nen einfaches empfehlen wi ee107 wo man auch noch viel mit HTML usw reissen kann und was nicht 30MB wiegt.

 

[sube]

Meinetwegen auch beides zusammen. Dauert ja nicht lange.

Wer gar keine Erfahrung hat, kann aber mit HTML ohne CSS schon eine Webseite bauen.

 

[Webzurfer]

Ja, da habe ich auch schon dran gedacht und mich auch schon mit dem Thema auseinander gesetzt und hier belesen: http://www.webwissen.de/der-11-homepage-baukasten/
Ich glaube, dass es eine super Alternative für mich ist. Ich sehe da viele Vorteile, denn ich habe nicht aus ausreichende Know-how eine Homepage selbst du "bauen".

Viele Grüße,
Webz

 

[Miyamori]

Bitte Bitte erkläre uns was dir genau vorschwebt unter "eine Homepage", das kann so ziemlich alles mögliche sein von Hello World! bis facebook Clone.

@baukasten

Pakete:
BASIC-Paket nach der Testphase 9,99 €/ Monat zzgl. MwSt. (11,89 €/Monat inkl. MwSt.).
PLUS-Paket nach der Testphase 19,99 €/ Monat zzgl. MwSt. (23,79 €/Monat inkl. MwSt.).
PRO-Paket nach der Testphase 29,99 €/ Monat zzgl. MwSt. (35,69 €/Monat inkl. MwSt.).

WTF?

 

[Kraligor]

Ich glaube, dass es eine super Alternative für mich ist. Ich sehe da viele Vorteile, denn ich habe nicht aus ausreichende Know-how eine Homepage selbst du "bauen".

..deshalb wurde dir ja auch angeraten, dir das Wissen anzueignen. Die Basics sind wirklich schnell erlernt. Falls Du das nicht möchtest, würde ich auch eher zu einem kostenlosen CMS tendieren.

 

[Jesterfox]

Wer gar keine Erfahrung hat, kann aber mit HTML ohne CSS schon eine Webseite bauen.

Die dann aber entweder total langweilig aussieht (mit den default Styles des Browsers) oder man hat es falsch gemacht und veraltete Features von HTML 4 Transitional (oder älter) verwendet. Man sollte schon von Anfang an versuchen die Trennung von Inhalt (HTML) und Aussehen (CSS) einzuhalten, dann hat man es später viel leichter.


Für weitere Tipps wäre aber Ziel und Umfang der geplanten Website interessant.

 

[omaliesschen]

Um Gottes willen!..@-_11¬^-^

HTML & CSS sind die BBCodes von heute.

<blockquote class="postcontent restore ">
<b>Um</b> <font color="#FF0000"><font size="3">G<font size="2">o</font>tt<font size="7">e</font>s</font></font> <font color="#FF0000"><b>willen</b></font><font size="6">!</font>..<font size="1">@-_11¬</font><font color="#800080"><font size="3">^-^</font></font><br>
<br><u><b><font size="6">H</font>T<font size="6">M</font>L</b></u> &amp; <u><b>C<font size="6">S</font>S</b></u> <i><font color="#0000FF">sind</font></i> die <font color="#00FF00"><font size="1"><b><font size="7">B</font></b><b><font size="6"><u>B</u></font></b><font size="5">C</font><font size="4">o</font><font size="3">d</font><font size="2">e</font><i><font size="1">s</font></i></font></font> von <u>heute</u>.</blockquote>

 

[Jesterfox]

Danke für die Bestätigung ;-)

 

[omaliesschen]

Ich kann für den BBCode Parser nichts.

 

[Jesterfox]

Aber der Code zeigt wunderschön wie schlimm HTML wird wenn man es zu Darstellungszwecken missbraucht. Das sollte man sich erst gar nicht angewöhnen, denn einmal gewohntes kriegt man meist nur ganz schwer wieder raus... wenn man später dann mal wartbare und übersichtliche Seiten oder Templates erstellen will wird es schwer sich umzugewöhnen.

 

[omaliesschen]

Naja. Das lässt sich auch mit CSS in dem Beispiel nicht viel übersichtlicher gestalten. Hier mal ein Beispiel das zeigt was googles code pretify anstellt (css basiertes Styling), und das ist noch harmlos da der Code nur ein kleines array beinhaltet:

<pre class="prettyprint linenums lang-php prettyprinted" style=""><ol class="linenums"><li class="L0"><br></li><li class="L1"><span class="kwd">public</span><span class="pln"> $dynamicPanel </span><span class="pun">=</span><span class="pln"> array</span><span class="pun">(</span><br></li><li class="L2"><span class="pln">        </span><span class="str">'panel_wrapper_open'</span><span class="pln">  </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="str">'&lt;div id="c-41" class="c-41"&gt;&lt;ul id="c-42"&gt;'</span><span class="pun">,</span><br></li><li class="L3"><span class="pln">        </span><span class="str">'rightSideFirst'</span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="kwd">false</span><span class="pun">,</span><br></li><li class="L4"><span class="pln">        </span><span class="str">'rightSideSecond'</span><span class="pln">     </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="str">'&lt;li&gt;&lt;a href="index.php"&gt;Portal&lt;/a&gt;&lt;/li&gt;'</span><span class="pun">,</span><br></li><li class="L5"><span class="pln">        </span><span class="str">'rightSideThird'</span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="str">'&lt;li&gt;&lt;a href="index.php?cat=forum,overview"&gt;Forum&lt;/a&gt;&lt;/li&gt;'</span><span class="pun">,</span><br></li><li class="L6"><span class="pln">        </span><span class="str">'rightSideFourth'</span><span class="pln">     </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="str">'&lt;li&gt;&lt;a href="index.php?a=[...]"&gt;Writers&lt;/a&gt;&lt;/li&gt;'</span><span class="pun">,</span><br></li><li class="L7"><span class="pln">        </span><span class="str">'rightSideFifth'</span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="kwd">false</span><span class="pun">,</span><br></li><li class="L8"><span class="pln">        </span><span class="str">'rightSideSixth'</span><span class="pln">      </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="kwd">false</span><span class="pun">,</span><br></li><li class="L9"><span class="pln">        </span><span class="str">'leftSideFloat'</span><span class="pln">       </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="kwd">false</span><span class="pun">,</span><br></li><li class="L0"><span class="pln">        </span><span class="str">'panel_wrapper_close'</span><span class="pln"> </span><span class="pun">=&gt;</span><span class="pln"> </span><span class="str">'&lt;/ul&gt;&lt;/div&gt;'</span><br></li><li class="L1"><span class="pln">        </span><span class="pun">);</span><br></li></ol></pre>

Ergänzung (24. Mai 2013)

Und da auch CB google pretify nutzt sieht das ganze jetzt, nach doppeltem Durchgang so aus:

<pre class="bbcode_code prettyprint linenums lang-none prettyprinted" style=""><ol class="linenums"><li class="L0"><span class="tag">&lt;pre</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"prettyprint linenums lang-php prettyprinted"</span><span class="pln"> </span><span class="atn">style</span><span class="pun">=</span><span class="atv">""</span><span class="tag">&gt;&lt;ol</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"linenums"</span><span class="tag">&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L0"</span><span class="tag">&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L1"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"kwd"</span><span class="tag">&gt;</span><span class="pln">public</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> $dynamicPanel </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> array</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">(</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L2"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'panel_wrapper_open'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">  </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'&amp;lt;div id="c-41" class="c-41"&amp;gt;&amp;lt;ul id="c-42"&amp;gt;'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L3"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideFirst'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">      </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"kwd"</span><span class="tag">&gt;</span><span class="pln">false</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L4"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideSecond'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">     </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'&amp;lt;li&amp;gt;&amp;lt;a href="index.php"&amp;gt;Portal&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L5"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideThird'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">      </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'&amp;lt;li&amp;gt;&amp;lt;a href="index.php?cat=forum,overview"&amp;gt;Forum&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L6"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideFourth'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">     </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'&amp;lt;li&amp;gt;&amp;lt;a href="index.php?a=[...]"&amp;gt;Writers&amp;lt;/a&amp;gt;&amp;lt;/li&amp;gt;'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L7"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideFifth'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">      </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"kwd"</span><span class="tag">&gt;</span><span class="pln">false</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L8"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'rightSideSixth'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">      </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"kwd"</span><span class="tag">&gt;</span><span class="pln">false</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L9"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'leftSideFloat'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">       </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"kwd"</span><span class="tag">&gt;</span><span class="pln">false</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">,</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L0"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'panel_wrapper_close'</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">=&amp;gt;</span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln"> </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"str"</span><span class="tag">&gt;</span><span class="pln">'&amp;lt;/ul&amp;gt;&amp;lt;/div&amp;gt;'</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;li</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"L1"</span><span class="tag">&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pln"</span><span class="tag">&gt;</span><span class="pln">        </span><span class="tag">&lt;/span&gt;&lt;span</span><span class="pln"> </span><span class="atn">class</span><span class="pun">=</span><span class="atv">"pun"</span><span class="tag">&gt;</span><span class="pln">);</span><span class="tag">&lt;/span&gt;&lt;br&gt;&lt;/li&gt;&lt;/ol&gt;&lt;/pre&gt;</span></li></ol></pre>

 

[Jesterfox]

Ok, derart wile Formatierungen sind etwas schwieriger, aber trotzdem lässt sich mit den Features von CSS3 einiges machen. Der "Fehler" der CSS-Version ist es alles über zusätzliche HTML-Elemente mit eigenen Klassen zu erschlagen. Idealerweise fügt man aber keine neuen HTML-Elemente hinzu die nur für die Formatierung benötigt werden und setzt auch Klassen sparsam ein. Dazu muss man sich aber mit den CSS-Selektoren auseinandersetzen, was diese alles Leisten können.

 

[H3XOR]

Also ich finde www.bplaced.net in verbindung mit der deutschen Wordpress CMS ziemlich gut und leicht auch für Anfänger, gibt auch massig Templates..Widgets und Tutorials..

 

[Kausalat]

Wenn man wirklich konsequent auf CSS verzichtet, bleibt dem Besucher nur noch das Grundgerüst der Website. Also quasi das nackte Holzgestell eines Leichtbauhauses.

Ich finde, wenn man schon "schmutzige", unsematisch angehäufte font-, b- und u-Tags anwendet, kann man sich gleich wenigstens die Basics von CSS aneignen, und zwar nicht inline im HTML-Quellcode.

 

[omaliesschen]

Warum sind b u i schmutzig?

Kürzer geht es nicht.

 

[Daaron]

Das "lernen" würd ich drauf beschränken mir nen Webspace zu suchen..wo die HTML Seite drauf kann und dann einfach im Editor anfangen zu coden.

Und wozu dann Webspace? Für statisches HTML, CSS, JS benötigt man nicht einmal einen Webserver. Da reicht ein Doppelklick auf die HTML-Datei...
Wenn man dann doch mit MySQL & PHP experimentieren will, braucht man keinen öffentlichen Webspace, denn der ist nur unnötig umständlich, ihm fehlen evtl. Features und außerdem ist es auch eine Sicherheitsfrage. Nein, wenn man so etwas lernen will lädt man sich einfach XAMPP runter. Muss nicht einmal ernsthaft installiert werden, läuft sogar als Portable-Version. Ist nur als Produktivsystem unbrauchbar, zum Entwickeln unter Windows aber wirklich genial.

Zuerst mal Kopfbereich und diese ganze Annotationssache und dann einfach loslegen. Wichtig sind da imo doch nur Tabellen und div-Container. Farben, Hintergrundbilder, Wasserzeichhen, Schriftarten und Grössen und dann wars das auch schon mit HTML/CSS. Nur das mans mal gesehen macht und weiss wie es funzt. Merken is eh Kismet- steht ja alles im Netz^^ Was will man da gross lernen? Das ist an einem Nachmittag durch. Wenn man noch den Abend dazunehmen will kann man sich ja gerne mit JavaScript befassen aber im Grossen und Ganzen...

Ok. Welche HTML5-Notation wäre semantisch korrekt, wenn du ein längeres Zitat nebst Autor als Block (mit Absätzen etc.) darstellen willst? Welches HTML-Element, mit welchen Parametern, wäre hingegen für ein kurzes Inline-Zitat mit Quellenangabe (z.B. ner URL) korrekt?

Wie genau zeichnest du Zusatzinhalte zum aktuellen Hauptinhalt aus, die das Verständnis des Hauptinhaltes fördern, aber allein keine nennenswerte Relevanz haben? Dabei ist der Hauptinhalt auch grundsätzlich ohne den Zusatz "lebensfähig".

Können Überschriften gruppiert werden?

Du willst Audio- oder Videoinhalt ohne Flash einbinden. Worauf musst du achten?

Was ist der Shadow DOM?

Also wenn du HTML5, was nun einmal Stand der Technik ist, in- und auswendig kennst, dann kannst du obige Fragen mit einem Lächeln aus der Kalten beantworten.
Aber tatsächlich schätze ich dich nach deiner obigen Aussage eher so ein, dass du noch nicht einmal von <time> gehört hast, geschweige denn von dessen genauer Formatierung. Dabei ist gerade dieses Element in Foren, Blogs, News,... unglaublich nützlich.

Dann als nexter Step wäre eine MySL DB gut (evtl aufm Webspace wenns geht) und dann kann man sich die folgenden 2-5 Tage mit PHP befassen und MySQL. Also einfache Daten aus einer Tabelle abfragen und in die Tabelle reinschreiben.

...und, weil man keinen Plan von Nix hat, gleich mal 20 Sicherheitslücken aufstoßen und das eigene Lieblingspasswort in den Orbit brüllen.

Wer gar keine Erfahrung hat, kann aber mit HTML ohne CSS schon eine Webseite bauen.

Das will ich sehen, und zwar semantisch korrekt in HTML5-Notation.... oder wenigstens XHTML 1.1 Strict.

Ich glaube, dass es eine super Alternative für mich ist. Ich sehe da viele Vorteile, denn ich habe nicht aus ausreichende Know-how eine Homepage selbst du "bauen".

Was genau ist denn das Ziel deiner Homepage? Wenn du damit in irgend einer Form Geld verdienen willst, dann lass die Finger von Baukästen, sondern INVESTIERE. Bezahl Profis dafür, dass sie dir etwas vollkommen EIGENES bauen. Bei Baukästen hast du dann dasselbe Layout wie 5000 Andere auch und keine nennenswerten Optionen, daran etwas zu ändern.

 

[omaliesschen]

Es ist keine Schande auf die ganzen Tags zu verzichten:
http://www.quackit.com/html_5/tags/html_blockquote_tag.cfm

<dl class="quote"><dt>Quote</dt><dd>http://www.quackit.com/html_5/tags/html_blockquote_tag.cfm</dd></dl>

 

[Miyamori]

Man kann auch ohne CSS erfolgreich sein als Beispiel würde ich mal fefes Blog in den Raum werfen.

 

[carom]

Hier mal ein Beispiel das zeigt was googles code pretify anstellt (css basiertes Styling), und das ist noch harmlos da der Code nur ein kleines array beinhaltet:

Das ist aber generierter Code, der interessiert dich doch gar nicht mehr. Wichtig ist, dass du zur Entwicklungszeit sauber trennst, weil du es damit für dich und deine Arbeitskollegen einfacher machst. Was hinterher im Browser beim User ankommt ist völlig Hupe, solange es noch einigermaßen barrierefrei ist. Viele Webframeworks haben eine Asset-Pipeline, die packen beim Ausliefern alle CSS und JS-Files deines Projekts in je eine einzige Datei, um die Anzahl der Browserrequests zu reduzieren. Manche nennen dabei sogar CSS-Klassen und JS-Funktionen in möglichst kurze Bezeichner um. Das Ergebnis ist hässlich, aber es ist völlig egal, da es etwas generatives ist und dich nichts mehr angehen muss, außer dem Browser sieht das niemand mehr.

Warum sind b u i schmutzig?

Weil es eine Style-Angabe ist und in HTML nichts mehr verloren hat, dafür hast du CSS. Wenn du semantisch etwas hervorheben möchtest, dann nimmst du in HTML <strong> und <em>, das Aussehen kannst du dann über CSS bestimmen - per default ist strong aber bereits bold und em kursiv, weil es meistens so verwendet wird.

 

[Jesterfox]

Wenn man keine wartbare, seo-taugliche und barrierefreie Webseite haben will kann man natürlich auf korrektes und sinnvolles HTML verzichten. Dann sollte man aber besser gleich ein PDF ins Netz stell dann muss man sich auch nicht mit Browser-Unterschieden rumärgern ;-)

Für die erste Homepage eine Anfängers mag das noch nicht so relevant sein, aber besser gleich richtig anfangen als sich später mit alten Gewohnheiten rumzuärgern.

Buchtipp: http://jendryschik.de/wsdev/einfuehrung/

Ist zwar noch das "alte" CSS 2.1 mit XHTML 1.0, aber es liefert eine gute Grundlage die auch mit CSS 3 und HTML 5 gültig ist.