Informatikarbeit Klasse 9 Homepage programieren

02.01.2011, 12:10

Blackarro

Informatikarbeit Klasse 9 Homepage programieren

Meine Frage:
Hallo,

Ich gehe in die 9 Klasse an einer Realschule und muss eine Homepage für eine Musikschule programmieren, die als Arbeit gewertet wird.
Da wollte ich mal fragen, ob jemand so was schon mal gemacht hat und eventuell mir ein paar Tipps geben kann??
Denn die Arbeit ist sehr wichtig für mich, weil ich steh in Info nicht so gut ^^

Über Viele Antworten würde ich mich sehr freuen smile

Meine Ideen:
-----------------Wie sie ungefähr aussehen soll:---------------------------

Sie soll fast genauso aufgebaut seine wie diese Seite
http://www.musikschule-forte-piano.de/cms/Wir_ueber_uns-2.html

und der Head sollte ungefähr so aussehen wie bei dieser Seite
http://www.musikschulen.de/

Zudem soll ich noch ein Logo entwerfen(das hab ich schon)
genauere Angaben kann ich euch erst nach den Ferien geben, aber eigentlich kann ich alles reinpacken, was ich will darein Packern.

WICHTIG:
Keine Urheberrechts Verletzung (Bilder, Videos,... aus dem Netz)

02.01.2011, 16:51

Auf diesen Beitrag antworten »

Ibn Batuta

Die einfachste Möglichkeit ist, daß du ein CMS (z.B. Joomla!) verwendest und das Template änderst.

Ibn Batuta

02.01.2011, 17:15

Auf diesen Beitrag antworten »

Blackarro

sry kannst das noch mal anders erklären^^

02.01.2011, 17:48

Auf diesen Beitrag antworten »

Ibn Batuta

Was genau soll ich dir erklären?

Ibn Batuta

02.01.2011, 20:07

Auf diesen Beitrag antworten »

Blackarro

Dieses CMS, Joomla und Template. Weiß gerade nicht was du damit meins.

02.01.2011, 21:12

Auf diesen Beitrag antworten »

Ibn Batuta

Ok. Dann vielleicht besser doch nicht...

Kannst du eine Skriptsprache wie PHP? Hast du Ahnung von CSS?

Ibn Batuta

02.01.2011, 22:02

Auf diesen Beitrag antworten »

Blackarro

Als wir hatten erst HTML und c++,c und java lerne ich gerade großes Grinsen

aber in HTML bin ich richtig gut, doch ich bekomm das mit der Homepage nicht wirklich hin. Hab bis jetzt nur eine grobe Vorstellung wie die aussehen soll und das Logo hab ich schon endworfen muss nur noch ein paar kleine veränderungen vornehmen.

03.01.2011, 16:51

Auf diesen Beitrag antworten »

Ibn Batuta

Dann verstehe ich euren Lehrer nicht. Augenzwinkern

Java kann man natürlich schon für die Webentwicklung verwenden, aber in dem Stadium scheinst du ja noch nicht zu sein. großes Grinsen

Hast du Grundkenntnisse von PHP und CSS? Dann würde ich an deiner Stelle nämlich mir die Homepage rudimentär mittels PHP, HTML und CSS programmieren.

Ibn Batuta

03.01.2011, 22:15

Auf diesen Beitrag antworten »

Blackarro

Wir sollen die nur mit HTML programmieren.

04.01.2011, 08:29

Auf diesen Beitrag antworten »

MaBa

Hallo Blackarro,

Zitat:

Wir sollen die nur mit HTML programmieren.

Ich möchte wetten, dass ihr auch CSS (Cascading Style Sheets) benutzen dürft. Keine Angst CSS ist total einfach. Es wird verwendet, um Inhalt und Darstellung voneinander zu trennen. Dadurch erhöht sich die Wartbarkeit deiner Seite erheblich. Du könntest dann z.B. mit nur kleinen Änderungen das komplette Aussehen der Website verändern.

