Session 2 Outline

Session 2: Homepages

(Making a Homepage)

  • Templates: Pre-designed page layouts that can be used to make new pages with a similar design, pattern, or style.
    • These are like website blueprints that help you start building quickly.

  • Blocks: In WordPress, these are the components for adding content in the new WordPress block editor.
    • Parts of your website where you can add pictures, text, or videos.

Click here to go to Figjam Board for activity (or select the bottom left in the box below)

What makes a good website?

Imagine you’re building a digital front door for a business—that’s essentially what a homepage is for a website. Here’s how you can make a good one, explained in a way that’s easy to grasp:

What’s Do You Offer? (Clear Value Proposition)

Think of the homepage as a quick introduction. Just like when you meet someone new, you want to make a good first impression. The homepage should immediately tell visitors what the website is about and what they can gain from it. This is often done with a big, bold statement or question that grabs attention.

Easy to Move Around (Intuitive Navigation)

Your website should be easy to explore, like a well-organized school binder. The homepage should have a simple menu—like a table of contents—that guides visitors to different sections of the site easily. This way, they won’t get lost or frustrated trying to find what they need.

Make it Look Cool (Engaging Visuals)

A homepage should be visually appealing. Use great images, fun videos, or cool graphics that relate to what the website is about. This makes the homepage not only nice to look at but also helps to tell the story of what the website or business offers.

What Should They Do Next? (Calls-to-Action)

Finally, your homepage should guide visitors on what to do next. This could be inviting them to sign up for a newsletter, checking out a product, or just learning more about a service. These invitations are called “calls-to-action,” and they should stand out so visitors know exactly where to click to continue their journey on the site.

Creating a homepage is like setting up a welcoming entry into a house or setting the stage for a play—it sets the tone and invites people to come in and explore more.

Helpful Vocabulary for this section

Homepage: This is the main page of a website, kind of like the front door to a house. It shows visitors what the website is about and where they can go to find other stuff on the site.

Navigation Bar: This is the menu you see at the top of a website. It has links to the main parts of the site, like “Home,” “About Us,” and “Contact.” It helps you get where you want to go on the site without getting lost.

Hero Image: A big, eye-catching picture right at the top of the page. It usually has some text on it that tells you something important about the site, and it’s meant to grab your attention.

Call to Action (CTA): This is a button or link that encourages you to do something, like sign up, buy something, or learn more. It’s like a little nudge telling you what to do next.

Responsive Design: This means making sure the website looks good and works well no matter what device you’re using—like your phone, tablet, or computer.

Content Management System (CMS): A tool that helps you build and manage your website without needing to know how to code. WordPress, which we’re using, is one of these tools.

Widgets: These are little tools you can add to your website, like a calendar, a weather update, or a link to your Instagram feed. They add extra info or features to your site.

SEO (Search Engine Optimization): This is all about getting your website to show up higher in search results when people Google something that’s related to what you do or offer on your site. It involves using the right words and organizing your site so that search engines like it.

Wireframe: Think of this as a blueprint for your website. It’s a simple sketch that shows where things like pictures and texts will go on the site without any design elements. It helps you plan out the site’s layout.

Landing Page: A specific page on a website made for visitors coming from a certain ad or link. It’s designed to get those visitors to take an action, like joining a mailing list or buying a product.

Footer: The part at the bottom of every page on a website. It usually contains contact info, links to important pages, or social media icons. It’s like the footer on a document, sitting at the bottom but full of useful stuff.

Analytics: These are tools that help you see how many people are visiting your website and what they’re doing there. It’s like a report card that tells you what’s popular on your site and what’s not, helping you make it better.

Useful Links