Eine Homepage erstellen

Ich habe versucht 2 Homepages zu erstellen. Eine mittels HTML, Javascript und PHP und eine mittels WordPress.

Die HTML Homepage bietet Webinare für Chat-GPT an.
Die WordPress Homepage ist mein eigener Blog.

Das Konzept der HTML Seite ist äusserst simpel. Es ist sehr textlastig und gefälllt mir weniger. Die WordPress Seite gefällt mir besser. Hier konnte ich auch mit diversen Plug-Ins herumprobieren und auch das einbetten von Bildern war einfacher.

Ein verwendetes Plug-In war JetPacket. Damit kann man diverse Sachen anstellen, ich habe es zum erstellen einer stylishen Gallerie verwendet. Die Bedienung war sehr simpel, das fand ich toll. Einziges Problem ist, dass man sich einen JetPacket Account erstellen muss was ich etwas unschön finde.

Auch gefällt mir bei WP die eingebaute Kommentarfunktion. Die Kommentare kriegt man hübsch aufgelistet im Admin-Menu (wie ein Email-Postfach). Auch sind dort Spam und Beleidigungen nicht möglich, da alle Kommentare zuerst noch vom Admin freigeschaltet werden müssen.

Fazit:

Ich muss sagen, dass mir der Ansatz mit WordPress deutlich besser gefällt.

Ich finde, dass die WordPress-Seite mit deutlich weniger Aufwand deutlich hübscher aussieht. Um mir eine Homepage komplett selbst zu gestalten müsste ich diverse Programmiersprachen lernen und selbst dann würde es vermutlich weniger hübsch aussehen als bei einem Anbieter wie WordPress.

Anbieter wie WordPress sparen deutlich Zeit und wenn man sich die Homepage selber gestalten will und keine grossen technischen Fähigkeiten hat ist dieser Ansatz deutlich besser.

hofallmend.ch

hofallmend.ch (hasn.ch)https://hasn.ch/students/25-winzenried/1%20Webseite%20Hof%20Allmend/index.html

Für das Modul Webtechnologien und Webdesign habe ich mit HTML eine Webseite für unseren Landwirtschaftsbetrieb erstellt.

Auf der Einstiegsseite sind die wichtigsten Infos über den Hof zu finden

Unter der Rubrik „Hof“ werden die Betriebszweige vorgestellt

Beim Betriebszweig BnB wird das Angebot gezeigt. Ausserdem ist ein google Kalender eingebettet welcher darüber Auskunft gibt an welchen Daten das Zimmer verfügbar ist..

Fazit für den Kurs:

  • Spannende Inputs zu HTML / CSS / PHP
  • Java =

Die Welt der KI’s

Das Ziel dieser Webseite ist es, einen allgemeinen Überblick über verschiedene Einsatzmöglichkeiten von KI’s zu schaffen. Daher erstellte ich eine Seite zu ChatGPT, DALL-E 2 und weiteren möglichen Einsatzmöglichkeiten. Dazu wurde sehr viel dieser Webseite mit Hilfe einer KI erstellt. Insbesondere der Text wurde fast ausschliesslich durch eine KI (ChatGPT) geschrieben.

Startseite ohne Header

Auch der rote Botton, welcher auf jeder Seite in der Fusszeile zu finden ist, wurde mit Hilfe einer KI programmiert. Beim Drücken dieses Knopfes, wird man automatisch auf eine Seite weitergeleitet, auf der erklärt wird, wie dieser Knopf funktioniert. Ausserdem befindet sich eine Bildergalerie auf der Startseite, welche mit dem Plugin Jetpack erstellt wurde.

Roter Knopf

Das Logo der Webseite wurde ebenfalls mittels einer KI (DALL-E 2) erstellt.

Webseiten Logo

Die Seite Blog, stellt einen Überblick dar, inklusive einer kurzen Vorschau, über die aktuellen Beiträge. Am Ende der Vorschau gibt es einen Link zum ganzen Beitrag.

Die Blog Seite

Am Ende jedes Beitrages hat man die Möglichkeit einen Kommentar zu hinterlassen. Diese müssen anschliessend noch freigeschaltet werden.

Komentarfunktion

Ein zusätzlicher Nutzer Namens Hans Mustermann wurde auch erstellt. Er hatt die funktion eines Autors.

Benutzer

