Homepage Vorlagen ( Templates ) zum Download

Webseiten 41 - 48  ( frei für privat, kostenpflichtig für kommerziell )

Wie dürfen diese Templates eingesetzt werden?

Bitte lesen Sie vor dem Download einer Homepagevorlage unbedingt unsere Nutzungsbedingungen.
Diese Homepage Vorlagen können für den privaten Gebrauch kostenlos heruntergeladen, angepasst und weiterverwendet werden. Das Anbieten der Templates auf anderen Webseiten, der Weiterverkauf sowie auch die Verwendung als direkter Download ist nicht gestattet. Je nach dem Inhalt, welcher eingefügt wird, kann auch für Privatpersonen eine kommerzielle Nutzung vorliegen.

Eine kommerzielle Nutzung ist erlaubt. Die kommerzielle Nutzung ist jedoch nur gegen Bezahlung gestattet. Für kommerziell gilt: Die Preise finden sie immer direkt neben dem Vorschaubild - als letzte Zeile vom Beschreibungstext.

Auch wenn Sie die Vorlagen anpassen, bleibt das Copyright für das Design beim Autor der Vorlagen. Für Ihren eingefügten Inhalt, sei es Text, spezielle Grafiken o.a., haben Sie dann selbstverständlich Ihr Copyright.



HomeVorlagen(c) NutzungKontakt
ImpressumBestellungWiderrufDatenschutz



 41DER KLEINE LEUCHTTURM Bestellen Downloaden Anschauen



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download






[ Fotos zeigen Auflösungsansicht von SMARTPHONE und TABLET im Portraitmodus sowie DESKTOP-PC ]


Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Webseiten-Konstruktion ohne Javascript.
Lightbox-Foto-Gallerie mit Javascript (Jquery).
  • Mit 'Lightbox Picture Gallery'.1 ( Die bekannte und beliebte Foto-Gallerie-Schau ).
  • Slogan-Spruch im Kreis ( Auf jeder Seite steht ein anderer Spruch).
  • Geometrische Formen ( Kreis und Quadrat nur mit CSS erstellt - Platziert per POSITION: relative/absolute ).
  • Verschieden farbige Boxen in der rechten Sidebar: Mit Pseudoelement ':nth-child()' sehr code-sparend angelegt.
  • Farbfilter in Blau (Halbtransparent): Mit CSS-rgba ( Farbe und Deckungsgrad ggfls. anders einstellbar ).
  • Font-Icons ( Icon-Schrift bereits installiert, somit Icons tauschbar/erweiterbar ) .
  • Google-Webfonts ( Schrift 'Roboto' und 'Open Sans' bereits installiert ). Schriftschnitt:Light.
  • CSS-Animation: DREHEN.

1= Lightbox Picture Gallery: So funktioniert diese Foto-Schau:
Nach Klick auf ein Foto öffnet sich ein neues Fenster mit dem Foto sowie einer Bildunterschrift und einer Anzeige (Bild X von Anzahl X), gleichzeitig dunkelt sich die komplette Webseite im Hintergrund ab. Wenn mehrere Fotos in einer Gruppe zusammengefaßt sind, ergibt sich folgendes tolle Feature: Fahren Sie mit der Maus über die rechte Fotohälfte. Es erscheint dann ein Pfeil, welcher Sie durch Klick auf diesen immer weiter zum nächsten Foto führt. In diesem Fenster lässt sich also eine ganze Bildkollektion durchsehen. Übrigens erscheint bei Mausberührung auch ein Pfeil nach links um die Fotos wieder in anderer Richtung zu betrachten.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
 42 Let the dogs out Bestellen Downloaden Anschauen



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download