Wie lange hast du denn Zeit für deine Arbeit? Was wird gewertet? Die Seite, eine Ausarbeitung, beides?

Die Programmierung hast du schnell fertig, sofern die Inhalte und Graphiken stehen. Wichtiger ist die Planung! Mach dir z.B. zu folgenden Punkten Gedanken:

-An welche Zielgruppe richtet sich die Website?
-Was soll ein Benutzer auf der Website machen?
-Wie sollte die Navigation aussehen (Sitemap, nicht Design)
-Welche Keywords sollten wpäter im Quellcode angegen werden? (Stichwort Suchmaschinenoptimierung)

Bei der Präsentation solltest du herausstellen, dass du nicht bloß stumpf den Quellcode geschrieben hast, sondern dir vorher Gedanken gemacht hast dir ein Konzept überlegt hast. Für das Design/Layout ist es hilfreich sich vorher ein paar Skizzen auf Papier zu kritzeln. Dann kannst du anhand der Skizzen entscheiden, was dir gut gefällt und was nicht so gut ist.

Wenn du fertig bist solltest du die Seite selbst testen (gibt es tote Links, etc.) und von Freunden testen lassen. Sag Ihnen nichts zu der Seite und lass sie herausfinden, ob die Seite intuitiv zu bedienen ist, ob die Botschaft der Seite auch übermittelt wird und ob alle Informationen schnell gefunden werden.

Du solltest dir auch grob §5 des TMG (Telemediengesetz) anschauen. Ein Impressum wird für deine Website unumgänglich sein. Du findest im angegebenen §5 alles was im Impressum stehen sollte.

Wenn es konkrete Fragen zur Umsetzung geht, frag einfach nochmal.

Viele Grüße,
MaBa

04.01.2011, 19:17

Auf diesen Beitrag antworten »

Blackarro

Erst mal Danke für den ausführlichen Text Augenzwinkern

Ich weiß nur den Namen und das das eine Musikschule ist und näheres wird mir erst in der nächsten Infostunde gesagt (12.1).Aber ich Rechne so dass ich 1 Monat Zeit dafür habe und ich kann dir auch noch mal schreiben, wenn ich das weiß.

08.01.2011, 19:00

Auf diesen Beitrag antworten »

aal

Lern einfach html...3 Frames, ein Conten, ein Header und ein Naviframe.
und fertig ;D

10.01.2011, 10:45

Auf diesen Beitrag antworten »

MaBa

Von "einfach" HTML ist abzuraten, da viele Tags, etc. als deprecated markiert sind und HTML nur noch für die reine Strukturierung verwendet werden sollte.
Natürlich muss man immer den Nutzen und den Aufwand zueinander ins Verhältnis setzen. Bei einem Monat Zeit würde ich aber auf jeden Fall mal in CSS reinschauen. Ich wette, dass sich das überaus positiv auf die Note auswirken wird. Vor allem wenn man die Verwendung von CSS richtig motiviert und auf die Vorteile verweist.

Ich würde das mit dem Lehrer im Vorfeld einfach kurz besprechen, dann bist du auf jeden Fall auf der sicheren Seite.

10.01.2011, 13:46

Auf diesen Beitrag antworten »

Blackarro

Kann ich ja alles ^^

10.01.2011, 13:47

Auf diesen Beitrag antworten »

Blackarro

ja kann ich mal machen

10.01.2011, 13:48

Auf diesen Beitrag antworten »

Blackarro

Danke nochmal für die Info Augenzwinkern

15.01.2011, 15:00

Auf diesen Beitrag antworten »

Blackarro

Hier sind ein Paar Sachen, wie wir sie Schreiben sollen :

Homepage - Seiten:

► Lehrkräfte

► Lernangebote

► Anmeldung

► Veranstaltungen (Termine) die sich immer aktualisieren

► Presse (Zeitungsartikel)