Zur Programmierung des Kontaktfeldes wurde das Plugin Contact Form 7 benutzt. Bei diesem Schritt wurde ausserdem ein reCaptcha 3 eingefügt, um sicher zu stellen, dass ein Mensch das Kontaktformular ausfüllt.

Kontaktformular

Ausserdem wurden auf der Seite KI generierte Serie 2 Videos von Youtube verlinkt.

KI generierte Serie

Das Design der Webseite wurde mit Hilfe von den Vorlagen von WordPress erstellt. Dazu gehörte auch der Header, inklusive der möglichkeit die weiteren Seiten zu verlinken.

Header

Über diesen Header sind alle Seiten zugänglich ausser die Seite mit der Beschreibung des roten Konpfes. Ein kleines EasterEgg hat noch nie geschadet ;).

Wandern in den Italienischen Alpen

Die Webseite wurde erstellt für Wanderliebhaber, die sich gerne weiter über den Wandersport informieren und sich gerne einige Tipps einholen. Es wurden die Plug ins Jetpack und Robo Gallery verwendet. Das Design wurde möglichst simpel und clean gehalten für eine gute Übersicht und eine gute Wissensübertragung. In diesem Beitrag wird die Webseite kurz vorgestellt.

Startseite

Startseite der Webseite

Auf der Ersten Abbildung sehen sie die Startseite der Webseite. Die Webseite ist unterteilt in Seiten: Startseite, Routenplanung, Musik beim Wandersport und Kontakt. Neben den Seiten gibt es noch die Beiträge des Blogs: Gesund durch den Wandersport, Beliebte Wanderrouten in den Italienischen Alpen, Wanderregionen in den Italienischen Alpen und Hallo Wanderwelt. Eine Suchfunktion lässt bestimmte Themen, Seiten oder Einträge schnell ausfindig machen.

Schlagwörterfunktion und Kommentarfunktion

Hier sehen sie die Schlagwörterfunktion und die Kommentarfunktion die unter jedem Beitrag und jeder Seite zu sehen ist.

Slideshow

Slideshow

Auf einer Seite habe ich eine Slideshow mit Bildern von den Italienischen Alpen hinzugefügt mithilfe eines Plugins.

Footer

Footer der Website

Auf dieser Abbildung sehen sie den Footer der Webseite. Dieser Footer ist aufgebaut aus dem Archiv der Beiträge, den Kategorien der Seiten und Beiträge und die häufigsten Schlagwörter, mit denen man schnell zu einer passenden Seite oder einem passenden Beitrag kommt. Oberhalb des Footers kann man mit zwei Buttons einen Beitrag oder Seite vor oder zurück gehen.

Beispiel einer Seite

Seite Routenplanung

Auf dieser Abbildung sieht man ein Beispiel für den Anfang einer Seite. Auf dieser Seite geht es darum, wie man die Route für eine Wanderung plant.

Spotifyinput

Spotify

Bei der Seite Musik beim Wandersport, habe ich eine Spotifyplaylist eingefügt, die beliebte Hiking Songs abspielt.

Kontakt

Auf der Kontaktseite können die Betrachter Kontaktaufbauen mit den Besitzern der Seite, in diesem Beispiel Herr Mustermann.

Mit diesem Kontaktformular können die Betrachter direkt in Kontakt treten mit den Besitzern oder Mitarbeitern der Website.

A self Study of my work

In dieser Blockwoche war es mein Ziel ein Portfolio für mein grosses grosses Hobby machen. Das Fotografieren.

Dieses Ziel Konnte ich zu gewissem masse erreichen, ich merkte welcher Aufwand hinter einer Website steckt und entschied mich einige Bilder auf eine Website zu laden und diese zu bewerten, des weiteren war es ein grosses Ziel ein Tic-Tak-Toe auf meiner Seite zu haben. Ich habe auch ein Foto als Header über dem Header eingefügt.

Beim Design der Seite habe ich das Standartlayout der vorgegebenen Seite verwendet und die Farben ein wenig verändert und die Icons verändert.

Ich entschied mich für Brauntöne da diese in meinen Fotos auch stark vertreten sind.

Bei den Bildbeschrieben habe ich einen kleinen Text zum Bild, welcher die Kamera, die Location des Bilds und die Wahl des Films kurz Beschreibt.

Ein wenig spass durfte natürlich auch nicht fehlen, ich habe am Anfang de woche in funktionierendes Tic-Tac-Toe gefunden. Das musste fast auf meine Seite. Darum habe ich es auch hinzugefügt.

