Anzeige

Welches Bildformat, für die ganze Seite ?

Welches Bildformat, für die ganze Seite ? | PSD-Tutorials.de

Erstellt von hdd_1, 18.11.2014.

  1. hdd_1

    hdd_1 Noch nicht viel geschrieben

    Dabei seit:
    17.11.2014
    Beiträge:
    26
    Welches Bildformat, für die ganze Seite ?
    Hallo zusammen

    Ich habe Logo im .AI Format (Illustrator)

    Ich würde gerne den Logo sozusagen über die ganze Seite "zeigen" links und rechts kommt noch die Navigation (je 2 == 4 Buttons) das alles sollte animiert sein, also Logo sollte als Explosion erscheinen und wenn jemand auf einen Button klickt dann sollte sich der Logo um 180 Grad drehen und der Inhalt wird gezeigt. Und das alles noch in einen CMS einpacken.

    Hier noch was ich möchte (Ein Bild sagt mehr als tausend Worte) http://postimg.org/image/xnrcn13qd/

    Meine Fragen:
    - Was sollte ich am besten für Bildformat verwenden ? Die Seite sollte auch (möglichst schnell) angezeigt werden und nicht 30,40 Sekunden lang laden.... :confused::motz:

    - Wie wäre es am besten zu realisieren: jQuery, Canvas ...?

    Danke:daumenhoch
     
    #1      
  2. ullihantke

    ullihantke B2B Design e.K.

    Dabei seit:
    15.08.2012
    Beiträge:
    163
    Geschlecht:
    männlich
    Software:
    CC (Mac)
    Welches Bildformat, für die ganze Seite ?
    Ist das für eine Präsentation?

    Wenn du es als html umsetzen willst würde ich png nehmen oder du machst eine PowerPoint Präsentation.
     
    #2      
  3. hdd_1

    hdd_1 Noch nicht viel geschrieben

    Dabei seit:
    17.11.2014
    Beiträge:
    26
    Welches Bildformat, für die ganze Seite ?
    Hallo

    Nein, es ist nicht für eine Powerpoint Präsentation, es sollte eine
    normale Webseiten entstehen, mit CMS (nicht html sondern php)
     
    #3      
  4. msa1989

    msa1989 Bin da

    Dabei seit:
    24.11.2007
    Beiträge:
    163
    Geschlecht:
    männlich
    Welches Bildformat, für die ganze Seite ?
    @hdd_1
    Ich würde das von deinem Bild abhängig machen. Es kann sein, dass bereits ein gif ausreichende Qualität bietet. Je nach Einstellung der Farben (z.B. 128) kommt dann wirklich ein ganz schön kleines Bild bei raus, was schnell von jedem geladen werden kann.
    Zusätzlich solltest du dir mal was webp Format anschauen (vor allem von Chrome unterstützt). Dann brauchst du halt eine Funktion die je nach Browser dann das passende Bild lädt.
    Ich teste meine Seiten immer mit einer Geschwindigkeit von DSL 2000. Wenn der Aufruf länger als 3 Sekunden dauert, dann verändere ich was, da ich als Benutzer auch keine Lust hätte länger zu warten.
     
    #4      
  5. ovbb

    ovbb es gibt für alles eine weg

    Dabei seit:
    07.02.2007
    Beiträge:
    210
    Geschlecht:
    männlich
    Ort:
    Wien
    Software:
    DW, FL, PS, ID, AI, Editor, Bash, VisualStudio :-)
    Kameratyp:
    D90
    Welches Bildformat, für die ganze Seite ?
    ??? :)

    beim bild reichen 72dpi aus für die darstellung im web (nicht zum drucken). hast du irgendwelche browsereinschränkungen? ansonsten könntest du dir auch noch das svg-format ansehen, welches du direkt aus AI exportieren kannst. hierbei musst du aber auf die briwserkompatibilität achten.
     
    #5      
  6. gmw

    gmw Aktives Mitglied

    Dabei seit:
    05.06.2008
    Beiträge:
    719
    Geschlecht:
    männlich
    Ort:
    Bochum
    Software:
    HDR Darkroom 5, PS CC 2015, LR CC und dies und das
    Kameratyp:
    Olympus E510, Sony A58
    Welches Bildformat, für die ganze Seite ?
    auch mal OT
    warum Fragezeichen?
    Ich trinke auch kein Alkohol, nur Bier:)
     
    #6      
  7. ovbb

    ovbb es gibt für alles eine weg

    Dabei seit:
    07.02.2007
    Beiträge:
    210
    Geschlecht:
    männlich
    Ort:
    Wien
    Software:
    DW, FL, PS, ID, AI, Editor, Bash, VisualStudio :-)
    Kameratyp:
    D90
    Welches Bildformat, für die ganze Seite ?
    Trotzdem vergleichst du Bier und Hopfen nicht miteinander, auch wenn du angeblich keine Alkohol trinkst. :)
     
    #7      
  8. gmw

    gmw Aktives Mitglied

    Dabei seit:
    05.06.2008
    Beiträge:
    719
    Geschlecht:
    männlich
    Ort:
    Bochum
    Software:
    HDR Darkroom 5, PS CC 2015, LR CC und dies und das
    Kameratyp:
    Olympus E510, Sony A58
    Welches Bildformat, für die ganze Seite ?
    dir kann man auch nichts vormachen:)
     
    #8      
  9. ovbb

    ovbb es gibt für alles eine weg

    Dabei seit:
    07.02.2007
    Beiträge:
    210
    Geschlecht:
    männlich
    Ort:
    Wien
    Software:
    DW, FL, PS, ID, AI, Editor, Bash, VisualStudio :-)
    Kameratyp:
    D90
    Welches Bildformat, für die ganze Seite ?
    programiere ja auch html :)

    btt: vielleicht kannst du uns ja auch das logo mal zeigen. jenachdem wieviele farben du verwendest kann man es auch in anderen formaten und geringerer qualität abspeichern ...
     
    #9      
  10. hdd_1

    hdd_1 Noch nicht viel geschrieben

    Dabei seit:
    17.11.2014
    Beiträge:
    26
    Welches Bildformat, für die ganze Seite ?
    Das Logo ist schwarz-weiss

    Ich würde gerne einen Logo sozusagen über die ganze Seite "zeigen" lassen, links und rechts kommt noch die Navigation (je 2 == 4 Buttons) das alles sollte animiert sein, also Logo sollte am Anfang als Explosion (oder ein andere Effekt) erscheinen und ein paar Sekunden später sollten die Buttons sichtbar sein (Foto 1)

    Siehe Foto 1

    [​IMG]

    Und wenn jemand auf einen Button klickt (egal links oder rechts) dann sollte sich der Logo um 90 Grad drehen (es qird quasi Rückseite von Logo angezeigt) und der Inhalt (News, Gallery, Kontaktformular..) sollten im Rahmen von der Logo erscheine (Foto 2)

    Siehe Foto 2

    [​IMG]


    Und das alles noch in einem CMS bzw. in WordPress (weil die News sollten editierter sein + 10 Mitglieder (Accounts erstellen für geschützten Bereich)

    Danke.
     
    #10      
  11. Harald aus RE

    Harald aus RE Nicht mehr ganz neu hier

    Dabei seit:
    15.04.2013
    Beiträge:
    91
    Geschlecht:
    männlich
    Ort:
    neben Herne
    Software:
    Elements, CS2 und PaintNet WIN 7 Prof 32 und 64bit
    Kameratyp:
    uralte Konika Minolta Z1
    Welches Bildformat, für die ganze Seite ?
    OT/ Hallo,

    wie reduzierst Du die DSL Geschwindigkeit, Im Router? Bei mir besteht auch das Problem, da ich eine VDSL 25 habe.

    Gruß Harald OT-ENDE/
     
    #11      
  12. msa1989

    msa1989 Bin da

    Dabei seit:
    24.11.2007
    Beiträge:
    163
    Geschlecht:
    männlich
    Welches Bildformat, für die ganze Seite ?
    @Harald aus RE
    Hast ne PM, das passt hier nicht in den Thread

    @hdd_1
    Wenn du noch Animationen drin haben willst, dann musst du dich in Javascript einarbeiten. Ich hab hier mal ein paar Beispiel-Zeilen. Ich hab damit ein DIV auf 100% der Seite vergrößert, und den Ursprung auf der Seite ganz links oben im Eck gesetzt.
    Code (Javascript):
    1. function enlarge() {
    2.    $('#logo').animate({               // ID: Logo animieren
    3.      width: '100%',                   // Breite auf 100% setzen
    4.      height: '100%',                   // Höhe auf 100% setzten
    5.      top: 0,                           // An der Seite ganz oben
    6.      left: 0,                         // An der Seite ganz links
    7.      opacity: 1                       // Deckkraft auf XX% (hier 100%)
    8.    }, 1000);                           // Gesamtdauern = 1s
    9. }
    Vermutlich brauchst du die "Top", und "Left" - Zeilen nicht, weil du das ja von Anfang an in CSS beschreiben kannst wo es stehen soll. Ich würde das Objekt an einer bestimmten Stelle positionieren (bei dir rechts neben den Button auf der linken Seite) und Breite und Höhe auf 0 setzen. Anschließend kannst du mit "animate ... width... height" das Objekt auf die gewünschte Größe "ziehen". Zu guter Letzt musst du nur noch die Zeit einstellen.
    Dasselbe gilt natürlich für die Buttons die du einblenden möchtest.
     
    #12      
  13. ovbb

    ovbb es gibt für alles eine weg

    Dabei seit:
    07.02.2007
    Beiträge:
    210
    Geschlecht:
    männlich
    Ort:
    Wien
    Software:
    DW, FL, PS, ID, AI, Editor, Bash, VisualStudio :-)
    Kameratyp:
    D90
    Welches Bildformat, für die ganze Seite ?
    Denke, dass das Ganze nicht so einfach sein wird.
    Man muss ja bedenken, dass unterschiedliche Geräte unterschiedliche Größen haben.
    Da wird das mit dem Logo recht kompliziert und der Platz recht schnell sehr rar.

    Frag mich die ganze Zeit warum das explodieren muss?

    Die Idee mit dem Umdrehen und dies als Platz für den Inhalt zu verwenden klingt da weit spannender, ganz egal ob es gutes design ist oder nicht.
     
    #13      
  14. msa1989

    msa1989 Bin da

    Dabei seit:
    24.11.2007
    Beiträge:
    163
    Geschlecht:
    männlich
    Welches Bildformat, für die ganze Seite ?
    @ovbb:
    Mit den unterschiedlichen Displaygrößen hast du recht. Aber auf einem Hochkant - Format (z.B. iPhone) da kann man eh nicht links und rechts die Buttons auch noch anzeigen, wenn das Design mobile Geräte unterstützen soll. Und so machen es einem eigentlich die Prozent-Werte recht einfach, weil 100% ist immer der ganze Bildschirm, egal wie groß ;-)
    Da muss man sich halt überlegen welche Größen man in welcher Optik bedienen will
     
    #14      
  15. ovbb

    ovbb es gibt für alles eine weg

    Dabei seit:
    07.02.2007
    Beiträge:
    210
    Geschlecht:
    männlich
    Ort:
    Wien
    Software:
    DW, FL, PS, ID, AI, Editor, Bash, VisualStudio :-)
    Kameratyp:
    D90
    Welches Bildformat, für die ganze Seite ?
    sicher. ich persönlich surfe am handy auch immer im querformat.
    gebe nur zu bedenken, dass die seite sicher auf eine monitor >22" sicher super aussieht. auf kleineren geräten erkennt man wahrscheinlich das logo nicht. ganz egal ob es unproportional nach unten gedehnt wird (falls man es um den content herum gibt) oder der sichtbare bereich für den content einfach zu klein wird (falls der content im logo drinnen sein).
     
    #15      
Seobility SEO Tool
x
×
×