Erste richtige Homepage.. welche Programmierersprache/ System?

vickymawiva

vickymawiva

Well-known member
ID: 308089
L
6 Januar 2008
310
18
Also ich habe es bis jetzt immer nur hin bekommen ein Design in Photoshop zu slicen und dann den Hintergrund der Textfelder in einer Tabelle als Hintergrund für die Tabellenzeile einzusetzen. Also Tabellendesign auf die billigste Art...
DAS ist meine Momentane (etwas unfertige) Homepage...
Sobald man die Seite etwas größer zeiht wird alles unscharf, dass stört mich. Ich habe das Design für 1024x764 entworfen und habe selbst 1920x1080 (glaub ich). Dieses Problem wird ja bei mehreren auftreten...

Jetzt will ich mir mal vornehen sowas RICHTG hinzubekommen. Also mit hoverbuttons Diesen Klappmenüs, evtl ner selbst gemachten gallerie (benutze im moment svBuilder), ect. Generell einfach ein halbwegs professionelles Webdesign.

Im Internet habe ich auch ein Tutorial gefunden : *klick*

Allerdings möchte ich mal fragen ob ich mit html5 und etwas Java schon einigermaßen gut beraten bin oder ob das ebenfalls totaler Müll ist...
 
also HTML und CSS reichen völlig aus um eine gute Internetseite zu erstellen, sofern du noch irgendwelche Spielereien einbauen willst, dann wäre Javascript noch nützlich

aber mit Java wirst eher weniger anfangen können, da das eher für richtige Programme/Spiel gebraucht wird

wichtige Stichworte für Google wären:
"Selfhtml", "CSS" und "Javascript *Spielereiname*"
 
Danke erstmal für die schnelle antwort.. also html und css habe cih jetzt in diesen tutorials gefunden 1. und 2. Allerdings verstehe ich schon den schritt beim coden ganz am anfang nicht, weil der Autor die Designs jedes mal anscheinend nach anderen Kriterien in Tabellenspalten einteilt???

Gibt es solche Tutorials vielleicht irgendwo auf deutsch? also self-html kenne ich aber wenn man nicht weiß wie man die einzelnen code teile miteinander verbinden kann, dann bringt mich das auch nicht so richtig weiter
 
Allerdings verstehe ich schon den schritt beim coden ganz am anfang nicht, weil der Autor die Designs jedes mal anscheinend nach anderen Kriterien in Tabellenspalten einteilt???
Zum Vergrößern anklicken....

Um eine ordentliche Homepage zu machen, darfst du nicht mit Tabellen arbeiten. Schau dir DIVs im Bezug auf CSS an.
Dann unterteilst du die PSD ganz logisch. Anhand deines Beispiels folgendermaßen:
- Header
-> Logo
-> Navigation
- Content (2 Spalten Layout mithilfe von Float)
-> Content
-> Sidebar
- Footer (Fehlt bei dir in der PSD)
 
also ich habe mir das ganze gründlich durchgelesen und das System auch schon ganz gut verstanden :)

Jetzt wollte ich mich selbst an einer Seite versuchen um das ganze mal zu üben. Allerdings klappt es bei mir irgendwie nicht, dass die css Datei sich richtig auf die html Datei bezieht.. Denn die Html Datei nimmt die angaben aus meiner css Datei nicht auf :-?

Html datei:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <link rel="stylesheet" type="text/css"
 href="cssdatei.css">
  <title>test-css seite</title>
</head>
<body>
<h1>Mein Schrifttest (h1)</h1>
<h2>die Unterüberschrift (h2)</h2>
</body>
</html>

Der Code in meiner Css Datei (die heißt wirklich "cssdatei.css"):
Code: 
<style type="text/css">

