In your new, blank Project:
- Choose your fonts (family and sizes).
- Establish your brand colors at a minimum, more color choices if necessary.
- Choose your breakpoint sizes.
The above are all style issues, but if they’re not in the Theme, then you’re going to have lots of issues downstream. Look at what other sites do as examples to get ideas for Theme. Looking at the free projects is one way of seeing how they’re set up IN THE THEME.
- On your home page, create the following Component structure: (a) Menu, (b) Container, (c) Footer. Keep tweaking your menu and footer until you like them, then make them globals. It’s possible that you might want to put Flex/Grid in the Container between them that will be consistent across pages, if so, do that next.
- Establish your basic page structure (you can add to it later) with blank pages that are named (home, blog, gallery, contact, etc.). You can add sub-pages later. Add the Header/Container/Footer construct to each page.
- For as many of the SVG, JPG, PNG, and other assets you’re going to use on the site, build out the Resources section with a folder structure that matches the page structure you just created (e.g. /resources/images/page/resource.xxx).
- If you’re going to use the CMS, add the necessary folders and files (ala Microblog), plus make sure you add a Posts page and an Authors page to the structure you built in #5.
- Design away with the Essentials add-on and the built-in Components. Some say start by getting all pages right for mobile first, then using breakpoint overrides to change design as the screen size goes up. Some of us do it the opposite way. But pick a direction! Get things right at the min or max size, then work your way to the other end.
- Add your content to the Essentials and Components you used in #7 (I always start with the default lorem ipsum content because I’m worried about style first, content second, when designing a site. Likewise, add your beginning CMS content.
- Do a complete and thorough Preview walk-thru of your site.
And throughout: file, folder, page, and resource names should be all lowercase, no spaces, hyphen-instead of space if you need it.