► Downloads wie Termine, die per Klick gedruckt werden

► Bildergalerie

Was ich bis jetzt habe:

► Die Frames also die einzelnen Seiten (Noch nicht alle geschrieben)

► Logo

► und ein bisschen von Lehrkräften

Noch mal zur Erinnerung, die Seite soll ungefähr so aussehen wie diese:
http://www.musikschule-forte-piano.de/cm...eber_uns-2.html

Und so ein Head haben wie diese:
http://www.musikschulen.de/

Das ist der Code für die Seite die ich bis jetzt geschriben habe :

code:

1:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><HTML><HEAD><TITLE> Animal-Homepage <TITLE><CENTER> <H1> Die Tierwelt - interaktiv <H1> </CENTER><!--Linie Oben Anfang--><HR SIZE="3" WIDTH="90%" NOSHADE><!--Linie Oben Ende--><BR><!--Hintergrundfarbe Anfang--><BODY BGCOLOR="SILVER"><!--Hintergrundfarbe Ende--><!--TABLE Anfang--><TABLE ALIGN=CENTER BOARDER=0><TR><TD><A HREF="Spitzmaulnashorn.HTML" <IMG SRC="spitzmaulnashorn.jpg" width=150 Height=100> </A><TD><A HREF="N.HTML" <IMG SRC="ameisenbär.jpg"width= 150 Height=100> </A><TD> <A HREF="kaenguru.HTML" <IMG SRC="kaenguru.jpg"width= 120 Height=100></A><TD><A HREF="teddybär.HTML" <IMG SRC="teddybär.jpeg"width= 100 Height=100></A></TR></TABLE><!--TABLE Ende--><BR><!--Linie Unten Ende--><HR SIZE="3" WIDTH="90%" NOSHADE><!--Linie Unten Ende--><CENTER> <H4> Klicken Sie auf das Tier, von dem Sie mehr Informationen wünschen!<H4> </CENTER></HEAD><BODY></BODY></HTML>

15.01.2011, 15:04

Auf diesen Beitrag antworten »

Blackarro

Hier sind ein Paar Sachen, wie wir sie Schreiben sollen :

Homepage - Seiten:

-> Lehrkräfte

-> Lernangebote

-> Anmeldung

-> Veranstaltungen (Termine) die sich immer aktualisieren

-> Presse (Zeitungsartikel)

-> Downloads wie Termine, die per Klick gedruckt werden

-> Bildergalerie

Was ich bis jetzt habe:

-> Die Frames also die einzelnen Seiten (Noch nicht alle geschrieben)

-> Logo

-> und ein bisschen von Lehrkräften

Noch mal zur Erinnerung, die Seite soll ungefähr so aussehen wie diese:
http://www.musikschule-forte-piano.de/cms/Wir_ueber_uns-2.html

Und so ein Head haben wie diese:
http://www.musikschulen.de/

Das ist der Code für die Seite die ich bis jetzt geschriben habe :

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><HTML>
<HEAD>
<TITLE> Animal-Homepage <TITLE>
<CENTER> <H1> Die Tierwelt - interaktiv <H1> </CENTER>
<!--Linie Oben Anfang-->
<HR SIZE="3" WIDTH="90%" NOSHADE>
<!--Linie Oben Ende-->
<BR>
<!--Hintergrundfarbe Anfang-->
<BODY BGCOLOR="SILVER">
<!--Hintergrundfarbe Ende-->
<!--TABLE Anfang-->
<TABLE ALIGN=CENTER BOARDER=0>
<TR>
<TD>
<A HREF="Spitzmaulnashorn.HTML" <IMG SRC="spitzmaulnashorn.jpg" width=150 Height=100> </A>
<TD>
<A HREF="N.HTML" <IMG SRC="ameisenbär.jpg"width= 150 Height=100>
</A>
<TD>
<A HREF="kaenguru.HTML" <IMG SRC="kaenguru.jpg"width= 120 Height=100>
</A>
<TD>
<A HREF="teddybär.HTML" <IMG SRC="teddybär.jpeg"width= 100 Height=100>
</A>
</TR>
</TABLE>
<!--TABLE Ende-->
<BR>
<!--Linie Unten Ende-->
<HR SIZE="3" WIDTH="90%" NOSHADE>
<!--Linie Unten Ende--><CENTER>
<H4> Klicken Sie auf das Tier, von dem Sie mehr Informationen wünschen!<H4> </CENTER>
</HEAD>
<BODY>
</BODY>
</HTML>

