myWeb now!

01 Verwendung Inselsysteme Grid-Systeme können eine Menge Kopfschmerzen in Web-Design zu speichern. Versuchen Sie es mit freien Ressourcen wie Cameron McEfee ist guideguide Photoshop-Erweiterung und die Grid-System Generator, um benutzerdefinierte Raster einfach und präzise. 02 Get it all out Einer der besten Praktiken für eine erfolgreiche Web-Design (und Zeit-Management) ist es, alle Elemente auf Ihrer Photoshop Leinwand statt, bevor Sie dirty mit Design zu bekommen. Web-Designer oft recht Sprung in ein bestimmtes Gebiet ohne Rücksicht auf den Rest der Seite und das Gewicht des Inhalts. immer den groben Rahmen einrastet schnell wird smarter sicherzustellen Entscheidungen frühzeitig zu erkennen und zu vermeiden größere Änderungen später.

03 Kennzeichenhalter Custom Presets Dokument Hit Ctrl / Cmd + N, um das neue Dokument zu öffnen. Die Presets Menü enthält grundlegende Web-und Mobile-Presets, aber es fehlt vielen gängigen Dimensionen für eine Vielzahl von Grid-Systemen, Banner, iOS und Android-Geräten. nehmen Sie sich einige Minuten Zeit, um die fehlenden Bereiche zu füllen.

04 Passen Standardtyp Schließen Sie alle geöffneten Dokumente. Öffnen Sie die Zeichen-Palette, um Ihre bevorzugte Schriftart, Gewicht, Abstand und Farbe auszuwählen. No more default Myriad!

05 Crisp Vektoren halten Sie Ihre Vektor-Objekte knackig. mit dem Rechteck-Werkzeug (U) ausgewählt haben, öffnen Sie die Geometrie Optionsmenü in der Optionsleiste. Überprüfen Sie die Option An Pixeln ausrichten. 06 Einfache gepunktete Linie Wählen Sie das Pinsel-Werkzeug (B), dann öffnen Sie den Pinsel Presets Palette, die von der Drop-Down-Menü in der oberen rechten Ecke an. Wählen Platz Bürsten und traf anhängen. Wählen Sie nun die Festplatte Platz 1 Pixel Pinsel. Wechseln Sie auf die Pinsel-Palette und klicken Sie Pinselform, Anpassung Abstand auf 300%. auf Ihrer Leinwand, halten Sie die Umschalttaste, während Sie die Bürste horizontal oder vertikal zu einem knackigen gepunktete Linie erstellen. 07 Einfache Zeilenumbrüche mit einem schnellen Workaround können Photoshop gelten Text Wrap ähnliche Funktionen in InDesign. Wählen Sie das Rechteck-Werkzeug (U). In der Optionsleiste stellen Sie die Pfade zu füllen, stellen Sie die Form Rechteck-Werkzeug und wählen Sie (oder drücken Sie +) ‘to path Bereich Add’. auf Ihrer Leinwand, zeichnen Sie ein großes Rechteck über den Content-Bereich. Zurück in der Optionsleiste, ändern Sie den ‘to path Bereich Add’ auf (oder drücken Sie -) “vom Pfad Bereich Subtrahieren”. auf der Leinwand mit den Umrissen des ursprünglichen Rechtecks ​​zeigt, zeichnen Sie einen schneidenden Rechteck, wo der Text umbrochen wird. Wählen Sie das Textwerkzeug (T), und klicken Sie in das große Rechteck, um die Form zu einer Art Work Path mit Typ füllen konvertieren. Sie können weiter zu verfeinern Type Work Path Dimensionen mit dem Rechteck-Werkzeug (U) und dem Direktauswahl-Werkzeug (A). 08 Quick-Farbe füllt Hit Alt / Opt + Entf, um Text, Formen und Schichten mit der ausgewählten Vordergrundfarbe zu füllen. Drücken Sie Strg / Cmd + Entf, um einen Bereich mit der ausgewählten Hintergrundfarbe zu füllen. Hit D, um die Standard-Schwarz-Weiß zurück, und drücken Sie X, um die Vorder-und Hintergrundfarbe zu tauschen.

09 Bleiben Sie organisiert die Tastenkombination Strg / Cmd + G zu gruppieren Schichten und halten Sie organisiert und ausgerichtet. Gruppieren Sie Ihre Content-Bereiche und Komponenten – wie Navigation, featured Content-Bereiche, tragende Bauteile und Fußzeilen – separat sparen Sie Kopfschmerzen während der Design-und Entwicklungsprozess eines Projekts. 10 ab intelligente Verwendung von Smart Objects (gehen Sie zu Filter> Convert für Smart-Filter, und Strg / der rechten Maustaste auf Layer> Convert to Smart Object) weise wirklich erhöhen können Workflows während des gesamten Konstruktionsprozesses. Converting größere Fotos und Vektor-Objekte in Smart Objects behält ursprüngliche Bildqualität nach dem Skalieren, Drehen und Neigen.

Tags: web design, web design tips