WILLKOMMEN ZUR BESSEREN. künstler-webseite

Transkript

1 WILLKOMMEN ZUR BESSEREN künstler-webseite

2 NEUES konzept Neueste Werke Kommende Ereignisse Bildwechsel Startseite

3 NEUES konzept Neueste Werke Kommende Ereignisse Bildwechsel Startseite Galerien (sortiert?) Nach Technik Nach Entstehung Werke

4 NEUES konzept Neueste Werke Kommende Ereignisse Bildwechsel Startseite Galerien (sortiert?) Nach Technik Nach Entstehung Werke Vita - Über mich - CV Zur Person - Persönlich Mitgliedschaften BBK - DAGGWS Biografie

5 NEUES konzept Neueste Werke Kommende Ereignisse Bildwechsel Startseite Galerien (sortiert?) Nach Technik Nach Entstehung Werke Vita - Über mich - CV Zur Person - Persönlich Mitgliedschaften BBK - DAGGWS Biografie Als Liste oder als Bildgalerie Partner - Mitkünstler - Links Weitere Seiten (facebook etc.) Ausstellungen Referenzen

6 NEUES konzept Neueste Werke Kommende Ereignisse Bildwechsel Startseite Galerien (sortiert?) Nach Technik Nach Entstehung Werke Vita - Über mich - CV Zur Person - Persönlich Mitgliedschaften BBK - DAGGWS Biografie Als Liste oder als Bildgalerie Partner - Mitkünstler - Links Weitere Seiten (facebook etc.) Ausstellungen Referenzen Vollständiger Name, Adresse, , Telefonnummer (Impressumgenerator) Kontakt Impressum DEMO

7 NEUES konzept Sonderthema: Verkaufen im www INTERN Auf der eigenen Webseite via -Anfrage EXTERN Verkaufsplattformen

8 I word press

9 WEBSITE baukasten EVTL. ÜBERSPRINGEN =>99

10 WEBSITE baukasten Photo: pixabay DEMO

11 VERBESSERUNGStipps WEB-WERKZEUGE Photo: pixabay.com/nasa

12 VERBESSERUNGStipps WEB-WERKZEUGE 20 DESIGN-TIPPS

13 VERBESSERUNGStipps WEB-WERKZEUGE 20 DESIGN-TIPPS GUTE BILDER Photo: pixabay.com/nasa

14 VERBESSERUNGStipps WEB-WERKZEUGE 20 DESIGN-TIPPS GUTE BILDER MOBILE WEBSITE Photo: pixabay.com/nasa

15 WEBwerkzeuge Bild-/Textbearbeitung am PC Mac geeigneter für Design? Für Texte Word / Notepad Für Bilder ungeeignet: Paint Empfehlung: Picasa (z.b. von Chip) Befriedigend: Pixlr.com (engl.) Sehr gut: Corel Paint Optimal: Photoshop DEMO tipp:

16 WEBwerkzeuge Bildbearbeitung ONLINE Adobe Photoshop Express (gratis) photos.google.com (Gmail-Konto) viele Apps, alle lahm Logoerstellung ONLINE (sehr sehr simpel) DEMO

17 WEBwerkzeuge Daten in der»cloud« Fotos in der»cloud« (fotos) DEMO

18 WEB 20 TRICKS+ werkzeuge tipps Photo: unsplash.com

19 GUTESdesign 01 was muss ich beachten? Eigene Ideen Eigene Bilder Keine Website-Plagiate Trends? One-Pager + Parallaxen-Effekt schon wieder out Photo: pixabay.com DEMO

20 LAYOUTraster 02 wie soll meine webseite aussehen? Zauberwort:»Raster«Gleichmäßige Gestaltung Harmoniegesetze

21 LAYOUTraster goldener schnitt 03

22 LAYOUTraster 04 fibonacci folge»fibonacci-folge«summe der beiden Zahlen-Vorgänger 1:2 2:3 3:5 5:8 8:13... Formen nach der Natur

23 BASISbereiche 05 was ist üblich? Kopfbereich Menubereich Untermenus Bildbereich Fußbereich Sonderform One-Pager Sonderform mit Parallaxen-Effekt DEMO DEMO

