Alsacréations, c'est aussi une agence web... avec un nouveau site

Aucun kiwi n'a été maltraité durant le développement.

Une seule phrase : chapeau !

Design moderne, simple sans être simpliste, très pro, très clair. J'adore, tout simplement, ça ressemble énormément à ce que j'aime faire ;)

Voilà qui donne sérieusement envie de se mettre à HTML5 et CSS3 de façon sérieuse et courante ! (quitte à ne pas faire plaisir à certains navigateurs qui n'auront pas la chance de pouvoir afficher fièrement des designs du même acabit…)

J'aime beaucoup ce nouveau design !

Et les commentaires dans les sources aussi :
ex dans le js : // Penser à mettre des images de la team à poil...

y'a plus qu'a :)

J'aime beaucoup mais c'est dommage pourle poids de la page (887Ko)... Ça a été long à charger...
Le proxy du boulot ralentit les choses mais bon... ;-)

Juste pour info : en raison des visites massives actuellement, le serveur a parfois un peu de mal à suivre. Inconvénients du direct, toussa.

Comme toujours : Superbe travail ! :)

I Love it !

L'effet manga rend méconnaissable certains des collaborateurs. Soit dit en passant, puisque vous êtes quatre, vous auriez pu afficher le trombinoscope avec un effet « National Monument ». ;)

Sur la page d'accueil, est-il normal qu'il y ait une barre de défilement horizontale débouchant sur une très maigre colonne affichant les domaines d'expertise ? :-/

Espérons que Laurie-Anne n'en dira aucun mal. :p

Je ne suis pas très fan de l'utilisation des Face Your Manga.
Ça fait moins pro je trouve.

Sinon question bidon html, plusieurs h1 n'est elle pas déconseillée ? ou j'ai loupé un truc ?

Félicitations tout simplement, certains passages ne manquent vraiment pas d'originalité :)
Le serveur doit pleurer un peu mais bon..

@Bluug : En html 5 on peut démarrer un élément section ou article avec un h1. ;-)

@Bluug : Et en HTML 4 et XHTML 1, on peut déjà utiliser plusieurs fois h1.

Autre retour susceptible d'être gênant : quand on est dans le sous-domaine dédié aux formations, certains liens du menu de navigation du bas (Photographie, par exemple) ne pointent pas vers les bonnes URLs, quand ils ne créent pas de confusion : je pense notamment au lien Accessibilité, qui est ambigu, en ce sens qu'il y a une page dédiée à la formation à l'accessibilité (http://formations.alsacreations.fr/accessibilite.html) en même temps qu'une page de présentation de l'accessibilité (http://www.alsacreations.fr/accessibilite.html).

Excellent le design :)

Les portraits de Dew et Felipe ne sont pas du tout ressemblant ! Quant au tien Raphael, il manque de fidélité (ce sourire exagéré et ce côté juvénile ne te ressemble pas du tout) et de sérieux pour un site pro ;)

J'aime bien dans le JS:

// Penser à mettre des images de la team à poil...

:B

On peut gagner 63.39 KB sur les images avec smush.it ;-)

Un truc qui m’a fait sourir : Le nom d’un célèbre fabricant d’appareils photos n’a pas été remplacé sur l’objectif. :p

Bravo à vous pour cette nouvelle mouture !

Je trouve le design un poil trop fun, un poil pas assez sérieux, mais c'est clairement assumé. Et puis, j'ai pardonné cet unique défaut à la lecture du "J'ai un gros zoom ES-1.87 ZX80 à spectre inversé" qui m'a fait éclaté de rire !

Le "Nous créons des sites web efficaces SANS OGM" m'a particulièrement amusé ^^

@ annso :
C'est sûr, le design est très fun, et c'est justement là qu'est son intérêt. En regardant bien les sites d'autres agences, web, on voit que c'est justement beaucoup trop sérieux, trop "rigide".
C'est ce côté "fun" qui marque les esprits, dans cette nouvelle mouture, tout en conservant un côté professionnel dans l'agencement et la rédaction des contenus. Ce mix de deux composantes a priori incompatibles est un choix très judicieux de leur part (à mon humble avis) :)

je n'aime également pas les têtes en manga, on dirait des trucs fait avec un générateur en ligne (peut-être est-ce le cas ?)

Gros regret qui gâche un site très très bien : il y a un certain aliasing sous Firefox sur certains textes : création web, références, à propos, etc... c'est dommage, car le reste est nickel-chrome.

Qq petits chevauchements sur l'iPod Touch dans la navigation en bas de page aussi ! ;)

Félicitations à vous !
Très beau rendu.

J'aime le décalage qui au final n'en est pas forcément un, pourquoi faire preuve de professionnalisme devrait empêcher les points d'humour ? =D

Bonne continuation ;)

@devzonefr : ah oui sympa cette phrase ! :p

Bravo pour cette refonte.

Dommage que le lissage des polices ne fonctionne pas sur les titres (ça contraste par rapport aux images qui ont un rendu très propre)

Ladytron, Victor > Les gens d'alsacréations étant sérieux, ils ont pensé à IE6 :p Le site passe très bien et est presque aussi beau que sous un navigateur moderne. Comme quoi il est possible de "faire plaisir à certains navigateur" même avec du HTML5 et du CSS3 (même s'il faut passer par JS).

Bonjour,

bien que assez honnête, je trouve le nouveau site assez peu professionnel, on dirait que tout les trucs "cools" trouvés sur smashing magazine ont été assemblés sans cohérence, en mode check-list, or un site bien n'est pas nécessairement la somme arithmétique d'éléments "cools". Beaucoup de choses sont là gratuitement "pour faire joli", et le tout fait penser à une "couche graphique", à des ornements sur du code sans conception réelle, et sans que le tout soit vraiment maitrisé.

Concrètement les icônes sont dépareillées et mises en vrac, les têtes de mangas sont hyper connotées jeunes graphistes débutants et ne font pas pro du tout, les macbooks n'ont pas de raison d'être, l'iconographie n'est pas très pertinente, incohérente et assez bateau, les ombres font un peu "sorti du tube" et le contenu éditorial est assez pauvre, voir carrément lourd.

Le site n'est pas horrible, mais pas assez qualitatif pour une agence web et c'est dommage.

Au niveau des prestations, je vous déconseille de proposer de la photographie professionnelle car c'est une discipline à part entière, et il ne suffit pas de tâter un peu un reflex pour prétendre proposer une presta de qualité, mieux veut rester focus (c'est le cas de le dire ;) ).

