10 Webentwicklungskonzepte, die Designer kennen sollten

Seit über 10 Jahren arbeite ich als Webentwickler. Die meiste Zeit hat mein Unternehmen als Entwicklungsteam für Subunternehmer gearbeitet und mit Webdesignern an Websites und Anwendungen gearbeitet. Darüber hinaus haben wir unser eigenes kleines CMS-Produkt entwickelt. Barsch Dies wird von vielen Webdesignern verwendet, um eine einfache Inhaltsverwaltung für ihre Websites bereitzustellen. Während ich Perch unterstütze, sehe ich, wie Menschen arbeiten und mit welchen Konzepten sie zu kämpfen haben.

Ein Designer, der freiberuflich tätig ist oder eine eigene Agentur betreibt, muss möglicherweise den Kunden die technischen Konzepte sicher erklären. Der Endkunde ist sich der verschiedenen Besonderheiten beim Starten einer neuen Website häufig nicht bewusst und verlässt sich darauf, dass sein Webdesigner ihn durch den Prozess führt. Selbst wenn Sie dazu neigen, Entwicklungsarbeit auszulagern, kann sich ein Verständnis der Entwicklung auszahlen, wenn Sie die technischen Teile des Auftrags mit Ihren Kunden besprechen können. Wenn Sie mit Entwicklern zusammenarbeiten, hilft Ihr Wissen außerdem dabei, die Kommunikation zu beschleunigen und Missverständnissen vorzubeugen.

Dieser Artikel enthält einige kleine Tipps und Links zur weiteren Lektüre zu Themen, die ich bei der Arbeit mit Webdesignern an Projekten und bei der Unterstützung von Perch erklärt habe.



1. Schreiben Sie benutzerzentrierte Funktionsspezifikationen

Funktionsspezifikationen oder Briefs für die Entwicklungsarbeit sind Teil des Agenturlebens. Sie bekommen ein bisschen schlechte Presse, da sie verwendet werden können, um den Kunden über den Kopf zu schlagen und um zu verhindern, dass Änderungen vorgenommen werden, die die Website zum Besseren verbessern. Wenn Sie jedoch Zeit und Kosten angeben müssen, benötigen Sie etwas, auf dem diese Schätzung basiert, und wenn Sie Entwicklungsarbeiten an Subunternehmer vergeben, müssen Sie sicherstellen, dass den Entwicklern klar ist, was sie erstellen müssen.

Entwicklungsspezifikationen sollten Ihre Anwendung klar beschreiben und sich darauf konzentrieren, was der Benutzer tun kann. Konzentrieren Sie sich auf die Aufgaben, die Benutzer - sowohl Besucher als auch Administratoren - erfüllen müssen, und Sie werden einen langen Weg gehen, um eine Spezifikation zu erstellen, gegen die zuverlässig zitiert werden kann und die verhindert Merkmal kriechen .

2. Berücksichtigen Sie bei der Planung die Programmierkonstrukte

Wenn Entwickler eine Reihe von Anforderungen durchdenken, neigen wir dazu, in Programmierkonstrukten zu denken. Ein Verständnis dieser Konstrukte kann bei der Entwicklung von Spezifikationen und beim Entwerfen von Schnittstellen wirklich hilfreich sein.

Bedingte Logik - wenn ... dann ... sonst ...

Ein Beispiel für eine bedingte Logik könnte die folgende Anforderung sein. Wenn ein Benutzer angemeldet ist, zeigen Sie ihm einen Link zu 'Mein Konto', andernfalls die Links für die Anmeldung und Kontoerstellung. Es ist leicht, das Andere zu vergessen, wenn Sie einen Flow entwerfen. Überlegen Sie immer, was passiert, wenn Ihre Bedingung nicht erfüllt ist.

Schleifen

Ein großer Teil der Entwicklung besteht darin, Informationsblöcke zu wiederholen. Möglicherweise haben Sie Produkte in einer Datenbank gespeichert und möchten diese als Liste anzeigen, wobei Sie denselben Markup-Block immer wieder wiederholen, bis Sie das Ende erreicht haben.

Preiserhöhung für Adobe Creative Cloud-Studenten

Was passiert, wenn Sie zu viele Elemente haben, um sie auf einer Seite gut anzuzeigen? Sie benötigen eine Art Paging - vorheriges und nächstes - oder eine andere Möglichkeit, nur einen Teil der Daten anzuzeigen. Können Leute diese Daten auf irgendeine Weise sortieren? Gibt es Sonderfälle, die anders angezeigt werden müssen? Diese Regeln müssen in der Spezifikation erläutert werden, da für jede Filterung wahrscheinlich zusätzliche Informationen für das Produkt in der Datenbank gespeichert werden müssen.

