Abp website

ABP London Web Design Project

Contents • Home page • Press release page layout / single page • Publication page layout / single page • Event (News) page layout / single page • Blog page layout / single page • Gallery page layout / single page • Opportunity (Career) page layout / single page • Contact page & Sitemap page

HOME PAGE

Home Page Contents • Dropdown navigation menu (need sitemap) • Sliding header images (3-5 images) • Twitter feeds (need account name) • Videos (hosting, player, etc.)

• 360 view player for ABP • Reference information for subpages

HOME PAGE Elements: Press Release • Latest two press releases displayed here

• A prominent image

Other sec5ons • Image + Link • Could be video, twi;er, events etc

• Images slides -­‐ HighlighJng mulJple important messages e.g.

Links • Sitemap • Contact Us • News and Press • Career

• Simple, organised and allow users find what they are looking for quickly and easily

Career / Ad

• Image slider – click to view other ‘image slides’

h;p://www.skanska.co.uk/

• With hyperlinks

360 PAGE

• IncorporaJon of ABP’s 360 page would be useful.

• If this is not possible a link would be needed. h;p://bit.ly/1h4sZ1b

h;p://ninety90.co.uk/ABP_APP_London/

COLOURS • Both the Wanda Group website and the Hakkasan website have a bold background colour.

• The colour of their wriJng also standout, making the text more clear and easy to read.

h;p://hakkasan.com/locaJons/hakkasan-­‐mayfair/

SEARCH FUNCTION • A search funcJon on the right-­‐hand corner of the webpage.

DROP DOWN MENUS • The use of drop down menus that take you to a different page of the website. For example, under ‘Media Centre’ have a drop down menu leading to three separate pages for ‘News’, ‘Press Releases’ and ‘Gallery’.

h;p://www.wanda-­‐group.com/

PRESS RELEASE

Press Release Contents

• Sort by both year and month • Images and text • Independent single page

PRESS RELEASE • The releases are sorted by year and month.

Year tab on top.

• Photos and a paragraph of text for the latest releases.

• Standard style for date/headline/lisJng

h;p://www.skanska.co.uk/News-­‐-­‐Press/Press-­‐releases/

PRESS RELEASE • Each press release is displayed in a webpage.

• Standardised format (heading, subheading, date, image, body text, contact info)

Advantage: • BeKer naviga5on – While reading the news release, the user remains on the site instead of being led to a pdf link. So the user can easily navigate to the previous page or other pages by clicking on the menu bars on the lec or at the top.

• News update via a CMS system

PUBLICATION

Publication Contents • A book-shelf theme layout • Independent single ISSUU frame page (with magazine view) • ISSUU account registration required • Full-definition PDF files required

PUBLICATIONS • Different bookshelves for magazine, brochures, leaflets • Thumbnails of cover • Linked to interacJve pdf

h;p://www.skanska.co.uk/News-­‐-­‐Press/PublicaJons/

EVENT

Event Contents • Images and text • Independent single page • Relevant information side bar • Full-definition PDF files required

EVENT PAGE • Heading • Event picture • Short descripJon • Link to a subpage for each event Subpage • Text + Images • Video

h;p://www.skanska.co.uk/About-­‐Skanska/Sustainability/

BLOG

Blog Contents

• Blogger picture and text • Independent single page • Under News category

BLOG • Built as part of the site, under the News secJon • Guest blogger picture (with a link underneath for a short biography) • The full post will be displayed in a separate page, with a comment feature

h;p://www.balfourbea;y.com/index.asp?pageid=43

OTHER REFRENCE

Reference • http://www.artzip.org • http://www.taiwanseasonfringe.com • http://www.xinpro.co.uk • www.xycollective.co.uk/xywedding • http://www.xycollective.co.uk/pi • http://www.xycollective.co.uk/car8 • http://www.xycollective.co.uk/xy • http://www.xycollective.co.uk/ai