Website Designs met Fotografie Achtergrond

Facebook Twitter Email

Een professionele fotografie achtergrond kan een geweldige toevoeging zijn aan een website en wordt meer en meer gebruikt in hedendaags webdesign. Je hebt dit type websites zeker en vast al eerder gezien, bijvoorbeeld bij een design studio website of een fotografie portfolio. Tegenwoordig wordt het ook vaak gebruikt in andere branches zoals e-commerce websites, voor restaurants, hotels, reisbureaus… Een foto zegt meer dan duizend woorden en bij Storyline Design kunnen deze prachtige stijl in webdesign alleen maar aanmoedigen. Onderaan deze pagina hebben we een basis tutorial toegevoegd om zelf een website met een fotografie achtergrond te maken.

Er zijn verschillende types van foto achtergronden in webdesign: soms maakt men gebruik van één foto voor de gehele website, je kan een enkele foto gebruiken per website categorie of verschillende foto’s die verschijnen door een of ander bewegend effect. Hieronder vind je enkele mooie voorbeelden van al deze types waar we helemaal weg van zijn. Wij zijn natuurlijk vertrouwd met de foto achtergrond techniek en hebben deze reeds gebruikt in het verlezen zoals je kan zien in ons portfolio. Bekijk onderstaande design collectie voor eigen inspiratie en aarzel niet om ons te contacteren met eender welk idee. Wij denken graag met u mee.

25 Website Design Voorbeelden

Signal 7

Website Designs met Grote Achtergrond Foto

Creative Spaces

Website Designs met Grote Achtergrond Foto

Calendars Lavazza

Website Designs met Grote Achtergrond Foto

Owl Concept

Website Designs met Grote Achtergrond Foto

Novembro

Website Designs met Grote Achtergrond Foto

Gazelle Touch

Website Designs met Grote Achtergrond Foto

Go To China

Website Designs met Grote Achtergrond Foto

Creative People

Website Designs met Grote Achtergrond Foto

Racket

Website Designs met Grote Achtergrond Foto

FiftyTree

Website Designs met Grote Achtergrond Foto

TM Design

Website Designs met Grote Achtergrond Foto

Goliath Sportswear

Website Designs met Grote Achtergrond Foto

The Great Discontent

Website Designs met Grote Achtergrond Foto

Timberland

Website Designs met Grote Achtergrond Foto

Poco People

Website Designs met Grote Achtergrond Foto

AS Architecture

Website Designs met Grote Achtergrond Foto

MacAllan Ridge

Website Designs met Grote Achtergrond Foto

Werkstette

Website Designs met Grote Achtergrond Foto

Gavin Castleton

Website Designs met Grote Achtergrond Foto

August

Website Designs met Grote Achtergrond Foto

Rickard Sund

Website Designs met Grote Achtergrond Foto

Art of Flight

Website Designs met Grote Achtergrond Foto

Tatchies

Website Designs met Grote Achtergrond Foto

Babak Salari Photography

Website Designs met Grote Achtergrond Foto

 

Achtergrond Fotografie Tutorial

Een grote foto als achtergrond gebruiken voor uw website is niet moeilijk met CSS. Je kan de achtergrond instellen in het BODY element van uw stylesheet. De CSS code zal er als volgt uitzien:

body {
  background: #e6ddca url(bg_img.png) no-repeat center top;
  padding: 0;
  margin: 0;
  width: 100%;
}

Het is belangrijk ervoor te zorgen dat je een foto neemt die groot genoeg is. Er zijn verschillende bezoekers met verschillende schermresoluties. Als je een foto gebruikt met een breedte van 1280 pixels zal de foto afgesneden worden bij een schermresolutie van 1920 bij 1080 pixels omdat deze niet breed genoeg is om het scherm te vullen. Om dit te vermijden kan je ofwel een foto nemen die groot genoeg is, ofwel een kleinere afbeelding waarvan je de randen het zelfde kleur zijn als de BODY achtergrond.

Wees niet verlegen als je vragen hebt!

Written by

Stein

28 year old web designer from Gent. Graduated as a Master Applied Engineering, ICT, which gives me the necessary technical skills. My true passion however, is design and photography. As founder of Storyline Design Studio I'm always looking for new challenges and edges.

No Comments Yet.

Leave a Reply


Message