IFD:WebApps/Carlo E. - Rakete Örschdorf.de: Difference between revisions

From Medien Wiki
 
(26 intermediate revisions by the same user not shown)
Line 1: Line 1:
== www.rakete-oerschdorf.de ==
== www.rakete-oerschdorf.de ==


===Beschreibung===
===BESCHREIBUNG===
 
[[File:Logo.png|right]]
Es ist eine Website, die den Verein nach Außen hin repräsentiert.
Es handelt sich hierbei um eine Website, die den Verein nach Außen hin repräsentiert.
<br />
Bei dem Verein handelt es sich um einen Sport- und Freizeitverein, dem jeder,
<br />
<br />
vorausgestzt er ist damit einverstanden dass der Verein politisch, rassisch und konfessionell neutral ist.
Bei dem Verein handelt es sich im engeren Sinn um einen Sport- und Freizeitverein, dem jeder, vorausgestzt er ist damit einverstanden dass der Verein politisch, rassisch und konfessionell neutral ist, beitreten kann.
<br />
<br />
Der Verein kann zudem seine Mitgleider über die neusten und wichtigsten termine informieren.
Der Verein kann zudem seine Mitgleider über die neusten und wichtigsten Termine schnell und zuverlässig informieren.


===Design / Screenshots===
===DESIGN / SCREENSHOTS===


Die gesamte grafische Oberfläche der Homepage soll nicht zu "übertrieben" sein.
Die gesamte grafische Oberfläche der Homepage soll nicht zu "übertrieben" sein.
<br />
<br />
Dennoch muss die sportliche als auch die dynamische Aussagekraft des Vereins repräsentiert werden.
Dennoch muss die sportliche als auch die dynamische Aussagekraft des Vereins repräsentiert werden.
<br />
<br />
MODERN | EINFACH | EINLADEND | AUSSAGEKRÄFTIG | REPRÄSENTATIV
<br />
<br />
All das sollen Eigenschaften der Homepage sein und verwirklicht werden.


<br />
<br />
Line 21: Line 25:
====Design #1====
====Design #1====


<br />
[[File:homenew.jpg|200px]]
 
[[File:kontaktnew.jpg|200px]]
[[File:screenshot 1.jpg|400px]]
[[File:screenshot 2.jpg|400px]]
[[File:screenshot 3.jpg|400px]]


<br />
<br />


====Design #2====
====Design #2====
[[File:design3.1.jpg|200px]]
[[File:design3.2.jpg|200px]]


<br />
<br />


[[File:homenew.jpg|400px]]
====Design (Final)====
[[File:kontaktnew.jpg|400px]]
 
[[File:final1.jpg|200px]]
[[File:final2.jpg|200px]]
[[File:final3.jpg|200px]]


<br />
<br />


Der aktuelle Fortschritt kann auf http://www.rakete-oerschdorf.de] verfolgt werden.
Der aktuelle Fortschritt und komplette Umfang kann auf http://www.rakete-oerschdorf.de verfolgt werden.


===Umsetzung===
===UMSETZUNG===


