Designing and Developing a Site:
A step-by-step guide of the process of building and designing a website. The featured website for this guide is sfccdesign.com, the SFCC Graphic Design Grad Show website.
If you want to create a captivating website from scratch, it’s crucial to get a good grasp of your target audience and check out your competitors. You need to know what kind of content your potential visitors are into and what information they’re looking for.
Based on the information we’ve gathered in step one, it’s time to consolidate it into a comprehensive website plan. This involves developing a site map, which lists all the main topic areas and potential sub-topics of the website. The site map serves as a blueprint, clarifying the content that will be included and helping us understand the navigational structure.
The next step is to find some design inspiration and build a mockup of the wireframe. Wireframes serve as a blueprint for organizing the visual design and content elements of the website. They’re handy for spotting any potential challenges or gaps in the site map. Although wireframes don’t include final design elements, they give you a preview of how the site will eventually look. Plus, they can be a great source of inspiration when it comes to formatting different elements.
Now it’s time to create a style guide for the site. A style guide is like a handy reference book that brings together all the design choices for your website. It covers things like color scheme, typography, icons, buttons, and logos. Along with the visual elements, all the content needed for the site will be collected during this step. This includes but is not limited to images, text, links, and videos.
With all the content collected and all the visual elements determined, the next step is to start building out the website. Since this will be the first go at it, we call this a rough as it may not be flushed out but it’ll create a good foundation of how the website looks and functions.
Once the website has been adjusted and modified to a more complete and clean site, we have reached the final design. This design may still need slight altering but overall the functionality and visual design should be finalized. During this step we will also test the site in various ways such as checking links, responsiveness, images loading properly, and how the site looks on different browsers.
During this last step, we will fine tune any last minute revisions on the site. This doesn’t mean it’s the last time you’ll update it as maintance is an ongoing process for websites but this should be the last step before officially launching the site. Typically when launching a new site, announcing it on social media is recommended so your target audience can check it out.