Kleiner Lernspass

Im Rahmen des Wahlmoduls Webdesign und Webtechnologien haben wir (Marco Wiedmer und Fabienne Jakob) eine WordPress Webseite erstellt, die wir hier vorstellen werden.

Die Webseite stellt das Einzelunternehmen „Kleiner Lernspass“ vor, welches Nachhilfe Unterricht in Biberist anbietet. Auf der Seite „Start“ und „Über uns“ erhalten die Kundinnen und Kunden einen ersten Einblick in das Unternehmen. Navigieren zwischen den Seiten können sie mittels Menüleiste.

Anschliessend können sich die Kunden über zwei verschiedene Angebote informieren: das Lerncoaching und die Schulstoffbegleitung für das Übertrittsverfahren von der Primarschule zur Sekundarschule. Dabei sind die zwei Unterseiten (Lerncoaching und Schulstoffbegleitung) auf der Seite „Angebot“ verlinkt. Zusätzlich sind sie auch noch als Drop-Down unter dem Angebot in der Menüleiste ersichtlich.

Um eine Nachhilfelektion zu buchen, können die Kunden auf der Seite „Kontakt“ mit der Administration des Kleinen Lernspass Kontakt aufnehmen. Dies können sie telefonisch oder via Kontaktformular machen.

Weiter hat es verschiedene Beiträge rund um das Thema Nachhilfeunterricht auf der Seite „Beiträge“.

Zuletzt hat es auch noch eine Seite über Jobs. Das Unternehmen ist ständig auf der Suche nach neuen Nachhilfelehrpersonen, weshalb sich Interessentinnen und Interessenten per Mail melden können.

HAFL – Groupe biblique

Notre site a été conçu dans le cadre du cours BUUx442 „Programmation et graphisme pour le web“. Ce cours nous a permis de nous familiariser et progresser dans l’utilisation de langage informatique tels que html, CSS, PhP, javascript ainsi que dans le fonctionnement d’un serveur Internet. Le site présenté ci-dessous a été réalisé avec l’outil WordPress.

Ce site a pour but de rassembler les étudiants de la HAFL qui cherchent à connaître Dieu au travers de la Bible et à se réunir autour de leur Foi commune en Jésus-Christ.

Notre vœu est également de permettre des échanges plus larges, avec tous ceux qui cherchent comme nous des réponses à notre monde. Il y a tant besoin d’espoir, de justice, de solidarité, et pourtant l’on se heurte à de nombreuses limites.

Nous vous invitons à découvrir notre site internet…

Menus

Nos menus permettent de sélectionner la langue et de naviguer entre les différents thèmes.

Page d’accueil

La page d’accueil présente les articles récents, ainsi qu’une introduction aux principaux onglets. En cliquant sur „lire plus“, on arrive directement sur la page correspondante.

Contenu

Les articles peuvent être ajoutés au fur et à mesure dans les différents menus. Nous avons installé une extension qui propose chaque jour un court texte de la Bible. Ce verset est présent sur toutes les pages, dans la colonne de gauche.

Calendrier interactif

Comme nous souhaitons nous rencontrer en diverses occasions, un calendrier permet de publier les prochains événements de manière claire.

Forum

Le but de cette association est aussi de stimuler la réflexion de chacun sur des sujets existentiels ou des sujets d’actualités. L’idée de Forum, lieu de discussions et d’échanges civilisés sied parfaitement à cette idée.

Le forum permet de lancer des sujets de réflexion. Ces sujets peuvent être repris dans les rencontres ou dans les discussions de tous les jours pour ne pas sans cesse parler de la météo ou des travaux à rendre.

Contact

Pour finir, nous avons créé une page „contact“, afin que vous puissiez nous reconnaître dans les couloirs ou nous écrire simplement un mail.

Nous serions heureux que cette idée que nous avons imaginée cette semaine puisse déboucher sur des échanges et de nouvelles rencontres, sous une forme ou une autre.

Swiss-Teddy-Doodle

Im Rahmen des Wahlmoduls Web-Technologien und Web-Design haben Michael Teutschmann und ich, Laura Kunz, die im Folgenden kurz vorgestellte WordPress-Webseite erstellt.