[ Fotos zeigen Auflösungsansicht von TABLET und SMARTPHONE im Portraitmodus sowie DESKTOP-PC ]

Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Komplette Webseite ohne Javascript.
  • FLAT-DESIGN (Flach, Minimalistisch, Modern).
  • Khaki-Farbtöne (Passend zur Hundewelt).
  • Runde Fotos mit CSS-border-radius.
  • Bei mobilen Geräten wird ein zusätzlicher "Seitentitel" (z.b. "home" für die Startseite) eingeblendet.
  • Bei mobilen Geräten: Fest am oberen Rand positionierte Menü-Leiste (Scrollt nicht mit).
  • CSS-Animationen: Drehen, Slide-Top, Slide-Left.
  • Mit Toggle-Menü. (Bei mobilen Geräten wird ein platzsparendes Menü aktiviert (mit Umschalt-Button An/Aus.)
    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
 43 Road To Happiness Bestellen Downloaden Anschauen
Homepage Vorlage , templates , Homepage-Vorlagen,  free download    Homepage Vorlage , templates , Homepage-Vorlagen,  free download

Besonderheiten

Straße ins Glück. Folgen Sie doch auch neugierig und selbstbewusst dem Lauf der Straße zu Ihrem persönlichen oder geschäftlichen Erfolg.
Das Layout hat im Inhaltsfeld eine feste Breite von 920 Pixel (wobei die Höhe des Inhaltsfeldes unbegrenzt ist). Die obere Grafik geht jedoch als Hintergrundgrafik über eine Breite von 1600 Pixel, so dass auch grössere Monitoransichten abgedeckt werden.

Technik

Teils grafisches teils flexibles Layout.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 29,--
 
 44 Bed And Breakfast Bestellen Downloaden Anschauen



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download







[ Fotos zeigen Auflösungsansicht von SMARTPHONE und TABLET im Portraitmodus sowie DESKTOP-PC ]

Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Jquery: Slider (Bildwechsler)
Jquery: Smooth-Scroll-To-Top
Jquery: Lightbox-Foto-Gallerie
  • Neue Version 0 der Icons-Font (Font Awesome) - diese erschien gerade erst im Dezember 2017 - bei uns jetzt schon in dieser Vorlage installiert + Beschreibung für die wichtigsten Änderungen!
  • Jquery: Slider (Bildwechsler).1 Hier mit über 18 Fotos, damit Sie genau sehen, wie es funktioniert - sowohl bei kleinen (mobilen) als auch hohen Auflösungen. Inklusive Steuerung per 'Thumbnails'.
  • Jquery: Smooth-Scrolling-To-Top.2
  • Jquery:Lightbox Picture Gallery.3
  • Mit Toggle-Menü 4 - Menü-Button-Schalter: An/Aus.
  • Font-Icons ( Icon-Schrift bereits installiert, somit Icons tauschbar/erweiterbar ) .
  • Google-Webfonts ( Schrift 'OPEN SANS LIGHT' bereits installiert ).
  • CSS-Animation: Toggle-Menü schiebt sich von links nach rechts in die Seite hinein.
0= Neue Version Font Awesome:
Hintergrund-Info dazu hier vom Magazin: t3n-digital pioneers

1= Slider (Bildwechsler) inkl. Thumbnail-Steuerung:
Die animierte Slideshow ganz oben wurde mit einem Jquery-Script getätigt und startet automatisch. Diese läßt sich aber auch manuell über die Pfeile steuern sowie auch per Klick bzw. Touch auf die Thumbnails, also die kleinen Vorschau-Bilder. Wir haben über den Slider ein ca. Ein-Drittel großes Feld (halbtransparent per CSS-rgba) darüber gelegt, welches Menü und Homepagenamen enthält.

2= Smooth-Scrolling-To-Top:
Wenn man ein wenig scrollt, blendet sich ein kleiner Button (mit Pfeil-nach-oben) ein. Ein Klick oder Touch auf diesen Button fährt die Seite sanft scrollend nach oben an den Anfang der Seite. Es ist also kein plötzlicher Sprung sondern ein animiertes Hinaufgleiten.

3= Lightbox Picture Gallery: So funktioniert diese Foto-Schau:
Nach Klick auf ein Foto öffnet sich ein neues Fenster mit dem Foto sowie einer Bildunterschrift und einer Anzeige (Bild 1 von X), gleichzeitig dunkelt sich die komplette Webseite im Hintergrund ab. Wenn mehrere Fotos in einer Gruppe zusammengefaßt sind, ergibt sich folgendes tolle Feature: Fahren Sie mit der Maus über die rechte Fotohälfte. Es erscheint dann ein Pfeil, welcher Sie durch Klick auf diesen immer weiter zum nächsten Foto führt. In diesem Fenster lässt sich also eine ganze Bildkollektion durchsehen. Übrigens erscheint bei Mausberührung auch ein Pfeil nach links um die Fotos wieder in anderer Richtung zu betrachten.

4= Toggle Menü:
Eine Javascript-freie Lösung, welche auf mobilen Geräten ein Menü ermöglicht, welches sich per Schalter ein-und ausschalten läßt.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
 45 Wellness Relaxation Bestellen Downloaden Anschauen



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download







[ Fotos zeigen Auflösungsansicht von SMARTPHONE und TABLET im Portraitmodus sowie DESKTOP-PC ]

Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Jquery: Lightbox-Foto-Gallerie
Jquery: Smooth-Scroll-To-Top
  • Meditative Farbe Violett/Lila1 dient der Entspannung, Meditation und Spiritualität.
  • Jquery: Smooth-Scrolling-To-Top.2
  • Jquery: 'Lightbox Picture Gallery'.3 ( Die bekannte und beliebte Foto-Gallerie-Schau ).
  • Font-Icons ( Icon-Schrift bereits installiert, somit Icons tauschbar/erweiterbar ) .
  • Google-Webfonts ( Schrift 'Open Sans' bereits installiert ). Schriftschnitt:Light.
  • CSS-Animation: Vergrößerung der Icons im Menü bei Mausberührung.

1= Meditative Farbe:
Violett / Lila hat als spirituelle Farbe eine stark meditative Wirkung und steht als Verbindungsfarbe zwischen zwischen Bewusstem und Unbewusstem sowie für Spiritualität oder Mystisches. Auch das Christentum setzt diese Farbe gerne ein, stehend für Buße, Einkehr, Umkehr, Fastenzeit.

2= Smooth-Scrolling-To-Top:
Wenn man ein wenig scrollt, blendet sich ein kleiner Button (mit Pfeil-nach-oben) ein. Ein Klick oder Touch auf diesen Button fährt die Seite sanft scrollend nach oben an den Anfang der Seite. Es ist also kein plötzlicher Sprung sondern ein animiertes Hinaufgleiten.

3= Lightbox Picture Gallery: So funktioniert diese Foto-Schau:
Nach Klick auf ein Foto öffnet sich ein neues Fenster mit dem Foto sowie einer Bildunterschrift und einer Anzeige (Bild X von Anzahl X), gleichzeitig dunkelt sich die komplette Webseite im Hintergrund ab. Wenn mehrere Fotos in einer Gruppe zusammengefaßt sind, ergibt sich folgendes tolle Feature: Fahren Sie mit der Maus über die rechte Fotohälfte. Es erscheint dann ein Pfeil, welcher Sie durch Klick auf diesen immer weiter zum nächsten Foto führt. In diesem Fenster lässt sich also eine ganze Bildkollektion durchsehen. Übrigens erscheint bei Mausberührung auch ein Pfeil nach links um die Fotos wieder in anderer Richtung zu betrachten

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
 46 City Lights Bestellen Downloaden Anschauen



Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download
Homepage Vorlage , templates , Homepage-Vorlagen,  free download







[ Fotos zeigen Auflösungsansicht von SMARTPHONE und TABLET im Portraitmodus sowie DESKTOP-PC ]

Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Webseiten-Konstruktion ohne Javascript.
  • Effektvolle CSS-Animation beim Hauptmenü.
    Bei Mausberührung des Hauptmenüs erfolgen verschiedenen Animationen wie folgt:
    - Link plus Font-Icon verschiebt sich nach links.
    - Der Link wechselt die Farbe und vergrössert sich.
    - Das Font-Icon dreht sich rechtsherum und wird dabei ausgeblendet.
  • CSS-Transparenz-Farbverlauf ( Kreisförmig abgerundetes Menüfeld mit transparentem Farbverlauf ) .
  • Font-Icons ( Icon-Schrift bereits installiert, somit Icons tauschbar/erweiterbar ) .
  • Google-Webfonts ( Schrift 'OPEN SANS LIGHT' bereits installiert ).
    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--
 
 47 Friday Bestellen Downloaden Anschauen
Homepage Vorlage , templates , Homepage-Vorlagen,  free download    Homepage Vorlage, templates , Homepage-Vorlagen,  free download

Besonderheiten

Schilf-Pflanzen vor einem Himmel mit luftigen Wolken. Das zaubert eine angenehme Atmosphäre. Fühlen Sie sich frei. Wie an einem Frei-Tag.

Besonderheiten

Schatten-Technik und Rundungstechnik beim Rahmen hier mittels transparenter PNG-Schatten-Grafik (damit in jedem Browser funktionabel).

Technik

Flexibles Layout.

    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 29,--
 
 48 WEB CARD Bestellen Downloaden Anschauen

Homepage Vorlage , templates , Homepage-Vorlagen,  free download


[ Fotos zeigen Auflösungsansicht von SMARTPHONE und TABLET im Portraitmodus sowie DESKTOP-PC ]

Besonderheiten

So macht Surfen auch auf mobilen Geräten Spaß! (Dank Responsive Webdesign)
Responsive Webdesign = Anpassung/Optimierung der extrem unterschiedlichen Bildschirmgrößen (nur per CSS) von Smartphone, Tablet, Notebook, Laptop und Desktop-PC innerhalb einer einzigen Webseite.

Technik

Mobile-First-Technik.
Komplette Webseite ohne Javascript.
  • Transparenz (mit CSS-rgba).
  • Fixierter Background (auch bei mobilen Geräten).
  • HTML-Anker (Innerhalb der Unterseiten werden die Links per sog. Html-Anker angesprungen).
  • CSS-Animationen: Drehen, Schwingen, Slide-Top.
    Privater Inhalt: Vorlage ist kostenlos
    Kommerzieller Inhalt: einmalig Euro 39,--