Planning Your Lodge Website
Every great website begins with a plan. Your plan should include two key elements:
- Content: The information you want to display or link to
- Interface: The layout, look, and feel of your site
Sketching a preliminary layout on paper is a helpful way to organize your thoughts. Consider including:
- Your Lodge information
- Lodge history
- Contact details
- Syllabus and calendar
- Office bearers
Designing for the Web
Designing a web page is different from designing a printed document. Web users interact with content in dynamic ways, guided by layout, imagery, and structure. A well-organized interface helps readers engage, navigate, and enjoy your site.
Visual Hierarchy
Balance is key. Avoid overwhelming users with dense text, bold graphics, or excessive typography. Use contrast and spacing to guide the eye and create a sense of order.
Page Dimensions
Design for screens, not paper. Keep your layout within a maximum width of 760 pixels to avoid horizontal scrolling. Limit each page to no more than four screens of content to maintain focus and readability.
Maximize Prime Real Estate
The top of your page is the most visible and valuable space. Use it to highlight key information, navigation, or your Lodge’s emblem. Visitors should understand your site’s purpose within the first few seconds.
Use Subtle Colours
Soft, natural tones work best for backgrounds and accents. Avoid bold, saturated colours except for areas of emphasis. Let your palette reflect the dignity and warmth of your Lodge.
Graphic Embellishments
Use visual markers—like icons, bullets, and dividers—sparingly. Overuse can lead to clutter and confusion. Emphasize only what truly matters.
Working with Fonts
Fonts shape tone and readability. Serif fonts (e.g. Times New Roman) have decorative strokes; sans-serif fonts (e.g. Verdana) are clean and modern. For web use, sans-serif fonts are generally easier to read.
- Use no more than two fonts per page
- Avoid unusual or decorative typefaces
- Do not use all capital letters
- Reserve underlining for hyperlinks
- Use colour sparingly to distinguish headings
- Left-aligned text is the most legible