Wir haben eine Webseite für potenzielle Interessentinnen und Interessenten an einem Welpen der Rasse Australian Labradoodle ausgearbeitet. Die Webseite besteht aus verschiedenen Seiten, in welchen unter Anderem die Rasse Australian Labradoodle genauer beschrieben wird. Einige Aspekte zur Zucht sind aufgeführt und auch ein Blog besteht. Darüber hinaus verfügt die Webseite über einen kleinen Shop, über welchen Hundezubehör gekauft werden kann. Um den Überblick nicht zu verlieren, sind die verschiedenen Seiten in einem horizontalen Menüband angeordnet.

Die Startseite zeigt sich mit der Verlinkung der Blogbeiträge. Darin wird das Alltagsleben der Zuchthündin aufgeführt.

Startseite inkl. Blogbeitrag
Startseite inkl. Verlinkungen

Damit hundeliebhabende Personen mit der Züchterin in Kontakt treten können, müssen sie das unten aufgeführte Kontaktformular ausfüllen und absenden.

Kontaktformular

Der Webshop besteht aus den verschiedensten Artikeln, welche beim Kauf eines Hundes nicht wegzudenken sind.

Shop

Page sportive „Théo Rogivue“

Dans le but du module Web Technologie et Web design, j’ai du créer une page web pour pouvoir apprendre les bases des plateformes testée. En faisant de la lutte suisse à haut niveau, il est important pour moi de pouvoir partager mes émotions et mes résultats avec mes proches et les gens qui me soutiennent. Je partage beaucoup sur les réseaux sociaux et je trouvais très enrichissant de pouvoir créer une page web accessible à tout le monde pour partager mon évolution.

Paramètres de la page

Pour la confection de cette page, j’ai utilisé le serveur WordPress par le biais de Hostpoint.ch. J’ai choisis le thème ASHE pour ma base.

Page : menu

C’est la page qui apparait lorsqu’on arrive sur mon site. elle contient l’entièreté du site dessus. La première choses et une image avec mon nom pour mettre le contexte de la page

Le menu se trouve au milieu de la page, en appuyant sur un des thèmes proposé, on arrive directement vers l’article concerné. La fonction „rechercher“ se trouve à droite de l’écran et elle permet de faire une recherche spécifique. Le thème „HAUTE-BROYE“ est un lien direct qui arrive sur la page web du club des lutteurs de la haute-broye.

les articles

Différents articles sont présents sur la page. On peut aussi consulter les résultats des années précédentes :

colonne latéral

Dans la colonne latéral se trouvent la date et le lieu de mes prochaines compétitions programmées

Donas Wildkräutershop

Willkommen auf unserer Website! Wir haben qualitative Wildkräuter für dich, welche du via Online-Shop als auch direkt bei uns im Laden kaufen kannst.

Wir lieben den Geschmack von feinen Kräutern und sind beeindruckt von der bunten Vielfalt, den zahlreichen Aromen und der Kraft der Natur, die in ihnen steckt. Kein Kraut schmeckt wie das andere und jedes hat einen eigenen Charakter und ein eigenes Aroma. Das Wissen der Kräuter fasziniert und begeistert uns und ist unsere Passion. Egal ob du auf der Suche nach einem Wildkraut, Naturheilkraut oder essbaren Blüten bist, in unserem Dona Shop findest du nahezu jedes essbare Kraut, das bis dato erforscht wurde, in höchster Qualität und in seiner reinsten Form. Und weil das Wissen hinter den Kräutern ein sagenumwobener Schatz ist, findest du hier auch Informationen rund um Wildkräuter, die dich einladen, in dieses spannende Thema einzutauchen.

Auf der Homepage stellen wir unsere Seite vor. Hier haben wir auch ein Plugin verwendet, welches ein Karusell mit verschiedenen Bildern enthält. Das Design, welches wir verwendet haben ist „Green Environment“. Die Webseite wollten wir ansprechen, hell, freundlich und natürlich gestalten.

Im Menü haben wir diverse Unterkapitel zu den jeweiligen Themen erstellt.

In unserem Onlineshop kann man Produkte bestellen. Es gibt hier auch die Funktion „Mein Konto“, „Kasse“ und „Warenkorb“. Der Onlineshop wurde mittels des Plugins WooCommerce.

Auf der rechten Seite befinden sich die Beiträge als auch das Suchfeld und die neu erstellten Kommentare. Im Beitrag befindet sich zudem noch ein Link zu unserer HTML-Seite. Zudem steht unter dem Beitrag jeweils noch ein Kommentarfeld.

Dieser Beitrag wurde von Dominique Bürkli & Nadine Ursprung erstellt.