Pour conclure le site est juste correct mais indigne d'une agence web réputée tel que alsa, et il aurait fallu faire un vrai travail de conception en amont au lieu d'empiler des choses "fun" ensemble sans chercher à être cohérent.

@yosh : heureusement que chacun a ses goûts et ses appréciations ;)

c'est pas une histoire de gout là, mais sinon oui, comme tu dis ^^

@Laurie-Anne : merci d'avoir testé pour nous ;) On tape souvent sur IE 6/7, il est vrai, en oubliant qu'avec quelques astuces simples on peut encore faire des choses correctes avec ce dinosaure du web. Ceci est cependant une autre histoire :)

@yosh : cf l'article rédigé => "Le design se veut, comme à notre habitude, frais et léger tout en demeurant professionnel. Nous avons pris le risque de nous baser sur des techniques très actuelles voire avant-gardistes telles que HTML5 et CSS3."
C'est un choix totalement assumé de leur part : pourquoi faire comme tout le monde ?
Oser la différence, c'est se démarquer et attirer l'attention.

Quel rapport ? je ne parle pas du html5/css, ni de la légèreté du design (quel que soit la définition qui lui est donné ici). Je n'ai jamais critiqué le fait de marquer la différence non plus.

Super votre site, moi j'aime bien, mais j'aime mieux le design de .com que .fr même si le but de chacun est completement différent.

Sinon... "Where is Charlie", ça n'exsite pas.. C'est plus "Waldo"
<!-- But... Waldo, shall you find him ? -->

;)

@yosh : merci pour ton avis très tranché, même si tu te doutes que tout ce que tu trouves dépareillé a été mûrement réfléchi pendant plusieurs mois.
Au fait, tu avais vu la version précédente ?
Et pour ce qui est de la photo, tu as des critiques précises à faire sur mes photos en particulier (ou celles de Rodolphe), ou c'était juste pour placer une critique négative gratuite ?

@tous : merci pour vos retours très positifs (enfin pour 25 d'entre vous sur 26 ;)). Il est agréable de voir que vous appréciez le fait de s'être démarqués sans oublier d'être pro :)

@yosh : je suis vraiment d'accord avec toi sur tous les points énoncés. Le site n'est pas à jeter, loin de là, il est beau, il y a du travail, mais ça ne correspond pas à Alsacréations.
Le site se veut être très justement calculé dans le sens de l'humour et du professionnalisme, en essayant d'allier les deux dans un mélange certes atypique mais original, cependant cela n'a pas été fait dans son meilleur, et beaucoup de choses peuvent être encore revues. Je ne prétends pas pouvoir faire mieux, mais pour des gens qui prétendent à l'innovation, il faut le faire complètement, et sans taches, sinon le risque est de ne pas être pris au sérieux.

@noix de coco "Le site n'est pas à jeter" => tout à fait d'accord, et loin de là comme tu dis !! Je ne nie pas le boulot derrière non plus d'ailleurs.

@Raphaël : oui, j'avais vu la version précédente, plus cohérente à mon gout. Le problème de votre graphisme est qu'il repose quasi exclusivement sur des icônes, et elles sont un peu posées à la va comme je te pousse, en plus de ne pas provenir des mêmes sets, il y'a un peu à boire et à manger, elles sont de qualité inégales et pas raccord. Ça joue pour beaucoup dans l'impression générale (c'est on peut faire cette critique sur le .com aussi, mais c'est moins l'orgie sur le nombre d'icones)

le problème est qu'il y'a assez peu d'éléments, et qu'ils ne sont pas forcement choisis/placé judicieusement (ex la colonne contact du footer, à droite, ainsi que des titres décalés d'une page à l'autre, le manque de constance dans la titraille qui change de couleur pour des éléments de mm niveau, les grosses "icones" ignobles de la pages formation...)

J'ai aussi compris le décalage/humour mais la CR est un peu en retrait, ça aurait pu être traité différemment (comme dit ndc = il faut y aller à fond sinon ça foire)

Mon conseil serait de se tenir à un seul style graphique pour les icônes puisque c'est ça qui soutiens visuellement le site. les petites de la pages formations par ex. pour l'icono, investissez peut être dans des images plus qualitatives et moins bateau, ça rehaussera la qualité globale.

Comme vous le voyez c'est plus un empilement de détails qui font un tout, et qui manquent de cohérence comme je le disais (il n'y a même pas d'unité de taille !! Certaines couleurs comme le rose sortent de nulle part et disparaissent aussi vite qu'elles sont venues).

bref, vous avez tablé sur du simple, alors il faut être nickel de bout en bout, y aller à fond, et que l'ensemble soit homogène, sinon la sensation d'imperfection est immédiate.

pour les photos je suis désolé, je les trouve plus que correctes, certaines sont belles, cependant ça n'est pas (à mon avis) un critère suffisant pour VENDRE une prestation photo, on sent que ça ne sont pas des photos pro. Après tout dépends de votre cible/marché, mais bref, c'est un autre débat.

Sinon peut être vaut-il mieux UNE critique constructive et argumentée sur des points finalement faciles à corriger pour améliorer son site que 25 critiques qui disent juste "youpi" sans plus d'explications.

À vous de transformer l'essai et de changer un site "propre" en site "pro".

La couleur du menu noire sur le fond gris me choque ! De même que pour la balise H1 ...

De plus la police utilisée "font-family:'GraublauWebBold',sans-serif;" donne un effet d'aliasing et ça me stresse un peu. Je suis sous Vista + Firefox 3.6

A part ça, bien conceptualisé, bien réalisé, bien testé ... toutes les étapes de création de site internet sont bien présentes :p

Un petit retour sur la police aliasée : sachez qu'elle est déjà très jolie sur la version actuelle de Chrome, pas trop moche sur IE8 et qu'elle est/sera très bien sur la version 3.7 de Firefox... donc on peut dire qu'on a misé sur le futur proche :)

Si ça peut vous aider ou vous intéresser, la police présente un aliasing assez gênant (enfin, ça dépend des sensibilités) sous Firefox 3.6.4, Chrome 5.0.375.55 et Safari 4.0.5 sous Mac OS X 10.6.3.
Bonne continuation en tout cas !

@daitheflu : sur Chrome 5.0.375.55 la police est très lissée au contraire (vraiment pas aliasée). Bizarre que tu dises le contraire :/

