General - Advanced Web


NUMERO 21
Découvrez le numéro 21 de Web Design réalisé par des professionnels de la création de site. Conçu et rédigé à la fois par des journalistes, blogueurs et pro du Web. Avec une vingtaine de pages de tutoriels, des analyses, un cahier d'experts, des trucs et astuces...



Vente au numéro,
visitez notre boutique en ligne shop.oracom.fr

Un peu d'humour

publié le mardi 31 août 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 426 lectures
Parce que vous avez tous ou serez tous un jour confronté à un client qui a mauvais goût, voici une mini BD pour dédramatiser... Et vous pouvez même acheter le poster et l'afficher dans le bureau de votre boss ! Tks Mo.



 

Un chat sur Facebook !

publié le jeudi 12 août 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 281 lectures
Certes, le titre peut porter à confusion, mais non il n'y a pas de félin sur Facebook (quoi que, je n'ai pas vérifié, mais c'est bien possible). Mais bien une chatroom ! Nous avons ajouté ce module de Facebook pour voir un peu ce que ça pourrait donner et vous avez été nombreux à nous rejoindre lundi dernier pour papoter. Nous ferons cela régulièrement en vous prévenant sur FB, sur le blog si possible et sur Twitter (webdesignmag). Vous pourrez y poser des questions à la rédaction mais aussi parler entre vous pour vous refiler des tuyaux, ce qui s'est beaucoup vu lundi. Un échange très riche en quelques heures ! Nous songeons à moyen terme à créer un forum dans la nouvelle mouture de notre blog, alors si vous êtes pour, dites-le ;) Et dites-nous ce que vous aimeriez y trouver comme salon ;)



 

Développer vos pages à l’aide d’une grille, pour quoi faire ?

publié le mercredi 4 août 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 462 lectures
Excepté certains sites Web très créatifs, rien ne ressemble plus à un site Web qu’un autre site Web. Et cela ne fait que s’amplifier depuis l’utilisation massive des blogs et CMS. Nous faisons et refaisons sans cesse les mêmes opérations de préparation, de structuration et de répartition du contenu.
Chacune des zones de la page doit également être à des dimensions qui respectent une harmonie visuelle globale afin de préserver la lisibilité de l’ensemble. Ces règles de proportionnalité ne s’appliquent pas qu’au Web, on les retrouve pour définir tout type d’interface, qu’il s’agisse d’un magazine, d’un écran de télévision ou de téléphone, etc.
C’est là qu’interviennent les grilles ou l’art et la manière de répartir le contenu dans une matrice, à la façon d’un journal qui voit ses articles structurés en colonnes. D’ailleurs, Photoshop lui-même ne le propose-t-il pas lui aussi ?

Utilisation d’un framework
On trouve sur le Web divers frameworks pour travailler en mode grille. Sachant que tous fonctionnent sur le même principe, arrêtons-nous sur l’un des plus communs, 960. Celui-ci se présente sous forme de trois fichiers CSS : 960, reset et text. Dans l’ordre, le premier contient l’ensemble des règles nécessaires au fonctionnement de la grille, le deuxième réinitialise les déclarations par défaut des navigateurs et le troisième propose une mise en forme du texte… Libre à vous de le modifier, de le compléter et de l’adapter selon vos besoins.

Première prise en main
L’utilisation d’un framework est très basique, il suffit dans un premier temps d’importer les trois CSS dans le document HTML puis de construire la structure de la page. Prenons un exemple classique avec un header, un nav, un content et un footer, le tout contenu dans un main-content (cf. schéma 1 et code 1).



Tout passe par l’utilisation des classes du document 960.css. Le framework propose deux modes de travail en 12 ou 16 colonnes, il suffit donc d’ajouter la classe “container_12” (ou 16) à main-content pour définir le mode choisi. Ensuite, pour attribuer une pleine largeur au header, ajoutez-lui la classe “grid_12”. Pour répartir nav et content, disons en un tiers/deux tiers, il suffit d’ajouter une classe “grid_4” à nav et une “grid_8” à content (4 + 8 = 12). Et ainsi de suite…
Vous pouvez imbriquer autant de conteneurs enfants que vous souhaitez dans les conteneurs parents. Usez de la classe “grid_N” afin d’occuper le nombre de colonnes voulues. Vous risquez d’avoir quelques soucis de marges, vous avez pour cela accès à des classes alpha et omega qui suppriment respectivement les marges gauche et droite de l’élément affecté.
Enfin, il existe également des classes prefix_N et suffix_N qui apportent des padding gauche et droit aux éléments... Voilà, nous pourrions aller encore plus loin, mais cela dépasserait l’objectif de ce sujet.

Conclusion ?
Le Web n’est pas comparable à un écran de télé ou à un format standard de magazine. Il voit sa représentation étroitement liée au type d’écran de l’utilisateur et surtout à l’espace sans cesse redimensionné de la fenêtre du navigateur. Malgré cela, l’utilisation des grilles peut parfois nous être d’une grande utilité…

Par Birnou Sébarte, extrait de Web Design n°15

 

Débuter avec la POO en PHP

publié le jeudi 8 juillet 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 559 lectures
Un article pour débuter en Programmation Orientée Objet chez Grafikart.



 

Amazing shopping !