02.02.2011, 20:57

Auf diesen Beitrag antworten »

compufreak

Hey,
wenn du noch konkrete Hilfe brauchst, sag Bescheid Augenzwinkern

Übrigens hab ich mir mal (ganz kurz) deinen Quellcode oben angesehen... oha!
Lernt ihr das so in der Schule?????
Das ist ziemlich veraltet. HTML 4.01 ist von 1999. Also ungefähr 12 Jahre alt. Inzwischen gibt es HTML5 oder XHTML. Die Tags sollten eigentlich auch nicht mehr groß geschrieben werden. Wahrscheinlich verwendet dein Lehrer auch den font-Tag?
Oh Mann, die Schulen von heute XD

Egal. Wenn dein Lehrer das so will...

lg,
Compufreak

10.02.2011, 16:02

Auf diesen Beitrag antworten »

Blackarro

Ne das mit dem großschreiben mach ich selber, find ich übersichtlicher Augenzwinkern

10.02.2011, 16:07

Auf diesen Beitrag antworten »

Blackarro

Hab jetzt ein neues Problem:
dieser Code geht nur bei Firefox also nicht bei Internet Explorer

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Downloads<TITLE>
</HEAD>
<BODY>
<BODY BGCOLOR="#FECA12">
<H3> Hier stellen wir Ihnen zur Verfügung:  </H3>
<CENTER>
Unterrichtsvertrag 
<BR>
<!--Anfang Unterrichtsvertrag 2011 Download-->
<a href="Unterrichtsvertrag.doc"> <img src="Upload/Bilder/pdf.gif" title="Unterrichtsvertrag"
border="0" width="27" height="34"> </a> 
</p>
<!--Ende Unterrichtsvertrag 2011 Download-->

auf eine Hilfreiche Antwort wäre ich sehr dankbar ^^
<BR>
<BR>
Gebührenblatt 
<BR>
<!--Anfang Gebührenblatt 2011 Download-->
<a href="Gebührenblatt.doc "> <img src="Upload/Bilder/pdf.gif" title="Gebührenblatt"
border="0" width="27" height="34"> </a> 
</P>
<!--Ende Gebührenblatt 2011 Download-->
<BR>
<BR>
Alles Downladen
<BR>
<!--Anfang Alles 2011 Download-->
</p><a href="Schülervertrag 2011.doc"> <img src="Upload/Bilder/pdf.gif" title="Alles Downloaden"
border="0" width="27" height="34"> </a> 
</p>
<!--Ende Alles 2011 Download-->
<BR>
</CENTER>
</BODY>
</HTML>

und dieser Code geht nur beim Internet Explorer also nicht bei Firefox

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:

<html>
<title>Über uns</title>
<head>
<body bgcolor="#ffff99">
<font face="Comic Sans MA">
<h2> <center>Willkommen! </center> </h2>

<center> Wir begrüßen sie auf der Internetseite der Schule für Musik. </center>
<p>
<center> Das Musizieren gehört zu den menschlichen Lebensäußerungen wie die Sprache.
Und ähnlich wie eine Sprache will es auch gelernt sein. </center>
<p>
<center> Mit guter fachlicher Anleitung und anderen zusammen macht das am meisten Spass. </center> 
<p>
<center>Der Erfolg unserer Musikschule ist vor allem auf das erfahrene und engagierte Team aus professionellen Musikern und ein breites Angebot an Fächern zurückzuführen.
 