@Raphael : C'est vrai que la fonte en gras est moins lisible sur Mac, sur XP c'était bon. ;)

Hello,

je suis globalement de l'avis de Yosh (et de Noix de Coco pour le coup) concernant le design avec un gros bémol sur les icônes trop dépareillées, trop pleines d'effets, trop présentes... trop :)

Cette version est meilleure et fonctionne mieux que l'ancienne mais est plus éloignée de mes gouts graphiquement.

Bravo. Une question: comment parvenez-vous à valider en CSS sur le service de validation du W3C alors que votre feuille de style comporte des éléments du type -moz- ou -webkit- qui, chez moi, provoquent une erreur à la validation. Merci.

@Raphael : apparemment la plateforme joue pas mal. Sous Linux par exemple la police passe beaucoup mieux, que ça soit avec Firefox ou Chromium :)
Je peux éventuellement te faire des captures si ça t'intéresse. Just ask !

C'est étrange, 788 documents, ça me paraît peu.

Attention, ne le prends pas dans le mauvais sens (*), c'est juste que 788, c'est "atteignable", or j'ai toujours eu l'impression de trouver ce que je cherchais sur Alsacreations et que donc ses ressources étaient beaucoup plus vastes.

(*) en fait on dirait même que je suis en train de grave fayoter ^^

Salut,

Je suis globalement du même avis que yosh, je ne m'étendrai donc pas sur le nouveau site.

Concernant la photo, je suis perplexe : comme il a été dit plus haut, un reflex numérique, si haut de gamme soit-il, ne fait pas le photographe. Je pense que jouer sur le nom d'Alsacréations pour vendre de la presta photo est une erreur, surtout en pratiquant des tarifs aussi bas (je n'ai pas dit que vous cassiez les prix, mais je le pense très fort).
Vous devriez séparer cette activité des prestas qui vous ont fait connaitre pour recentrer le site sur ce que vous savez faire, à savoir de la qualité web.

@Ericf : Je pense, à mon humble avis, que la publication d'un ouvrage sur la photographie prouve un minimum de niveau non ? ;)

Concernant les photos, je peux comprendre les réticences. Mais une photo peut représenter à elle seule l'identité d'un client : c'est le but d'une charte graphique. Une photo de qualité peut sublimer à elle seule un design. C'est plus sympa que des banques d'images :)

Hello à tous, une petite réponse rapide :

@Thibault : ça me paraît assez peu à moi aussi... d'autant plus que cette actu porte l'id n°1033, mais ça pourrait être cohérent : on publie finalement assez rarement, mais on espère qu'il s'agit de ressources de qualité ;)

@Ericf : ok pour ton retour. On a fait le pari d'un visuel très décalé et on l'assume car c'est tout à fait dans notre esprit depuis le début, mais on peut comprendre que ça heurte la sensibilité des afficionados de sites "classiques".

Pour ce qui est de la photo, on a déjà deux commandes de clients professionnels, donc : non, on ne pense pas s'être trompés et : oui, il semble que nos photos soient suffisamment "pros".

@alexhochart : bonne question. En fait, j'avoue ne pas avoir testé la validation CSS ! En général je ne me sers de cet outil que pour détecter éventuellement de grosses erreurs de syntaxes.

@daitheflu : merci pour la proposition. Pour l'instant le changement de typo (mûrement réfléchie) n'est pas à l'ordre du jour.

police pas du tout lissée sur CHROME 5.0.375.55 WIN 7 64bits

ça marche bien un conan ? ;)

@Noisequik : bizarre, j'ai exactement la même configuration chez moi... et elle est très lissée et très propre. Je n'ai rien changé à mes réglages.

@raphael : pour la validation CSS, j'ai trouvé ce qui faisait la différence (mais je ne l'explique pas): on enlève "type="text/css" dans , soit <link rel="stylesheet" href="style.css" media="screen, projection"/>, et ça valide. Bizarre bizarre.

Perso j'adore ce nouveau design.

Il en ressort un côté perfectionniste et pro malgré le côté décalé (qui contribue à rendre le tout finalement moins austère que la plupart des autres sites d'agences web).

Et je viens de découvrir que vous êtes seulement 4 ! Vu la renommée d'alsacréations, je pensais que c'était beaucoup plus "gros"...

Et aucun problème de lissage de polices chez moi (sous chrome mac et ubuntu), tout est clean et lisible.

@Raphaël : excuse moi d'insister mais votre site n'a rien de décalé, et ça ne heurte la sensibilité de personne, c'est juste qu'il y a des éléments objectivement améliorables, tels que les icônes qui ont justes été piochées dans 20 sets gratuits différents, ou l'icono qui est réutilisé du .com et franchement vieillote.

Tu peux t'entêter et dire que non, tout va bien ce site est parfait, que vous êtes incompris et que c'est très bien pour le cible et assumé, ou alors tu peux te dire que tu vas corriger les choses faciles à corriger et ainsi monter d'un cran la qualité du site (en plus tu vois bien que ça n'est pas un avis isolé)

Je te redonne des solutions simple :
- acheter (ou mieux, créer sur mesure) UN set d'icônes complet et homogène pour le site
- harmoniser les titres pour que 2 titres de même niveau soient traités pareil au fil des page
- être cohérent sur les couleurs (virer le rose du texte, ou faire un rappel ailleurs)
- dégager les têtes de mangas qui font vraiment ados/wilogo/deviantart/lolz
- virer la tasse de café qui est juste là pour faire "in" dans la page d'accueil, franchement c'est démodé, surtout quand c'est totalement hors contexte (pas d'environnement de bureau ni de vue de dessus nulle part ailleurs) en gros on sent qu'elle a été mise là "parce que ça fait bien" (un peu comme sur le .com au début)
- organiser le contact en bas à droite qui part dans tous les sens
- changer les stock photos des bandeaux pour d'autres plus qualis (et pas retouchée à l'arrache cf les yeux verts

comme tu peux le voir ça n'est pas grand chose, ni une remise en question totale du site, en 1/2 journée ça devrait être réglé, pour une amélioration globale importante. À toi de voir.

Il pourrait y avoir d'autres amélioration plus profondes, mais régler ces problèmes mineurs sera déjà le plus rentable en terme temps/image.

