[WIP] Website advies

[filenox]

Beste,


Ik heb voor een kennis met een traiteurzaak een website in elkaar gestoken. Er komt dus geen geld aan de pas.* De traiteurzaak maakt vooral Italiaanse gerechten, de klanten zijn vooral mensen met een feest, een communie etc, er is dus geen winkel aan verbonden.

De afbeeldingen die ik op de website heb gebruikt zijn gekopieerd van de originele site - die er notabene verschrikkelijk uitziet. De kwaliteit van de afbeeldingen kan dus nog beter. *Er is dan ook geen budget om stockphoto's aan te kopen.

Ik heb ook al in andere topic advies gevraagd maar aangezien ik niet het hele topic wou kapen start ik hier een nieuwe post. Hun commentaar samengevat:

---

gebruik meer plaatjes

Dat is dus niet mogelijk. Foto's met een hogere resolutie zijn onderweg maar de belichting etc zal niet goed genoeg zijn vrees ik om in de site te gebruiken.

quote: StukFruit

De afbeelding op de "frontpage" is imho totaal nutteloos, niet goed geintegreerd met de rest van de site en overbodig omdat het niet meer is dan een saaie foto die daar zomaar is neergeplempt en niet weet wat hij daar doet

Hij is inderdaad nutteloos maar voordat de kok vanboven stond zag je dankzij deze afbeelding direct dat het om een Italiaanse traiteurzaak ging en niet over een kapperszaak oid. Maar ja de tijden zijn veranderd, wat stel je voor? Direct verwijzen naar de Over Ons pagina?

quote: StukFruit

Qua uitlijning begrijp ik niet waarom die zo raar is of gewoon afwezig is, de "over ons"-pagina vloekt met de rest,

De uitlijning van de li-items heb ik aangepast maar kan je je punt nog wat verder duidelijk maken? En hoezo vloekt die Over Ons pagina?

quote: StukFruit

En de gebruikte lettertypes natuurlijk

Welk soort lettertype stel je dan voor?

quote: StukFruit

En de mogelijkheid om terug te gaan naar de "frontpage" zonder de url opnieuw in te voeren.

Een koppeling naar een nutteloze afbeelding, waarom?

---

• vragen naar foto's met meer dan 24pixels - done (nog geen antwoord)
• vragen naar een prijzenlijst en niet enkel naar het aanbod - done (nog geen antwoord)
• informatie verkrijgen over de bereikbaarheid, mogen ze altijd bellen of enkel na 16u bijv.

---

Screenshots

[Aloys]

Het eerste dat direct bij mij omhoog komt is: gebruikt hij nog 800x600 ofzo? De website is een klein blokje op mijn (niet eens zo grote laptop-) scherm. Kan het geheel niet wat breder, maximaal 980 pixels ofzo?

[RobIII]

Ik zie niet welk menu actief is.

Verder: Waar hoort mijn topic?
Ik zie geen HTML/Javascript noch een concreet probleem daarmee: WEB >> GFX

[ Voor 73% gewijzigd door RobIII op 28-01-2012 23:17 ]

[Spike_wolf]

Aangezien je nog volop met de website bezig bent heb ik de titel gewijzigd in WIP ipv Showcase

Aloys, de schermen van tegenwoordig zijn inderdaad wat breder dan vroeger, maar de opzet zoals hij nu is heeft niet heel veel meer ruimte nodig. De tekstvelden moeten sowieso niet veel breder worden dan 600-650 pixels om het fijn leesbaar te houden. Het toevoegen van extra onderdelen kan uiteraard wel, maar breder is niet altijd beter

[Edit]
Wat me zo opvalt is dat het helemaal niet duidelijk is waar je je eigenlijk op de site bevind, het menu veranderd niet, en je hebt ook geen breadcrumbs die je de weg wijzen op dat gebied. Daar zou ik zeker even naar kijken.

[Edit2]
Wat RobIII dus ook al zegt

[ Voor 23% gewijzigd door Spike_wolf op 28-01-2012 23:18 ]

[filenox]

Van die resolutie valt goed mee hoor
De screenshots zijn gewoon bijgesneden, de grotere versies kan je hier vinden:

http://www.mediafire.com/?bo7bsb1qp46xk7r
http://www.sendspace.com/file/2v3ka8

