Vous êtes obligé d’avancer mais pas à l’aveugle Internet bouge très rapidement. De nouvelles technologies arrivent chaque jour. Nous devons en permanence rester au point. Nous vous aidons à mettre en place les solutions les plus pertinentes et adaptées à votre stratégie numérique. Soyez tranquille : la technologie, c'est notre affaire. Grâce à notre expertise, votre entreprise sera plus rentable. Agence digitale : One Cut Studio vous appuie en graphisme, webdesign, création de logo et d'identité graphique, développement de site internet, application mobile, e-commerce, branding, marketing, publicité, packaging, impression, photographie, vidéo et réseaux sociaux. Nous vous accompagnons dans les domaines opérationnels et organisationnels, recommandations technologiques, exploration et exploitation de données Quelque soit la taille de votre structure, comptez sur nous pour vous accompagner lors de votre transition vers le numérique. Nous avons tout ce dont vous avez besoin pour réussir votre projet en ligne. Solutions clés en main, services sur mesure, budget maîtrisé. image : ajoutez un souffle de fraîcheur à votre site Identité : création d'une présence forte La réussite de votre entreprise dépend de votre capacité à provoquer l'intérêt chez vos clients : • Ingénierie web & mobile • Branding, publicité et webdesign • Community management • Communication & evénementiel • Sites web vitrine, e-commerce & application web • Applications mobiles pour iPhone & Android • Audit et veille stratégique Nous vous aidons à vous imposer sur votre marché. Bien qu'il soit important de bien concevoir votre identité graphique; de votre site internet à l'ensemble de vos outils publicitaires, rares sont les projets qui se réalisent d'un seul trait, sans modification ou mise à jour. Pour mener à bien votre présence en ligne, il faut un support, de la maintenance et un entretien régulier. Nous vous assistons en : web marketing · solutions cloud maintenance web/application · service desk STRATÉGIE DE SOUTIEN image : OCS vous facilite internet 2 PROJETS RÉCENTS Ces sociétés ont pu bénéficier de notre expertise. Regardez leurs sites, posez leur vos questions et faites-nous part de vos impressions : HIC & UBIQ Créateur de l'armoire multi-facettes Présenté comme un meuble presque ordinaire, son système breveté et primé au concours Lépine, intègre un déplacement mécanique et fluide des ensembles, permettant en quelques secondes de transformer un dressing en bibliothèque ou en bureau. http://linkedin.com/company/5240849 http://facebook.com/hicetubiq http://yacommeunhic.com ADtect Détection de réseaux enterrés Les investigations de détection répondent aux exigences réglementaires en matière de sécurisation de travaux à proximité de réseaux enterrés. Ces localisations permettent une meilleure connaissance du sous sol et une optimisation des projets de construction. http://linkedin.com/in/r%C3%A9mi-wagrez http://facebook.com/ADtectreseau http://adtect.fr CRÉATION TEXTE · LOGO · ILLUSTRATION · PHOTO · VIDÉO Les textes: Pour communiquer vos produits et services, mais aussi pour améliorer le référencement de votre site (SEO / SEA). Le logo: Le point de départ de votre identité en interne et en ligne. Les illustrations: Souvent il est plus facile d'illustrer un processus que de le décrire. La photographie : Les images ont une place primordiale dans toute campagne de marketing. La vidéo : Avec l'arrivée d'internet à haut débit, les sites web intègrent de plus en plus souvent le mouvement. ILLUSTRATIONS Il est plus facile d'illustrer votre activité que de la décrire. Que ce soit pour usage interne, B2B ou promotionnel, nous pouvons vous assister dans la création de toutes vos illustrations. Une bonne illustration peut mieux véhiculer les avantages de vos services et plus rapidement que plusieurs paragraphes de texte. Nous utilisons les outils appropriés (Illustrator, Photoshop et divers outils 3D) pour préparer des illustrations limpides et attirantes.

