+ All Categories
Home > Technology > Basic Anatomy of a Website

Basic Anatomy of a Website

Date post: 01-Sep-2014
Category:
Upload: molecularcode-web-design
View: 241 times
Download: 0 times
Share this document with a friend
Description:
 
Popular Tags:
34
Molecularcode Web Design and Development Alex Ruaux http://alexruaux.com [email protected] Beginners WordPress.com Course | West Island Women’s Centre | Spring 2013 The Basic Anatomy of a Web Site
Transcript
Page 1: Basic Anatomy of a Website

Molecularcode Web Design and Development

Alex Ruaux

http://alexruaux.com

[email protected]

Beginners WordPress.com Course | West Island Women’s Centre | Spring 2013

The Basic Anatomy of

a Web Site

Page 2: Basic Anatomy of a Website

FUNDAMENTAL FEATURES OF A WEBSITE

title and

tagline

header

menu

content

sidebar

and

widgets

footer

Page 3: Basic Anatomy of a Website

TITLE AND TAGLINE

Could be just text

May include an image or logo

Usually in top left corner, sometimes centre

May have a tagline (additional explanatory text)

Page 4: Basic Anatomy of a Website

TITLE AND TAGLINE

Page 5: Basic Anatomy of a Website

TITLE AND TAGLINE

Page 6: Basic Anatomy of a Website

TITLE AND TAGLINE

Page 7: Basic Anatomy of a Website

HEADER

The title and/or tagline may be integrated into the

header

Usually an image or logo

May include text

Usually spans the whole width of the website

Page 8: Basic Anatomy of a Website

HEADER

Page 9: Basic Anatomy of a Website

HEADER

Page 10: Basic Anatomy of a Website

HEADER

Page 11: Basic Anatomy of a Website

MENU

This links to all pages on the site

Usually at the top of the page, may be to the side

May have dropdown options

May appear more than once on the page

Page 12: Basic Anatomy of a Website

MENU

Page 13: Basic Anatomy of a Website

MENU

Page 14: Basic Anatomy of a Website

MENU

Page 15: Basic Anatomy of a Website

MENU

Page 16: Basic Anatomy of a Website

CONTENT

On the homepage, this may be blog posts or static

content

The homepage needs to explain what the site is

about / for

Will likely include pictures

May include a call to action

Page 17: Basic Anatomy of a Website

CONTENT

Page 18: Basic Anatomy of a Website

CONTENT

Page 19: Basic Anatomy of a Website

CONTENT

Page 20: Basic Anatomy of a Website

CONTENT

Page 21: Basic Anatomy of a Website

CONTENT

Page 22: Basic Anatomy of a Website

CONTENT

Page 23: Basic Anatomy of a Website

CONTENT

Page 24: Basic Anatomy of a Website

CONTENT

Page 25: Basic Anatomy of a Website

SIDEBAR AND WIDGETS

There may be a sidebar on either the left of the

right-hand side

There may be more than one sidebar

The sidebar may or may not appear on the

homepage

The content of the sidebar is determined by which

widgets you use

Widgets include things like a calendar, image, blog

titles, categories, social media icons, search box...

Page 26: Basic Anatomy of a Website

SIDEBAR AND WIDGETS

Page 27: Basic Anatomy of a Website

SIDEBAR AND WIDGETS

Page 28: Basic Anatomy of a Website

SIDEBAR AND WIDGETS

Page 29: Basic Anatomy of a Website

SIDEBAR AND WIDGETS

Page 30: Basic Anatomy of a Website

FOOTER

The footer is the text at the bottom of every page

Should include copyright notice and menu / sitemap

Often includes designer/theme and platform names

May include social media links

May include feeds e.g. twitter

Page 31: Basic Anatomy of a Website

FOOTER

Page 32: Basic Anatomy of a Website

FOOTER

Page 33: Basic Anatomy of a Website

FOOTER

Page 34: Basic Anatomy of a Website

FOOTER


Recommended