Pour les photos c'est bien que vous en vendiez, moi aussi on m'en a déjà demandé, mais ça n'est pas vraiment une garantie (plein de gens vendent des sites internet full table faits sur word) : je reste un amateur (même éclairé) avec un reflex, et ça se voit, tout comme dans les photos de vos galeries. de la photo pro c'est ça par ex : http://www.margecasey.com/ (je sais, tu vas s... me dire qu'il y en a des "vraiment pas belles" mais c'est juste le 1er exemple qui me vient)

Je comprends qu'il est tentant (et surement rémunérateur) de vendre de la presta photo pour faire du global et être autonome sur des budgets (et d'ailleurs ça doit intéresser votre cible) mais cependant je trouve que diluer votre expertise de la sorte n'est pas forcement une bonne idée. Bon après ça dépends de la cible et du business plan que vous avez déterminé, donc à la limite même si je trouve que c'est une erreur de positionnement ça ne me regarde pas.

Bon courage

yosh > pour la tasse de café, je l'ai vu comme un séparateur entre les 3 premières étapes ( => développement du projet) et l'après projet ( => suivi), je trouve que ça rend plutôt bien personnellement... bref ce que tu décris comme des problèmes objectifs sont simplement des choix artistiques, et je ne pense pas qu'ils vont repenser tout le site juste pour TE faire plaisir ;)

ça "rend bien" n'est pas trop un critère mais bref...

après moi ça ne me fait ni plaisir ni pas plaisir hein, je m'en fous en fait, c'est juste que c'est mon boulot et que je suppose que si le site est présenté c'est en partie pour recevoir des critiques.

Sinon il n'y a aucun choix artistique dans mes critiques (sinon je leur aurait dit de faire tel ou tel site ou de le changer complètement) ce sont juste des éléments objectifs pour améliorer un site existant sans remettre en cause les choix effectués. mettre des icones dépareillées n'est en rien un choix "artistique" c'est plutôt un choix dicté par les icônes gratuites "qui font jolies" disponibles.

enfin bon ce que j'en dis hein, peut être que ça conviens à la cible, mais c'est quand même dommage de se voiler la face pour de si petites modifs

@raphaël : pour revenir sur la question des photos, en en-tête de ton book photo on peut lire "Portfolio d'un photographe amateur à Strasbourg". Donc pas pro, donc finalement c'est toi même qui l'écrit, c'est tout ce que je disais.

@yosh : ne pas confondre ce que je fais chez moi à la maison (mon site perso), et ce que je fais dans le cadre de mon boulot.
Je n'ai pas de statut d'EURL à mon compte, mais Alsacréations fait de la photo professionnelle et je fais partie d'Alsacréations.

Note : je crée aussi des sites web amateurs personnels chez moi et ça ne m'empêche pas d'en créer de façon pro avec Alsacréations.

Voila une capture d'écran : http://bit.ly/deEVJu
Vista + Firefox 3.6
et tester sur 7 32bits + Firefox 3.6 = tjr pbl d'aliasing

Rajouter une activité de photographie apporte un plus au contraire ... beaucoup d'entreprise ont besoin d'avoir des clichés de leurs bâtiments, locaux, enseigne et même de leur équipe etc... Le client pourra centralisé toutes ses demandes chez Alsacreations pour avoir un site web de qualité, il ne s'embêtera pas à passer par plusieurs prestataires.

Félicitations pour votre nouveau site, je n'ai qu'une seule chose à dire "très frais", j'aime beaucoup votre style graphique avec vos couleurs acidulées qui apportent beaucoup visuellement. Déjà que j'adore la version d'alsacreations.com, là c'est carrément une claque. Chapeau les artistes !

voici une capture aussi sur Google Chrome pour illustrer le problème.

http://yfrog.com/g4alsap

A mon avis, cela vient de la configuration du Clear type sous Windows ?

il faut cliquer sur la loupe sinon l'image est redimensionnée et donc aliasée.

J'aime beaucoup le côté moins corporate, plus accessible que le site de beaucoup d'agence avec un design un peut sectaire et stéréotypé, une identité visuel vraiment différente.
Quand au polices en gras, sa passe mal sous Mac.

Perso j'ai découvert le site hier soir sur mon mac, et aucun problème de polices en gras pour ma part.

@XdiZ, dans ta capture d’écran le texte est lissé. Il y a même du lissage sous-pixel. Par contre, la graisse est forte et je me demande si c’est voulu ou si c’est une graisse «artificielle» générée par le navigateur (ou la librairie système utilisée pour le rendu des fontes). Le fait de déclarer une fonte qui est déjà “bold” en font-weight:bold peut avoir des conséquences pas terribles.
Sous Linux (Ubuntu 10.04, Firefox), j'ai aussi trouvé que le rendu du texte @font-face n'était pas propre. Mais c'est peut-être juste la fonte utilisée qui passe mal à ce corps-là.

Sinon, sur le fond je suis plutôt d'accord avec yosh. Ainsi qu'avec les solutions pratiques préconisées.
Pour la photo, je ne connais pas assez bien les compétences de Raphaël et les prestas offertes pour juger. Je pense que pour une agence parisienne ça ne passerait pas, il y a une offre trop grande de photographes pros qui font des choses très bien pour des photos mode, produits, lieux, etc. Pour une agence en province, par contre, et des clients locaux, ça peut être une bonne offre.

Félicitation pour votre site !
C'est vrai qu'il avait besoin d'un petit coup de peinture, l'ancien était toujours frai mais il commençait à être en place depuis trop longtemps.

PS : la capture d'écran de la newsletter pour Petzl n'a pas supportée le traitement par lot --'
PS2 : 30 millions d'amis non plus...

Je confirme sur Ubuntu / Firefox la police du menu fait crade.

Il y'a également beaucoup à revoir au niveau de la performance, c'est beaucoup trop lourd. Sur une machine modeste (celeron / chipset graphique avec mémoire partagée sur la RAM), ça rame complet sur les ascenseurs : limite désagréable à visiter.

Les PNG et les images en général peuvent être nettement optimisés, certains choix de formats sont inadaptés causant un "sur-poids", le "iepngfix.htc" cause également des problèmes de performance et peut être substitué à d'autres solutions d'intégration, beaucoup plus efficaces.

Les remarques de yosh me semblent également bien pertinentes.

@original.defeat : merci pour ce retour en terme de performance.

Pour ce qui est de ton premier point, j'expliquerai cela de manière très simple : il s'agit volontairement de présenter beaucoup de choses très graphiques, donc forcément même en optimisant les performances, ça reste lourd sur un matériel ancien.

