⚡️ 1. Begriffe der Webentwicklung
Front-End? CRUD? Domainname Service? Kleines Lexikon der Webentwicklung
Was versteht man unter Hosting?
Hosting ist eine Dienstleistung, bei der eine Webseite auf einem Server gespeichert wird, sodass diese im Internet abrufbar ist. Webhosting ist sozusagen der Grundstein, damit Privatpersonen oder Unternehmen ihre Internetseite veröffentlichen können. Neben Speicherplatz stellt ein Hosting-Anbieter auch zahlreiche Zusatzleistungen zur Verfügung. Die Kosten für kleinere Webseiten liegen bei durchschnittlich 8 Euro im Monat.
Was ist ein Front-End?
Der Begriff “Front-End” bezieht sich auf den clientseitigen Teil einer Webanwendung oder Software, also auf den Teil, mit dem die Benutzer direkt interagieren. Es umfasst alles, was ein Benutzer visuell und funktional auf seinem Gerät erlebt, einschließlich Layout, Design, Inhalt und interaktive Elemente. In Diesem Post erfährst du mehr darüber.
Was ist ein Back-End?
Der Begriff “Back-End” bezieht sich auf den serverseitigen Teil einer Webanwendung oder Software. Er ist für die Verwaltung und Verarbeitung von Daten, die Handhabung von Geschäftslogik und die Bereitstellung des Front-Ends verantwortlich. Das Back-End umfasst den Server, die Datenbank und die Anwendung, die zusammenarbeiten, um dem Benutzer Informationen und Dienste bereitzustellen. In Diesem Post erfährst du etwas über das Microsoft-PAM-MIM System - eine vollständige Back-end Umgebung zur Verwaltung von Nutzerrechten.
Was ist AJAX
Ein AJAX Request (Asynchronous JavaScript and XML) ist eine Technik, mit der eine Webseite asynchrone Anfragen an den Server senden kann, ohne dass die gesamte Seite neu geladen werden muss. Im Grunde verbindet AJAX das Front-End mit dem Back-End. Daten können somit dynamisch zwischen Front und Back hin und her wandern, ohne die User-Journey zu unterbrechen. Ein AJAX Request kann verwendet werden, um neue Inhalte in einem Nachrichten-Feed zu laden oder ein Formular zu senden, wobei die Seite im Hintergrund mit dem Server kommuniziert und der Nutzer direkt das Ergebnis sieht. Die Technik basiert auf JavaScript und XML (oder JSON) und verwendet in der Regel das XMLHttpRequest-Objekt oder die moderne fetch() API.
Darstellung einer AJAX-Request zwischen Front-End und Back-End
Was ist CORS
CORS (Cross-Origin Resource Sharing) ist ein Sicherheitsmechanismus, der von Webbrowsern verwendet wird, um den Zugriff auf Ressourcen (wie APIs, Skripte oder Daten) auf einer Website von einer anderen Domain zu steuern. Standardmäßig blockieren Browser aus Sicherheitsgründen Anfragen von einer Domain an eine andere, wenn diese Anfragen als “Cross-Origin” betrachtet werden (z. B. wenn eine Website auf Ressourcen von einer externen Domain zugreifen möchte). CORS ermöglicht es dem Server, gezielt anzugeben, welche anderen Domains auf seine Ressourcen zugreifen dürfen, indem er spezielle HTTP-Header wie Access-Control-Allow-Origin
verwendet. Wenn der Server diese Header nicht sendet oder CORS falsch konfiguriert sind, wird der Zugriff blockiert, um potenzielle Sicherheitsrisiken zu vermeiden.
CORS stellt somit sicher, dass Webanwendungen sicher miteinander interagieren können, ohne die gleiche Origin zu teilen.
Was ist SMTP?
SMTP (Simple Mail Transfer Protocol) ist ein Protokoll zum Versenden und Weiterleiten von E-Mails im Internet. Es dient dazu, E-Mails von einem E-Mail-Client (z. B. Outlook, Gmail) an einen E-Mail-Server zu übertragen und von dort aus an den Zielserver weiterzuleiten, der die Nachricht schließlich dem Empfänger zustellt. SMTP funktioniert auf Port 25, 465 (für verschlüsselte Verbindungen) oder 587 und regelt den Ablauf des E-Mail-Versands, einschließlich der Kommunikation zwischen den Servern. Es ist jedoch nur für das Senden von E-Mails zuständig, während für das Abrufen von E-Mails andere Protokolle wie IMAP oder POP3 verwendet werden.
Darstellung einer SMTP-Verbindung zwischen Email-Client und SMTP Server
Achtung: Die konfiguration von SMTP kann kompliziert sein. Hier siehst du das typische Gefrickel mit SMTP-Errors
Was ist ein MIME-Type
Ein MIME-Type (Multipurpose Internet Mail Extensions Type) ist ein standardisiertes Verfahren zur Angabe der Art und des Formats einer Datei. Er wird verwendet, um die Art der über das Internet übertragenen Daten anzugeben, damit Software wie Webbrowser, E-Mail-Clients und andere Anwendungen die Datei entsprechend verarbeiten können. In diesem Post wird ausführlicher auf den MIME-Type eingegangen.
Was ist ein Active Directory?
Active Directory (AD) ist ein Verzeichnisdienst von Microsoft, der in Windows-Servern eingesetzt wird, um Netzwerke zu organisieren und zu verwalten. Es dient zur zentralen Verwaltung von Benutzern, Computern, Gruppen, Sicherheitsrichtlinien und anderen Netzwerkressourcen innerhalb eines Unternehmens. In einem Active Directory werden Informationen hierarchisch gespeichert, wobei Domänen, Organisationseinheiten und Objekte wie Benutzer oder Geräte verwaltet werden. Administratoren können mithilfe von AD Rechte und Zugriffsberechtigungen für Benutzer festlegen, sodass nur autorisierte Personen auf bestimmte Ressourcen zugreifen können. AD ermöglicht somit eine effizientere und sicherere Verwaltung von Netzwerken in größeren Organisationen.
Hier findest du einen klassischen Trouble-Shooting Prozess im Active Directory Umfeld.
Was ist ein Backlink?
Ein Backlink ist ein externer Link, welcher auf eine andere Webseite verweist. Ein Beispiel: Sie betreiben eine Webseite, die über Nahrungsergänzungsmittel aufklärt (A). Ein anderer Webseitenbetreiber (B) verkauft neben Sportbekleidung auch Nahrungsergänzungsmittel über seinen Onlineshop. Verweist der Onlineshopbetreiber (B) mit einem Link auf ihre Webseite (A), spricht man von einem Backlink. Backlinks sind einer der wichtigsten Kriterien für die Suchmaschinenoptimierung (SEO). In diesem Post erfahren Sie mehr darüber.
Was versteht man unter Usability?
Übersetzt bedeutet Usability Benutzerfreundlichkeit. Eine optimierte Usability auf Webseiten sorgt für eine einfache und bessere Nutzbarkeit einer Internetseite. Unabhängig davon, mit welchem Endgerät der Nutzer die Webseite besucht. Einfach gesagt ist das Ziel einer nutzerfreundlichen Webseite, dass der Besucher mit sehr wenig Aufwand sein Ziel erreicht.
Darstellung einer Customer Journey auf webdev-guide.net
Was ist ein Favicon?
Favicons (Favorite-Icons) sind Symbole, welche in der Registerkarte, als App-Symbol oder neben dem Titel in den Suchergebnissen angezeigt werden. Dabei handelt es sich meist um ein vereinfachtes Icon, beispielsweise das Logo des Unternehmens. Ein Favicon ist für jede Unternehmens- oder für jede Vereinswebseite ein Muss, da dieses Symbol für Nutzer als Wiedererkennbarkeit der Webseite dient.
Onepager vs Multipager
Ein Onepager besteht aus einer einzigen Seite. Das bedeutet, dass der Inhalt einer Webseite in Kurzform präsentiert wird. Ein Klick in die Navigation führt den Nutzer der Webseite auf den gewünschten Abschnitt innerhalb des Onepagers und nicht auf eine separate Unterseite. So können Sektionen durch einfaches Scrollen oder wie bereits erwähnt per Klick in die Navigationsleiste erreicht werden.
Ein Multipager hingegen sind Webseiten mit mehreren Unterseiten. Diese Unterseiten werden ebenfalls durch einen Klick in die Navigationsleiste erreicht oder über interne Links auf der Webseite. Die Vorteile des Multipagers liegen klar auf der Hand. Viele Informationen über Ihre Dienstleistung oder über Ihr Unternehmen können so den Besuchern bereitgestellt werden. Separate Seiten für Bildergalerien, Kontaktmöglichkeiten, Referenzen und vieles mehr.
Feature | Onepager | Multipager |
---|---|---|
Definition | Eine Website mit allen Inhalten auf einer einzigen Seite, die vertikal gescrollt wird | Eine Website, die in mehrere Seiten unterteilt ist, die sich jeweils auf unterschiedliche Inhalte konzentrieren |
Benutzererfahrung | Einfache Navigation; Benutzer können durch Scrollen auf Informationen zugreifen | Klare Trennung der Inhalte; Benutzer können spezifische Informationen auf speziellen Seiten finden |
SEO | Begrenztes Keyword-Targeting (alle Inhalte auf einer Seite) | Besser für das Targeting eines breiteren Spektrums von Keywords über verschiedene Seiten hinweg |
Ladegeschwindigkeit | Kann anfangs langsamer sein, da alle Inhalte auf einer Seite geladen werden | Schnelleres Laden pro Seite; nur bestimmte Inhalte werden bei Bedarf geladen |
Mobile Experience | Einfache Navigation auf dem Handy mit vertikalem Scrollen | Erfordert optimierte Navigation; kann bei schlechtem Design schwieriger für mobile Nutzer sein |
Entwicklungskomplexität | Oft einfacher und schneller zu entwickeln, geeignet für kleine Websites | Komplexer einzurichten, ideal für größere Websites mit umfangreichen Inhalten |
Wartung | Einfacher zu warten, da Änderungen |
Vor- und Nachteile von OnePager vs. Multipager Websites
Was bedeutet Responsive Webdesign?
Unter einem Responsive Design oder Responsive Webdesign versteht man eine optimierte Darstellung der Webseite unabhängig von der Bildschirmgröße des Endgerätes wie Smartphone, Tablet und PC. Ein Responsive Design ist der heutige Standard, um neben der Benutzerfreundlichkeit auch eine attraktivere Positionierung in den Suchergebnissen zu gewährleisten. Nicht selten werden Elemente aufgrund der kleinen Bildschirmgrößen von Smartphones ausgeblendet, um das beste Nutzererlebnis für unterschiedliche Geräte zu erzielen. Mehr zum Thema Responsive Webdesign finden Sie in diesem Post.
Was ist eine Domain?
Bei einer Domain handelt es sich um eine eindeutige Adresse, welche weltweit einzigartig ist. Ähnlich wie ein Fingerabdruck. Dabei ist eine Domain nicht gleichzusetzen mit einer URL, doch ist sie ein wichtiger Bestandteil. Die URL dieser Website ist: https://www.webdev-guide.net/ und die Domain lautet: webdev-guide.net. Wie eine URL entsteht, ist recht einfach erklärt: Eine IP-Adresse ist eine Zahlenreihe (192.168.179.42). Diese wird von einem Nameserver (DNS-Server) übersetzt, was man dann als Domain bezeichnet. Mehr dazu erfahren Sie in diesem Post.
Was bedeutet Redirect?
Ein Redirect ist eine serverseitige Weiterleitung. Einfach ausgedrückt leitet man eine URL auf eine andere URL weiter. Dies geschieht über eine htaccess-Datei (eine Anweisung an den Server per Textdatei). Eine Weiterleitung kommt bei einem Umzug zum Einsatz. Das heißt, wenn man zum Beispiel eine neue Domain erworben hat. Nicht selten nutzt man ein Redirect, wenn eine Seite nicht mehr existiert. Damit der Webseitenbesucher keine unschöne 404-Fehlermeldung bekommt, kann man diese Seite per 301-Redirect auf eine andere Seite weiterleiten. Mehr dazu erfahren hier, im separaten Post
Was sind Metadaten?
Metadaten spielen eine wichtige Rolle in der Suchmaschinenoptimierung (SEO). Metadaten sind Informationen für Suchmaschinen und dienen dazu, den Inhalt einer Webseite besser zu verstehen. Insbesondere der <title>
Tag und die <meta>
-Tags gehören zu den wichtigsten Rankingfaktoren bei Google, duckduckgo, metager und anderen Suchmaschinen, da diese in den Suchergebnissen angezeigt werden. Mehr zu Metadaten in diesem Post.
Was ist eine Robots.txt?
Die Robots.txt ist eine kleine Textdatei. Diese Datei enthält wichtige Informationen und dient als Anleitung für den Crawler. In einer Robots.txt werden Verzeichnisse, Unterverzeichnisse oder einzelne Dateien hinterlegt, um zu signalisieren, welche von den Suchmaschinen gelesen werden dürfen und welche nicht. Deshalb wird die Textdatei im Hauptverzeichnis gespeichert und kann dadurch als erstes ausgelesen werden.
Was ist eine sitemap.xml?
Eine sitemap.xml ist eine XML-Datei, die die URLs einer Website auflistet und es Webmastern ermöglicht, Suchmaschinen über die Struktur ihrer Website zu informieren. Diese Datei hilft Suchmaschinen wie Google, Bing und anderen, den Inhalt der Website effektiver zu crawlen und zu indizieren. Sie kann zusätzliche Metadaten zu jeder URL enthalten, z. B. wann sie zuletzt aktualisiert wurde, wie oft sie sich ändert und welche relative Bedeutung sie im Vergleich zu anderen URLs auf der Website hat. In diesem Post erfahren Sie mehr darüber.
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<!-- Homepage -->
<url>
<loc>https://www.example.com/</loc>
<lastmod>2024-01-15</lastmod>
<changefreq>daily</changefreq>
<priority>1.0</priority>
</url>
<!-- About Page -->
<url>
<loc>https://www.example.com/about</loc>
<lastmod>2024-01-10</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
<!-- Services Page -->
<url>
<loc>https://www.example.com/services</loc>
<lastmod>2024-01-12</lastmod>
<changefreq>weekly</changefreq>
<priority>0.7</priority>
</url>
<!-- Blog Page -->
<url>
<loc>https://www.example.com/blog</loc>
<lastmod>2024-01-14</lastmod>
<changefreq>daily</changefreq>
<priority>0.6</priority>
</url>
<!-- Individual Blog Post -->
<url>
<loc>https://www.example.com/blog/how-to-create-a-sitemap</loc>
<lastmod>2024-01-13</lastmod>
<changefreq>yearly</changefreq>
<priority>0.5</priority>
</url>
</urlset>
Darstellung einer beispielhaften sitemap.xml
Was ist ein CMS?
CMS = Content-Management-System. Diese Softwareanwendung ermöglicht die Erstellung einer Homepage ohne Programmierkenntnisse. Ein CMS verfügt über eine grafische Benutzerfläche. Das ermöglicht geschulten Personen mit begrenzten technischen Kenntnissen, Inhalte zu aktualisieren und zu pflegen. Durch vorgefertigte Design-Vorlagen können so in kürzester Zeit kostengünstige Webseiten erstellt werden. Das sind nur wenige Vorteile eines Content-Management-Systems. Doch wie so oft, kein Vorteil ohne Nachteil. Ein klarer Nachteil ist neben der Performance und Leistung die eingeschränkte Gestaltung der Webseite, welche durch vorgefertigte Design-Vorlagen bestimmt wird. Zudem muss ein CMS gewartet und gepflegt und wichtige Systemupdates aus Sicherheitsgründen installiert werden. In Diesem Post erfährst du mehr darüber.
Was ist HTML?
HMTL steht als Abkürzung für Hyper Text Markup Language und ist eine einheitliche, textbasierte Auszeichnungssprache. HTML bildet die Grundlage für die meisten Webseiten und dient zur Strukturierung sowie zur Einbindung unter anderem von Texten, Bildern und Videos. Der Code besteht aus verschiedensten Tags, welche unterschiedliche Bereiche kennzeichnen. In Diesem Post erfährst du mehr darüber.
Was ist CSS?
CSS (Cascading Style Sheets) ist eine Stylesheet-Sprache, mit der die Darstellung eines in HTML oder XML geschriebenen Dokuments beschrieben wird. Sie gehört neben HTML und JavaScript zu den Kerntechnologien des World Wide Web und ist für die Erstellung visuell ansprechender Webseiten und Benutzeroberflächen unerlässlich. In Diesem Post erfährst du mehr darüber.
Was ist ein CRUD
CRUD ist ein Akronym, das für Create, Read, Update und Delete steht. Es beschreibt die grundlegenden Operationen, die mit Daten in einer Datenbank oder einem anderen Datenspeicher durchgeführt werden können. Diese vier Operationen sind essentiell in der Fullstack-Webentwicklung, da sie die Basis für die meisten datenbezogenen Anwendungen bilden. Hier ein ausführlicher Beitrag der einzelnen Operationen.
Was ist JavaScript?
JavaScript oder abgekürzt JS ist eine der am häufigsten verwendeten Programmiersprachen in der Webentwicklung. Diese objektorientierte Spache wird genutzt, um dynamische Elemente einzubinden und um komplexe Kontrollabfragen durchzuführen. Beispiele zur Anwendung von JavaScript sind Diashows, Menüs, Animationen, Browserspiele und vieles mehr. In Diesem Post erfährst du mehr darüber.
Was ist PHP?
PHP steht als Abkürzung für Hypertext Preprocessor und ist eine der am häufigsten genutzten Skriptsprachen. PHP, welche direkt auf dem Webserver ausgeführt wird, ist eine sogenannte serverseitige Skriptsprache, die das Erstellen dynamischer Webseiten und Webanwendungen ermöglicht. Anwendungsbeispiele für PHP sind unter anderem Onlineshops und Content-Management-Systeme (CMS). In Diesem Post erfährst du mehr darüber.