Webschnittstellen erstellen, wo Sie anfangen sollen

Webschnittstellen erstellen, wo Sie anfangen sollen / Programmierung

Computercode und Pixel sind mehr als nur Ziegelsteine ​​die Grundlage der Wirtschaft des 21. Jahrhunderts. Wenn du dich schon mal angeschaut hast “Seitenquelltext” oder “Entwicklerwerkzeuge” In Ihrem Browser sind Sie wahrscheinlich auf ein Durcheinander von Text gestoßen und haben sich gefragt, wie die Webseite funktioniert.

Webentwickler rufen an Graphisch User ichSchnittstellen (GUIs) zusammen die Vorderes Ende einer Webseite, im Gegensatz zum Backend. Das Frontend ist das, was der Benutzer manipulieren, handeln und anderweitig verwenden kann. Das Back-End kann als Infrastruktur betrachtet werden, die alle Informationen und Aufgaben enthält und unterstützt, die das Front-End impliziert.

Dieser Artikel befasst sich mit dem Frontend. Wir werden das Territorium ausarbeiten, so dass Sie die Unterschiede und Möglichkeiten des Frontends verstehen können und Ihnen zeigen, wie Sie mit den Tools des Webentwicklers beginnen und diese sinnvoll einsetzen können interaktive Webseiten.

Webdesign gegen Front-End-Entwicklung

In großen Organisationen sind Design und Entwicklung Aufgaben, die von Teams von Fachleuten mit unterschiedlichen Fähigkeiten durchgeführt werden. Designer würden ein spezifisches visuelles und Interaktionsdesign erstellen. Front-End-Entwickler würden es implementieren.

Für eine Person gibt es jedoch keinen Grund, Ihre Erkundung einzuschränken: Nur weil Sie an Entwicklung interessiert sind, bedeutet das nicht, dass Sie keine Vision für das Design haben und umgekehrt. Ein bescheidenes Wissen über grundlegende Webtechnologien oder Designprinzipien kann für Ihre Karriere oder Ihr Geschäft von großem Nutzen sein.

Front-End-Entwicklung ist mehr und weniger eine Codierungsaktivität. Mehr, weil es mehr als die Hälfte des Designs ist: Viele Konzepte stammen aus der Welt der Druckproduktion. Weniger, weil der Code bei der Verwendung von Computercode weniger komplex und fehlerverzeihend ist und weniger Grundkenntnisse in der Programmierung erfordert als andere Web-Programmiersprachen (von denen viele im Backend zu finden sind), zu welcher Programmiersprache Lernen - Web-Programmierung Welche Programmiersprache muss man lernen - Web-Programmierung Heute werden wir uns die verschiedenen Web-Programmiersprachen ansehen, die das Internet unterstützen. Dies ist der vierte Teil einer Programmierserie für Anfänger. In Teil 1 haben wir die Grundlagen von… Read More .

Das Web-Frontend: Markup, Stylesheet und Programmiersprachen

Die meisten Webseiten bestehen aus drei Technologien: Hypertext Markup Language (HTML), Cascading Style Sheets (CSS) und JavaScript (JS):

  • Markup-Sprachen wie HTML ein Dokument mit markieren Stichworte. Tags kennzeichnen semantische Inhalte und strukturieren das Dokument. Strukturierte Dokumente können sein gestylt.
  • CSS ist ein Style-Sheet-Sprache und Nachkommen von Druckstilanweisungen zu einem Seitenkompositor (der das endgültige druckbare Bild für eine Druckmaschine erstellt); Im Web bestimmt CSS generell die Darstellung von Inhalten wie Typografie und Layout sowie das Platzieren von Grafiken.
  • JavaScript ist im Gegensatz zu den vorherigen beiden ein Programmiersprache. JS kümmert sich um Interaktion und Benutzereingaben und konzentriert sich auf die Ereignisse, die ein Benutzer erzeugt. Um das Bild ein wenig mehr auszufüllen, ist das Gegenteil eines ereignisgesteuerten Paradigmas eines, bei dem die Programmierung unabhängig von den Benutzereingaben ausgeführt wird.

HTML

Es ist über zwanzig Jahre her, und der Hauptzweck von HTML bleibt derselbe: Der für einen Leser bestimmte Text wird von der Struktur getrennt, die zum Analysieren des Dokuments erforderlich ist.

Warum brauchst Du es

Warum ist HTML immer noch wichtig? Einfach ausgedrückt: In HTML liegt die semantische Bedeutung Ihres Inhalts. Dies ist für Maschinenleser wie Suchmaschinenspider und Bildschirmleser (für Zugänglichkeit) erforderlich. Im Laufe der Zeit ist die Relevanz der Trennung von semantischem und strukturellem Aspekt im Laufe der Zeit eher gewachsen als gesunken. Die neueste Version von HTML (5) führte Tags ein wie

,