Pour ce qui est des images, elles sont toutes passées par des outils tels que Smush-it (sauf certaines pour des raisons précises). Je suppose qu'on peut encore gagner un peu de poids par rapport à Smush-it, mais de là à gagner 50% je ne crois pas.

Pour le PNGfix, il n'est chargé que sur IE6. Ce dernier apparaît en "niveau 3" de notre tableau de prise en charge des navigateurs, c'est à dire que ses lacunes en terme de performance ne sont pas jugées importantes.

La grande majorité des critères de performance est également remplie pour PageSpeed et YSlow, ce qui est loin d'être le cas des autres sites en général. Mais merci d'avoir pris le temps pour toutes ces dissections...

@Raphael : Il y'a quelques points de contrôle intéressant à appliquer, qui pourraient largement vous surprendre concernant PNG. Les outils de compression ne sont pas les seuls moyens d'optimiser des PNG ; créer des PNG optimisés (notion de filtrage, intégration, etc.) à la base permet d'obtenir de bien meilleurs résultats.

Pour illustrer rapidement :
http://193.252.122.54/oweb/degrade-mauvais-en...
http://193.252.122.54/oweb/degrade-bon-encodage.png

La première image ne peut être optimisée car elle est mal encodée : les outils de compression, tels qu'ils soient, ne peuvent pas obtenir de résultats significatifs. La seconde image est optimisée à la création, et optimisée. Le gain est alors supérieur à 98 %.

Cette méthode de travail, bien qu'extrême dans cet exemple, peut être appliquée sur n'importe quelle image, et, selon les caractéristiques, on peut obtenir de très bons résultats. En faisant un compromis entre le choix du format / réutilisabilité / intégration, votre interface peut être nettement réduite niveau poids (à la louche, de l'ordre de 30% (sous entendu donc, 30% de charge en moins / nouveau visiteur).

@dew : On voit que les notions de performances ont été étudiées (expires, etags etc.), mais on ressent néanmoins directement un problème de "lourdeur générale" à l'arrivée sur le site, ce qui dégage chez certains utilisateurs un effet plutôt négatif. Rapidement :

- Le nombre importants de requêtes HTTP ; éventuellement vérifier l'utilisation de CSS-Sprites ou Image Map (cela s'applique pas mal sur la page d'accueil, ou la page des références par exemple) ;

- Le choix du format JPG / PNG sur certaines images ; exemple concret, le fond, qui aurait pu occuper une centaine d'octets en PNG, ou certaines icônes en PNG qui pourraient être en JPG ;

- Décompression des images en mémoire, cause le ralentissement constaté lors du "scrolling" sur une page du site, en rapport direct avec les points de contrôles d'intégration.

Il y'a d'autres points à étudier que je ne peux lister de manière exhaustive.

Ceci dit, même si mes critiques sont ciblées sur le négatif, il y'a tout de même de nombreux points positifs et bien pensés ; graphiquement, j'aime bien, même si ça reste un avis purement personnel (et inutile).

Il y'a également un point à souligner, concernant les fichiers PDF que vous proposez :

- Niveau accessibilité, les PDF ne disposent pas de balises /Title, /Subject, /Hx, /P etc., ce qui font d'eux des PDF sans structure sémantique ; les images ne disposent pas de texte alternatif (alt) ;

- Niveau compression, en utilisant mon ScriptPDF et en appliquant la décompression du flux Deflate, puis en appliquant celle du serveur à la place (qui est plus récente que cellle proposée par OpenOffice que vous utilisez), le gain est d'environ 15% par PDF. Il y'a également beaucoup de polices différentes utilisées (chaque police occupe un poids). L'usage de la mise en emphase "gras" sur les titres implique également le ré-encodage complet de la police, et donc "sur-poids". Même remarque pour les italiques.

Enfin, les conseils concernant les images s'appliquent également dans vos productions PDF (dimensionnement des images, choix du format). Exemple, sur le fichier "presentation.pdf", où le fait que le logo est en texte rend presque illisible le thème du document (image sans texte alternatif).

A titre comparatif, et en appliquant ces quelques conseils, le PDF peut être plus accessible et disposer d'un poids largement atténué. Et cette fois ci, cela dépasse les 50% ;)

Merci @original.defeat pour ces précisions pertinentes sur plusieurs points.
Quand je parlais de "sauf certaines pour des raisons précises" c'est par exemple au sujet de ta proposition de transformer certaines images PNG en JPG : nous avons pour idée de peut-être un jour changer l'habillage de fond du site. Pour cela, l'emploi de PNG transparents demeure inévitable.
C'est un des exemples de "sauf certaines pour des raisons précises" ;)

Pour les PDF, tu as raison et on est au courant. On va essayer de trouver du temps pour cette étape d'accessibilisation.

J'ai qu'un truc à dire : dommage que j'aie pas un super projet web à réaliser, le site donne envie de vous confier la tâche (j'ai pas le pognon non plus, mais c'est une autre histoire).
Ce qui est frappant, c'est qu'en parcourant le site, on a l'impression que le web, c'est du gâteau (niveau marketing, c'est convaincant, par contre j'y vois aucune allusion aux réalités du métier ;)) !

@briegel : A mon sens, c'est le propre d'une bonne agence : ne pas montrer la difficulté (les réalités) du métier ou du moins en soulager le plus possible les clients. :)

moi j'aime bien, bravo pour votre travail ! C'est du beau boulot ;)

@yosh tu te la pète parce que tu bosse chez Publicis modem je pense. Tes remarques sont caractéristiques du DA gros comptes. C'est facile quand tu as des intégrateurs à fouetter pour que les pixels s'alignent tels les fantassins de l'armée rouge, mais la petite équipe d'Alsacréations se fait plaisir, chose que TU doit avoir oubliée tellement t'es pro.

@iManu : Merci pour ces encouragements.

Par contre je t'avertis que je ne compte pas laisser les commentaires partir en vrille ou en combats de coq : chacun a son opinion personnelle sur le design de ce nouveau site et je préfèrerais qu'il n'y ait aucune attaque personnelle gratuite envers qui que ce soit. Yosh a son avis que certains autres partagent et il s'est donné du mal pour l'étayer de manière constructive.