· accueil · Identité · Try · Accueil · · Start · Imagine · Try · Accueil ·
Small panelto bottom of document Search wikipedia Read   Edit m view history Article   Talk Not logged in | talk | contributions | create account | log in SvijaWTFp*dia, l'encyclopédie libre Svija est un website builder utilisé pour créer des sites Web basés sur le format SVG, sans avoir besoin d'écrire du code.Dans sa forme actuelle, Svija permet aux utilisateurs de concevoir et de créer des sites web à l'aide d'Adobe Illustrator. Bien que le contenu soit servi dans un conteneur HTML, les sites web Svija sont uniques puisqu'ils sont entièrement construits à partir de fichiers SVG.La philosophie de Svija est que lorsque le visiteur-euses et leur navigateur déterminent l'apparence du contenu, le HTML est une solution appropriée. Cependant, le format SVG est nettement mieux adapté pour donner un contrôle complet au créateur de contenu.Le flux de travail Svija est le suivant :1. l'utilisateur-ice lance un programme de synchronisation, Svija Sync2. l'utilisateur-ice crée du contenu (pages ou modules) dans Adobe Illustrator3. les fichiers SVG sont exportés via un script Illustrator, Svija Tools ; toutes les modifications sont téléchargées automatiquement par Svija Sync4. aucun autre travail n'est nécessaire pour considérer que le contenu fini5. peut être combiné, déplacé ou supprimé dans Svija AdminÀ ce jour, Svija est la seule plateforme qui permet la création de sites Web basés sur SVG. Svija est actuellement en version bêta. Il s'agit d'une preuve de concept, créée pour établir la viabilité du projet Svija tandis que le financement est recherché pour achever le projet Svija dans son intégralité.L'utilisation de Svija nécessite la création d'un compte gratuit, disponible sur demande sur svija.love. Redirigé depuis SvijaSVG. Pour la société de cosmétique ukrainienne homonyme, voir Svija Cosmetics. Développé parPremière versionDernière versionDépôts Écrit enSystème d'exploitationLanguesTypeLicenceSite web Svija SAS22 décembre 20152.1.6 · 29 juillet 2020github.com/svijasvg/svija-sync, /svijasvg/svija-tools Python, PostgreSQL, JSmacOSanglais, françaisWebsite buildertype BSD (Svija Tools,Svija Sync)svija.love 1234567891011121314151617 PrésentationHistoreExemplesProblèmes avec HTMLSVG : format négligéLes bénéfices de SvijaLes limites de SvijaResponsive web designLe RemAccessibilitéMoteurs de rechercheAnimationGestion de texteSvija StoreL'avenir de SvijaArticles connexesLiens externes Contents Categories: free software | programmed in python | python web frameworks | software using the bsd license This page was last edited on 2 September 2020, at 13:50 |UTC|.Text is available under the Creative Commons Attribution-ShareAlike License; additional terms may apply. By using this site, you agree to the Terms of Use and Privacy Policy. Wikipedia® is a registered trademark of the Wikimedia Foundation, Inc., a non-profit organization.Privacy Policy | About Wikipedia | Disclaimers | Contact Wikipedia | Developers | Statistics | Cookie Statement | Mobile View PrésentationSites web basés sur SVGSvija est conçu pour faciliter la création de sites web visuellement efficaces et très détaillés. Alors que les sites web HTML sont limités graphiquement et vulnérables aux différences d'affichage entre les différentes plateformes et navigateurs, les sites web SVG affichent un contenu extrêmement détaillé de manière identique sur toutes les plateformes.Les sites web de Svija s'affichent normalement et sont classés normalement par les moteurs de recherche. Du point de vue de l'utilisateur-ice, un site web Svija ne se distingue pas d'un site web HTML ; il se comporte comme on s'y attend (le texte peut être sélectionné, les liens peuvent être suivis, etc.). La principale différence technique entre un site web Svija et un site web traditionnel est qu'au lieu que les éléments de page soient définis par des balises HTML, ils sont définis par des balises SVG.Éléments de SvijaBien qu'il soit prévu de publier un logiciel de création propriétaire, Svija utilise actuellement Adobe Illustrator pour la mise en page.Le programme Svija CMS se compose d'une interface web qui permet la gestion de contenu, combinée à un composant supplémentaire côté serveur qui adapte les pages SVG exportées par Illustrator pour une utilisation sur le site web.En plus de l'installation du serveur Svija, Svija Sync synchronise en permanence le contenu local avec un serveur et Svija Tools qui se compose de Adobe Illustrator ActionScripts facilitent la création de contenu web.Svija AdminSvija Admin est un système de gestion de contenu (CMS) écrit en Django et basé sur une base de données PostgreSQL, à peu près similaire à Wordpress ou à d'autres créateurs de sites web. Il permet aux administrateurs d'attribuer les fichiers SVG générés par Illustrator à des pages spécifiques ainsi que de nombreuses autres tâches administratives.Svija permet de combiner différents modules basés sur SVG tels que des menus, des pieds de page, des bannières, de la publicité ou des fonctionnalités spéciales. Les autres fonctionnalités incluent la gestion des titres de page, des plans de site, des informations SEO et des fonctionnalités de formulaire.Plus important encore, Svija Admin fournit un processus de conversion propriétaire qui adapte le format Adobe SVG à l'affichage des pages web.Svija SyncSvija Sync est un Mac script bash qui synchronise un dossier de travail local avec le serveur du site web. Svija Sync s'exécute en continu, permettant au concepteur de travailler dans Illustrator pendant que le site web est mis à jour en temps réel.Svija Sync peut également être utilisé en collaboration. Étant donné que le serveur contient une copie complète de tous les fichiers nécessaires pour travailler sur le site web, chaque membre de l'équipe peut télécharger l'intégralité du site web puis remettre à jour le site avec les modifications voulues.Svija ToolsSvija Tools se compose de deux ActionScripts Adobe Illustrator et d'un modèle Adobe Illustrator. Le script principal, Tout sauvegarder en SVG, exporte tous les fichiers Illustrator ouverts au format SVG avec les paramètres nécessaires pour une utilisation en tant que contenu web.Un deuxième script, Propager calques déverrouillés, partage des éléments entre des documents ouverts, ce qui facilite le travail sur des groupes de pages web similaires. Le modèle est utilisé pour la création de nouvelles pages dans un format approprié. HistoireAndrew Swift et AnaÿsSvija est la création d'Andrew Swift, un designer et développeur américain qui vit en France depuis 2000 (Toulouse). De 2002 à 2008, Swift a développé Anaÿs≈, un outil qui a permis la construction de sites web indexables et modifiables par l'utilisateur en Flash, basés sur des fichiers Adobe Illustrator.Après la vente de son entreprise en 2010, Swift a quitté le domaine de la technologie, projetant de devenir un artiste à plein temps. En 2014, se rendant compte qu'une carrière dans les beaux-arts serait difficile à réaliser, il décide de revenir à l'infographisme.La fin de FlashAvec l'avènement de l'iPhone et la montée en puissance du web mobile, Flash n'était plus une option. La création de sites web était dès lors dominée par des outils de création de sites tels que Wordpress, Wix, Weebly et Squarespace.Swift, refusant d'accepter de travailler avec HTML, a commencé à chercher une solution vectorielle. Il est rapidement devenu évident qu'il n'y avait que deux alternatives largement prises en charge : l'élément HTML 5 Canvas et le format d'image SVG. SVG a été choisi car il inclut du texte référençable.Au départ, il n'était pas clair si le format SVG serait réellement utilisable pour créer des sites web. Divers problèmes sont apparus : les images liées n'apparaissaient pas correctement, tous les navigateurs ne pouvaient pas redimensionner dynamiquement le contenu SVG et le navigateur Safari redimensionnait le texte SVG de manière erratique.Ces problèmes et d'autres ont finalement été résolus. Les premiers sites web basés sur SVG ont été construits à la main, mais au cours de dix-huit mois en 2015-2016, le processus a été automatisé et Svija est né.Svija SASEn 2017, Swift s'est associé aux agences web One Cut Studio et Agence Takotak sur plusieurs sites web basés à Svija. En 2019, Jean-Philippe Juan et Badre Akaaboune, responsables de leurs agences respectives, ont proposé un partenariat afin de commercialiser Svija.Au départ, il a été décidé de rechercher un financement directement avant de faire connaître le programme. Cependant, il est rapidement devenu clair que la levée de fonds dépendrait de la capacité à montrer une base d'utilisateur-ices intéressés et croissante.Depuis janvier 2020, les efforts se sont concentrés sur la préparation d'une version bêta du logiciel Svija. Svija SAS a été officiellement créée en septembre 2020. N° 379, 2014 · Figure AssiseD'après « Studio di panneggio di una figura seduta » de Léonard da Vinci.Fusain et Carbothello sur papier marron Canson. 36,0 x 36,0 cm. ExemplesLes images suivantes renvoient aux pages Svija existantes qui présentent des fonctionnalités possibles uniquement avec les sites web SVG. Recréer ces pages serait impossible ou extrêmement laborieux en HTML. Alors que les sites web HTML se composent exclusivement de rangées de blocs de contenu rectangulaires de taille imprécise, les sites web SVG peuvent exploiter un contenu qui est :• incurvé• incliné• chevauché ou décalé• détaillé et positionné avec précision• tordu ou déformé• continu sur toute la page ozake.com≈ · antretoise.svija.site≈ · onecutstudio.com≈ · svija.love≈ Problèmes avec HTMLHTML est un descendant direct de Generalized Markup Language (GML) d'IBM, sorti en 1969. L'intention explicite du HTML a toujours été de décrire la structure d'un document sans en décrire l'apparence. Les caractéristiques par défaut du balisage HTML sont définies par le navigateur, pas par le standard HTML.Feuilles de style en cascadeDepuis 1996, les feuilles de style en cascade (Cascading Style Sheets ou CSS) sont utilisées pour fournir des règles de formatage standardisées pour l'affichage des pages. Séparation de mise en forme (CSS) et contenu (HTML), il est possible de présenter la même page dans différents styles pour différentes méthodes de présentation, comme à l'écran, en version imprimée, par voix (via navigateur basé sur la parole ou lecture d'écran), et sur les appareils tactiles en braille.Cependant, un effet secondaire de cette emphase est que graphiquement, HTML est resté extrêmement basique. À ce jour en 2020, HTML ne peut dessiner que :• textes• images • rectangles• lignes horizontalesDe plus, les navigateurs ne prennent pas tous en charge le CSS de la même manière ; la prise en charge de la fonctionnalité CSS n'est pas cohérente entre eux. Plusieurs techniques de codage ont été développées pour cibler des navigateurs spécifiques avec des solutions de contournement (communément appelées CSS hacks ou filtres CSS).Conception avec HTML et CSSPlus important encore, le processus de conception graphique avec HTML et CSS est extrêmement complexe :• une page web typique peut nécessiter plus de vingt balises HTML invisibles pour positionner une seule phrase • lorsqu'un élément est mal placé, il est difficile de savoir quelle balise HTML cachée en est responsable• positionnement d'un élément sur la page se fait par rapport aux autres éléments ; le déplacement d'un élément peut provoquer un effet d'entraînement sur toute la page• créer un contenu graphique continu sur une page entière est extrêmement fastidieux• simuler une forme autre qu'un rectangle nécessite la création d'une image de la forme souhaitéePar conséquent, la plupart des sites web sérieux sont développés via un processus où la conception initiale est adaptée pour Internet par un ou plusieurs développeurs qui la convertissent en différents blocs HTML et CSS.La dépendance vis-à-vis du HTML et du CSS signifie qu'à partir de 2020, la plupart des principaux sites web restent très simples et suivent une structure similaire : • le contenu est présenté en rangées de rectangles,• il y a peu ou pas de formes autres que des rectangles• quelques grandes images créent un intérêt graphiqueCeci est particulièrement évident lorsque tous les rectangles sont rendus visibles, comme on peut le voir dans cette vidéo≈.Exemple de HTML<html> <head>     <style>      p {color: red}     </style>   </head>   <body>     <p>       Ceci est un paragraphe avec du texte rouge.     </p>   </body> </html> SVG : format négligéLe format SVG, bien que plus stable et plus performante que HTML, n'a pas été adoptée pour la construction de contenu web en général. C'est le cas pour deux raisons.Le SVG n'est pas largement comprisTout comme le HTML, le format SVG prend en charge le style d'objet avec CSS, ainsi que des images et des polices liées en externe. Cependant, à l'exception d'Adobe Illustrator, aucun des outils disponibles pour la création de contenu SVG ne permet d'exploiter ces fonctionnalités.Les programmes qui ne prennent pas en charge les images et les polices liées décomposent les images et les polices en données intégrées au SVG. Par conséquent, la réutilisation d'une seule image ou police à plusieurs endroits n'est pas possible et la sélection ou l'indexation de texte n'est pas possible. Le SVG est rendu comme une image sans contenu interne discret et ne peut pas être considéré comme une véritable page web.La perception populaire du SVG est qu'il s'agit d'un format extrêmement utile pour les logos, les icônes et les illustrations, mais pas pour le contenu web général.La difficulté d'expérimenter avec SVGUne deuxième raison pour laquelle le format SVG a été largement ignoré pour le contenu web est que si il est possible de commencer à utiliser HTML en entrant quelques balises dans un simple éditeur de texte, l'écriture de code SVG nécessite un programme spécialisé pour commencer. Puisque le navigateur gère la mise en page d'une page HTML, le contenu utilisable peut être créé avec un minimum d'effort. L'investissement en temps et en énergie nécessaire pour expérimenter la création de sites web est essentiellement nul pour le HTML et relativement élevé pour le SVG.Adobe IllustratorAdobe Illustrator est le seul programme capable de créer du contenu web réel au format SVG. Cependant, bien que capable de générer des fichiers SVG utilisables, Illustrator ne propose aucun outil pour gérer ces fichiers ou les présenter au format de page web. Et, comme les fichiers SVG créés par Illustrator ne sont pas spécifiquement destinés à une utilisation sur Internet, ils contiennent des détails d'implémentation problématiques qui doivent être corrigés avant de pouvoir être intégrés à un site web.De plus, Adobe Illustrator est un programme payant qui a la réputation d'intimider le nouveau venu.Exigences du programme d'édition pour utiliser SvijaCapacités nécessaires pour assurer la compatibilité de Svija :• application Mac• identités d’objet personnalisés (nécessaire pour animation)• styles CSS pour objets (nécessaires pour animation et affichage couleur Display P3)• liens vers images bitmap externes• liens vers images vectorielles externes• liens vers polices externesCapacités utiles pour la compatibilité Svija :• styles de texte réutilisables• guides de dessinLe seul programme de création SVG qui répond à tous les critères est Adobe Illustrator. La compatibilité avec Adobe Xd sera ajoutée, bien qu'il ne prenne pas en charge les images vectorielles liées ou les images avec des rapports hauteur / largeur modifiés.Les programmes suivants sont capables d'exporter des illustrations SVG, mais en septembre 2020 ne prennent pas en charge les liens vers des images ou des polices externes :Affinity Designer (Serif)Amadine≈ (Belight)Boxy SVG≈CorelDRAWInVision StudioLibreOffice DrawMicrosoft VisioOmnigraffleOpenOffice DrawSketchGravit Designer≈ ne prend pas en charge CSS feuilles de style ou ID d'objet.Inkscape et Sketsa nécessitent l'installation de frameworks tiers pour l'installation de macOS et seront pris en compte lors du développement d'une version PC de Svija.Exemple de SVG<svg height="100" width="100">   <circle cx="50" cy="50" r="40" stroke="black" stroke-width="1" />   <text x="0" y="15" fill="red">Exemple de texte</text> </svg> top: sRGB bottom: Display P3 Différence visible sur iPhone, iMac de septembre 2015 ou plus récent, ou un Macbook Pro d'octobre 2016 ou plus récent, dans Safari ou Firefox. Précision : le HTML a été créé avec l'intention que chaque navigateur dicte les détails du rendu de la page. Bien que les principaux navigateurs aient convergé vers une interprétation standard de CSS, il existe encore des différences significatives. Il a été difficile de créer un site web en HTML qui nécessite un alignement précis des différents éléments de la page.Le résultat a été que les concepteurs de sites web ont en grande partie abandonné l'idée de créer des sites web avec des contenus précis. Il est entendu que les éléments seront légèrement déplacés et la conception du site web en tient compte. Les sites web modernes souffrent tous d'un manque de détails - ce n’est plus la peine de créer des conceptions à l'alignement parfait.En revanche, le format SVG garantit que les éléments sont affichés exactement comme ils ont été créés, jusque dans les moindres détails. Pour la première fois, il est devenu avantageux d'investir des efforts dans la création de contenu précis et complexe : les concepteur-ices peuvent être sûrs que leur site web apparaîtra comme prévu, même sans le tester.Vitesse : les sites Svija se chargent extrêmement rapidement. Bien que l'ordinateur personnel moyen soit environ 5000 fois plus rapide en 2020 qu'il ne l'était en 1995 et qu'une connexion Internet typique soit environ 3500 fois plus rapide, il est encore extrêmement courant que les sites web prennent plusieurs secondes à se charger.Il y a plusieurs raisons à cela, mais trois facteurs importants sont :Complexité de la page : les sites web HTML modernes nécessitent un grand nombre d'éléments cachés pour placer correctement le contenu sur la page. Il est courant qu'une seule phrase soit maintenue en place par 20 à 30 rectangles cachés. La quantité de données nécessaire pour afficher une page web est disproportionnée par rapport à son contenu visible.Calcul de dessin : HTML oblige le navigateur à calculer le placement des objets sur la page conformément aux directives CSS. Afin de dessiner les éléments visibles, le navigateur doit d'abord prendre en compte les éléments cachés avec leurs directives CSS complexes, et calculer la page résultante.Mise en cache : la plupart des pages web nécessitent un calcul côté serveur avant d'être envoyées aux visiteur-euses. La mise en cache de page fait référence à la pratique de stocker ce contenu d'une manière qui évite la nécessité de répéter le même calcul chaque fois que la page est demandée. Bien que les principaux sites web d'entreprise mettent en œuvre des systèmes de mise en cache, cette technologie a été difficile à intégrer pour les concepteurs ayant moins de ressources.Svija aborde ces trois facteurs de la manière suivante:La complexité de la page est réduite en spécifiant directement l'emplacement de chaque élément ; aucun élément caché n'est nécessaire.Les calculs de dessin sont simplifiés car le format SVG inclut déjà le placement calculé de chaque élément sur la page.La mise en cache des pages est utilisée systématiquement sauf lorsque le contenu est consulté par l'administrateur du site.Le calcul nécessaire pour afficher correctement une page web a été déplacé du navigateur vers l'ordinateur du développeur-euses web, et le processus de construction de la page finale est effectué bien avant que le visiteur ne le demande. Bénéfices de SvijaLes principaux avantages de l'utilisation de Svija par rapport à d'autres types d'outil de construction de sites web sont la réduction du temps de développement et une meilleure expérience des visiteur-ses.Temps de développement réduitIl est possible de développer un site web Svija dans environ 20% du temps nécessaire pour créer un site web comparable en utilisant des méthodes traditionnelles.Conception rapide : plutôt que d'avoir à positionner tout le contenu à l'aide de simples rectangles, dont la plupart sont invisibles (comme c'est le cas avec HTML), Svija bénéficie de trente-cinq ans de développement de l'un des outils de conception graphique les plus puissants disponibles. L'objet est placée directement dans la position souhaitée, sans étapes intermédiaires.Élimination de la vérification et du débogage : HTML a été créé avec l'intention que les navigateurs déterminent la méthode correcte de dessin de chaque page. Par conséquent, les navigateurs dessinent les pages de manière légèrement différente. Une fois la page initiale construite en HTML, commence une longue étape de vérification et de débogage nécessaire pour s'assurer que la page s'affiche correctement.Il existe dix combinaisons de navigateur/plateforme avec une part de marché importante qui sont généralement prises en charge :• Windows : Internet Explorer, Edge, Chrome et Firefox• Mac : Safari, Chrome et FirefoxiPhone : Safari et Chrome• Android : ChromePour un site web important, il est nécessaire de vérifier le bon fonctionnement du site Internet sur chacune de ces combinaisons. Il est courant que les développeur-euses web disposent d'ordinateurs supplémentaires qui ne sont utilisés que pour la vérification du site web.L'avantage de Svija à cet égard est que les fichiers SVG sont affichés de manière identique sur toutes les plateformes; toute la phase de vérification est complètement éliminée.Amélioration de l'expérience du visiteurLes avantages pour les visiteur-euses d'un site Svija sont la richesse, la précision et la rapidité.Richesse : alors que HTML limite la conception des pages aux images, rectangles et lignes horizontales, le format SVG prend en charge toute la palette de la conception graphique professionnelle. Des techniques avancées sont non seulement possibles, mais relativement simples à mettre en œuvre, y compris les objets débordants et superposés, les objets tordus ou déformés, la continuité sur toute la page, les courbes et la transparence, les objets inclinés et les dégradés.Outre les avantages de contenu dus à l'utilisation d'Adobe Illustrator et du format SVG, Svija est le seul constructeur de sites web à prendre en charge la gamme de couleurs Display P3, qui permet des couleurs beaucoup plus riches que le site web typique.Pour voir la différence, veuillez consulter cette page sur un iPhone, iMac de septembre 2015 ou plus récent, ou un Macbook Pro d'octobre 2016 ou plus récent, dans Safari ou Firefox. Limitations de SvijaBien que la plupart de ces problèmes soient résolus dans les versions futures, la version actuelle de Svija est limitée dans l'implémentation des types de contenu suivants :Intégration de base de données : il n'est actuellement pas possible d'inclure du contenu tiré d'une base de données. Contenu étendu: la gestion des menus pour de grands ensembles de pages peut être compliquée.Pages à forte intensité de texte : Svija a été conçu pour un contenu avec une forte composante graphique. Les pages qui contiennent de grandes quantités de texte qui doivent être régulièrement modifiées peuvent prendre du temps à entretenir.Formulaires : Svija intègre les formulaires via les pages d'administration du CMS. Cependant, les formulaires complexes ou de plusieurs pages peuvent prendre du temps à créer et à gérer.Intégration avec d'autres technologies web : le fait que Svija représente une rupture radicale avec le paradigme web existant signifie que l'intégration avec d'autres technologies, comme MeteorJS, peut être difficile.Intégration de la publicité : les plateformes publicitaires qui nécessitent une intégration côté serveur ne peuvent actuellement pas être intégrées aux sites web de Svija. Svija a déclaré que c’était considéré comme une fonctionnalité et non comme une limitation.Contenu multiplateforme : le contenu destiné à être visualisé sur une plus grande variété de plateformes que d'habitude (par exemple, des écrans de montres ou d'automobiles) peut être difficile à mettre en œuvre.Intégration du e-commerce : l'intégration nécessite actuellement la création d'un site web hybride avec un composant HTML traditionnel et un composant SVG.Redistribution de contenu : Svija ne prend pas en charge la redistribution du contenu. On s'attend à ce que le contenu des différentes plateformes soit défini par différents documents sources.SolutionsIl existe deux types de solutions à ces problèmes disponibles pour les utilisateurs actuels de Svija :Javascript : Svija permet une intégration étendue avec Javascript dans diverses formes réutilisables, et beaucoup de ces limitations peuvent être résolues avec la programmation, incluse soit sur des pages ou des sections spécifiques du site Internet.Hybridation : de nombreux sites web peuvent raisonnablement être divisés en une partie vitrine et une ou plusieurs parties fonctionnelles. Dans ces cas, il peut être efficace d'utiliser des sous-domaines pour créer un site Svija pour la partie vitrine et des sites web traditionnels pour les parties fonctionnelles.Les futures versions de Svija incluront des fonctionnalités de plugin et ces limitations seront résolues techniquement.t Responsive web designUn site web réactif est une approche de la conception web qui permet à une seule page web d'être rendue différemment sur des appareils et tailles d'écran variables.L'intention est de simplifier le processus de création d'un site web en utilisant la séparation HTML du contenu et du style pour réutiliser le même contenu dans différents contextes avec des directives de style différentes.Cependant, la redistribution des versions du même contenu en fonction de la plate-forme a de graves conséquences sur le processus de conception.Avant même d'envisager des options réactives, la conception de sites web HTML se limite à des rectangles, des images et du texte cachés. Lorsque le contenu est déplacé automatiquement en fonction du navigateur, il devient extrêmement difficile de créer des pages dont le rendu est prévisible, sans parler de fournir une expérience riche ou complexe.La philosophie de SvijaPratiquement tous les constructeurs de sites web incluent des options pour créer des sites web responsifs. Dans la plupart des cas, les développeurs-ses utilisent ces options pour créer deux versions : une version de bureau et une version mobile. Divers éléments peuvent également apparaître ou être déplacés en fonction des dimensions exactes de l'écran.Svija est destiné aux sites web où le créateur-ices de contenu souhaitent avoir un contrôle total sur la page finale. Par conséquent, une version fixe distincte de chaque page est créée pour chaque version du site web. Dans la plupart des cas, cela signifie une version de bureau et une version mobile. Bien que la création de versions distinctes pour différentes plateformes puisse sembler un sacrifice, la réalité est que la plupart des entreprises qui se soucient de fournir une expérience mobile solide construisent déjà des sites web mobiles distincts. Et, contrairement aux sites web HTML, les sites web Svija sont définis en unités Rem et s'adaptent automatiquement à la taille de la fenêtre du navigateur.La construction de pages web est tellement plus rapide à l'aide de fichiers locaux dans Adobe Illustrator que dans un constructeur de site web en ligne, que même avec la création de versions séparées, la construction de site web à Svija prend environ 60 à 80% de temps en moins que dans un constructeur de site web.Deux versions et demieLa plupart des visiteurs-ses du site web se répartissent en trois catégories faciles à définir :• bureau• mobile • tablettePlutôt que de créer des pages adaptatives difficiles à concevoir, Svija peut répondre aux besoins de presque tous les visiteurs avec deux versions et demi d'un site web :• version bureau pour trackpad / souris• version mobile pour finger• version tablette pour doigt = contenu bureau + menus mobiles L’utilisation de Svija ne nécessite pas de respecter cette philosophie, mais le contenu initial du didacticiel est configuré de cette manière.Mises à jour futuresAu cours de la phase bêta du développement, il n'est pas possible de créer une page Svija qui redistribue du contenu automatiquement. Cependant, des mises à jour du CMS Svija permettront aux versions futures de Svija d'inclure des options pour redistribuer automatiquement le contenu. Le résultat sera des pages Svija qui se chargent avec une rapidité extrême tout en étant adaptées à n'importe quel écran. Le RemSvija est unique parmi les website builder car les pages web sont continuellement adaptées à la largeur de la fenêtre du navigateur. Les éléments d'une page ne sont pas décalés ou repositionnés pour des fenêtres de tailles différentes. Au contraire, le contenu change de taille avec la fenêtre.Cet effet est rendu possible par l'utilisation du Rem pour positionner les éléments de la page.Traditionnellement, les pages web sont créées à l'aide d’unité de pixels. Le contenu défini par des pixels ne s'adapte pas à l'ordinateur avec lequel il est visualisé. Une page de 1000 pixels de large remplira presque un écran de 1024 pixels de large et couvrira moins de la moitié d'un écran de 2560 pixels de large.Rem : cadratin de racineEn typographie, les lettres sont mesurées en cadratins (« Em » en anglais) : la largeur de la lettre M. De cette façon, divers aspects d'un texte peuvent être décrits de façon cohérente, quelle que soit la taille de police.Sur Internet, le cadratin ou Em s'utilise de la même manière : elle mesure différents aspects du texte sans tenir compte de la taille de la police.Cependant, étant donné que le cadratin est défini différemment pour chaque élément de la page, le Rem (Root Em) a été créé pour décrire la taille de police par défaut pour la page globale. Contrairement à l'Em, le Rem est constant dans tout le document.Svija utilise le Rem pour décrire la taille et la position de tous les éléments de la page. Lorsque la fenêtre est redimensionnée, la définition Rem est mise à jour en même temps afin que le contenu s'adapte parfaitement à la fenêtre. AccessibilitéL’utilisation du format SVG présente certains défis dans la création des sites web accessibles.Bien que le texte d'un fichier SVG soit lisible par une technologie d'assistance (lecteurs d'écran), il peut être interrompu ou présenté dans le désordre.Adobe Illustrator stocke le texte dans l'ordre dans lequel il est dessiné. Les éléments en arrière-plan sont dessinés avant les éléments au premier plan.Lorsque les éléments ne se chevauchent pas, il est facile pour le concepteur-ices, par exemple, de placer un titre devant le paragraphe suivant sans le remarquer.Dans le SVG exporté, le titre suivra le paragraphe qu'il est censé précéder.Un problème temporaireSvija est orienté vers la création de sites web en SVG car actuellement, le seul moyen de créer du contenu SVG est d'utiliser Adobe Illustrator.Cependant, HTML présente de nombreux avantages dans le traitement du texte, et les futures versions de Svija évolueront vers un modèle hybride dans lequel HTML est utilisé pour le contenu textuel et SVG est utilisé pour le contenu décoratif.La construction de la page restera similaire au processus existant, mais la conversion d'un document en SVG créera un document en couches contenant à la fois des éléments SVG et HTML.Une fois que les documents hybrides seront possibles, il n'y aura plus de problème d'accessibilité.Solutions d'accessibilitéSvija a été critiquée≈ pour créer des sites web entièrement SVG. Il est rapidement apparu que des solutions étaient nécessaires pour que le projet avance.Pendant la période intermédiaire avant que le contenu hybride ne devienne possible, Svija a proposé deux solutions pour répondre à la question d'accessibilité : champ d'accessibilité dans le CMS Svija : pendant la phase bêta, il y a un champ de texte disponible dans la page d'administration où le concepteur-ices peuvent saisir des textes qui rendraient le site plus accessiblescript pour corriger l'ordre du texte : Svija Tools ajoutera un script qui permet de réorganiser automatiquement tout le texte de la page pour s'assurer qu'il est accessible aux lecteurs d'écranLe contexteLe passage du HTML au SVG pour la construction de sites web représente un changement de paradigme dans la construction d'Internet. C'est un changement nettement plus important que le passage de la télévision en noir et blanc à la télévision couleur.Alors que l'accessibilité est une priorité, Svija a été clair que l'absence initiale d'une solution parfaite n'est pas une raison pour différer une transition vers le SVG.C'est en poursuivant la transition vers le SVG que de meilleures solutions d'accessibilité seront créées. Moteurs de rechercheLes sites web de Svija sont construits presque exclusivement au format SVG. L'utilisation intensive du SVG a des conséquences sur l'optimisation pour les moteurs de recherche.TexteLe texte à l'intérieur d'une balise SVG est indexé normalement, mais peut apparaître brouillé. L'ordre du texte dépend de la profondeur de l'objet texte dans le document Adobe Illustrator : dans le fichier SVG final, les éléments plus profonds apparaissent avant les éléments plus superficiels.Une future mise à jour de Svija Tools introduira une option pour réorganiser automatiquement le texte dans Adobe Illustrator dans le cadre du processus d'exportation d'un fichier au format SVG.LiensJusqu'en août 2016, Google n'a pas suivi les liens à l'intérieur d'une balise SVG. La prise en charge de Google pour le contenu SVG s'est constamment améliorée au fil du temps. Des recherches sont en cours pour déterminer si les liens SVG sont actuellement suivis.En attendant, pour s'assurer que les pages Svija sont correctement indexées, le Svija backend insère automatiquement des liens HTML entre les pages.Contexte structurelPour comprendre comment indexer des sites complexes, Google dépend du contexte fourni par les balises HTML. Le texte d'une balise H1 (titre) est considéré comme plus important que le texte d'une balise P (paragraphe).Par défaut, tout le texte d'une page Svija a la même importance. Il n'y a pas de disposition dans le format SVG pour différencier les différents éléments structurels du texte. C'est en fait la force du SVG par rapport au HTML : les concepteur-ices décident de ce qui est important et prennent la décision finale sur l'importance de chaque élément tout au long du processus de conception.Étant donné que Svija n'est pas destiné à la création de sites web extensifs basés sur du texte, le manque de structure contextuelle n'est pas considéré comme une limitation. À l'avenir, avec la sortie de Svija Design et des pages hybrides HTML/SVG, la question de la structure du texte sera résolue automatiquement.Mobile FirstGoogle a déclaré qu'à compter du 1 juillet 2019, le référencement mobile-first≈ sera appliquée à tous les nouveaux sites web. Ce n'est pas une limitation de Svija, mais c’est inclus ici pour rappeler qu'il est particulièrement important de créer une version mobile substantielle de chaque site. AnimationSvija dépend de la bibliothèque d’animation GSAP≈ pour l'animation. GSAP (GreenSock Animation Platform) est une bibliothèque d'animation complète Javascript qui est utilisée par Amazon, Adobe et Google entre autres.Au départ, les animations sont programmées en Javascript. L'animation dépend de l'ID d'objet SVG attribué par Adobe Illustrator dans le panneau Calques :• objet déclencheur • objet cibleTout d'abord, le script définit l'objet déclencheur qui écoutera l'événement déclencheur :obj = document.getElementById('objet déclencheur'); obj.addEventListener('mouseover', playAnim);Ensuite, l'animation est définie :var myAnim=new gsap.timeline ({paused:true}); function playAnim(){ myAnim.play(); }Lorsque les mouvements inclus dans l'animation sont définis :myAnim.to('#objet cible', 1.0, {scale:2.0}); myAnim.to('#objet cible', 1.0, {x:'+=5.0'});Comprendre ces deux transformations :myAnim.to · mouvement vers un état final, par opposition à à partir d'un état initial# · l'objet ayant l'id…1.0 · durée de la transformation en secondesscale:2.0 · augmenter l'échelle de l'objet d'un facteur de deuxx:'+ = 5,0' · déplacer l'objet vers la droite de 5 REM ou 50 pixelsLe laboratoire d'animationLa version bêta de Svija nécessite l'écriture d'animations à la main mais il est entendu que tous les concepteurs peuvent ne pas être à l'aise avec la programmation nécessaire.Bien que divers scripts pré-écrits soient disponibles, le laboratoire d'animation fournira une assistance croissante dans le développement d'animations complexes :• sélection du déclencheur et des objets cibles• définition de séries de mouvements• synchronisation de l'animation Gestion de texteHTML a été conçu dans le but d'être utile pour gérer de grandes quantités de texte et que le texte soit lisible par une machine. Il excelle dans cette tâche : les balises HTML fournissent des informations importantes sur la structure et le contenu d'une page qui permettent aux pages d'être indexées et catégorisées automatiquement, notamment par Google.Le fait que le texte HTML soit stylé conformément aux règles CSS signifie que le contenu peut être automatiquement redistribué en fonction de la plate-forme sur laquelle il est affiché : conception web réactive.Ces deux qualités dépendent de calculs externes à la page : l'intention structurelle est interprétée par les ordinateurs de Google, et l'affichage de la page est déterminé par des calculs effectués par le navigateur de l'utilisateur-ice.En revanche, le format SVG dispose d'outils de gestion de texte extrêmement limités. Il n'y a pas de balises pour les différents éléments structurels et il n'y a pas de retour à la ligne automatique. Tous les calculs, y compris la division du texte en plusieurs lignes et son positionnement correct, sont effectués lors de la création du SVG.Les pages SVG présentent des avantagesLa philosophie de Svija est qu'en déplaçant le calcul inhérent à la création de contenu web du navigateur vers l'ordinateur des concepteur- ices, des gains importants peuvent être réalisés en termes de liberté de créativité, de temps passé à créer et, surtout, de temps passé à vérifier le résultat. La vérification après conception a été presque complètement éliminée dans la construction des sites web de Svija.Pour ces raisons, l'utilisation du format SVG est considérée comme une avancée importante même si elle implique de sacrifier temporairement certaines des qualités utiles du contenu HTML.Les pages hybrides SVG/HTML sont la solution à long termeParce que Adobe Illustrator est le seul outil de création de SVG actuellement capable de créer du contenu web, il a été nécessaire de travailler dans les limites du format Adobe SVG pour lancer Svija. Il ne s'agit pas actuellement d'exporter un fichier d'Adobe Illustrator qui combine du contenu HTML et SVG.Cependant, cette situation est temporaire. La sortie de Svija Design permettra aux sites web de bénéficier du meilleur du SVG et du HTML. SVG sera utilisé dans la mesure du possible, et HTML sera utilisé pour afficher le contenu du texte avec toutes les informations structurelles utiles.Bien que la redistribution du texte dans le navigateur ne soit pas possible au départ, les futures versions de Svija Design permettront la redistribution du contenu grâce à des améliorations côté serveur du CMS Svija. Svija StoreUne fois que le programme bêta a réussi son cours, la boutique Svija permettra aux utilisateur-ices de Svija d'acheter des thèmes et des plugins.Thèmes SvijaLa vente de thèmes offre trois avantages importants :• Étant donné que l'utilisation d'Adobe Illustrator pour créer des pages Web permet une liberté d'expression unique, il a été reconnu dès le début que les concepteur-ices auraient besoin d'un certain niveau de conseils afin d'éviter de reproduire les problèmes rencontrés avec Adobe Flash. Les ventes de thèmes aideront Svija à offrir une expérience visiteur cohérente. • La vente de thèmes constituera une importante source de revenus pour l'entreprise.• Les ventes de thèmes fourniront une importante source de revenus aux concepteur-ices de thèmes, bénéficiant indirectement à Svija grâce à la création d'un écosystème florissant.Pour être présentés sur la boutique Svija, les thèmes devront être conçus conformément aux directives de l'interface humaine Svija.Plugins SvijaAvant même de lancer la version bêta de Svija, il était évident que pour avoir un impact sérieux sur Internet, Svija devait dépasser la capacité de créer des sites Web simples et statiques.La solution à cette limitation sera l'introduction d'une API de plugin en tandem avec une offre de plugin initiale qui étendra considérablement les fonctionnalités de Svija. Les plugins proposés incluent :• e-commerce et gestion des produits• une fonctionnalité de formulaire étendue• gestion des liens• gestion de référencement• gestion de texte• réservation et gestion de calendriers L'avenir de SvijaSvija est actuellement en version bêta et se compose de quatre éléments relativement simples :1. Svija Sync : un script bash pour Mac2. Adobe Illustrator3. Svija Tools : ActionScripts pour Adobe Illustrator4. Svija Admin : un système de gestion de contenu basé sur le WebÀ mesure que Svija évoluera, chacun de ces éléments subira une transformation importante.Svija Sync : Svija Sync sera réécrit comme une application de synchronisation à part entière pour Mac et PC, avec des options de collaboration et de gestion des versions inspirées de Github.Adobe Illustrator : Illustrator a été choisi car c'est le seul programme prêt à l'emploi capable de créer des fichiers SVG (presque) prêts pour le Web.Cependant, Svija Design remplacera à un moment donné Illustrator. Intégrant à la fois HTML et SVG dans la création de pages, il sera bien mieux adapté à la création de contenus web complexes et dynamiques. Bien que la version initiale soit relativement simple, à l'instar de Pages by Apple, des fonctionnalités plus complexes seront ajoutées au fur et à mesure du développement du programme.Svija continuera à travailler avec Adobe Illustrator, qui est particulièrement adapté à la création de contenu graphiquement complexe.Svija Tools : actuellement une collection d'Actions scripts (programmés en Javascript), Svija Tools sera réédité sous forme de plugin Adobe Illustrator multiplateforme. Le changement offrira plusieurs avantages :• accélération du workflow• meilleure intégration de contenu HTML• outils supplémentaires d'optimisation de contenu pour le web• installation facilitéeSvija Admin : il y a beaucoup améliorations prévues, notamment :• laboratoire d'animation pour faciliter la création de GSAP• assemblage et partage de pages et de modules• optimisation des images• sauvegardes automatiques, intégrées dans le processus de synchronisation• meilleurs outils pour coordonner le contenu multilingue• options d'accessibilité• options réactives automatisées Articles connexesCadratinFeuilles de style en cascadeHypertext Markup LanguagePlateforme de création de site webScalable Vector Graphics• Site web réactifStandard Generalized Markup Language Liens externesSite web officiel≈Site web de documentation≈Svija≈ sur BēhanceSvija≈ sur FacebookSvija≈ sur GithubSvija≈ sur InstagramSvija≈ sur TwitterSvija≈ sur YoutubeL'unité rem sur Adfab≈Developper un site web entier avec SVG≈ sur Stack Overflow VISIT ON MOBILE · 34 RUE JEAN GIRAUDOUX · 03300 CUSSET · FRANCE CONTACT@SVIJA.LOVE EMAIL IMAGINEZWTF ENTREZESSAYEZ ACCEPTER LES COOKIES ?NON OUI ? Votre choix d'aura aucune incidence sur la qualité de votre expérience.