Skip to main content

HTML und CSS, eigene Website erstellen

Einsteiger, Wissen und Praxis

Design ist nicht nur so, wie es aussieht und sich anfühlt. Design ist, wie es funktioniert.
Steve Jobs 1993, Artikel in der New York Times

Grundlagen, Entwicklungs-Umgebung und Tools

Das Entwickeln von modernen Webauftritten ist ein ständiger Lernprozess. Für Anfänger biete ich kostenlose Beratung in HTML und CSS an.

Telefon: 0345 25179391 (Click to call)

Kostenlos - Werkzeuge für Webdesign und Webentwicklung

Einfacher Programmeditor

Wenn Sie statische HTML-Seiten erstellen wollen, können Sie am Anfang einen WYSIWYG-Editor verwenden. Diese liefern aber selten zufriedenstellende Ergebnisse. Der Microsoft Editor Notepad ist ein einfacher Texteditor für Windows.

Er dient zum Schreiben und Lesen von unformatierten Texten, zum Probieren aber nur als Notlösung. Installieren Sie die kostenlose Alternative Notepad2 (Open-Source), ein mit vielen Extras ausgestattetes Textprogramm. Notepad2 ist ein lohnender Ersatz für den Windows-Editor und zugleich ein sehr gut geeigneter Programmeditor.

Eine perfekte Entwicklungsumgebung

Mit seiner Syntaxhervorhebung bildet Notepad2 den Schwerpunkt einer Entwicklungsumgebung mit ausreichenden Standardfunktionen.
Hier können Sie den Editor von Florian Balmer downloaden:

Download Notepad2.
Zu einer einfachen und kostenlosen Entwicklungsumgebung gehören lediglich:

  • ein Quelltext-Editor (Programmeditor),
  • ein Bildbearbeitungsprogramm,
  • ein FTP-Programm zum Upload und Download ihrer Dateien.

Die Grundlagen einer Webseite

HTML Quelltexte und Stylesheets

Eine Website in HTML erstellen erscheint am Anfang recht schwierig. Als Einsteiger sollen Sie klein beginnen. Dann ist es leichter, eine einfache Website) zu erstellen und zu veröffentlichen. Durch die Trennung von Inhalt (HTML) und Design (CSS) sparen Sie sich sehr viel Zeit beim Lernen von HTML und CSS. Mit HTML5 und CSS3 ist alles wesentlich einfacher geworden.

Bilder und Grafik

Webfotos/Bilder steigern das Leser-Interesse an einer Webseite. Fotos für Websites lassen sich bereits mit einfachen Programmen bearbeiten. Ein Webfoto soll den Kern einer Aussage betonen. Bildausschnitte betonen ein gewähltes Motiv und illustrieren den Inhalt.

Weblinks für Autodidakten

Tipps und Tools

Die folgende Auswahl ist nur ein Anfang. Sie ist keineswegs vollständig. Ich behalte mir vor, Inhalte zu ändern , zu ergänzen oder zu löschen.

Grundlagen Lernprogramme

Mediaevent HTML-Grundlagen
Zu HTML, CSS und PHP gibt es viel zu lernen. HTML als Markup-Sprache des Internets steht an erster Stelle für den Anfang.

Google Tools für Webmaster
Kurse und Leitfäden zur Erstellung hochwertiger Websites. Bei Problemen erhalten Sie Hilfe durch eine Liste mit den häufigsten Problemen und mit Test-Tools.

Mozilla Entwickler-Werkzeuge
Es gibt eine Menge über Webdesign zu lernen. Webdesign und Webentwicklung für Anfänger und Fortgeschrittene.

Prüfprogramme

PageSpeed
PageSpeed Insights misst die Leistungsfähigkeit einer Seite auf Mobilgeräten und Desktop-Computern.

SEORCH - Check auch für komplette Websites
Onpage-Tool und SEO-Crawler, der Crawler scannt bis zu 500 Unterseiten einer Webseite und erstellt eine technische und content-bezogene Analyse.

WeTest - Webseiten-Test

Webseiten-Test
Das Tool analysiert und bewertet Webseiten wie ein Mensch nach Inhalt, Qualität und Nutzer-Freundlichkeit.

Baukasten-Website als Alternative?

Firmenwebsite

Einige Unternehmer wollen schnell und billig einen Firmenauftritt erhalten. Dabei wollen sie die Inhalte selbst bearbeiten und sogar die Webseiten selbst gestalten. Die Unternehmer erwarten, das der Webauftritt schnell neue Kunden bringt. Eine lokale Firmensite will natürlich ihre Kunden in der Region gewinnen.

In der Realität bleiben Baukasten-Websites nachweislich ohne Erfolg. Dem Bearbeiter fehlt zumal die erforderliche Zeit und entsprechende Fähigkeiten. In der Praxis zeigt sich, dass Firmenwebsites mit Baukastensystem selten oder überhaupt nicht gepflegt werden. Es ist ohnehin unrentabel, wenn der Unternehmer seine Arbeitszeit für diese Tätigkeiten opfert. Diese Zeit kann er rationeller für sein Unternehmen nutzen.

WordPress und Webhosting

WordPress ist die meist genutzte Open-Source-Software. Damit verfassen Sie in wenigen Schritten eine eigene Webvisitenkarte als Firmenwebsite.

Viele Webhoster bieten eine automatische WordPress Installation mit nur wenigen Klicks an. Ich empfehle zur WordPress Installation 1&1 WordPress Hosting inklusive eigener Domain. Für einen privaten Webauftritt mag das mit einiger Einarbeitung in Wordpress ausreichen.