publié le lundi 24 mai 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 950 lectures
En collaboration avec l’entreprise lilloise Keyneosoft, sept élèves de l’Ecole Centrale de Lille développent selon leur idée originale un système d’essayage virtuel à partir de bornes prévues à cet effet dans les magasins de prêt-à-porter. Le projet Try&See aboutira au mois de juin et sera alors visible dans le show-room de Keyneosoft.



Deux ans de travail auront été nécessaires aux sept élèves motivés de l’Ecole Centrale de Lille pour réaliser un programme permettant à ses utilisateurs de se voir vêtu des vêtements qu’ils souhaitent au travers d’un écran. Le bon rendu du vêtement se justifie par les solutions techniques apportées par Try&See. Il tient d’abord dans le fait que le vêtement lui-même au lieu d’être modélisé est numérisé et traité. Par ailleurs, l’image de l’utilisateur est celle renvoyée par le biais d’une caméra et enfin la superposition de cette dernière avec la représentation du vêtement est agrémentée d’un système qui rend l’adéquation plus réelle.



L’aboutissement du projet Try&See sera l’occasion pour le groupe d’en exposer le principe auprès du jury de l’Ecole. Keyneosoft sera ensuite libre de le diffuser. Son utilisation ludique et facile sera appréciée de tous, jeunes et moins jeunes et pourrait représenter un intérêt certain pour de nombreuses marques de prêt-à-porter. La reconnaissance de mouvement intégrée offre la possibilité d’en manier les commandes à distance et rend le projet Try&See d’autant plus appréciable qu’il rentre dans la logique d’expansion du e-commerce vers une technologie novatrice et grand public.



Le projet, initialement conçu pour l’essayage en ligne, sera également adaptable aux sites internet des marques qui le désirent. En effet, il pourrait représenter un atout majeur pour la vente à distance et notamment permettre à ses internautes d’essayer (ou de faire essayer à des enfants par exemple) et d’acheter des vêtements parmi une large gamme proposée par la marque, ce qui ouvre de nouvelles perspectives au projet Try&See.

Contact :
Zelda Below Responsable de la communication

Keyneosoft

 

Blogger depuis l'espace

publié le mercredi 5 mai 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 272 lectures
Il semblerait que Twitter soit allé bien plus loin qu'il ne l'avait prévu à la base en atteignant l'espace ! L'astronaute Soichi Noguchi est actuellement dans la station internationale pour ISS Expedition 22/23. Et il semblerait que l'astronaute japonais tweet depuis l'espace. En utilisant son téléphone, Soichi a placé des photos prises à différents points du globe sur son compte Twitpic. Plus de 500 photos étonnantes à voir, prise de jour et de nuit. Vous pourrez même y voir Paris de nuit avec toutes ses lumières. Faites un tour sur son Twitpic.





 

Enquête

publié le lundi 26 avril 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 286 lectures
Chers lecteurs, notre enquête du mois a subi quelques bugs de lancement !
Si vous avez répondu à l'enquête iStockphoto entre le vendredi 16 et le jeudi 22 avril, votre inscription n’a malheureusement pas été prise en compte.
Nous vous remercions de bien vouloir vous réinscrire à nouveau pour répondre au questionnaire afin que vos réponses soient prises en compte et et que vous receviez vos cadeaux !
Avec toutes nos excuses pour cet incident indépendant de notre volonté.
Merci de votre compréhension.



 

Le contraste

publié le lundi 19 avril 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 255 lectures
Un bel article chez CSS4 DESIGN sur le contraste des sites et des outils pour le vérifier.



 

Oracom recherche un développeur web confirmé (H/F)

publié le jeudi 8 avril 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 330 lectures
Oracom recherche un développeur web confirmé (H/F)
Lieu : Paris 14ème

Dans le cadre du renforcement de nos activités d'édition de services en ligne, Oracom recrute (CDD de 3 mois, renouvelable) un développeur web expérimenté. Maitrisant le PHP, le Javascript, le CSS et les bases de données MySQL, vous devrez également avoir des notions d'AJAX et de Joomla (CMS).

Dynamique, autonome et ayant l'esprit d'équipe, vous travaillerez sur des projets innovants liés à l'univers de la presse en ligne et papier.

Le télétravail n'est pas autorisé. Le poste est à pourvoir dès que possible. Salaire variable selon expérience. Contact et candidature : alexandre.habian@oracom.fr (Référence : « CDD Dev Web »)

Oracom est un groupe de presse, éditeur de nombreux magazines leaders dans les secteurs de la high-tech (Mobiles magazine, Micro Portable…), de la maison (Home magazine, Home Solutions…) et de la création (Advanced Creation, Web Design…).

 

Nouveau magazine !

publié le jeudi 1 avril 2010 par Stéphanie Guillaume
dans la catégorie General | aucun commentaire | 284 lectures
Après Advanced Creation, après Web Design et après le tout jeune 3DMag, nous vous présentons Création Photo, un magazine de création multi-logiciels dédié plutôt aux débutants en la matière. Vous y trouverez des tutoriels sur Photoshop, Photoshop Elements, Gimp, Paint Shop Pro, Artrage, etc. Plus d'infos sur le lien : ) En kiosque le 1 avril ! Promis ce n'est pas une blague !



 

Nos Partenaires Officiels



tuto informatique en vidéo

Nos Partenaires Formation














CATÉGORIES
    
Découvrez le forum en partenariat avec
le magazine Advanced WEB

DÉCOUVREZ LE MAG Advanced Creation
LIENS UTILES
ARCHIVES