The following section is a list of arbitrarily many items, where each item has title, link, icon, link button and an optional caption. This page was built by a content manager without any developers being involved. Users know what to expect and it just works.īelow we have an example of a long landing page from starting with a typical Hero section, followed by various sectional components. Making these sites responsive is as easy as making sure each section is independently responsive. There are no issues with accessibility from quirkier UX and documents reading from top to bottom is basically how the web was designed to be consumed so it just plays well with all parties involved, including crawlers. It’s easy to reason about, the UX is straight-forward and well understood. Most marketing sites follow a pattern of being sectional. Once you have your primitive elements like typography, colors, spacings, links, buttons, cards, icons, grids and various image containers, you should design your website sections using these. You’ll find dozens of these in the React ecosystem. If you don’t have one then it’s completely fine theming some pre-existing component library as well. My colleague Harrison has written about the technical implementation details of creating a low level design system with React, styled components and styled-system. I’ll go into the detail of each in separate sections, starting with the design system.
#GATSBY RESPONSIVE LAYOUT GENERATOR#
#GATSBY RESPONSIVE LAYOUT FULL#
Content managers at need full controlĪ content marketing team together with SEO and performance marketing experts often want full control of a website, so they can execute on marketing efforts without having to coordinate with a separate development team. A startup’s website and their content marketing plays a huge role in making this happen. Since people don’t switch insurance easily it’s a behemoth of a marketing task to convince them to change. I’ll show you how Makers’ Den created a custom sectional website builder for using Prismic.io, React and Gatsby.js but first let’s give you some context: FRI:DAYįRI:DAY Versicherungen is an insurance startup that’s turning the German up on its head by offering pay-per-kilometer for car insurance and other new insurance products in the notoriously conservative German market. Generating with GatsbyJS from Prismic.io.Create a dynamic page structure in Prismic.io.Content managers at need full control.
0 kommentar(er)