24 KIss 06 keep it simple stupid Eine gute Webseite ist einfach, sauber, knackig, klar, ehrlich und irgendwie überraschend Gestalte die Webseite um Deine Hauptaussage herum Die Webseite ist für den Betrachter, nicht für den, der sie macht

25 UP TO date 07 das kannste SO MACHEN... Quelle: Internet

26 Quelle: Internet 07

27 EIGENESlogo 08 na logo :) Eigenes»Logo«macht einmalig Einfache Lösung:»SignaturInitialenFantasiename«Vielfache Nutzung Briefkopf, Visitenkarte, Autowerbung... Abspeichern als Bitmap! Photo: pixabay.com DEMO

28 EIGENESlogo 08 JPG /.jpg / jpeg

29 EIGENESlogo 08 achtung: Falsche Hintergrundfarbe

30 EIGENESlogo 08 tipp: speichern als.png

31 WEBschriften 09 was zu beachten ist Schriften auf PC/MAC unterschiedlich gratis oder kommerziell Lizenzen beachten Schrift = Persönlichkeit Photo: pixabay.com

32 09 Quelle: DEMO

33 WEBschriften 09 nie zuviele schriften mischen Nie mehr als 2-3 Schriften Handschriften gezielt einsetzen Times, Arial und eher vermeiden tipp: DEMO

34 WEBschriften 10 Diese Schrift ist zu hell Besserer Kontrast dieser text ist etwas zu dominant Dieser Text ist wohl zu klein für eine Präsentation Benutzen Sie Großbuchstaben nur GEZIELT Versetzen Sie sich in die Lage des Betrachters

35 PARTNER WEBicons 11 KOMFORT HANNOVER EINSTELLUNG STIL was zu beachten ist Icons ersetzen Text RAUM INDIVIDUALITÄT ATMOSPHÄRE SERVICE ERREICHBARKEIT HERZ

36 PARTNER WEBicons 11 KOMFORT HANNOVER EINSTELLUNG STIL lizenzrecht Unbedingt Lizenzen beachten z.b. nur private Nutzung z.b. Verlinkung auf jeder Seite z.b. komplett freie Nutzung RAUM INDIVIDUALITÄT ATMOSPHÄRE SERVICE ERREICHBARKEIT HERZ

37 TEXTtipps 12 textmenge Weniger ist (meist) mehr Einfache Wortwahl (meist) besser Lasst Bilder sprechen

38 TEXTtipps 13 quellenangaben Zitate kennzeichnen mit Quellenangabe

39 TEXTtipps 14 zeilenlängen im web Zu breite Zeilen lassen sich schwer lesen und das Auge ermüdet schnell. Der Sprung vom Zeilenende zum nächsten Zeilenanfang ist mühselig. Zu kurze Zeilen mit weniger als 18 Zeichen sind oft ebenso mühselig zu lesen. Das Auge muss ständig in die neue Zeile springen und ermüdet schnell. Optimal lesbar sind ca. 6 Wörter und 34 Buchstaben pro Zeile. Texte mit mehr als 7 Zeilen werden oft nicht komplett gelesen. Viele lesen - besonders im Web - nur den Anfang und den Schluss.

40 TYPOtipps 15 Lieber Markus, hiermit lade ich Dich herzlich zu einer Sommernachtsparty ein. Wir wollen essen, tanzen, feiern und gemeinsam den Sommeranfang in der Scheune von Bauer Hansen in Engensen feiern. Sonntag, 21. Juni ab Uhr Hinter den Höfen Burgwedel UAWG bis 5. Mai Lieber Markus, hiermit lade ich Dich herzlich ein, zu einer sommernachtsparty Wir wollen essen, tanzen, feiern und gemeinsam den Sommeranfang in der Scheune von Bauer Hansen in Engensen feiern. Sonntag, 21. Juni ab Uhr Hinter den Höfen Burgwedel UAWG bis 5. Mai