D'ailleurs en passant, indépendamment du design, j'aurais surtout apprécié des retours sur la nouvelle réorganisation des contenus et de la navigation, qui était jugée désastreuse sur l'ancienne version. (pour rappel : www.alsacreations.fr/v1)

@iManu : mais oui bien sûr, d'ailleurs toutes les remarques que je donne sont relatives à l'intégration, et pas du tout sur le graphisme. D'ailleurs changer une icône par une autre c'est du high level en inté, c'est bien connu (je ne savais pas que tu doutais autant des compétences de mecs qui dirigent quand même alsacréations).

Le plus dommage justement c'est que c'est un site sans contraintes client et que justement on peut améliorer les choses sans compromis parce que "la fille du patron aime les mangas".

De toutes manières j'ai eu plusieurs échos comme quoi il était inutile de critiquer et que rien ne serait amélioré, apparemment le webdesign ne doit souffrir d'aucune critique. Donc je vais arrêter de "me la péter" comme tu dis, j'avais déjà tiré un trait sur les forums alsa, mais je vois que c'est pareil dans les commentaires des actus, apparemment le design est quelque chose de sensible par ici.

@Raph : bravo, votre site est très pro et très quali, il n'y a rien à améliorer, ça respire le professionnalisme et le design high level, félicitations !!

@Raph : au moins la nouvelle version est claire, remarque la première l'était aussi c'est juste la home qui manquait totalement de hierarchie (je ne me rapelle plus des pages intérieures, ça fait des 404)

@raph ui c'est pas beau les trolls ..
@yosh bah, excuse-moi, ne fais pas la tête ton analyse est très bonne et part d'une bonne intention, mais à mon sens un peu décalée. Dans ton premier commentaire la même chose aurait pu être dite avec plus de concision, vu le contexte, ou alors en MP si tu tenais à développer avec ce niveau de précision.

Pour revenir au sujet "[...] un nouveau site", faire une refonte c'est intégrer les nouvelles techno et en ce sens c'est réussi et même anticipé.
La charte graphique que vous avez développée reste à mon avis cohérente avec l'ancienne version, ainsi que le ton sympathique et léger qui fait, je pense, partie de votre succès depuis toutes ces années auprès de la communauté que vous avez su fédérer.
Enfin, même si quelques imperfections peuvent légitimement heurter certains, je suis sûr que la voie est tracée vers un nouveau succès et qu'une foule de clients seront accrochés et satisfaits. Bonne route !

En effet, ça commence un peu à partir en 'cahouetes', mais les remarques "à polémiques" sont quand même globalement très intéressantes.
Pour ma part, en-dehors de toute analyse concrète et réfléchie, je dirai simplement que comme pour l'ensemble de vos créations le rendu de ce nouveau site me séduit. Il y a vraiment une "griffe alsacréations", qu'elle plaise ou non. En tout cas, c'est pour moi une source d'inspiration tant au niveau de la composition que de l'intégration. Bravo!

Une question :
Est-ce que le fait que le slideshow ne défile pas dans l'ordre des vignettes est volontaire ? J'imagine que oui mais je n'en vois pas dans quel intérêt. Et au final je trouve cela déroutant.
Tout comme le fait de trouver le menu pour passer d'une rubrique à l'autre en bas des pages intérieures. Evidemment, si la page est lue dans son ensemble, le visiteur va finir par retrouver le menu mais je ne suis pas sûr que les pages soient toujours lues dans leur ensemble.
Sinon, le nouveau site prime par son originalité, son humour jusque dans le code source. Après on est en droit de ne pas aimer mais au moins il sort du lot.

