{"id":219820,"date":"2020-05-14T00:00:00","date_gmt":"2020-05-13T22:00:00","guid":{"rendered":"https:\/\/blog.lewagon.com\/nao-categorizado\/5-steps-to-build-your-first-landing-page\/"},"modified":"2020-05-14T00:00:00","modified_gmt":"2020-05-13T22:00:00","slug":"5-steps-to-build-your-first-landing-page","status":"publish","type":"post","link":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/","title":{"rendered":"5 steps to build your first landing page"},"content":{"rendered":"","protected":false},"excerpt":{"rendered":"

Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!<\/p>\n","protected":false},"author":1,"featured_media":219821,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[146],"type_de_post":[],"post-format":[179],"class_list":["post-219820","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-skills","tag-web-pt-br","post-format-post-pt-br"],"acf":[],"acfml_non_translatable_locations":null,"_wp_attached_file":null,"_wp_attachment_metadata":null,"wpml_media_processed":null,"_elementor_inline_svg":null,"_elementor_source_image_hash":null,"_wp_attachment_image_alt":null,"_msc":null,"_elementor_is_screenshot":null,"_wp_attachment_context":null,"_oembed_4f1dc266c1e5b199d2e3668569863d35":null,"_wp_attachment_backup_sizes":null,"description_courte_du_cours":null,"_description_courte_du_cours":null,"sujets":null,"_sujets":null,"niveau":null,"_niveau":null,"duree":null,"_duree":null,"lien_externe_du_cours":null,"_lien_externe_du_cours":null,"_g_feedback_shortcode_8e54bebc0966bf7f9290fee5ef5e57c8a8c597c6":null,"_g_feedback_shortcode_atts_8e54bebc0966bf7f9290fee5ef5e57c8a8c597c6":null,"elementor_font_files":null,"elementor_font_face":null,"_elementor_location":null,"_elementor_priority":null,"_elementor_code":null,"_elementor_extra_options":null,"date_de_levent":null,"_date_de_levent":null,"heure_de_debut_de_levent":null,"_heure_de_debut_de_levent":null,"heure_de_fin_de_levent":null,"_heure_de_fin_de_levent":null,"time_zone":null,"_time_zone":null,"description_de_levent":null,"_description_de_levent":null,"format_du_cours":null,"_format_du_cours":null,"pre-requis":null,"_pre-requis":null,"langue_de_levent":null,"_langue_de_levent":null,"lien_externe_de_levent":null,"_lien_externe_de_levent":null,"_yoast_wpseo_primary_tag_events":null,"lieu_de_levent":null,"_lieu_de_levent":null,"_menu_item_type":null,"_menu_item_menu_item_parent":null,"_menu_item_object_id":null,"_menu_item_object":null,"_menu_item_target":null,"_menu_item_classes":null,"_menu_item_xfn":null,"_menu_item_url":null,"_omapi_type":null,"_omapi_ids":null,"_omapi_enabled":null,"_yoast_wpseo_content_score":null,"_pll_strings_translations":null,"_yoast_wpseo_primary_post_tag":null,"_yoast_wpseo_primary_type_de_post":null,"_yoast_wpseo_primary_post-format":null,"_oembed_e607e81f61090d85eabdabc743a27470":null,"_oembed_196c62ccee9fda191cd6fa5f568ddc05":null,"_oembed_6b5f28c0de48cbf3a2ad766be5eb3b30":null,"_oembed_082c4292f4cd0dedc40ae746a899501c":null,"om_disable_all_campaigns":null,"wpil_sync_report3":"1","_yoast_wpseo_focuskw":null,"_yoast_wpseo_linkdex":null,"_yoast_wpseo_opengraph-title":"5 steps to build your first landing page | Le Wagon","_yoast_wpseo_opengraph-description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","_yoast_wpseo_twitter-title":"5 steps to build your first landing page | Le Wagon","_yoast_wpseo_twitter-description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","wpil_links_inbound_internal_count":"0","wpil_links_inbound_internal_count_data":[],"wpil_links_outbound_internal_count":"0","wpil_links_outbound_internal_count_data":[],"wpil_links_outbound_external_count":"0","wpil_links_outbound_external_count_data":[],"wpil_sync_report2_time":"2023-08-11T09:31:56+00:00","gnpub_modified_count":null,"_encloseme":null,"_jetpack_memberships_contains_paid_content":null,"_oembed_df252bc3f21e94e550790f0a26013d33":null,"_oembed_7c25793225e5877909b9566a95c01f07":null,"_oembed_time_7c25793225e5877909b9566a95c01f07":null,"_oembed_c035311b2d37111892bc6336ad75c1a7":null,"_oembed_time_c035311b2d37111892bc6336ad75c1a7":null,"_yoast_wpseo_focuskw_text_input":"","_yoast_wpseo_opengraph-image":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg","_yoast_wpseo_twitter-image":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg","_bnitk_mfd_meta-robots-noindex":null,"_yoast_wpseo_meta-robots-noindex":null,"_bnitk_mfd_meta-robots-nofollow":null,"_yoast_wpseo_meta-robots-nofollow":null,"_oembed_9b38dff8e9475b390d223d1a13735d6e":null,"_oembed_09b03dce1da57707d8b400d6ead6cfea":null,"_oembed_time_09b03dce1da57707d8b400d6ead6cfea":null,"_oembed_761875ecd5d7c814e779a8a1669e3078":null,"_oembed_time_761875ecd5d7c814e779a8a1669e3078":null,"_oembed_60128998417fdcbaac97a635f5785efd":null,"_oembed_time_60128998417fdcbaac97a635f5785efd":null,"_oembed_bbc2c908fc7e611d82dce88119dc4350":null,"_oembed_time_bbc2c908fc7e611d82dce88119dc4350":null,"_oembed_5ada75a4373349f7b136423290505b3a":null,"_oembed_time_5ada75a4373349f7b136423290505b3a":null,"_oembed_086373a651e90a4eb1279fa1f945472c":null,"_oembed_time_086373a651e90a4eb1279fa1f945472c":null,"_wpml_post_translation_editor_native":null,"_oembed_5e24c29ce369f6b80c9eeec04f14665b":null,"_oembed_time_5e24c29ce369f6b80c9eeec04f14665b":null,"_oembed_8c3e7085f10b7c0fc5520e72277d797b":null,"_oembed_time_8c3e7085f10b7c0fc5520e72277d797b":null,"_oembed_1489782c3c8ef26605b6876b88f7bdda":null,"_oembed_time_1489782c3c8ef26605b6876b88f7bdda":null,"_oembed_0a3d659fc8de333aa903ab0b56018d23":null,"_oembed_time_0a3d659fc8de333aa903ab0b56018d23":null,"_oembed_d1585e059963c7dbe1909a198f64637b":null,"_oembed_da273c5e4d4993b38963204fa3018b68":null,"_oembed_time_da273c5e4d4993b38963204fa3018b68":null,"_oembed_a5e2c70342e4f17e48253b0a60b76258":null,"_oembed_time_a5e2c70342e4f17e48253b0a60b76258":null,"_oembed_83c8f84c43191797360817ecdc633650":null,"_oembed_time_83c8f84c43191797360817ecdc633650":null,"_oembed_e105b3463a1e23321ff3d1a9daf4ce77":null,"_oembed_1692f2329443bc1b18fc320e0d77cb4e":null,"_yoast_wpseo_schema_article_type":null,"_oembed_02bf1d274545a46fdad44828db802e9b":null,"_oembed_483efee027379bb1099137e135e60619":null,"_oembed_time_483efee027379bb1099137e135e60619":null,"_oembed_d9e3a2e55472c308a6d4f95f9859d57c":null,"_oembed_time_d9e3a2e55472c308a6d4f95f9859d57c":null,"_oembed_14a773041d4083fdc540105ccc635e1f":null,"_oembed_time_14a773041d4083fdc540105ccc635e1f":null,"_oembed_fd2c0295b311b878f43def139f693291":null,"_oembed_time_fd2c0295b311b878f43def139f693291":null,"_oembed_9e88339a75e081aa4aa002ac43b5917e":null,"_oembed_time_9e88339a75e081aa4aa002ac43b5917e":null,"_oembed_e58b2264fd34411178c5aead6e76fc0e":null,"_oembed_time_e58b2264fd34411178c5aead6e76fc0e":null,"_oembed_bddf29494cd341c273d2f25802785f3a":null,"_oembed_time_bddf29494cd341c273d2f25802785f3a":null,"_oembed_9fdc7ffbd7d1c456cb57323136bcf86d":null,"_oembed_time_9fdc7ffbd7d1c456cb57323136bcf86d":null,"_oembed_6882adf1f7ba34c40d8abda49c078862":null,"_oembed_time_6882adf1f7ba34c40d8abda49c078862":null,"_oembed_42ae0b6a999f98ed81c86edf9b80d360":null,"_oembed_time_42ae0b6a999f98ed81c86edf9b80d360":null,"_oembed_f4dcff6ba8f84f09cade790420ba4d80":null,"_oembed_time_f4dcff6ba8f84f09cade790420ba4d80":null,"_oembed_25071af9d5ecd73a9356fe5704bba4d8":null,"_oembed_time_25071af9d5ecd73a9356fe5704bba4d8":null,"_oembed_a86728f5efc0ca0642006bbb96f843cc":null,"_oembed_time_a86728f5efc0ca0642006bbb96f843cc":null,"_oembed_d7b5055b785ef8a0cf22c87d024bf2a4":null,"_oembed_time_d7b5055b785ef8a0cf22c87d024bf2a4":null,"_oembed_6a73e101cae7c3452b00a72cf0fc9b22":null,"_oembed_time_6a73e101cae7c3452b00a72cf0fc9b22":null,"_oembed_0aef478f0830cc2e857b9a150a7f763a":null,"_oembed_time_0aef478f0830cc2e857b9a150a7f763a":null,"_oembed_d1a3bdcdf10e4859560b01d910ad1120":null,"_oembed_time_d1a3bdcdf10e4859560b01d910ad1120":null,"_oembed_05ef2af36a31586761b7311d393d1df4":null,"_oembed_time_05ef2af36a31586761b7311d393d1df4":null,"_oembed_ed00fe1690bb2e86f1eb06acfe8a13e7":null,"_oembed_time_ed00fe1690bb2e86f1eb06acfe8a13e7":null,"_oembed_59ffcbf71f633752ca4f26b3b4a544c9":null,"_oembed_time_59ffcbf71f633752ca4f26b3b4a544c9":null,"_oembed_a7b688611478922544f14672fda18461":null,"_oembed_time_a7b688611478922544f14672fda18461":null,"_oembed_266f9a151e3a09eeee918af2d28fd24f":null,"_oembed_time_266f9a151e3a09eeee918af2d28fd24f":null,"_oembed_9f52726dd229470e47d40ff0c8aeb5f8":null,"_oembed_time_9f52726dd229470e47d40ff0c8aeb5f8":null,"_oembed_5547f713058fed19783e0533ce393a31":null,"_oembed_time_5547f713058fed19783e0533ce393a31":null,"_oembed_68ff8dd20e77e109ad084c2252ca040d":null,"_oembed_time_68ff8dd20e77e109ad084c2252ca040d":null,"_oembed_819f09a569080db91bf5dadda0a30d9f":null,"_oembed_time_819f09a569080db91bf5dadda0a30d9f":null,"_oembed_4fc081fbdf0afd05a624ba852a63e133":null,"_oembed_time_4fc081fbdf0afd05a624ba852a63e133":null,"_oembed_d66baf1301b99db8b19a0924319cf03e":null,"_oembed_time_d66baf1301b99db8b19a0924319cf03e":null,"_oembed_14a5f80e3eef4903e482b0ef3799659e":null,"_oembed_time_14a5f80e3eef4903e482b0ef3799659e":null,"_oembed_c24c715adb3853482526a794a5f3c3bb":null,"_oembed_time_c24c715adb3853482526a794a5f3c3bb":null,"_oembed_9c493e098be2852715cc990b6e6243f3":null,"_oembed_time_9c493e098be2852715cc990b6e6243f3":null,"_oembed_b60b7e3028d326711916099f54e986fa":null,"_oembed_time_b60b7e3028d326711916099f54e986fa":null,"_oembed_5283e19fcec44e632de8d436d46ec2f7":null,"_oembed_time_5283e19fcec44e632de8d436d46ec2f7":null,"_oembed_057692cb4479cf5c77363896a28db44f":null,"_oembed_time_057692cb4479cf5c77363896a28db44f":null,"_oembed_e8cb0f41d141fe5eb9d69fc32a98cd72":null,"_oembed_time_e8cb0f41d141fe5eb9d69fc32a98cd72":null,"_oembed_75dcbca80ec1829a77578390fae8fa56":null,"_oembed_time_75dcbca80ec1829a77578390fae8fa56":null,"_oembed_e49318dfeabd5f16d7967e2fcc746fbd":null,"_oembed_time_e49318dfeabd5f16d7967e2fcc746fbd":null,"_oembed_76116b03fe5a013341210d278021184b":null,"_oembed_time_76116b03fe5a013341210d278021184b":null,"_oembed_6c81e1c9b634b5066fb37aaccfd71053":null,"_oembed_time_6c81e1c9b634b5066fb37aaccfd71053":null,"_oembed_abbc1aa97e554f334c2ce25f0d883702":null,"_oembed_time_abbc1aa97e554f334c2ce25f0d883702":null,"_oembed_ba421363b36dd97c087665d5025396cf":null,"_oembed_time_ba421363b36dd97c087665d5025396cf":null,"_oembed_a98f236eb48eb9cd4ede7f319e9cfbc7":null,"_oembed_time_a98f236eb48eb9cd4ede7f319e9cfbc7":null,"_oembed_d61fec7d73397687995fec8d7bd9852f":null,"_oembed_time_d61fec7d73397687995fec8d7bd9852f":null,"_oembed_2e9e46a0176fe90e49cc5fff32ac6912":null,"_oembed_time_2e9e46a0176fe90e49cc5fff32ac6912":null,"_oembed_8a304f49b3aa1c3eec8d0b0577e05e3d":null,"_oembed_time_8a304f49b3aa1c3eec8d0b0577e05e3d":null,"_oembed_ad30824ca1e37cffdad2dbce46c4998a":null,"_oembed_time_ad30824ca1e37cffdad2dbce46c4998a":null,"_oembed_6c3dacc8273d4877c65378c1f324c9cc":null,"_oembed_time_6c3dacc8273d4877c65378c1f324c9cc":null,"_oembed_1d0e7d3c6d826ca1e56a24218abba6f2":null,"_oembed_time_1d0e7d3c6d826ca1e56a24218abba6f2":null,"_oembed_50929cd1300f7cdee57e6e5451afb186":null,"_oembed_time_50929cd1300f7cdee57e6e5451afb186":null,"_oembed_72dc139d079681a2c3d759a86af48ccc":null,"_oembed_time_72dc139d079681a2c3d759a86af48ccc":null,"_oembed_d359fdb1fa5da9e62dd3505937f46fb6":null,"_oembed_time_d359fdb1fa5da9e62dd3505937f46fb6":null,"_oembed_589d6065ccac39334963be5bd8656631":null,"_oembed_time_589d6065ccac39334963be5bd8656631":null,"_oembed_715be02b6ebadc1be6dd638a57d01eb7":null,"_oembed_time_715be02b6ebadc1be6dd638a57d01eb7":null,"_oembed_f5139a9df267d3aa532f5b56409c90b0":null,"_oembed_time_f5139a9df267d3aa532f5b56409c90b0":null,"_oembed_3d9a26be229b27005ca74596fb62cc08":null,"_oembed_time_3d9a26be229b27005ca74596fb62cc08":null,"_oembed_a7d6f0ce79de685fc6f7f4d447e15468":null,"_oembed_time_a7d6f0ce79de685fc6f7f4d447e15468":null,"_oembed_20849479e832b5312335e3086c5f972b":null,"_oembed_time_20849479e832b5312335e3086c5f972b":null,"_oembed_2be4d392f66846deb7624c1bf3bc293e":null,"_oembed_time_2be4d392f66846deb7624c1bf3bc293e":null,"_oembed_9bcf546ec292041d23df28a719840688":null,"_oembed_time_9bcf546ec292041d23df28a719840688":null,"_oembed_0858ffd7404bcd7d82896f942481fe63":null,"_oembed_time_0858ffd7404bcd7d82896f942481fe63":null,"_oembed_4a2dd0ecf082a7c7d82731c06a644799":null,"_oembed_time_4a2dd0ecf082a7c7d82731c06a644799":null,"_oembed_8a1e46bc730cb21c1085d157ae6fa8b6":null,"_oembed_time_8a1e46bc730cb21c1085d157ae6fa8b6":null,"_oembed_cae7deb931d75f809e459e912e71429a":null,"_oembed_time_cae7deb931d75f809e459e912e71429a":null,"_oembed_6fcb4f8ab72abccda75674f71a946f97":null,"_oembed_time_6fcb4f8ab72abccda75674f71a946f97":null,"_oembed_7f0bfd584f844117a64fe73d83b43245":null,"_oembed_time_7f0bfd584f844117a64fe73d83b43245":null,"_oembed_d0aea105cffdf6e004979cf1e4f51e96":null,"_oembed_time_d0aea105cffdf6e004979cf1e4f51e96":null,"_oembed_e53b85b8766b3dc91338f6c1b95a2541":null,"_oembed_time_e53b85b8766b3dc91338f6c1b95a2541":null,"_oembed_48832be87b763046d232c1f2b5ac5fb3":null,"_oembed_time_48832be87b763046d232c1f2b5ac5fb3":null,"_oembed_32a9a34fcf91c466be9a08e1dba3c84e":null,"_oembed_time_32a9a34fcf91c466be9a08e1dba3c84e":null,"_oembed_fb50b2dc07acfa2418f00cdc2ad4c4c2":null,"_oembed_time_fb50b2dc07acfa2418f00cdc2ad4c4c2":null,"_oembed_3089e1d62f944a73b38c996e49abd2fc":null,"_oembed_time_3089e1d62f944a73b38c996e49abd2fc":null,"_oembed_1ecc99e75cf5d001c8da4f4d600703a8":null,"_oembed_time_1ecc99e75cf5d001c8da4f4d600703a8":null,"_oembed_b9c03ca24b382c17966861d251dc3b8d":null,"_oembed_time_b9c03ca24b382c17966861d251dc3b8d":null,"_wp_trash_meta_status":null,"_wp_trash_meta_time":null,"_wp_desired_post_slug":null,"_oembed_031755ba22f2b639d88c78254a99ff39":null,"_oembed_time_031755ba22f2b639d88c78254a99ff39":null,"description_de_la_ressource":null,"_description_de_la_ressource":null,"titre_du_fichier":null,"_titre_du_fichier":null,"_edit_last":null,"_edit_lock":null,"_wp_old_slug":null,"_top_nav_excluded":null,"_cms_nav_minihome":null,"inline_featured_image":null,"_yoast_wpseo_estimated-reading-time-minutes":null,"_yoast_wpseo_wordproof_timestamp":null,"_wpml_media_duplicate":"1","_thumbnail_id":"219821","_wpml_media_featured":"1","_wpml_word_count":null,"_last_translation_edit_mode":null,"_last_editor_used_jetpack":null,"_elementor_edit_mode":null,"_elementor_template_type":null,"_wp_page_template":"default","_elementor_page_settings":null,"_elementor_data":null,"_elementor_page_assets":[],"_elementor_version":null,"_elementor_pro_version":null,"_elementor_elements_default_values":null,"_elementor_css":null,"_elementor_source":null,"_elementor_conditions":null,"_wpml_location_migration_done":null,"_elementor_controls_usage":null,"_elementor_screenshot_failed":null,"_elementor_screenshot":null,"_elementor_popup_display_settings":null,"_yoast_wpseo_primary_category":null,"_wp_old_date":null,"_elementor_template_widget_type":null,"_icl_lang_duplicate_of":null,"_yoast_wpseo_metadesc":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","_yoast_wpseo_title":"5 steps to build your first landing page | Le Wagon","contenu_de_larticle":"

\n O objetivo de uma landing page \u00e9 de promover sua marca e converter usu\u00e1rios em potenciais clientes. E a porta de entrada do seu site e da uma oportunidade de mostrar o que sua marca representa. A gente sabe o quanto primeiras impress\u00f5es contam, por isso sua landing page tem que ser clara, informativa e impactante. Com tanta coisa a pensar at\u00e9 mesmo antes de come\u00e7ar a programar, \u00e9 sempre dif\u00edcil saber por onde come\u00e7ar. Para ajudar, resumimos o processo em 5 etapas f\u00e1ceis de se seguir, para voc\u00ea poder construir sua primeira landing page hoje.\n
\n
\n<\/div>\n

Etapa 1. Fa\u00e7a o set up e desenha no papel.<\/strong><\/h2>\n
\n Ter o setup correto antes de codar \u00e9 muito importante. O setup n\u00e3o somente inclui baixar um bom editor de texto mas tamb\u00e9m planejar o desenho da sua p\u00e1gina. Nos recomendamos Sublime Text como editor de texto, porque tem umas features legais de auto completion e highlighting de sintaxe. Isso faz seu c\u00f3digo ser mas bonito, e codar mais f\u00e1cil. Em seguido, pense na estrutura da sua p\u00e1gina e como vai ser o look dela. Tente separar suas ideias em se\u00e7\u00f5es e desenhe esses blocos num papel para criar o esqueleto do que voc\u00ea esta construindo. Esse esbo\u00e7o r\u00e1pido vai ser muito \u00fatil na etapa 2. N\u00e3o esque\u00e7a de baixar um navegador bom tipo Chrome. Vai precisar disso para mostrar seu c\u00f3digo e testar para fazer corre\u00e7\u00f5es r\u00e1pidas. Abaixo \u00e9 um exemplo de esbo\u00e7o de esqueleto.\n \n
\n \n
\n Rough skeleton sketch\n <\/figcaption>\n <\/figure><\/a>\n<\/div>\n

Etapa 2. Da a vida a seu esqueleto<\/strong><\/h2>\n
\n
Mesmo se o HTML n\u00e3o \u00e9 o mais bonito sem o CSS, uma estrutura limpa \u00e9 importante para construir uma landing page bonita. O documento HTML \u00e9 dividido em 2 partes:  <head><\/head> e <body><\/body>. O <head> guarda a intelig\u00eancia da p\u00e1gina, enquanto o <body> guarda o conte\u00fado e a estrutura. Para uma estrutura limpa, cada se\u00e7\u00e3o do esqueleto\/esbo\u00e7o deveria ser encapsulado na pr\u00f3pria tag <div>. Podem adicionar classes a essas tag <div>, para poder chamar elas individualmente com estilo CSS especifico. (Estilo sera abordado na Etapa 4!). Lembrem de usar tags de header e par\u00e1grafos quando adicionar seu texto. Isso adiciona estrutura ao seu conte\u00fado e da relevo aos elementos de texto importante da sua p\u00e1gina. Veja aqui um exemplo de uma se\u00e7\u00e3o de top banner encapsulada numa tag <div> com uma class chamada \"banner\". Ela contem um tag header, um tag par\u00e1grafo e um link de \"call to action\".\n
\n
\n<\/div>\n
\n
\n<\/div>\n
<div class=\"banner\">\n  <h1>Change your life, learn to code<\/h1>\n  <p>Le Wagon brings technical skills to creative people<\/p>\n  <a href=\"https:\/\/www.lewagon.com\" target=\"_blank\" class=\"btn-blue\">Apply now<\/a>\n<\/div><\/pre>\n
\n 
\n<\/div>\n
Etapa 3. Adicione um pouco de impacto<\/strong><\/h2>\n
\n 
Agora que sua estrutura e seu conte\u00fado est\u00e3o organizados, seu site esta se formando. Mas um usu\u00e1rio pode se assustar com muito texto, por isso vale a pena inserir imagens legais para aumentar impacto e chance de convers\u00e3o. A sele\u00e7\u00e3o de imagens \u00e9 essencial para comunicar e transmitir as emo\u00e7\u00f5es que sua marca carrega. Landing pages geralmente tem encima uma se\u00e7\u00e3o de banner com uma imagem de fundo larga e um texto por cima. O objetivo \u00e9 atrair a aten\u00e7\u00e3o do usu\u00e1rio para o call to action e criar o desejo deles quererem saber mas sobre o seu site e marca. Usar imagens de qualidade \u00e9 importante mas n\u00e3o se preocupem se voc\u00ea n\u00e3o for um fotografo professional. Pode usar site como \n unsplash.com<\/a> para encontrar o que precisar. \n 
\n 
\n<\/div>\n
Etapa 4. Vamos estilizar.<\/strong><\/h2>\n
\n 
CSS esta ai para isso, dar um bela estilizada no seu esqueleto HTML da etapa 2. Antes de codar, pense em quem \u00e9 sua audi\u00eancia target e como isso pode influenciar seu design. Recomendamos n\u00e3o usar mas que 3 cores para o site inteiro, uma cor dominante, que vai ser aquela associada com sua marca, e duas cores complementares para criar seu \"colour scheme\". Se voc\u00ea n\u00e3o confiar muito no seu pr\u00f3prio gosto (acontece...), pode usar ferramentas como \n colorhunt<\/a> e \n coolors<\/a>. Consist\u00eancia \u00e9 chave no seu estilo, para escolher cores, mas tamb\u00e9m fontes. Ter um m\u00e1ximo de 2 fontes diferentes para seus headings e par\u00e1grafos pode ajudar a dar continuidade no site e transmitir firmeza a sua marca. \n Google fonts<\/a> s\u00e3o de gra\u00e7a, f\u00e1ceis de usar e tem uma larga sele\u00e7\u00e3o de estilos para poder escolher. Lembra que se voc\u00ea adicionou classes a suas se\u00e7\u00f5es HTML na etapa 2,  agora voc\u00ea pode adicionar estilo individual a elas no seu CSS. Veja o exemplo de estilo CSS para a classe \"banner\" que t\u00ednhamos criado na etapa 2, com o exemplo de implementar uma imagem de fundo forte da Etapa 3. \n<\/div>\n
\n 
\n<\/div>\n
.banner {\n  background-image: url('images\/background.jpg');\n  background-size: cover;\n  background-position: center;\n  padding: 150px 0;\n  text-align: center;\n}<\/pre>\n
\n 
\n<\/div>\n
Etapa 5. Torne seu site responsivo<\/strong><\/h2>\n
\n 
At\u00e9 agora, criamos uma estrutura de p\u00e1gina HTML, adicionado imagens e estilizado com CSS. Mas se ficou bonito no desktop, sem media queries, tem alta chance de aparecer todo zuado no mobile. Acesso via smartphone representam uma maioria dos acessos dos seus usu\u00e1rios potenciais. Por isso \u00e9 t\u00e3o importante fazer seu site responsivo. Adicionar media queries ao seu arquivo CSS ajuda a modificar o comportamento dos elementos em fun\u00e7\u00e3o do tamanho do aparelho do usu\u00e1rio. Isso garante uma boa experi\u00eancia de uso, n\u00e3o importa qual aparelho seja usado para acessar. Por exemplo, vamos imaginar que voc\u00ea quer so 1 coluna no seu grid de cards no mobile e tablet em vez de 3 no desktop, pode adicionar isso no seu CSS:\n<\/div>\n
\n 
\n<\/div>\n
@media (max-width: 800px) {\n  .cards {\n    grid-template-columns: 1fr;\n  }\n}<\/pre>\n
\n 
Isso significa que se a tela do navegador do usu\u00e1rios \u00e9 menor que 800px, a regra de estilo vai se aplicar. Pode se adicionar regras assim em diferentes lugares. Veja um template de exemplos de regras comuns: \n<\/div>\n
\n 
\n<\/div>\n
\/\/ Smallest device\n@media (min-width: 100px) and (max-width: 575px) {\n  \/\/ CSS for this breakpoint\n}\n\n\/\/ Small devices (landscape phones, 576px and up)\n@media (min-width: 576px) {\n   \/\/ CSS for this breakpoint\n}\n\n\/\/ Medium devices (tablets, 768px and up)\n@media (min-width: 768px) {\n   \/\/ CSS for this breakpoint\n}\n\n\/\/ Large devices (desktops, 992px and up)\n@media (min-width: 992px) {\n   \/\/ CSS for this breakpoint\n}\n\n\/\/ Extra large devices (large desktops, 1200px and up)\n@media (min-width: 1200px) {\n   \/\/ CSS for this breakpoint\n}<\/pre>\n
\n 
Se voc\u00ea gostou desse artigo, pode continuar navegando no nosso blog que tem v\u00e1rios artigos legais para entender melhor de programa\u00e7\u00e3o.\n<\/div>","_contenu_de_larticle":null,"titre_de_la_banniere":null,"_titre_de_la_banniere":null,"paragraphe_de_la_banniere":null,"_paragraphe_de_la_banniere":null,"intitule_du_bouton_de_la_banniere":null,"_intitule_du_bouton_de_la_banniere":null,"lien_du_bouton_de_la_banniere":null,"_lien_du_bouton_de_la_banniere":null,"yoast_head":"\n5 steps to build your first landing page | Le Wagon<\/title>\n<meta name=\"description\" content=\"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"5 steps to build your first landing page | Le Wagon\" \/>\n<meta property=\"og:description\" content=\"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog Le Wagon\" \/>\n<meta property=\"article:published_time\" content=\"2020-05-13T22:00:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg\" \/>\n<meta name=\"author\" content=\"MickaelT\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"5 steps to build your first landing page | Le Wagon\" \/>\n<meta name=\"twitter:description\" content=\"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"MickaelT\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/\"},\"author\":{\"name\":\"MickaelT\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#\\\/schema\\\/person\\\/8b4567040d8a3520451362bb71ea09e6\"},\"headline\":\"5 steps to build your first landing page\",\"datePublished\":\"2020-05-13T22:00:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/\"},\"wordCount\":7,\"publisher\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/04\\\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1\",\"keywords\":[\"Web\"],\"articleSection\":[\"Skills\"],\"inLanguage\":\"pt-BR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/\",\"url\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/\",\"name\":\"5 steps to build your first landing page | Le Wagon\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/04\\\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1\",\"datePublished\":\"2020-05-13T22:00:00+00:00\",\"description\":\"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/04\\\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/04\\\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1\",\"width\":6720,\"height\":4480},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/skills\\\/5-steps-to-build-your-first-landing-page\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Skills\",\"item\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/.\\\/skills\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"5 steps to build your first landing page\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#website\",\"url\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/\",\"name\":\"Le Wagon\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#organization\",\"name\":\"Le Wagon\",\"url\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/02\\\/logo.svg\",\"contentUrl\":\"https:\\\/\\\/blog.lewagon.com\\\/wp-content\\\/uploads\\\/2023\\\/02\\\/logo.svg\",\"width\":172,\"height\":44,\"caption\":\"Le Wagon\"},\"image\":{\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/#\\\/schema\\\/person\\\/8b4567040d8a3520451362bb71ea09e6\",\"name\":\"MickaelT\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g\",\"caption\":\"MickaelT\"},\"sameAs\":[\"http:\\\/\\\/blog.lewagon.com\"],\"url\":\"https:\\\/\\\/blog.lewagon.com\\\/pt-br\\\/author\\\/mickaelt\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"5 steps to build your first landing page | Le Wagon","description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/","og_locale":"pt_BR","og_type":"article","og_title":"5 steps to build your first landing page | Le Wagon","og_description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","og_url":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/","og_site_name":"Blog Le Wagon","article_published_time":"2020-05-13T22:00:00+00:00","og_image":[{"url":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg","type":"","width":"","height":""}],"author":"MickaelT","twitter_card":"summary_large_image","twitter_title":"5 steps to build your first landing page | Le Wagon","twitter_description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","twitter_image":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/03\/zhce8ar4fexzn7hbg5u0f6j8liqr-scaled.jpeg","twitter_misc":{"Escrito por":"MickaelT"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","BlogPosting"],"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#article","isPartOf":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/"},"author":{"name":"MickaelT","@id":"https:\/\/blog.lewagon.com\/pt-br\/#\/schema\/person\/8b4567040d8a3520451362bb71ea09e6"},"headline":"5 steps to build your first landing page","datePublished":"2020-05-13T22:00:00+00:00","mainEntityOfPage":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/"},"wordCount":7,"publisher":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/#organization"},"image":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blog.lewagon.com\/wp-content\/uploads\/2023\/04\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1","keywords":["Web"],"articleSection":["Skills"],"inLanguage":"pt-BR"},{"@type":"WebPage","@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/","url":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/","name":"5 steps to build your first landing page | Le Wagon","isPartOf":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#primaryimage"},"image":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/blog.lewagon.com\/wp-content\/uploads\/2023\/04\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1","datePublished":"2020-05-13T22:00:00+00:00","description":"Voc\u00ea esta tentando criar uma landing page para seu projeto e n\u00e3o sabe por onde come\u00e7ar? E verdade que tem muita coisa para se pensar, desde usar as ferramentas certas at\u00e9 o design e o c\u00f3digo que estrutura sua p\u00e1gina. Para ajudar, simplificamos o processo em 5 etapas simples de seguir, para voc\u00ea poder criar essa pagina hoje! Venha conferir como!","breadcrumb":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#primaryimage","url":"https:\/\/i0.wp.com\/blog.lewagon.com\/wp-content\/uploads\/2023\/04\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1","contentUrl":"https:\/\/i0.wp.com\/blog.lewagon.com\/wp-content\/uploads\/2023\/04\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1","width":6720,"height":4480},{"@type":"BreadcrumbList","@id":"https:\/\/blog.lewagon.com\/pt-br\/skills\/5-steps-to-build-your-first-landing-page\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/blog.lewagon.com\/pt-br\/"},{"@type":"ListItem","position":2,"name":"Skills","item":"https:\/\/blog.lewagon.com\/pt-br\/.\/skills\/"},{"@type":"ListItem","position":3,"name":"5 steps to build your first landing page"}]},{"@type":"WebSite","@id":"https:\/\/blog.lewagon.com\/pt-br\/#website","url":"https:\/\/blog.lewagon.com\/pt-br\/","name":"Le Wagon","description":"","publisher":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.lewagon.com\/pt-br\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/blog.lewagon.com\/pt-br\/#organization","name":"Le Wagon","url":"https:\/\/blog.lewagon.com\/pt-br\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/blog.lewagon.com\/pt-br\/#\/schema\/logo\/image\/","url":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/02\/logo.svg","contentUrl":"https:\/\/blog.lewagon.com\/wp-content\/uploads\/2023\/02\/logo.svg","width":172,"height":44,"caption":"Le Wagon"},"image":{"@id":"https:\/\/blog.lewagon.com\/pt-br\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/blog.lewagon.com\/pt-br\/#\/schema\/person\/8b4567040d8a3520451362bb71ea09e6","name":"MickaelT","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/secure.gravatar.com\/avatar\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/627722b9f4aaa9f24735f9b8656525ab01111fb2c94de91dc70c9c1bffb90e7b?s=96&d=mm&r=g","caption":"MickaelT"},"sameAs":["http:\/\/blog.lewagon.com"],"url":"https:\/\/blog.lewagon.com\/pt-br\/author\/mickaelt\/"}]}},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/blog.lewagon.com\/wp-content\/uploads\/2023\/04\/zhce8ar4fexzn7hbg5u0f6j8liqr-4.jpeg?fit=6720%2C4480&ssl=1","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/posts\/219820","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/comments?post=219820"}],"version-history":[{"count":0,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/posts\/219820\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/media\/219821"}],"wp:attachment":[{"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/media?parent=219820"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/categories?post=219820"},{"taxonomy":"type_de_post","embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/type_de_post?post=219820"},{"taxonomy":"post-format","embeddable":true,"href":"https:\/\/blog.lewagon.com\/pt-br\/wp-json\/wp\/v2\/post-format?post=219820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}