Die gesamte Seite wird im Grunde mittels HTML, CSS, JavaSrcipt und PHP dargestellt.
Die gesamte Seite bzw. Teile werden im Grunde mittels '''''HTML, CSS, JavaSrcipt, JQuery''''' und '''''PHP''''' dargestellt.
<br />
<br />
Das Kontaktformular, Gästebuch, die Funktion "Neuigkeit hinzufügen", den Bild- und Videoupload werden mit Hilfe von PHP umgesetzt.
Das Kontaktformular, Gästebuch und der Administratorenbereich werden mit Hilfe von '''''PHP''''' und '''''mySQL''''' umgesetzt.
<br />
<br />
Für diese Funktionen werde ich wohl eine Datenbank oder CMS verwenden müssen.
Für diese Funktionen werde ich eine Datenbank verwenden.
<br />
<br />
Da ich damit noch nie gearbeitet habe, werde ich mich intensiv damit befassen, um die Website im vollem Maße nutzen zu können.
Da ich damit noch nie gearbeitet habe, werde ich mich intensiv damit befassen, um die Website im vollem Maße nutzen zu können.
<br />
Alle Funktionen und Unterseiten, die geplant waren, werden umgesetzt und haben sich von Design zu Design lediglich in ihrem Aussehen, aber nicht in ihre Funktionsweise geändert.
<br />
Als erstes hatte ich mir überlegt, was eine gute Vereinsseite alles beinhalten sollte und einen Verein am besten repräsentiert. Zunächst sollten auf der Startseite sofort die News ersichtlich sein, um unnötige Suchereien auf der Website nach wichtigen Terminen zu vermeiden. Um doch mal wieter entfernte Termine nachzuschauen wurde ein Kalender aufgesetzt, der für die letzten Jahre ein Archiv anlegt. Da kein Geburtstag im Verein in Vergessenheit geraten soll, kann man einen Geburtstagskalender aufrufen, der einem am Anfang schon mitteilt wer in den nächsten 14 Tagen >Geburtstag hat. Eine kurze Vorstellung des Clubs darf natürlich auch nicht fehlen und somit wurde die Rubrik Verein (Chronik/Gremien/Mitgliedschaft/Ordnungen) geschaffen. Medien (Bilder/Videos) und die Nennung der Sponsoren als auch Helfer durfte natürlich auch nicht vernachlässigt werden. Zu guter letzt kam noch ein Gästebuch hinzu, um dem Verein Danksagungen, Anregungen und Kritik mitzuteilen.
Als bisher Letztes wurde eine Suchfunktion in die Website integriert.
Derzeit arbeite ich daran der Seite einen noch individuelleren Charakter, durch eigene Buttons, zu geben
====Techniken/Sprachen====
* HTML
* CSS
* JavaScript
* JQuery
* Datenbank
* Adope Photoshop CS5
* Notepad++
====Auszug aus dem Newssystem:====
====add_news====
<source lang="php" line start="1">
<?php
include_once("connect.php");
$title = $_POST['title'];
$text = $_POST['text'];
if($_POST['send'])
{
if($title && $text)
{
mysql_query("INSERT INTO `news`(`title`, `text`) VALUES('$title','$text')") or die ( mysql_error() );
die('<p>News wurden hinzugefügt!</p><p><a href="http://www.rakete-oerschdorf.de/index.php">zur Startseite</a></p>');
}
echo 'formular gesendet!';
}
?>
<form action='admin_area.php' method='POST'>
<table>
  <tr>
      <td width="175"><p>Titel (max. 100 Zeichen)</p></td>
      <td><input id='news_title' class='text' type='text' maxlength="100" name='title' /></td>
  <td></td>
  </tr>
  <tr valign='top'>
      <td><p>Neuigkeit</p></td>
      <td><textarea id="news_text" name='news' cols='40' rows='10'></textarea></td>
  <td></td>
  </tr>
  <tr>
      <td>&nbsp;</td>
      <td><input type='reset' /><input type='submit' name='send' value='Mitteilen' /></td>
  <td></td>
  </tr>
</table>
</form>
</source>
====get_news====
<source lang="php" line start="1">
<?php
include_once("connect.php");
$query = mysql_query("SELECT * FROM news ORDER BY id DESC") or die (mysql_error());
while($row = mysql_fetch_array($query))
{
print "<div class='news'>";
print "<b><p><font color='#ff8800'>" . $row['title'] . "</font></p></b>";
print "<p>" . $row['text'] . "</p>";
print "</div>";
}
?>
</source>
===ZUKUNFT===
Für die Zukunft ist ein Forum geplant, um den intensiven Austausch zwischen den einzelnen Vereinsmitgliedern zu gewährleisten.
<br>
Zudem wird es eine Art TV (Ö-TV) geben, mit dem der Verein via Livestream von aktuellen Turnieren und Veranstaltungen sendet, aber auch ältere Videos abgerufen werden können.


===Qhellen / Hilfen===
===Quellen / Hilfen===


