[vc_row][vc_column width= »1/4″ el_class= »expertise-btns » css= ».vc_custom_1530300247063{background-color: #ffffff !important;} »][vc_raw_html]JTNDYSUyMGNsYXNzJTNEJTIyYnRuLXNraWxsJTIwdG91dGVzLWV4cGVydGlzZXMlMjIlMjBocmVmJTNEJTIyJTJGd2ViZGVzaWduZXItcHJlc3RhdGlvbnMlMkZzaXRlLWludGVybmV0JTJGJTIzZXhwZXJ0aXNlcyUyMiUyMGl0ZW1wcm9wJTNEJTIydXJsJTIyJTIwdGl0bGUlM0QlMjJFeHBlcnRpc2VzJTIyJTNFJTNDc3BhbiUyMGl0ZW1wcm9wJTNEJTIybmFtZSUyMiUzRVRvdXRlcyUyMG1lcyUyMGV4cGVydGlzZXMlM0MlMkZzcGFuJTNFJTNDJTJGYSUzRSUwQSUzQ2JyJTNFJTBBJTNDYSUyMGNsYXNzJTNEJTIyYnRuLXNraWxsJTIyJTIwaHJlZiUzRCUyMiUyRndlYmRlc2lnbmVyLXByZXN0YXRpb25zJTJGZXhwZXJ0aXNlLXdlYmRlc2lnbiUyRiUyMiUyMGl0ZW1wcm9wJTNEJTIydXJsJTIyJTIwdGl0bGUlM0QlMjJXZWJkZXNpZ24lMjIlM0UlM0NzcGFuJTIwaXRlbXByb3AlM0QlMjJuYW1lJTIyJTNFV2ViZGVzaWduJTNDJTJGc3BhbiUzRSUzQyUyRmElM0UlMEElM0NiciUzRSUwQSUzQ2ElMjBjbGFzcyUzRCUyMmJ0bi1za2lsbCUyMGJ0bi1za2lsbC1hY3RpdmUlMjIlMjBocmVmJTNEJTIyJTJGd2ViZGVzaWduZXItcHJlc3RhdGlvbnMlMkZleHBlcnRpc2UtaW50ZWdyYXRpb24taHRtbC1jc3MtanMlMkYlMjIlMjBpdGVtcHJvcCUzRCUyMnVybCUyMiUyMHRpdGxlJTNEJTIySW50JUMzJUE5Z3JhdGlvbiUyMiUzRSUzQ3NwYW4lMjBpdGVtcHJvcCUzRCUyMm5hbWUlMjIlM0VJbnQlQzMlQTlncmF0aW9uJTIwJTI4SFRNTCUyQyUyMENTUyUyQyUyMEpTJTI5JTNDJTJGc3BhbiUzRSUzQyUyRmElM0UlMEElM0NiciUzRSUwQSUzQ2ElMjBjbGFzcyUzRCUyMmJ0bi1za2lsbCUyMiUyMGhyZWYlM0QlMjIlMkZ3ZWJkZXNpZ25lci1wcmVzdGF0aW9ucyUyRmV4cGVydGlzZS11eC1ldC11aSUyRiUyMiUyMGl0ZW1wcm9wJTNEJTIydXJsJTIyJTIwdGl0bGUlM0QlMjJVWCUyMGV0JTIwVUklMjIlM0UlM0NzcGFuJTIwaXRlbXByb3AlM0QlMjJuYW1lJTIyJTNFVVglMjBldCUyMFVJJTNDJTJGc3BhbiUzRSUzQyUyRmElM0UlMEElM0NiciUzRSUwQSUzQ2ElMjBjbGFzcyUzRCUyMmJ0bi1za2lsbCUyMiUyMGhyZWYlM0QlMjIlMkZ3ZWJkZXNpZ25lci1wcmVzdGF0aW9ucyUyRnNpdGUtaW50ZXJuZXQlMkZzaXRlLW1vYmlsZS1yZXNwb25zaXZlLWRlc2lnbiUyRiUyMiUyMGl0ZW1wcm9wJTNEJTIydXJsJTIyJTIwdGl0bGUlM0QlMjJSZXNwb25zaXZlJTIwZGVzaWduJTIyJTNFJTNDc3BhbiUyMGl0ZW1wcm9wJTNEJTIybmFtZSUyMiUzRVJlc3BvbnNpdmUlMjBkZXNpZ24lM0MlMkZzcGFuJTNFJTNDJTJGYSUzRSUwQSUzQ2JyJTNFJTBBJTNDYSUyMGNsYXNzJTNEJTIyYnRuLXNraWxsJTIyJTIwaHJlZiUzRCUyMiUyRndlYmRlc2lnbmVyLXByZXN0YXRpb25zJTJGZXhwZXJ0aXNlLXJlZmVyZW5jZW1lbnQtc2VvJTJGJTIyJTIwaXRlbXByb3AlM0QlMjJ1cmwlMjIlMjB0aXRsZSUzRCUyMlIlQzMlQTlmJUMzJUE5cmVuY2VtZW50JTIyJTNFJTNDc3BhbiUyMGl0ZW1wcm9wJTNEJTIybmFtZSUyMiUzRVIlQzMlQTlmJUMzJUE5cmVuY2VtZW50JTIwbmF0dXJlbCUzQyUyRnNwYW4lM0UlM0MlMkZhJTNFJTBBJTNDYnIlM0UlMEElM0NhJTIwY2xhc3MlM0QlMjJidG4tc2tpbGwlMjIlMjBocmVmJTNEJTIyJTJGd2ViZGVzaWduZXItcHJlc3RhdGlvbnMlMkZleHBlcnRpc2UtY21zJTJGJTIyJTIwaXRlbXByb3AlM0QlMjJ1cmwlMjIlMjB0aXRsZSUzRCUyMkNNUyUyMiUzRSUzQ3NwYW4lMjBpdGVtcHJvcCUzRCUyMm5hbWUlMjIlM0VDTVMlM0MlMkZzcGFuJTNFJTNDJTJGYSUzRQ==[/vc_raw_html][/vc_column][vc_column width= »3/4″ css= ».vc_custom_1530363442320{padding-left: 50px !important;} »][vc_column_text el_class= »texte-expertises » css= ».vc_custom_1533638170470{padding-bottom: 20px !important;} »]
L’intégration est la transposition du webdesign en code informatique. Concrètement, je prends la maquette validée du site et la transforme en langage HTML, CSS et JavaScript via un éditeur de texte (généralement Notepad++). Chaque choix graphique sera transformé en ligne de code.
L’avantage de faire appel à un webdesigner freelance comme moi, c’est que j’ai la double casquette de designer et de développeur intégrateur. Je comprends l’intégration et ses contraintes aussi bien que le design.
Techniquement, comment ça se passe ?
Dans un premier temps, j’organise mes fichiers dans des dossiers (images, vidéos, html, styles…). J’ouvre ensuite mon éditeur de texte et commence à créer des variables correspondant aux couleurs, niveaux de titres, boutons, polices etc. Ensuite, je reprends chaque page du design et l’intègre du haut vers le bas.
Si vous avez vu le film Matrix, c’est un peu comme ça, des lignes de code par milliers sur fond noir. Difficile pour un néophyte de comprendre ce qui se trame.
Une fois les pages intégrées, je vais faire en sorte que les pages s’adaptent aux différentes tailles d’écrans (grand écrans, tablettes, smartphone), c’est ce qu’on appelle le responsive design.
Ensuite, je me charge de la cross-comptabilité du site avec les différents navigateurs : Chrome, Firefox, Safari, Internet Explorer… Ces navigateurs ont tous des spécificités et des contraintes différentes qu’il faut prendre en compte dans l’intégration.
Une fois le site terminé, je vous l’envoie pour validation !
Si vous voulez connaître toutes les étapes d’un projet web, cliquez ici.
[/vc_column_text][/vc_column][/vc_row][vc_row bg_type= »grad » bg_override= »ex-full » bg_grad= »background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FBBCB5), color-stop(16%, #E8AAC6), color-stop(30%, #E8AAC6), color-stop(46%, #CEBEDF), color-stop(69%, #99C9EC));background: -moz-linear-gradient(140deg,#FBBCB5 0%,#E8AAC6 16%,#E8AAC6 30%,#CEBEDF 46%,#99C9EC 69%);background: -webkit-linear-gradient(140deg,#FBBCB5 0%,#E8AAC6 16%,#E8AAC6 30%,#CEBEDF 46%,#99C9EC 69%);background: -o-linear-gradient(140deg,#FBBCB5 0%,#E8AAC6 16%,#E8AAC6 30%,#CEBEDF 46%,#99C9EC 69%);background: -ms-linear-gradient(140deg,#FBBCB5 0%,#E8AAC6 16%,#E8AAC6 30%,#CEBEDF 46%,#99C9EC 69%);background: linear-gradient(140deg,#FBBCB5 0%,#E8AAC6 16%,#E8AAC6 30%,#CEBEDF 46%,#99C9EC 69%); » css= ».vc_custom_1529184817069{padding-top: 50px !important;padding-bottom: 50px !important;} »][vc_column][ultimate_heading main_heading= »Besoin d’un site internet ? » heading_tag= »div » main_heading_color= »#ffffff » sub_heading_color= »#ffffff » main_heading_margin= »margin-bottom:20px; » sub_heading_margin= »margin-bottom:10px; » main_heading_font_size= »desktop:45px; » sub_heading_font_size= »desktop:20px; » margin_design_tab_text= » »]Je crée des sites web élégants et efficaces pour répondre à vos objectifs,
délivrer votre message et générer des prospects et de nouvelles affaires.[/ultimate_heading][vc_row_inner][vc_column_inner width= »1/3″][/vc_column_inner][vc_column_inner width= »1/3″ css= ».vc_custom_1529184896244{padding-top: 20px !important;} »][ult_buttons btn_title= »CONTACTEZ-MOI » btn_link= »url:https%3A%2F%2Farounie.fr%2Fdevis-gratuit-webdesigner-freelance-nice%2F||| » btn_align= »ubtn-center » btn_size= »ubtn-block » btn_title_color= »#dab4d5″ btn_bg_color= »#ffffff » btn_anim_effect= »ulta-push » btn_bg_color_hover= »#ffffff » icon= »Defaults-paper-plane-o send-o » icon_size= »32″ icon_color= »#dab4d5″ btn_icon_pos= »ubtn-sep-icon-at-left » btn_font_style= »font-weight:bold; » btn_font_size= »desktop:20px; »][/vc_column_inner][vc_column_inner width= »1/3″][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]