Edit: zal eens kijken wat ik kan doen ivm die menu's

[ Voor 22% gewijzigd door filenox op 28-01-2012 23:34 ]

[Aloys]

Spike_wolf schreef op zaterdag 28 januari 2012 @ 23:16:
Aloys, de schermen van tegenwoordig zijn inderdaad wat breder dan vroeger, maar de opzet zoals hij nu is heeft niet heel veel meer ruimte nodig. De tekstvelden moeten sowieso niet veel breder worden dan 600-650 pixels om het fijn leesbaar te houden. Het toevoegen van extra onderdelen kan uiteraard wel, maar breder is niet altijd beter

Dat ben ik zeker met je eens, maar ik dacht meer aan een extra kolom toevoegen. Wat daar precies in moet komen weet ik dan ook niet zo, misschien aanbiedingen ofzo (hoewel ze die waarschijnlijk niet hebben).

[Yohsoog]

Even iets inhoudelijk: openingsuren!
Toch iets wat ik tegenwoordig wel van een winkel/restaurant/... met website verwacht tegenwoordig.

[filenox]

Openingsuren zijn niet van toepassing, het is een systeem van levering. Het is geen winkel oid

[ctrlaltdelbe]

filenox schreef op zaterdag 28 januari 2012 @ 23:46:
Openingsuren zijn niet van toepassing, het is een systeem van levering. Het is geen winkel oid

Je bedoelt dat het een traiteur is? Want als het pizza-aan-huis-achtig is, zijn openingsuren natuurlijk wel gewenst. En zelfs al is het een traiteur, dan is het wel handig om te weten wanneer mensen kunnen bellen, tenzij die persoon er geen problemen mee heeft 7/7 gebeld te kunnen worden.

[Yohsoog]

Inderdaad, noem het dan 'bereikbaarheid'. Als hij op vakantie gaat wil hij toch ook een plaatsje hebben om mee te delen dat hij niet bereikbaar is. Of als hij een van die weinige traiteurs is die niet op kerstmis levert, moet hij zoiets toch ook kenbaar kunnen maken.

Tenzij je dat op de contactpagina wil doen, maar dan moet je die google maps afbeelding toch wat kleiner maken.

[filenox]

Goed idee ja, dit zal ik eens navragen

Update over het menu-idee: dit is gelukt



Misschien niet de efficiënte manier om het te doen, maar het werkt wel
Ik heb namelijk 5 JS-scripts geschreven waarbij elke <a> een id heeft gekregen:

JavaScript:

    function overons(){
        document.getElementById('overons').style.color='#d5cdb7';
        lijst=['aanbod','gelegenheidssuggesties','fotos','contact'];
        for (var i = 0; i < lijst.length; i++){
            document.getElementById(lijst[i]).style.color='#fff';
        }   
        document.getElementById('iframe2').style.visibility='hidden';
    }

Bij 'onClick' worden deze functies opgeroepen De laatste regel is trouwens alleen 'visible' bij het item aanbod. Enkel dan moet dat submenu tevoorschijn komen

[ Voor 105% gewijzigd door filenox op 29-01-2012 01:33 ]

[Dark Blue]

Klinkt inefficiënt, vijf javascripts die in principe allemaal hetzelfde doen?

[filenox]

Volgens mij gaat het niet anders

[RobIII]

filenox schreef op maandag 30 januari 2012 @ 23:48:
Volgens mij gaat het niet anders

Dan doen ze niet alle 5 hetzelfde en heb jij gelijk of je bent niet bekend met DRY (en dus bijvoorbeeld functie/method parameters e.d.) en dan heeft DB een punt Even afgaand op de JS die ik plukte uit de url van je site (die elders op GoT vermeld is) vrees ik dat DB een punt heeft

Om je enigszins op weg te helpen:

JavaScript:

function changemenu(activemenu){ 
    lijst=['overons', 'aanbod','gelegenheidssuggesties','fotos','contact']; 
    for (var i = 0; i < lijst.length; i++) { 
        document.getElementById(lijst[i]).style.color = lijst[i] == activemenu ? '#d5cdb7' : '#fff'; 
    }     
    document.getElementById('iframe2').style.visibility = activemenu == 'aanbod' ? 'hidden' : 'visible'; 
}