Mittlerweile besteht unser Team aus 6 Pädagogen, die ihr Wissen in verschiedensten Fächern wie Klavier, Geige, Akkordeon, Querflöte, Gitarre, E-Gitarre, Saxofon, Klarinette, Keyboard, Gesang und Musikalische Früherziehung vermitteln.</center>
<p> 
<center> Des Weiteren bieten wir eine Vielzahl an interessanten Kursen für Kleinkinder an, die ihnen viel Freude bereiten.</center>
<p> 
<center>Ihre Baumberger Schule für Musik e.V.</center>
<center> <img src="X:\Freie Ablage\neu\Upload\Bilder\Bild 2 Musikklasse Okt 10.JPG" WIDTH="645" HEIGHT="320"> </center>
</Font> 
</body>
</html>

11.02.2011, 08:11

Auf diesen Beitrag antworten »

MaBa

Hallo Blackarro,

ich muss jetzt doch mal fragen, warum du hier im Forum postest, wenn du doch sowieso alle Hinweise in den Wind schlägst? Was genau erwartest du denn?

Zitat:

aber in HTML bin ich richtig gut

Dann versuch zumindest von deinem antiquierten Code abzurücken.

Zitat:

dieser Code geht nur bei Firefox also nicht bei Internet Explorer

Zitat:

und dieser Code geht nur beim Internet Explorer also nicht bei Firefox

Selbst mit gutem Willen kann dein Lehrer dir unter den Randbedingungen keine befriedigende Note mehr geben.

Die Zeit läuft, wenn ich dich richtig verstanden habe. Wenn du jetzt aktiv wirst und etwas Zeit investierst kann bestimmt noch eine anständige Leistung raus kommen.

Die Struktur deiner Website hast du im Kopf nehme ich an. Dann arbeite erst mal an einem Layout für die einzelnen Seiten. Verwende dort gleich sauberes (X)HTML. Verzichte z.B. auf das veraltete font-Tag, beachte den Kommentar von compufreak. Auch solltest du die Pfade zu deinen Bildern nicht absolut setzen.

Zitat:

Wenn die Seite auf einem Webserver liegt, wird das Bild kaum auf dem Laufwerk "X" gefunden werden. Verwende stattdessen relative Pfade.

Wenn du mit einer Seite fertig bist, check deinen Code am besten mit dem W3C Markup Validator Service.

Viele Grüße,
MaBa

13.02.2011, 17:45

Auf diesen Beitrag antworten »

compufreak

Also ich hab den Code nur kurz überflogen und dabei direkt ein paar komische Fehler (neben den bereits genannten) entdeckt.

Im ersten Code zum Beispiel öffnest du zweimal den Body-Tag. Das ist falsch.
Dann fängst du direkt mit H3 anstatt mit H1 an. Das ist sinnlos.
Und dann schließt du andauernd p-Tags die du nie geöffnet hast?
Vielleicht ein Copy&-Patse-Fehler? Lehrer

Im zweiten Code fehlt als erstes der Doctype. Dann steht das title-Element außerhalb des Head-Bereiches, welcher übrigens auch nicht geschlossen wurde. Zunge raus

Dann ist da noch der Font-Tag XD
Und du fängst mit H2 anstatt mit H1 an?! Oo
Danach machst du das Gegenteil des oben beschriebenen Fehlers: Du öffnest andauernd p-Tags ohne mal welche zu schließen!

Versteh' dies bitte als konstruktive Kritik. Ich möchte dich nicht ärgern, aber du solltest dich entweder besser konzentrieren oder die Grundlagen wiederholen. Wenn du letzteres tust, dann lerne am besten gleich die Grundlagen einer aktuellen Version!

Viel Glück und lg,
compufreak

Neue Frage »

Antworten »

Informatikarbeit Klasse 9 Homepage programieren

Verwandte Themen