[http://www.selfhtml.org www.selfhtml.org]
[http://www.selfhtml.org www.selfhtml.org]

Latest revision as of 17:30, 15 March 2011

www.rakete-oerschdorf.de

BESCHREIBUNG

Logo.png

Es handelt sich hierbei um eine Website, die den Verein nach Außen hin repräsentiert.
Bei dem Verein handelt es sich im engeren Sinn um einen Sport- und Freizeitverein, dem jeder, vorausgestzt er ist damit einverstanden dass der Verein politisch, rassisch und konfessionell neutral ist, beitreten kann.
Der Verein kann zudem seine Mitgleider über die neusten und wichtigsten Termine schnell und zuverlässig informieren.

DESIGN / SCREENSHOTS

Die gesamte grafische Oberfläche der Homepage soll nicht zu "übertrieben" sein.
Dennoch muss die sportliche als auch die dynamische Aussagekraft des Vereins repräsentiert werden.

MODERN | EINFACH | EINLADEND | AUSSAGEKRÄFTIG | REPRÄSENTATIV

All das sollen Eigenschaften der Homepage sein und verwirklicht werden.


Design #1

Homenew.jpg Kontaktnew.jpg


Design #2

Design3.1.jpg Design3.2.jpg


Design (Final)

Final1.jpg Final2.jpg Final3.jpg


Der aktuelle Fortschritt und komplette Umfang kann auf http://www.rakete-oerschdorf.de verfolgt werden.

UMSETZUNG

Die gesamte Seite bzw. Teile werden im Grunde mittels HTML, CSS, JavaSrcipt, JQuery und PHP dargestellt.
Das Kontaktformular, Gästebuch und der Administratorenbereich werden mit Hilfe von PHP und mySQL umgesetzt.
Für diese Funktionen werde ich eine Datenbank verwenden.
Da ich damit noch nie gearbeitet habe, werde ich mich intensiv damit befassen, um die Website im vollem Maße nutzen zu können.
Alle Funktionen und Unterseiten, die geplant waren, werden umgesetzt und haben sich von Design zu Design lediglich in ihrem Aussehen, aber nicht in ihre Funktionsweise geändert.
Als erstes hatte ich mir überlegt, was eine gute Vereinsseite alles beinhalten sollte und einen Verein am besten repräsentiert. Zunächst sollten auf der Startseite sofort die News ersichtlich sein, um unnötige Suchereien auf der Website nach wichtigen Terminen zu vermeiden. Um doch mal wieter entfernte Termine nachzuschauen wurde ein Kalender aufgesetzt, der für die letzten Jahre ein Archiv anlegt. Da kein Geburtstag im Verein in Vergessenheit geraten soll, kann man einen Geburtstagskalender aufrufen, der einem am Anfang schon mitteilt wer in den nächsten 14 Tagen >Geburtstag hat. Eine kurze Vorstellung des Clubs darf natürlich auch nicht fehlen und somit wurde die Rubrik Verein (Chronik/Gremien/Mitgliedschaft/Ordnungen) geschaffen. Medien (Bilder/Videos) und die Nennung der Sponsoren als auch Helfer durfte natürlich auch nicht vernachlässigt werden. Zu guter letzt kam noch ein Gästebuch hinzu, um dem Verein Danksagungen, Anregungen und Kritik mitzuteilen. Als bisher Letztes wurde eine Suchfunktion in die Website integriert. Derzeit arbeite ich daran der Seite einen noch individuelleren Charakter, durch eigene Buttons, zu geben

Techniken/Sprachen

  • HTML
  • CSS
  • JavaScript
  • JQuery
  • Datenbank
  • Adope Photoshop CS5
  • Notepad++

Auszug aus dem Newssystem:

add_news

<?php
include_once("connect.php"); 

$title = $_POST['title'];
$text = $_POST['text'];

	if($_POST['send'])
	{
	


		if($title && $text)
		{
			mysql_query("INSERT INTO `news`(`title`, `text`) VALUES('$title','$text')") or die ( mysql_error() );

			die('<p>News wurden hinzugefügt!</p><p><a href="http://www.rakete-oerschdorf.de/index.php">zur Startseite</a></p>');
		}
		
	echo 'formular gesendet!';

	}
?>
<form action='admin_area.php' method='POST'>
<table>
   <tr>
      <td width="175"><p>Titel (max. 100 Zeichen)</p></td>
      <td><input id='news_title' class='text' type='text' maxlength="100" name='title' /></td>
	  <td></td>
   </tr>
   <tr valign='top'>
      <td><p>Neuigkeit</p></td>
      <td><textarea id="news_text" name='news' cols='40' rows='10'></textarea></td>
	  <td></td>
   </tr>
   <tr>
      <td>&nbsp;</td>
      <td><input type='reset' /><input type='submit' name='send' value='Mitteilen' /></td>
	  <td></td>
   </tr>
</table>
</form>

get_news

<?php
include_once("connect.php");

$query = mysql_query("SELECT * FROM news ORDER BY id DESC") or die (mysql_error());

while($row = mysql_fetch_array($query))
{
print "<div class='news'>";
print "<b><p><font color='#ff8800'>" . $row['title'] . "</font></p></b>";
print "<p>" . $row['text'] . "</p>";
print "</div>";
}
?>

ZUKUNFT

Für die Zukunft ist ein Forum geplant, um den intensiven Austausch zwischen den einzelnen Vereinsmitgliedern zu gewährleisten.
Zudem wird es eine Art TV (Ö-TV) geben, mit dem der Verein via Livestream von aktuellen Turnieren und Veranstaltungen sendet, aber auch ältere Videos abgerufen werden können.

Quellen / Hilfen

www.selfhtml.org
www.phpbox.de
www.schattenbaum.net/php

Einige andere Hilfen wie Foreneinträge und Tutorials.