Vervolgens:

HTML:

<a ... onClick="changemenu('overons')">...
<a ... onClick="changemenu('aanbod')">...
<!-- etc. -->

Et voila; 5 functies overbodig en terug naar 1 functie
(Er zijn overigens nog wel meer punten die aandacht verdienen, daar niet van )

[ Voor 54% gewijzigd door RobIII op 31-01-2012 00:52 ]

[filenox]

Parameters, helemaal vergeten De code is nu meer dan gehalveerd

JavaScript:

function kleur(naamitem){
    lijst=['overons', 'aanbod', 'gelegenheidssuggesties', 'fotos', 'contact'];
    for (var i = 0; i < lijst.length; i++){
        if(naamitem == lijst[i]){
        document.getElementById(naamitem).style.color="#d5cdb7";
        }else{
        document.getElementById(lijst[i]).style.color="white";
        }
    }
    if(naamitem == 'aanbod'){
    document.getElementById('iframe2').style.visibility='visible';
    }else{
    document.getElementById('iframe2').style.visibility='hidden';
    }   
}

Edit: Ik had je bericht gelezen voor je edit dus mijn versie is iets anders..Anders is de vorm van langer blijkbaar. 7 regels code ipv 15 is best indrukwekkend

Edit2: ik heb vandaag ook een mail ontvangen met wat extra informatie + foto's.
Tijd om wat dingen aan te pasen dus

Edit3:

(Er zijn overigens nog wel meer punten die aandacht verdienen, daar niet van )

Bring it on

[ Voor 33% gewijzigd door filenox op 31-01-2012 01:32 ]

[filenox]

Iemand nog advies?

[kwaakvaak_v2]

aanbod in een iframe??

[Anoniem: 442448]

Zoals RobIII en Spike_wolf al hebben gezegd: het is op de image in de OP niet algeheel duidelijk waar je je op de website begeeft. Dit maak je echter wel duidelijk in de omgezette versie, dus dat is wel prima.

Wat het design betreft... ik vind het nogal saai overkomen. Alle elementen ogen nogal 'plat', terwijl de achtergrond best 'fancy' is met dat background pattern. Het linkermenu wat er 'opeens' bij staat onder 'Aanbod' is enigszins vervelend... It feels out of place.

Wellicht is het gewoonweg niet mijn smaak - dat kan natuurlijk ook.

[filenox]

Natuurlijk is dé vraag dan: hoe maak je het design beter?

[Dark Blue]

Door niet af te wachten, maar in Photoshop een aantal duplicaten te maken en lekker te gaan experimenteren met plaats, vorm, formaat en tint

Laat vooral je voortijdig gestopte pogingen ergens staan. Zodra je er een stuk of vijf hebt, maak dan van allemaal een screenshot, of nog beter, een kleurenprintje, en hang ze allemaal bij elkaar aan een muur.

Laat je moeder/vriendin/buurman er naar kijken en maak dan een keus

[BryanD]

persoonlijk ben ik niet helemaal geshockeerd van hoe mooi deze site is.

De basis staat zeer zeker maar dingen die opgemerkt heb die ik niet mooi vind:

- Je menu lijnt niet uit met je content vlak, en dit lijnt allemaal weer niet uit met je header.
- Je content is één groot vlak, plaats er wat plaatjes in, maak er meerdere kollom van.
- Doe wat meer met je typografie, gebruik bijvoorbeeld je H1, H2, en H3 tags, en dan in het zelfde font als je banner.
- Persoonlijk vind ik je knopjes wat saai en cheap ogen, maar dat kan ook smaak zijn.
- Ik zou zelf een container om je gehele layout heen leggen en daar een background op zetten en dan op je menu, banner etc... die hele lichte schaduw er af halen (ik heb even snel gekeken, weet niet of het er op zit, maar het leek zo).

Verder: experimenteer wat met je layout, de kleuren e.d. zijn prima en passen goed bij elkaar. Je lay-out is echter imho niet heel lekker.

Nog een pro-tipje: Line-height van 20 - 25px, maakt de tekst prettiger om te lezen

Ik ben zelf ook niet 's werelds beste designer...verre van zelfs, maar ik dacht ik geef je maar gewoon mijn mening en de truckjes die ik ken om een layout beter te laten lopen