Dieser Artikel von dev.opera erklärt die Grundlagen der Programmierung in einfachen Worten für den Nicht-Programmierer.

3. Vergessen Sie beim Entwerfen nicht die Fehlerzustände

Vergessen Sie nicht, die Fehlerzustände und die Validierung für Formulare zu vergessen, wenn Sie darüber nachdenken, einen Auftrag für die Entwicklung zu entwickeln oder Ihre ersten Entwürfe zu erstellen. Wenn Sie diese Dinge Ihren Entwicklern überlassen, werden Sie Fehlermeldungen erhalten, die von Programmierern entworfen wurden.

Schützen Sie Ihr Design vor Programmierern! Insbesondere, wenn Sie sich in einer Situation befinden, in der Sie Entwürfe an einen Entwickler übergeben, um die Site zu erstellen, und nach diesem Zeitpunkt möglicherweise nicht mehr viel Input haben. Denken Sie über die verschiedenen Stellen nach, an denen Benutzer Formulare ausfüllen oder auf andere Weise mit der Site interagieren müssen. Schützen Sie Ihr Design, indem Sie den Entwicklern klare Anweisungen geben, wie die Nachrichten angezeigt werden und wie die Benutzererfahrung sein soll.

4. Lernen Sie die Grundlagen des Datenbankdesigns und die Speicherung von Daten kennen

Sofern Sie keine vollständig statische Site haben - in diesem Fall werden Ihre Daten als HTML gespeichert -, speichern Sie Daten irgendwie. Wenn Sie wissen, wie Daten gespeichert werden, wird Ihnen das Leben als Webdesigner erleichtert. Es wird Ihnen helfen, die Entscheidungen zu verstehen, die ein Entwickler treffen muss, um Daten für die Verwendung auf der Site gut zu speichern, und warum scheinbar kleine Änderungen am Design viel Arbeit bedeuten können.

wie man ein Bild in Photoshop umkehrt

5. Lernen Sie, die Versionskontrolle zu lieben

Die Quell- oder Versionskontrolle mag insbesondere für den einzelnen Designer unnötig erscheinen, aber die Versionskontrolle kann helfen, Datenverlust zu verhindern, indem sie eine Sicherungskopie Ihrer Arbeit bereitstellt. Die Verwendung eines remote gehosteten Versionskontrollsystems kann auch die Arbeit an verschiedenen Standorten erleichtern. Ich checke meine Arbeit jeden Abend in unser System ein und wenn ich dann am nächsten Tag aus irgendeinem Grund von zu Hause aus arbeiten muss, kann ich meine Fortschritte überprüfen und genau dort weitermachen, wo ich aufgehört habe.

Heutzutage gibt es eine Reihe hervorragender Anbieter für gehostete Versionskontrolle - zum Beispiel GitHub und Bohnenstange . Bohnenstange haben auch eine Genialer Leitfaden zur Versionskontrolle für diejenigen, die es zum ersten Mal verwenden.

6. Erstellen Sie eine professionelle Entwicklungsumgebung

Die Unterstützung von Perch hat uns einen fantastischen Einblick in die Arbeitsweise der Menschen gegeben. Einige der beängstigenden Dinge, die wir sehen, sind die folgenden:

Entwicklung direkt auf der Live-Site

Ich bin immer wieder erstaunt über die Anzahl der Personen, die Änderungen direkt an Dateien auf einer Live-Website vornehmen. Dies ist eine schreckliche Art zu arbeiten und nicht nur, weil Sie wahrscheinlich etwas auf der Live-Site kaputt machen. Wenn Sie direkt auf Dateien auf einem Server entwickeln, ist es durchaus möglich, dass dies die einzige verfügbare Kopie der aktuellen Dateien ist. Wenn es ein Problem mit dem Server gibt, stellen Sie möglicherweise fest, dass Ihre gesamte Site verloren geht.

Entwicklung in einem Unterordner der Live-Site

Das andere, was wir sehen, ist die Entwicklung auf der Live-Site, jedoch in einem Unterordner. Dies bedeutet zwar, dass Sie keine direkten Änderungen an der Live-Site vornehmen, Sie haben jedoch immer noch das Problem, dass Ihre einzige Kopie der Site in einem Unterordner auf dem Live-Server vorhanden ist.

