61 Dinge, die jeder Webentwickler wissen sollte

Original-URL: http://stackoverflow.com/questions/72394

Übersetzer: Ruan Yifeng

1. Schnittstelle und Benutzererfahrung

1.1

Informieren Sie sich über die Implementierung von Webstandards durch die wichtigsten Browser und stellen Sie sicher, dass Ihre Site auf allen wichtigen Browsern ordnungsgemäß ausgeführt wird. Sie sollten mindestens die folgenden Engines testen: Gecko (verwendet in Firefox ), Webkit (verwendet in Safari , Chrome und einigen mobilen Browsern), IE (Sie können die von Microsoft veröffentlichten Application Compatibility VPC Images zum Testen verwenden) und Opera . Gleichzeitig können unterschiedliche Betriebssysteme auch die Darstellung Ihrer Website durch den Browser beeinflussen.

1.2

Neben Browsern gibt es noch weitere Möglichkeiten, Websites zu nutzen: Mobiltelefone, Screenreader, Suchmaschinen usw. Sie sollten wissen, wie Ihre Website in diesen Situationen funktioniert. MobiForge bietet einige relevante Kenntnisse zur Entwicklung mobiler Websites.

1.3

Erfahren Sie, wie Sie Ihre Website mit minimaler Unterbrechung für Ihre Benutzer aktualisieren. Generell gilt, dass Sie über ein Versionskontrollsystem (CVS, Subversion, Git etc.) und einen Datensicherungsmechanismus (Backup) verfügen müssen.

1.4

Verhindern Sie, dass den Benutzern unfreundliche Fehlermeldungen angezeigt werden.

1.5

Zeigen Sie die E-Mail-Adresse des Benutzers nicht direkt an, zumindest nicht im Klartext.

1.6

Legen Sie sinnvolle Nutzungsgrenzen für Ihre Website fest und beenden Sie den Dienst automatisch, sobald der Grenzwert überschritten wird. (Dies ist auch für die Website-Sicherheit relevant.)

1.7

Erfahren Sie, wie Sie die schrittweise Verbesserung von Webseiten implementieren.

1.8

Nachdem ein Benutzer eine POST-Anfrage gesendet hat, wird er immer auf eine andere Webseite umgeleitet .

1.9

Vergessen Sie nicht die Zugänglichkeit Ihrer Website (d. h. wie Menschen mit Behinderungen sie nutzen können). Für US-Websites ist dies manchmal eine gesetzliche Anforderung . WAI-ARIA verfügt hierzu über gutes Referenzmaterial.

2. Sicherheit

2.1

Lesen Sie den OWASP-Entwicklerleitfaden , der umfassende Hinweise zur Website-Sicherheit enthält.

2.2

Verstehen Sie SQL-Injection und wie Sie sie verhindern können.

2.3

Vertrauen Sie niemals vom Benutzer übermittelten Daten (Cookies werden auch vom Client übermittelt!).

2.4

Speichern Sie Benutzerkennwörter nicht im Klartext, sondern in gehashter Form.

2.5

Vertrauen Sie nicht zu sehr auf Ihr Benutzerauthentifizierungssystem. Es kann leicht kompromittiert werden, ohne dass Sie sich der Schwachstelle bewusst sind.

2.6

Erfahren Sie, wie Sie Kreditkarten verarbeiten .

2.7

Verwenden Sie SSL / HTTPS auf Anmeldeseiten und anderen Seiten, auf denen vertrauliche Informationen verarbeitet werden.

2.8

Erfahren Sie, wie Sie mit Session Hijacking umgehen.

2.9

Vermeiden Sie Cross-Site- Scripting (XSS).

2.10

Vermeiden Sie Cross Site Request Forgery (XSRF).

2.11

Wenden Sie Patches rechtzeitig an, um Ihr System auf dem neuesten Stand zu halten.

2.12

Stellen Sie sicher, dass Ihre Datenbankverbindungsinformationen sicher sind.

2.13

