Heute werden wir uns mit den Webdesign-Praktiken und Trends des größten Software-Namens beschäftigen, um zu sehen, ob wir etwas über einige Fehler erfahren können, die wir in unserer eigenen Arbeit vermeiden können.
Fühlen Sie sich frei, den folgenden Vorschlägen zuzustimmen oder diesen nicht zuzustimmen. Als professionelle Designer sind Ihre Einblicke wertvoll und ich freue mich auf Ihre Gedanken.
Der gelegentliche Rant
Für alle, die Artikel hassen, die mit Sprüchen gefüllt sind, entschuldige ich mich, dass dieser Beitrag manchmal etwas hart ist. Normalerweise lobte ich gutes Design lieber als schlechte Kritik, aber als David Appleyard und ich beschlossen haben, einen Beitrag zu den Designtrends von Microsoft zu schreiben, schien es viel mehr zu geben über die unordentlichen, hässlichen und / oder unpassenden Dinge Sie tun als die Alternative.
Um Sie in den Kommentaren abzuschneiden, werde ich in der nachstehenden Analyse keinen Vergleich mit Apple erwähnen oder diesen vergleichen. Dies soll kein Argument für einen PC im Vergleich zu Mac sein, sondern eher ein Blick auf das, was wir für wirklich schlechte Praktiken in Webdesign und -entwicklung halten. Fairerweise ist Microsoft ein äußerst erfolgreiches Unternehmen, das aufgrund dieser Probleme nicht ausfällt. Wie wir im Folgenden hervorheben, scheint es, als ob Microsoft für einige Websites wirklich einige herausragende Designer im Team hat. Wir schlagen lediglich vor, eine umfassendere Qualitätskontrolle zu implementieren.
Lassen Sie uns vor diesem Hintergrund einige Bereiche analysieren, an denen Microsoft scheinbar an Design und Entwicklungspraktiken mangelt und wie Sie von diesem Wissen profitieren können.
# 1 Hüten Sie sich vor der Vergabe bestimmter Plugins
Wenn wir aus den jüngsten Krisen zwischen Apple und Adobe etwas gelernt haben, kann das Erstellen von Websites, die vollständig von geschlossenen Plugins von Drittanbietern abhängen, zu schwerwiegenden Fehlschlägen führen. Microsoft scheint den gleichen Fehler zu wiederholen, da sein eigenes Netzwerk von Sites immer mehr von Silverlight abhängig wird.
Als ich die verschiedenen Websites von Microsoft durchgesehen habe, um mich auf diesen Artikel vorzubereiten, wurde ich ständig von Windows belästigt, dass ich Silverlight nicht installiert habe und daher die Webseite nicht so sehen konnte, wie sie angesehen werden sollte. Meine Frage ist, warum diese Route gehen. Vor allem, wenn es sich um einfache Diashows und Animationen handelt, die mit allgegenwärtigen Technologien ausgeführt werden können. Zugegeben, Microsoft besitzt Silverlight, so dass es aus geschäftlicher Sicht sinnvoll ist, ihre Investitionen zu unterstützen. Dies bedeutet jedoch nicht, dass dies die beste Wahl für Sie ist, wenn Sie auf ihren Zug springen.
Unabhängig davon, ob Sie ein großer Fan von Silverlight sind oder nicht, mein Rat ist, äußerst vorsichtig zu sein, wenn Sie die Funktionalität Ihrer Website auf dieser oder einer ähnlichen Technologie aufbauen. Da die Debatte darüber, ob es sinnvoll ist, Websites mit Flash zu entwickeln, sich immer weiter aufheizt, werden zweitrangigere Systeme wie Silverlight immer mehr zum Glücksspiel. Halten Sie sich, wenn möglich, an browserübergreifenden, standardkonformen Code und Tools, die keine zusätzlichen Arbeiten oder Installationen von Ihren Besuchern erfordern.
# 2 Sehen Sie sich Ihre Auflösung an
Dies ist eine meiner größten Beschwerden über Microsoft, einfach weil es wie schlampiges Design wirkt. Zweifellos gibt es eine feine Linie, um die Dateigröße zu verringern, um die Benutzerfreundlichkeit zu erhöhen, und um die Bilder sauber und scharf zu halten. Ich kann jedoch nicht anders als das Gefühl haben, dass Microsoft anfälliger für hässliche, gezackte JPGs zu sein scheint als jede andere professionelle Seite, die ich in den letzten Jahren gesehen habe.
Die ständig abnehmende Anzahl von DFÜ-Internetbenutzern drückt die akzeptablen Bildgrößen immer weiter nach oben. Dies bedeutet keinesfalls, dass Sie nicht besonders darauf achten sollten, alles so klein wie möglich zu machen, aber sobald es anfängt, das Design so stark zu belasten, dass die scheinbare Qualität der Website drastisch gemindert wird, werden die Bilder selbstzerstörerisch!
Sie leben aus purer Ironie, wenn Sie Bilder verwenden, um Ihre Website besser aussehen zu lassen und letztendlich Ihren ästhetischen Reiz zu verringern. Wenn möglich, zeigen Sie eine Vorschau der verarbeiteten Bilder auf verschiedenen Monitoren an und achten Sie genau darauf, wie viel Verzerrung und Artefakte Sie für akzeptabel halten.
# 3 Organisiertes Durcheinander
Manchmal können Sie alle offensichtlichen Gestaltungsregeln befolgen und trotzdem etwas erhalten, das optisch subpar erscheint. Beim Durchsuchen der Websites von Microsoft bin ich auf unzählige Bereiche gestoßen, wie den unten, der trotz ihrer Versuche, eine spaltenbasierte Organisation zu erstellen, unübersichtlich schien.
Also, was ist das Problem? Einfach gesagt, auf relativ kleinem Raum ist hier eine Menge los. Auch wenn sie definitiv versucht haben, den Inhalt zu ordnen und die visuelle Lesbarkeit durch Symbole zu verbessern, ist das Endergebnis immer noch aus dem Gleichgewicht geraten.
Wenn Sie sich genau anschauen, was hier vor sich geht, fühlt es sich an wie vier Informationsspalten, die von vier verschiedenen Personen entworfen wurden, die zusammengepfercht wurden. Die linke Seite scheint im Vergleich zu der rechten Seite sehr schwer zu sein, die Textfarbe ist etwas sporadisch, der Inhalt ist unbeholfen versetzt, und den Spalten fehlt der Atem, um sie wie die unabhängigen Bereiche erscheinen zu lassen, in denen sie sich befinden.
Die Lektion hier ist, darauf zu achten, dass Sie einen einzelnen Bereich Ihrer Seite mit zu unterschiedlichen Informationen füllen. Zweifellos gibt es viele Situationen, in denen die Situation eine Menge an Inhalten erfordern wird. Die Organisation sollte jedoch auf konsistente und attraktive Weise behandelt werden, wie in den nachstehenden schönen Beispielen (von Websites, die nicht von Microsoft stammen).
# 4 Inkonsistenz
Öffnen Sie von Microsoft.com aus die riesigen Dropdown-Menüs für die Navigation, und wählen Sie einen Bereich der Website aus, den Sie besuchen möchten. Unabhängig davon, auf welchen Link Sie klicken, die resultierende Seite sieht ganz anders aus als die Startseite und unterscheidet sich immer noch von den meisten anderen Links in derselben Dropdown-Liste.
Das Erkunden der Microsoft-Site ist wie das Drehen eines Roulette-Rads.Sie haben praktisch keine Ahnung, wo Sie landen werden und was Sie von der nächsten Seite erwarten. Einige Seiten haben swooshy Hintergründe, während andere weiche Farbverläufe oder sogar explodierende Kreise verwenden. Die meisten Seiten scheinen Blau, aber nicht notwendigerweise dasselbe Blau zu bevorzugen, und es gibt auch viele Seiten, die den blauen Trend völlig ignorieren.
Der Punkt ist, ob Ihre Website zwei oder zweihundert Seiten hat, Konsistenz ist ein Muss. Benutzer fühlen sich wohler, wenn sie sich innerhalb weniger Sekunden mit der Funktionsweise und dem Aussehen einer Website vertraut machen können. Wenn Sie ihnen alle paar Seiten etwas drastisch anderes geben, wird das Surfen zu einem verwirrenderen und weniger effizienten Erlebnis.
Darüber hinaus gibt es die Idee, dass die Schaffung einer starken, konsistenten Marke nur ein gutes Geschäft ist, da es den Kunden hilft, persönlicher auf Ihr Unternehmen einzugehen. Zwar jongliert Microsoft mit vielen verschiedenen Marken und Microsites, die alle von der Homepage stammen, aber selbst unter den Kernseiten von Microsoft.com scheinen die Bildthemen und Navigationsmethoden drastisch verschieden zu sein.
# 5 Clipart-zentriertes Design
Dieser Vorschlag ist offensichtlich ein wenig absurd, da ClipArt und Microsoft Office seit jeher unaufhaltsam miteinander verbunden sind. Seit 1995 hat sich das Icon-Design jedoch weiterentwickelt und es ist an der Zeit, diesen spezifischen Stil in den verwendeten Bildern aufzugeben.
Die oben genannten Beispiele aus verschiedenen Microsoft-Seiten lassen mich schrecken, vor allem der schreckliche "Anfänger-Entwickler". Logo. Ich habe keine Ahnung, warum ein Bumerang eine Pflanze angreift oder ob der magisch schwebende Computermonitor den Angriff unterstützt oder vor der Szene flieht. Ich weiß nur, dass die visuelle Kommunikation hier ein unverständliches Durcheinander ist.
Dies ist einer der Hauptgründe, warum CSS-Galerien wie unsere eigene existieren. Nicht so, dass Sie das Design von anderen stehlen können, aber so können Sie in den zehn Jahren, in denen Sie sich gerade entwickeln, einen Einblick in den Zustand des Designs erhalten. Wenn Sie durch diese Galerien stöbern, ist dies, als würden Sie beliebte Bekleidungsgeschäfte im Einkaufszentrum besuchen und Ihrer verrückten Tante das zeigen Sie muss sich nicht wie jemand aus der Sunny und Cher Show kleiden.
Fühlen Sie sich immer frei, um Grenzen zu überwinden und aktuelle Trends zu überwinden, indem Sie Ihre eigenen starten. Seien Sie vorsichtig, wenn Sie jahrelang stagnieren, während der Rest der Welt weitergeht.
# 6 Falsch ausgerichteter überlaufender Text
Ein weiterer Trend, den Microsoft-Websites kaum übersehen können, sind die ständig gebrochenen Textspalten, die ihre offensichtlichen Grenzen überschreiten.
Dieser ist ziemlich einfach zu reparieren und erfordert nur ein wenig Aufwand und Aufmerksamkeit. Stellen Sie sicher, dass Sie kostenlose Tools wie das Browserlabor von Adobe nutzen, um sicherzustellen, dass Ihre Layouts nicht beschädigt werden, wenn Sie in einem der wichtigsten Browser angezeigt werden.
Das CSS-Layout ist zwar zugegebenermaßen eine knifflige Angelegenheit, wenn es um Browserübergreifende Konsistenz geht, doch kleine Fehler wie diese beeinträchtigen die Qualität Ihrer Website und sind die Zeit, die zur Behebung von Problemen erforderlich ist.
# 7 schlechte Ausrichtung
Manchmal stellte mich eine bestimmte Seite vor die Herausforderung, zu entscheiden, welches Design hervorzuheben ist. Auf der folgenden Seite habe ich beispielsweise überlegt, einen winzigen Screenshot zu verwenden, der beim Klicken nicht größer wird. Je mehr ich jedoch auf die Seite blickte, desto verwirrter wurde das, was los war das Layout.
Wenn Sie mit der grundlegenden Designtheorie vertraut sind, wissen Sie, dass das Erlernen der Implementierung solider, konsistenter Ausrichtungen der Schlüssel für ein gutes Seitenlayout ist. Die ungeradzahlige Mischung aus linker, mittlerer und rechter visueller Ausrichtung, die oben auf der Baustelle stattfindet, in Verbindung mit dem unbeholfenen leeren Raum in der Nähe der Oberseite, führt zu einem wirklich merkwürdigen visuellen Fluss der präsentierten Informationen.
Wenn Sie darüber hinaus die Seite oben aufrufen, werden Sie feststellen, dass der gesamte Inhalt so aussieht, als würde er zentriert werden, wird aber wirklich durch den Streifen in der Mitte abgeworfen, wodurch die Seite recht mittig erscheint.
# 8 Ad Clutter
Kostenlose Design-Blogs wie dieser müssen viele Anzeigen enthalten. Dies ist einfach die Art und Weise, wie wir ein Einkommen erzielen und Sie weiterhin mit Inhalten versorgen. Wenn Sie jedoch eine professionelle Business-Site betreiben, müssen Sie sorgfältig prüfen, ob Sie Ihre Werbebotschaft und Ihre Professionalität beeinträchtigen möchten.
Die Seiten von Microsoft.com sind mit verschiedenen Anzeigen übersät, die die Ästhetik der Seite, auf der sie sich befinden, wirklich beeinträchtigen. Diese Anzeigen verweisen manchmal direkt auf andere Microsoft-Seiten, manchmal auf andere Unternehmen oder Partner. Es ist nichts falsch mit dem Konzept, den Verkehr auf andere Teile Ihrer Website zu lenken, aber wie Sie dies erreichen, kann einen großen Unterschied machen.
Wenn es eine Sache gibt, die die meisten Webbenutzer gelernt haben, zu erkennen, zu ignorieren und möglicherweise sogar erneut zu senden, handelt es sich um eine Werbebanner. Nicht um zu sagen, dass diese Art von Werbung nicht mit der richtigen Ausrichtung und dem richtigen Design funktioniert, oder sogar, dass Microsoft-Nutzer nicht darauf klicken. Ich frage mich jedoch, ob es keinen besseren Weg gibt.
Wenn Microsoft den Datenverkehr auf seine Mobiltelefone und andere Projekte lenken möchte, besteht der einfache Weg darin, ein überladenes, nicht dem Standard entsprechendes (designbezogenes) Werbesystem einzurichten, das über die gesamte Website läuft. Es scheint jedoch, als würde die Integration dieses Inhalts als Teil der eigentlichen Website eine wesentlich bessere Klickrate aufweisen, da mehr Benutzer die Nachricht zur Kenntnis nehmen und keine verinnerlichten Regeln zur Vermeidung von Banneranzeigen um jeden Preis brechen müssen.
Außerdem würde eine solche Integration dazu führen, dass die Entwürfe konsistenter werden, da sie als einzelne Einheit und nicht von separaten Teams erstellt werden. Dies ist ein Szenario, in dem ich die Kosteneffizienz von Microsofts Ansatz verstehen kann, aber Sie davor warnen sollte, ihrem Beispiel zu folgen.Die Chancen, die von Ihnen entworfene Websites nicht mit dem Mega-Netzwerk von Microsoft-Websites konkurrieren können, sind eher solide, integriertes Design, sodass Sie das visuelle Durcheinander übermäßiger Anzeigen vermeiden können.
Offensichtlich gibt es viele Genres für Websites, bei denen dies überhaupt nicht zutrifft, da erwartet wird, dass Werbung vorhanden ist. Stellen Sie nur sicher, dass Sie überlegen, ob Ihre Website für den Verkauf Ihres Produkts oder Ihrer Dienstleistung bestimmt ist oder ob zusätzliche Einnahmen und Ablenkungen durch Werbung erforderlich sind.
# 9 Ein Mangel an Atemraum
Beim Printdesign richten Designer jede Seite mit einem Live-Bereich ein. Normalerweise handelt es sich hierbei um einen rechteckigen Ausschnitt aus dem Beschnitt der Seite, der den Bereich definiert, in dem Inhalte sicher platziert werden können, um Seitenabschneidungen oder Randüberfüllung zu vermeiden. Die meisten Webdesigner tun dies intuitiv, da es ziemlich offensichtlich ist, dass Sie nicht möchten, dass Ihre Inhalte zu weit von der Browser-Seite entfernt sind.
Wie der Screenshot oben zeigt, gibt es einige Microsoft-Seiten, die solche Meinungen nicht zu berücksichtigen scheinen. Stattdessen wird der Inhalt gestartet, sobald die Seite mit horizontalem Abstand (mindestens in den von mir überprüften Browsern) leer ist.
Das Navigationsfeld fühlt sich nicht so an, als wäre es an der Seite der Seite eingebaut. Es fühlt sich an, als würde es abgeschnitten werden (wiederum kann es sein, dass es gerade aus dem Grund kommt, dass ich keinen Internet Explorer habe). Die Lektion hier ist einfach: Denken Sie immer an den Rand des Browserfensters. Wenn Sie nicht gegen die Regel verstoßen, um einen offensichtlichen visuellen Anschnitteffekt zu erzielen, platzieren Sie Ihre Inhalte, insbesondere interaktive Teile und Links, innerhalb eines sicheren Bereichs, sodass sich die Benutzer bei der Verwendung nicht überfüllt fühlen.
Wenn Sie sich den obigen Screenshot genau ansehen, können Sie einige weitere Beispiele von Microsoft-Designern sehen, ohne zu überlegen, ob der Text in allen gängigen Browsern ordnungsgemäß fließt. Für Microsoft ist dies ein amüsanter Trend, da viele Webdesigner ihre Tage damit verbringen, spezielle Einstellungen für den Internet Explorer von Microsoft zu treffen, aber das Milliardenunternehmen kann sich nicht die Mühe machen, seine eigene Arbeit auf anderen Systemen zu überprüfen.
# 10 Dein Talent nicht nutzen
Obwohl es oben bei Microsoft viele negative Kommentare zu den Webdesignern gibt, war ich angenehm überrascht, dass sie tatsächlich einige Websites und Seiten haben, die einfach toll aussehen.
Die oben genannten Beispiele sind nur zwei der vielen Orte, an denen ich glaube, dass Microsoft sie mit ihrem Layout, der Farbauswahl, der Grafik und der Browser-kompatiblen Kompatibilität wirklich aus dem Park geworfen hat. Was mir sagt, ist, dass irgendwo zwischen dem riesigen Pool von Kabinen in dieser Firma einige wirklich talentierte Personen sitzen, die in der Lage sind, die Firma vollständig aus ihrem Design-Einbruch herauszunehmen.
Diese Designer, wer auch immer sie sind, sollten zu Positionen befördert werden, die es ihnen ermöglichen, zusammenzuarbeiten und einheitliche Standards zu setzen, an die sich jeder Microsoft-Webdesigner buchstäblich halten müsste. Anstelle eines Labyrinths von unzusammenhängenden Inhalten können sie ein starkes Markennetzwerk bilden, das schöne Websites umfasst, die eindeutig zu einer Familie gehören.
Der letzte Vorschlag, den ich Ihnen präsentiere, ist, diese Arten von herausragenden Einzelpersonen in Ihrer eigenen Firma zu finden und ihnen eine Stimme zu geben. Anstatt sich über den Mangel an Talent unter den anderen Mitgliedern Ihres Teams zu beklagen, sollten Sie die stärksten Designer und Entwickler auf Positionen setzen, in denen sie jeden visuellen Kommunikationsfluss beeinflussen können, der mit einer bestimmten Marke verbunden ist.
Dies kann effizient und effektiv durch Erstellen klarer, konsistenter und strikter Markenrichtlinien erreicht werden, die an jeden Designer und Entwickler für jede bestimmte Marke, mit der Sie arbeiten, verteilt werden.
Schlussgedanken
Zusammenfassend lässt sich festhalten, dass Microsoft zwar über einige äußerst talentierte Webdesigner verfügt, die Arbeit dieser Einzelpersonen jedoch fast vollständig von den zahlreichen Inhalten überschattet wird, die nicht einmal den Standards entsprechen, die wir im ersten Jahr von Anfängern und Entwicklern erwarten würden .
Glücklicherweise können wir Unternehmen wie Microsoft als Unterrichtshilfe verwenden, um deutlich zu machen, dass es tatsächlich einen falschen Weg gibt, Dinge zu tun. Stellen Sie sich vor, dass Sie als alleinstehende Freiberuflerin oder kleine Designfirma Mega-Konzerne und Designfirmen in Bezug auf die Qualität Ihrer Arbeit nicht völlig übertreffen können.
Ich habe festgestellt, dass es oft einfacher ist, Beispiele für Qualitätsdesigner in weltweiten Büros zu finden, als am Schreibtisch großer Unternehmen zu sitzen. Trösten Sie, dass Sie nicht die Qualität von Hunderten von Designern koordinieren und kontrollieren müssen. Tun Sie Ihr Bestes, um einige der besten Websites im Internet zu erstellen, mit den wenigen Ressourcen, die Sie in Verbindung mit einer großen Menge an persönlichem Antrieb besitzen, um funktionell schöne Designs zu erstellen.