41 TYPOtipps 16 Viele unterschiedliche Schriftarten = Fonts können ein Design ruinieren. 2-3 Schriften reichen in der Regel. Besser nutzen Sie weniger Schriften. Eine Schreibschrift wirkt persönlicher als eine Standardschrift. Schaffen Sie Kontraste zwischen "Formell" und "Individuell". Relevante Unterschiede kann man in Schriftgröße und unterschiedlichen Schnitten fett, kursiv, leicht und extrabold akzentuieren. Aber -nicht wie hier- alles in einem Abschnitt!

42 TYPOtipps 17 aber nutzen Sie bitte niemals eine schreibschrift für einen kompletten absatz oder als fließtextschrift. diese schrift heißt "nichtlusduenn". und ich bin "nichtlusdick" Schrift: Joscha Sauer

43 TYPOtipps 18 Bitte verzerren Sie NIEMALS Ihren Text Stattdessen verwenden Sie besser einen SCHMALEREN Schriftschnitt oder einen WEITEREN Auch solche angepassten Formen kommen meist aus der Laien-Ecke

44 TYPOtipps 19 linksbündig rechtsbündig mittelsatz blocksatz Lieber Leser, bitte entscheiden Sie stets, wie ein Text sich am besten leist oder am besten aussieht. Nicht immer bringt der Blocksatz die besten Ergebnisse. Lieber Leser, bitte entscheiden Sie stets, wie ein Text sich am besten leist oder am besten aussieht. Nicht immer bringt der Blocksatz die besten Ergebnisse. Lieber Leser, bitte entscheiden Sie stets, wie ein Text sich am besten leist oder am besten aussieht. Nicht immer bringt der Blocksatz die besten Ergebnisse. Lieber Leser, bitte entscheiden Sie stets, wie ein Text sich am besten leist oder am besten aussieht. Nicht immer bringt der Blocksatz die besten E r g e b n i s s e. Eigentlich eher selten. Doch manchmal ist das ganz okay, wenn man entsprechend für sinnvolle Silbentrennungen sorgt und eine passende Gliederung hat. Eigentlich eher selten. Doch manchmal ist das ganz okay, wenn man entsprechend für sinnvolle Silbentrennungen sorgt und eine passende Gliederung hat. Eigentlich eher selten. Doch manchmal ist das ganz okay, wenn man entsprechend für sinnvolle Silbentrennungen sorgt und eine passende Gliederung hat. Eigentlich eher selten. Doch manchmal ist das ganz okay, wenn man entsprechend für sinnvolle Silbentrennungen sorgt und eine passende G l i e d e r u n g h a t. Oft wird der Zeienumbruch automatisch gemacht und man keinen Einfluss auf das spätere Aussehen. Oft wird der Zeienumbruch automatisch gemacht und man keinen Einfluss auf das spätere Aussehen. Oft wird der Zeienumbruch automatisch gemacht und man keinen Einfluss auf das spätere Aussehen. Oft wird der Zeienumbruch automatisch gemacht und man keinen Einfluss auf das spätere Aussehen.

45 WEBfarben 20 was zu beachten ist Weniger Farben Lesbarkeit (weiß auf schwarz) Farbharmonien Farbe = Persönlichkeit»Seriöse Farben«?»Eyecatcher Farben«Perfekter Hintergrund»neutral«Photo: pixabay.com DEMO

46 WEBfarben 20 Hell auf dunkel ist schwerer zu lesen als umgekehrt Dunkel auf hell ist leichter zu lesen als umgekehrt Starke Farbkontraste sind schwer zu lesen und "flimmern" Starke Farbkontraste sind schwer zu lesen und "flimmern"

47 Photo: pixabay.com PHOTOtipps

48 PHOTOtipps wie fotografiere ich meine gemälde fürs web? Kamera mind. 8 Megapixel Zauberwort:»diffus«Keine pralle Sonne Gleichmäßiges Licht Kunstlicht ohne Reflexe»Niemals«Blitzen Bild fest auf Staffelei o.a. (Wind) Leichtes Tele mm Bildformat JPEG FEIN MAX Automatikserie (+-Drittelblende) Photo: pixabay.com