Bleiben Sie über die neuesten Entwicklungen bei Angriffstechniken und die neuesten Sicherheitslücken für die von Ihnen verwendeten Plattformen im Auge.

2.14

Lesen Sie das Browser-Sicherheitshandbuch von Google.

2.15

Lesen Sie das Handbuch für Web Application Hacker .

3. Leistung

3.1

Verwenden Sie, wann immer möglich, die Zwischenspeicherung. HTTP-Caching und HTML5-Offline-Speicher richtig verstehen und verwenden.

3.2

Bilder optimieren. Verwenden Sie keine 20 KB große Bilddatei als wiederkehrendes Hintergrundmuster auf einer Webseite.

3.3

Erfahren Sie, wie Sie Inhalte mit gzip/deflate komprimieren ( Deflate wird bevorzugt ).

3.4

Kombinieren Sie mehrere Stylesheet-Dateien oder Skriptdateien in einer Datei. Dadurch können Sie die Anzahl der HTTP-Anfragen des Browsers und die Gesamtgröße der Datei nach der GZIP-Komprimierung reduzieren.

3.5

Auf der Website „Exceptional Performance“ von Yahoo finden Sie zahlreiche Tipps zur Verbesserung der Front-End-Leistung sowie das Tool YSlow . Die Seitengeschwindigkeit von Google ist ein weiteres Tool zur Analyse der Leistung von Webseiten. Für beide muss Firebug installiert sein.

3.6

Wenn Ihre Webseite viele kleine Bilder verwendet (z. B. Symbolleisten), sollten Sie CSS Image Sprite verwenden, um die Anzahl der HTTP-Anfragen zu reduzieren.

3.7

Websites mit hohem Datenverkehr sollten die Aufteilung der Komponenten auf mehrere Domänen in Betracht ziehen.

3.8

Statische Inhalte (wie Bilder, CSS, JavaScript und andere Webinhalte, die nicht mit Cookies in Zusammenhang stehen) sollten auf einer separaten Domäne platziert werden , die die Verwendung von Cookies nicht erfordert . Denn wenn sich unter dem Domänennamen ein Cookie befindet, wird der Cookie-Inhalt an jede HTTP-Anfrage des Clients an den Domänennamen angehängt. Ein guter Ansatz ist hier die Nutzung eines Content Delivery Network (CDN).

3.9

Minimieren Sie die Anzahl der HTTP-Anfragen, die der Browser zum Rendern der Webseite benötigt.

3.10

Verwenden Sie den Closure Compiler von Google, um JavaScript-Dateien zu komprimieren. YUI Compressor kann ebenfalls verwendet werden.

3.11

Stellen Sie sicher, dass sich im Stammverzeichnis Ihrer Website eine Datei „favicon.ico“ befindet, da der Browser diese automatisch anfordert, auch wenn die Webseite diese Datei überhaupt nicht enthält. Wenn diese Datei also nicht existiert, erzeugt sie viele 404-Fehler und beansprucht die Bandbreite Ihres Servers.

4. Suchmaschinenoptimierung (SEO)

4.1

Verwenden Sie „suchmaschinenfreundliche“ URLs, etwa example.com/pages/45-article-title statt example.com/index.php?page=45.

4.2

Verwenden Sie keine „Hier klicken“-Hyperlinks, da Sie dadurch eine SEO-Gelegenheit vergeuden und die Effektivität von Bildschirmleseprogrammen verringern.

4.3

Erstellen Sie eine XML-Sitemap- Datei. Der Standardspeicherort dieser Datei lautet normalerweise /sitemap.xml (d. h. sie befindet sich im Stammverzeichnis der Website).

4.4

Wenn mehrere URLs auf denselben Inhalt verweisen, verwenden Sie in Ihrem Webseitencode <link rel="canonical" ... /> .

4.5

Verwenden Sie die Webmastertools von Google und den Site Explorer von Yahoo.

4.6

Nutzen Sie von Anfang an Google Analytics (oder das Open-Source-Traffic-Analytics-Tool Piwik ).

4.7

Lernen Sie die Rolle von robots.txt kennen und erfahren Sie, wie Suchmaschinen-Spider funktionieren.