Es gibt ein zweites Problem bei der Entwicklung in einem Unterordner - sei es auf der Live-Site oder auf Ihrem lokalen Server -, da alle Ihre Pfade vom Stamm aus falsch sind, wenn Sie die Site um eine Ebene nach oben verschieben. Einige Skripte müssen die Pfade von root kennen, sodass Sie möglicherweise feststellen, dass die Änderung der Umgebung Probleme verursacht, wenn Sie live gehen. Drew McLellan erklärt, warum Sie sollten Beenden Sie Baustellen in Unterordnern .

Lokale Entwicklung ohne Webserver

Wenn Sie keine serverseitige Entwicklung durchführen, können Sie nur lokal arbeiten, eine Vorschau der Dateien aus dem Dateisystem im Browser anzeigen oder Dreamweaver oder einen anderen Editor für die Vorschau im Browser verwenden. Auf diese Weise werden Ihre Seiten nicht als Teil der Website angezeigt, was zu Problemen mit den Pfaden führen kann, wenn Sie live gehen.

Entwickler wissen, dass Sie Ihre Live-Umgebung immer so genau wie möglich spiegeln sollten. Dies verhindert viele der Probleme, die Sie sonst beim Verschieben einer Site live hätten.

Der beste 404-Seiten-Index aller Zeiten

Ich möchte vorschlagen, dass jeder seinen eigenen lokalen Webserver betreibt. Wenn Ihre Websites im Allgemeinen nur aus HTML und CSS bestehen oder Sie PHP verwenden, dann MAMP auf dem Mac, EasyPHP oder XAMPP unter Windows reicht das ganz gut. Erstellen Sie virtuelle Hosts für jede Site, damit die Dateien im Stammverzeichnis der Site gespeichert werden können.

7. Code und andere Assets wiederverwenden

Entwickler möchten Code nach Möglichkeit wiederverwenden, anstatt Dinge von Grund auf neu zu schreiben. Die Wiederverwendung spart Zeit, kann Ihnen aber auch ersparen, dass Sie immer wieder dieselben Fehler machen.

Die Wiederverwendung von Code bedeutet nicht unbedingt, dass für jeden Standort ein CSS-Framework oder dasselbe Boilerplate verwendet wird. Sie können nur eine Bibliothek mit nützlichen Ausschnitten verwalten.

In vielen Code-Editoren können Sie Code als Snippets oder Clips speichern. Es gibt auch eigenständige Tools und Web Applikationen für diesen Zweck entwickelt.

Bei der Wiederverwendung muss es nicht nur um Code gehen, Sie können auch allgemeine Oberflächenelemente speichern, um sie in Photoshop in Designs einzufügen. Eine Möglichkeit, mir Zeit zu sparen, besteht darin, einen Ordner mit Test-Upload-Dateien auf meinem Desktop zu speichern. Da ich häufig Content-Management-Systeme entwickle und teste, muss ich häufig das Hochladen von Bildern und Dateien testen. Wenn ich einige Testdateien behalte, lade ich am Ende nicht einige wichtige PDFs von den Konten auf den Testserver eines Clients hoch!

8. Wissen, wann eine Verlagerung der Haftung auf einen Dritten eine gute Idee ist

Es ist verlockend, alles tun und alles auf Ihrer eigenen Website behalten zu wollen. Manchmal ist es jedoch am verantwortungsvollsten, Ihrem Kunden vorzuschlagen, für einige Funktionen einen Drittanbieter zu verwenden. Gute Beispiele hierfür sind der Umgang mit Zahlungen und das Versenden von E-Mails.

Zahlungsseiten

Wenn Ihre Website Zahlungen online entgegennehmen muss, bieten viele Zahlungsdienstleister die Möglichkeit der vollständigen API-Integration oder der Zahlung auf einer sicheren Seite ihrer Website an. Wenn Sie nicht sehr sicher sind und nicht wissen, wie sich die PCI-DSS-Anforderungen auf Sie auswirken, ist es häufig eine bessere Entscheidung, das Sammeln von Kartendaten der PSP zu überlassen. Dann müssen Sie und Ihr Kunde sich keine Sorgen um die Sicherheit von machen Kartendetails.

Email schicken