Quand on commente un site, une des questions que l'on doit se poser, c'est : "est-ce que j'aurais pu faire mieux", ça s'appelle l'humilité.
Le site d'alsacréations est un exemple pour moi, parce que le design est soigné (un point), mais aussi parce que question marketting, c'est tout simplement du travail de maître : la cible est claire, les produits sont très bien identifiés, séparés, techniquement expliqués, bêtement compréhensibles (tiens, rev'la Mme Michu), et même les produits très "immatériels" comme l'assistance et le conseil sont mis en avant.
Si je quitte la casquette de designer web et que je mets celle de client, je ne peux pas mieux comprendre ce que fait Alsacréations : c'est un boulot réussi ET maîtrisé !

Nous avons toujours été ouverts aux critiques - surtout les constructives - et nous ne cherchons pas uniquement les félicitations à travers cette actualité mais gardez surtout en tête que :

- nous n'avons jamais présenté ce site comme le site ultime reflétant 100% de ce que l'on fait de mieux en web, il s'agit d'une refonte répondant à des impératifs, qui concerne un public que l'on connaît et fréquente au quotidien
- nous devons toujours faire preuve de pragmatisme (que ce soit pour nous-même ou dans des situations réelles / ou bien, yosh tu as des interlocuteurs idéaux qui acquiescent à tout ce que tu proposes et qui doublent le budget rien que pour atteindre le niveau de perfection accessibilité/design/performances que tu leur préconises)
- vous êtes (en tant que membres du .com) des power-users perfectionnistes qui cherchez le moindre octet mal placé, souvent de manière tout à fait justifiée, avec chacun sa spécialité (design, accessibilité, png, pdf...)
- nous n'avons jamais dit que l'on ne prendrait pas les remarques en compte, simplement nous n'allons pas le faire dans l'immédiat, mais bien entendu nous les notons car tout site web est évolutif, cela tombe sous le sens
- nous ne sommes pas fétichistes du PNG, sinon pourquoi pas recoder l'intégralité du serveur en assembleur en y mettant 14 fois plus de temps pour gagner 15% de perfs ;)

@briegel Si on suit ta logique, on ne pourrait commenter un disque des Beatles que si on joue mieux de la guitare que George Harrison. On ne va pas aller très loin à ce rythme !

@iManu Tu as 8 ans ou quoi ? C'est quoi ce ramassis de clichés débiles sur les grosses agences et ces attaques personnelles ? Les critiques de Yosh sont argumentées et objectives, toi tu fais du hors-sujet pur.

“Quand on commente un site, une des questions que l'on doit se poser, c'est : "est-ce que j'aurais pu faire mieux", ça s'appelle l'humilité. —briegel”

Voilà une bien mauvaise définition de l’humilité. Au bénéfice du doute, je vais supposer que le terme était mal choisi.

Sur le fond, c’est l’argument classique pour rejeter des critiques sans avoir à se demander si elles sont fondées ou non. Plutôt que prendre en compte la critique (et la contester ou l’ignorer si on le souhaite), on attaque la légitimité de la personne qui émet la critique. Mais non, il ne s’agit pas de savoir si on peut faire mieux, mais de savoir si on a un truc intéressant à dire ou pas. En l’occurrence les critiques de yosh et d’autres (bzh, original.defeat, …) sont intéressantes. Fin de la polémique.

Pourquoi tout le monde s'acharne sur leur site ?
L'équipe nous annonce gentiment qu'elle a mis à jour son site web et BIM!! toute la communauté se mêle ça.... =/
Enfin je dis ça... y'a pas mal de trucs intéressants n'empêche =P

Écoutez les gars, mettre des icônes harmonisées un minimum et pas de manga, je ne crois pas que ce soit une contrainte de malade dictée par des impératifs clients inouïs, surtout pour un site ou VOUS êtes les seuls décideurs, maitre d'œuvres et développeurs. Je me trompe peut être mais ça sent l'excuse.

Après votre cible si bien étudiée est peut être fan d'avatar générés automatiquement en vogue sur skyblog je ne sais pas (coïncidence, ça doit être la même cible que le site perso de raphaël, comme quoi le hasard fait bien les choses)

La qualité web c'est un tout.

Bon j'arrête là parce que ça ne mène à rien, et je retourne fouetter STPO pour qu'il intègre mes maquettes au pixel prêt (d'ailleurs kestufou à poster au lieu de bosser hum ? ;) )

@STPo 8 et demi !
@yosh bof ..

bon de toute façon c'est le problème classique avec les icônes, je rencontre aussi souvent ça...

A moins que le graphiste de la boite ait beaucoup de temps et pas d'autres mandats en cours, il est vraiment difficile de créer de toutes pièces de belles icônes ou de trouver un set original et bien fichu...

"UNE DES QUESTIONS" pas "LA QUESTION" ! (je lis mieux que vous, c'est pas de l'humilité)

J'aime bien la nouvelle présentation qui fait pro sans être austère, cependant les 7 icônes sous le premier cadre font un peu dépareillé et en tant que "sélecteurs" (c'est d'ailleurs visiblement leur fonction), ils seraient plus harmonieux en étant mis sur le côté du grand cadre principal : un peu comme le site du Kremlin ( http://www.kremlin.ru/ ) où à côté de la photo il y a 3 sélecteurs.

La page fait un peu longue... et les cadres successifs mis les uns en dessous des autres font monotone.
Une mise en page 2 ou 3 colonnes briseraient peut-être l'ennui.

Voilà, ce n'est que mon humble avis.

J'étais passé à côté des pages de prestations hormis "création web" qui est mis en avant dans le menu principal (lien qui change quand on se trouve sur formation, je n'ai pas saisi pourquoi?). C'est un peu gênant d'avoir le menu en bas de page pour naviguer entre ces différentes rubriques.

Pour revenir sur les icônes, je trouve la page "photographie professionnelle" bien illustrée et agréable. Les icônes/images ne sont pas trop présentes et laissent la place au contenu.

A contrario sur formations, passé le premier pavé/bloc, elles sont très grandes et peu agréables (et légèrement scalé au passage).

Maintenant si je vais sur accessibilité, les icônes sont de nouveau bien plus grande dans le premier pavé/bloc.

Bref, le tout donne une impression peu cohérente.

J'aurai aussi mis plus en avant les créations/références peut être avec des screenshoot plus grand ou plus de texte et surement paginé cette rubrique un peu à rallonge.

Avis émis sans oublier que faire une refonte est très chronophage et que Rome ne s'est pas faite en un jour. La base est bonne, ce sont des détails. :)

@original.defeat C'est plus que prévu de rendre les PDF accessibles, tu te doutes bien ;)
Mais j'ai rencontré un écueil sur chacun d'entre eux (un écueil différent pour chacun, ce serait trop simple sinon), bref ça empêchait pas de mettre le site en ligne et de corriger dans quelques semaines ces PDF.

J'adore votre panneau en page d'accueil, j'essaye d'ailleurs de créer la même chose pour mon portfolio, je vais m'y mettre ce mois çi :D

Bonsoir
Ben moi, j'aime beaucoup! Je ne connais pas les 4 mousquetaires (sauf à les avoirs lus ici ou sur papier), mais j'ai comme le sentiment que le site leur ressemble, et est l'image de leur agence...Si je puis me permettre cependant, en terme d'accessibilité, sauf à passer par les raccourcis clavier/souris, on ne peut pas agrandir/diminuer les textes (ok, ok, les h1et h2 d'entrées de pages suffisent sans doute, mais...)...c'est sans doute une question idiote, mais est-ce voulu? Je ne connais pas bien (oui, je sais, j'en ai honte ;-) ) les standards à ce sujet, donc, pardonnez moi ma question.
Encore bravo, et bonne route
Tchô

Ce serait pas une bonne idée de mettre le code asynchrone de Google Analytics plutôt que le code standard ?

Sinon c'est magnifique, et même le code est indenté avec le même amour que lorsqu'on aligne des saucisses. :D
J'espère que ça va vous ramener de nouveaux clients.

Sur le nouveaux site alsacreations.fr, je reconnais les icônes de plusieurs membres de crystalxp.net et de customxp.net (PNG Factory). Donc, je me demande si, aux nombre de "packs" que vous utilisez, vous avez réellement obtenu l'autorisation de les utiliser sur votre site web. En effet, autant crystalxp.net que customxp.net ne garantisse que l'utilisation personnelle des icônes publiées sur leurs galeries et indique clairement dans les licences d'utilisation qu'il faut obtenir une autorisation écrite pour l'octroi de tout autre droit.

Bonjour,

J'aime bien le design de votre nouveau site mais je reste perplexe sur l'accessibilité de celui-ci, surtout dans le cas de la désactivation de Javascript dans les navigateurs IE. En effet, les éléments HTML5 sont créés avec Javascript dans le cas de l'utilisation d'IE, donc si Javascript est désactivé, votre site ne ressemble malheureusement plus à grand chose...

Pourriez-vous m'éclairer dans votre choix d'obliger l'utilisation de Javascript pour la navigation dans votre site ??

Merci !

Bonjour bonsoir,
Voici un bail que je fréquente votre site et le consulte régulièrement. Au passage un grand merci pour tout ce boulot partagé, source inépuisable de références et documentation.
Bravo pour cette superbe nouvelle mouture. Un seul bémol : Question de goût, je n'aime pas trop les images manga. C'est le dessin que je trouve moche, pas le côté 'comics' qui me botte assez. Pourquoi n'avoir pas puisé dans un vrai dessin de B.D. un peu plus artistique ?
Sinon, côté critiques sur vos choix mélangeant un peu d'humour, de légèreté etc et le professionnel, il me semble que vous pouvez plus que très largement vous le permettre. Il suffit de parcourir vos sites web et forum en ligne pour voir l'évidence sans plus avoir à le prouver.
Bref, vous avez gagné le droit du style qu'il vous plait d'afficher.
Comme tous les autres internautes, avant même de tomber sur cet article, j'ai fouillé côté code source et me suis amusée.
Longue vie à vous.

Ha oui encore ceci
Côté graphisme les gens ne seront jamais d'accord. C'est trop subjectif les goûts et les couleurs. Je vois souvent passer des articles sur des sites spécialisés qui présentent un top des meilleurs design de l'année ou du mois. Et quand je clique dessus je vois des horreurs que d'aucuns trouvent belles. Question de mode... donc, encore une fois se faire plaisir et assumer ses goûts stylistiques me paraît la bonne méthode parce qu'il y aura toujours quelqu'un pour trouver ça moche ou beau.

@inconnu : je t'ai envoyé un message à ce sujet, j'attends de tes retours ;)

@freust : effectivement, l'affichage est dégradé sous IE sans JavaScript. Nous avons pris ce risque (qui ne concerne pas l'accessibilité mais le design, le contenu demeurant tout à fait accessible) en connaissance de cause : de par la communauté et la veille technologique que nous faisons, c'est presque une mission pour nous de faire "bouger les choses" et IE fait partie de ces "choses" quand on lui parle de HTML5 :)
Quitte à perdre quelques clients (et encore, cela reste à prouver), on préfère montrer ce que le Web actuel permet de réaliser.

Première impression à chaud : déçu de nouveau look.

Autant j'idolâtrais la première version, autant là je rebute. Comme Yosh qui disait auparavant, que le design ne fais pas pro pour une agence digne de Alsa.

Tout paraît approximatif et ne fait pas trop site "vitrine" pour une agence je trouve, je suis resté sur ma faim quand-même, pourtant je suis un fervent admirateur de M. Goetter. J'attends d'ailleurs un nouvel ouvrage.

Cordiales salutations

@DvN : "je suis resté sur ma faim quand-même, pourtant je suis un fervent admirateur de M. Goetter"
-> Dans ce cas là, il aurait fallu critiquer l'intégration et non le design;)

"J'attends d'ailleurs un nouvel ouvrage." -> Ah oui ? Il faudra que je prenne une année sabbatique maintenant que j'ai un métier et une famille ! :D

Il est beau ce site, j'en ai pris plein les mirettes. Bon, je ne suis allée que sur la page d'accueil et ne programme qu'à titre amateur.
Suite aux critiques sur le design qui ne fait pas assez "pro", je le trouve carrément plus classe que certains sites que j'ai eu l'occasion de visiter, qui font du web et dont le design fait carrément peur. Peur au point qu'on se demande comment ils trouvent des clients. Oui c'est acerbe, voire méchant, mais en contrepartie, je ne les cite pas.
Le fait que le titre soit accompagné d'une mention "agence web exotique" justifie amplement ce design. Design doux, aux rondeurs qui laissent supposer que la forme est tout aussi ergonomique et la navigation fluide. Carré parce que structuré, et rond à l'oeil, je trouve ça tout simplement extra.
Bon, j'arrête de passer la pommade et de baver, ça fait redondant et je vais naviguer davantage. Merci en tous cas pour ces tutos, ces rubriques, ce forum, merci pour l'ensemble des ressources Alsacréations.

@Raphael : C'est juste désolé, mais mon message je l'ai posté sur le vif et les émotions ont pris le dessus :). Je suis peut-être vieux jeu mais je restais admiratif sur la http://alsacreations.fr/v1/ version 1 du site...