4.8

Durch die Umleitung von Anfragen für www.example.com zu example.com (mithilfe einer 301 Moved Permanently-Umleitung) oder umgekehrt soll Google verhindern, sie als zwei Websites zu behandeln und ihre Rankings separat zu berechnen.

4.9

Seien Sie sich darüber im Klaren, dass es bösartige oder zwielichtige Web-Spider gibt.

4.10

Wenn Ihre Website nicht-textuelle Inhalte (wie Videos, Audiodateien usw.) hat, sollten Sie das Sitemap-Erweiterungsprotokoll von Google zu Rate ziehen.

5. Technologie

5.1

Verstehen Sie das HTTP-Protokoll und Konzepte wie GET, POST, Sitzungen, Cookies, einschließlich der Bedeutung von „zustandslos“.

5.2

Stellen Sie sicher, dass Ihr XHTML / HTML und CSS den W3C-Standards entsprechen, damit sie die Validierung bestehen. Dadurch wird verhindert, dass Ihre Seiten Browserprobleme auslösen, und sie funktionieren ordnungsgemäß mit Bildschirmleseprogrammen und Mobiltelefonen.

5.3

Verstehen Sie, wie Browser JavaScript-Skripte verarbeiten.

5.4

Verstehen Sie, wie JavaScript-Dateien, Stylesheets und andere Ressourcen auf einer Webseite geladen und ausgeführt werden, und überlegen Sie, wie sie sich auf die Seitenleistung auswirken. In manchen Fällen kann es sinnvoll sein , Skriptdateien am Ende Ihrer Webseite zu platzieren .

5.5

Machen Sie sich mit der Funktionsweise der JavaScript-Sandbox vertraut, insbesondere wenn Sie Iframes verwenden möchten.

5.6

Beachten Sie, dass JavaScript möglicherweise nicht verfügbar oder deaktiviert ist und dass Ajax möglicherweise nicht funktioniert. Bedenken Sie, dass „NoScript“ bei einigen Benutzern immer beliebter wird, die Skriptunterstützung bei mobilen Browsern sehr unterschiedlich ist und Google Seiten indiziert, ohne die meisten Skripts auszuführen.

5.7

Verstehen Sie den Unterschied zwischen 301-Weiterleitungen und 302-Weiterleitungen (dies ist auch eine SEO-bezogene Frage).

5.8

Erfahren Sie so viel wie möglich über Ihre Bereitstellungsplattform.

5.9

Erwägen Sie die Verwendung von „Stylesheet zurücksetzen“ .

5.10

Erwägen Sie die Verwendung eines JavaScript-Frameworks (wie etwa jQuery , MooTools , Prototype ), bei dem Sie Browserunterschiede ignorieren können.

6. Fehler beheben

6.1

Bedenken Sie, dass ein Programmierer 20 % seiner Zeit mit dem Codieren und 80 % seiner Zeit mit der Wartung verbringt, und planen Sie Ihre Zeit entsprechend.

6.2

Richten Sie einen wirksamen Mechanismus zur Fehlerberichterstattung ein.

6.3

Erstellen Sie Kanäle oder Systeme, über die Benutzer mit Ihnen Kontakt aufnehmen und Ihnen Vorschläge und Kritik übermitteln können.

6.4

Verfassen Sie eine Dokumentation für künftiges Wartungs- und Kundendienstpersonal, in der die Funktionsweise des Systems klar erläutert wird.

6.5

Machen Sie häufig Backups! (Und stellen Sie sicher, dass diese Sicherungen gültig sind.) Zusätzlich zu einem Sicherungsmechanismus müssen Sie auch über einen Wiederherstellungsmechanismus verfügen.

6.6

Verwenden Sie zum Speichern Ihrer Dateien eine Art Versionskontrollsystem, beispielsweise Subversion oder Git .

6.7

Vergessen Sie nicht, Unit-Tests durchzuführen. Frameworks wie Selenium werden Ihnen dabei hilfreich sein.

(über)