Das Senden von E-Mails ist eine knifflige Angelegenheit. Es kann schwierig sein, E-Mails für alle E-Mail-Clients zum Laufen zu bringen und Spamfilter zu überwinden. Sie müssen auch Abmeldeanfragen verwalten und sehen, wie viele Ihrer Nachrichten tatsächlich eingehen. Dienste von Drittanbietern wie Kampagnenmonitor und MailChimp zum Senden an Listen und Stempel Durch das Senden von E-Mails aus Ihrer Bewerbung kann die Haftung für E-Mails an einen Dritten übertragen werden, der ein Experte im Umgang damit ist.

9. Erkenne, dass billiges Hosting teuer ist

Wenn Sie jeden Monat weniger für Ihr Hosting bezahlen als jeden Morgen für Ihren Kaffee, stimmt etwas nicht. Hosting von schlechter Qualität kostet Sie viel mehr Zeit als Sie Geld sparen.

Hosts bieten billiges Hosting, indem sie nur sehr wenig Support bieten und eine große Anzahl von Websites auf jeden physischen Server laden. Je mehr Sites auf einem gemeinsam genutzten Server vorhanden sind, desto weniger Ressourcen verfügt jede einzelne Site - und Ihre Site wird wahrscheinlich langsam ausgeführt. Bei datenbankgesteuerten Websites können Verbindungsfehler mit dem Datenbankserver auftreten, da dieser über zu viel Datenverkehr verfügt damit umgehen.

wie man Formen in Illustrator hinzufügt

Wenn Sie möchten, dass Ihre Website schnell geladen wird und Ihr Host Ihnen bei Problemen hilft, zahlt es sich aus, ein bisschen mehr für Ihr Hosting zu zahlen. Mehr über Auswahl von Webhosting .

10. Informieren Sie sich über die Sicherheit

Mit ein paar grundlegenden Vorsichtsmaßnahmen können Sie das Risiko minimieren, dass eine Website gehackt oder unkenntlich gemacht wird. Die meisten Angriffe sind nicht persönlich, sondern zielen auf häufig installierte Software ab. Das Stoppen Sie Badware Die Site erklärt einige der häufigsten Dinge, die Sie auf einer gehackten Site finden können.

Upgrades auf Software von Drittanbietern müssen Teil der Spezifikation sein

Es ist unverantwortlich, einen Client mit auf seinem Server installierter Software von Drittanbietern ohne Aktualisierungsmöglichkeit zu belassen. Wenn Sie eine Site für jemanden bereitstellen, der Code von Drittanbietern verwendet - sei es Blog-Software, CMS, Forum oder etwas anderes -, müssen Sie entweder eine Vereinbarung mit dem Client haben, dass Sie die Software bei Bedarf aktualisieren oder weitergeben die Informationen, damit sie es selbst tun können.

Seien Sie sehr misstrauisch gegenüber Plugins

Vorausgesetzt, Sie haben die Kernsoftware, die Sie verwenden, wie z. B. WordPress, auf dem neuesten Stand, ist es weitaus wahrscheinlicher, dass ein Hacker über ein Plugin auf den Server zugreift, das entweder eine schlechte Sicherheit aufweist oder sogar ein Host für Malware selbst ist. Führen Sie Ihre Recherchen durch, bevor Sie Ihrer Site Code hinzufügen, und stellen Sie sicher, dass nach der Verwendung keine Probleme gemeldet werden.

Wenn Ihre Site kompromittiert ist, überprüfen Sie, ob andere Personen auf Ihrem Host das gleiche Problem haben

Möglicherweise hat nichts, was Sie installiert haben, eine Sicherheitsverletzung verursacht. Wenn Ihre Site gehackt wird, überprüfen Sie, ob auch andere Personen auf demselben Host das Problem haben. Das Problem kann auf eine schlechte Sicherheit beim Hosting-Unternehmen oder auf einen Kompromiss aufgrund der Control Panel-Software zurückzuführen sein. Wenn sie dies nicht sehr ernst nehmen, ist es Zeit, die Gastgeber zu wechseln!

Egal, ob Sie als Designer, Entwickler, Texter, Projektmanager oder in einer anderen Rolle im Web tätig sind, ich denke, je mehr Sie über den gesamten Stack wissen, desto besser. Wir arbeiten effektiver zusammen, wenn wir die Rollen des anderen schätzen und voneinander lernen können - und es gibt oft Tipps, die uns bei unserer eigenen Arbeit helfen können, wenn wir uns ansehen, was andere Menschen tun. Sie können Ihre eigenen Vorschläge für Tipps in den Kommentaren hinzufügen.