En tout cas si vous avez la quelque intention que ce soit de sortir un livre faites moi signe, je pré-commande même avant sa réalisation :D

@DvN : pas de souci... et pour ce qui est du livre, j'avoue que j'y pense :)

Salut, désolé pour le commentaire un peu tardif.
Globalement je suis pas trop emballé par ce nouveau design même si il représente une amélioration comparativement à la version précédente. Je suis assez d'accord avec Yosh sur les icônes mais ce n'est pas ce qui me choque le plus.
Concernant la presta de Photo, ça peut être un avantage non négligeable sur les autres web agency, je pense pas que ça soit une mauvaise idée.

Sur l'accueil, la longueur de la page me gêne, trop de contenu et peut-être aussi pas assez de hiérarchisation visuelle. Les titres d'accroche des 7 prestas sont excessivement gros, un peu trop agressif et orientation graphique trop publicitaire amha.
Dans les page de pestas, il y a trop de gras dans la présentation. Ok pour l'accroche mais pas pour la description et les mise en exergue ne sont pas assez évidentes, une seule couleur serait suffisante.
Sinon j'aime assez les blocs de prestas( Référencement...) ça fonctionne plutôt bien, les pages formation aussi.

Et enfin le logo (il me semble que personne n'en a encore fait la critique) :
L'emblème est presque nickel (feuille bleue tronquée à droite) mais pas le nom et la tagline : la tagline manque de contraste avec le fond et le vert acidulé en dégradé d"Alsacréation bof bof, trop d'effets et un typo qui laisse à désirer.

Puisque tu demandais un retour sur la répartition du contenu, la navigation principale (cette à droite du logo) devrait englober la totalité des pages du site, en partie pour avoir un aperçu de l'ensemble des rubriques du site (malgré la présence d'un plan du site pas forcément facilement repérable), aprés on va dire que c'est une bonne pratique ergonomique ;)
Quant aux avatars vous savez ce que j'en pense :)

Pour terminer sur une note un peu plus positive, bravo quand même pour cette refonte, je me doute que ça représente pas mal de boulot et de tergiversations ;)

@Hermann : "et le vert acidulé en dégradé d"Alsacréation bof bof"
-> Alsacréations sans "s" detected ! Je bannis ou bien ? :)
(merci pour ces retours)

@Raphael : Arf maudit S!

@an.archi : +1 J'ai vu la même chose ^^