* {font-size:14px;
  color:#ff0000;}

</style>
 
Code: 
<style type="text/css">

* {font-size:14px;
  color:#ff0000;}

</style>

zu
Code: 
* {
  font-size:14px;
  color:#ff0000;
}
ändern und es sollte funktionieren (wenn ich jetzt keinen anderen Fehler übersehen habe).
 
Danke erstmal, dass ging ja schnell :)
Allerdings funktioniert das irgendwie immer noch nicht. Also die "unterüberschrift" h2 ist zwar kleiner als h1 aber das steht ja nicht im css sheet. Das ist doch bei h1 /h2 /h3 Teilen immer so, dass sie immer kleiner werden, oder? und eigentlich soll der Text ja auch rot werden. Aber der ist immer noch schwarz :/
 
Wenn ich den Code genau so kopiere, wie er bei dir und bei mir in den Posts vorhanden ist, dann funktioniert das genau so wie es soll ...
 
das verstehe ich nicht.. bei mir geht es weder mit dem ff noch mit dem IE. Was kann denn da noch schief laufen? Also beide Dateien sind in einem Ordner.
 
Die style-Tags hast du aus der CSS-Datei entfernt, ja?
Ansonsten bleibt eigtl. nur noch, dass du irgendwo nen Buchstabendreher oder sowas hast.
 
Die Schreibweise mit dem Joker-Zeichen (*) ist ganz übles Mojo!

Besser:
Code: 
html, body, h1, h2 
{
 font-size:14px;
 color:#ff0000;
}
Idealerweise gibst du den Elementen noch Klassen:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <link rel="stylesheet" type="text/css"
 href="cssdatei.css" />
  <title>test-css seite</title>
</head>
<body>
<h1 class="head">Mein Schrifttest (h1)</h1>
<h2 class="subhead">Die Unterüberschrift (h2)</h2>
</body>
</html>
und dann:
Code: 
.head{
font-size: 16px;
color: #FF0000;
}

.subhead{
font-size: 14px;
color: #FF0011;
}

Wenn du wirklich mit Homepage erstellen beschäftigen willst, kommst du nicht herum HTML und CSS zu lernen (beides keine Programmiersprachen!).
Für mal was erstellen, sollte ein X-Beliebiger HP-Baukasten reichen (auch wenn die ein fürchterliches HTML produzieren).
 
Maniac99 schrieb:
Die Schreibweise mit dem Joker-Zeichen (*) ist ganz übles Mojo!
Zum Vergrößern anklicken....
Wieso?

CSS-Resets z.B. verwenden sogar bewusst den Stern, um wirklich alles zu erwischen. Solange man weiß, was man tut, is ein * im CSS absolut ok.

(Nicht verwechseln mit dem üblichen SELECT *, was sich Anfänger in SQL angewöhnen)
 
Maniac99 schrieb:
Die Schreibweise mit dem Joker-Zeichen (*) ist ganz übles Mojo!
Zum Vergrößern anklicken....

theHacker schrieb:
Wieso?

CSS-Resets z.B. verwenden sogar bewusst den Stern, um wirklich alles zu erwischen. Solange man weiß, was man tut, is ein * im CSS absolut ok.
Zum Vergrößern anklicken....

So sehe ich das auch!
Was ich immer gerne verwende:

PHP: 
* {
  padding:0;
  margin:0;
}

Das ist ziemlich praktisch, denn von Browser zu Browser hat man oft unterschiedliche Definitionen vom Margin und Padding und wenn man diese Definition einbaut, muss man auch für jeden Tag diese Abstände definieren und hat sie überall gleich.
 
Nunja, der Asterisk ist insofern schlechtes Mojo (schöner Ausdruck btw), weil er performance-technisch ganz schön zu Buche schlägt. Ist in dem Bereich letztendlich allerdings nicht so wirklich wild...

@DarkLord: Da wird auf den CSS Reset von Eric Meyer verwiesen. Inzwischen gibt's auch eine Variante, die die neuen HTML5-Elemente berücksichtigt:

:arrow: https://html5doctor.com/html-5-reset-stylesheet/

In dem Zusammenhang vielleicht noch eine ganz spannende Lektüre:

:arrow: https://html5boilerplate.com/docs/#Home

Im HTML5 Boilerplate werden relativ viele aktuelle Techniken verwendet und die Dokumentation ist ziemlich umfangreich.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben