Critique my uni assignment WordPress site please

[Deleted member 66701]

For my 2nd CMS assignment, I need to build a WordPress site, design brief as follows:-

You are currently on the second year of a Foundation Degree in Interactive Media Development at Lancaster University. After a successful initial application you have been set a further task by local web development house DECISIVE DESIGN.

The task they have set is once more around the theme of Web Based Content Management Systems, this time in the style of a design and development task. Following the previous task of researching into the different web based content management system environments available to web developers, WordPress has been chosen as the selected platform for DECISIVE DESIGN’s new web based venture.

You have been given control of a project to develop DECISIVE DESIGN’s content management system portfolio, and as such have been given a task to complete.

The first thing that DECISIVE DESIGN has asked is to choose from the following topics to be the basis of your site:

 A Gaming News Site (Specific Genre/Game)
 A Music News Site (Specific Genre/Style)
 A Movie/TV News Site (Specific Genre/Style)
 A Film News Site (Specific Genre/Style)
 An online magazine (Celebrity News / Gossip)

The site must include the following pages:

 The index page will be a feed of articles around the topic.
 A contact page
 An ‘about me’ styled page
 A Gallery / Media page
 Social Media incorporated
 Other static pages should be included which tackle the less dynamic stories (e.g. if it was about a specific game then a static page could deal with information about the publisher.
 Consideration for mobile devices in the development

The site must also include (but is not limited to) the following features:

 Access Control:
 Allow for multiple authors with access to post creation.
 Allow for an editor to have full access to creating/editing ALL posts.
 Allow for administrator access to have FULL control of the site and content.
 Include an RSS feed from an already established website to extend the use of your own site
 Include at least one image gallery

Tutor has put the emphasis on customising the hell out of an off the shelf template (we're not expected to make our own templates until next year). I've used http://www.elegantthemes.com/demo/?theme=Nexus as the template and this is as far as I've got so far:-

http://mapgaming.org.uk/

As always, suggestions welcome - especially for ways I can further customise the theme and push the boundaries. Oh, and if anyone wants to register and post comments on the blog, feel free!

Thanks in advance for your time.

 

[Deleted member 66701]

Thanks very much for your feedback - I've made most of those changes

Thanks for taking the time to have a look

 

[Deleted member 66701]

That arrow / chevron really needs to go. Your animated background looks weird when the site is viewed on a portrait monitor. Indeed, my portrait monitor is 1200 px wide so you need to ensure the site works on a 1050 px monitor.

Looks fine on my monitor at 1200px and 1050px wide - what exactly is "weird" with it?

Music should always be OFF by default.

Agreed, but my tutor wants it to remain on. I know, right I have however enabled the player controls so user can mute if required.

Thanks for taking the time to have a look

 

[Deleted member 66701]

Ok, I've made a few tweaks at my tutors suggestion (pinned the header/nav bar, tweaked some colours, dropped the carbon effect backdrop). She says she can't think of any more customisations to make me do - I've already gone waaaaaaaaaaaaaaaaay beyond what she was expecting anyone to do for this module and it's not due in until the 6th of December!

Anymore comments?

 

[Deleted member 66701]

Lose the text bevel on your title image at the top of the page.

Any reason why?

Going to assume it doesnt load all that content on mobile. Loading the videos all the time and its currently at 40mb after a couple of minutes!

Do you mean the background video or the content on the video page?

Background video is replaced by a static image on non desktop devices.

The TEamspeak bit looks a bit pants.

How so exactly? Do you mean the colour? If so, I'm afraid the text colour is a branding requirement to match the forum colour scheme, so it has to satay (sometimes, web development means having to implement what the customer wants, despite themselves).

 

[Deleted member 66701]

On the teamspeak bit the icons are a mess, cant tell what they are supposed to be. Dont think that whole section fits with the relatively clean look of the rest of the site.

Ah, I see. Unfortunately the Teamspeak code is an API and the code is generated elsewhere, you only have control over font size and colour, not the icons, so I can't do much about it.

Thanks for taking the time to explain though

Its also a web developers remit to advise the client when something looks toss.

Oh believe me I've tried!

 

[Deleted member 66701]

Of course you can. If the elements are in the DOM, they can be manipulated with CSS. After inspecting the TS section, you can see all of the styling is done inline and none of the elements have classes or IDs. If you want to modify the look of the TS section, you'll have to use children selectors and experiment with the use of !important as you'll need to override inline styles (which are usually prioritised above external CSS styles). The only unique element in that block is the root element of that widget which is #text-5. Start from there and work your way down the tree

OK - maybe I said that wrong.

At my skill level, there isn't a lot I can't do about it

But thanks for the explanation - I'll do some reading on DOM traversal and manipulation!

 

[Deleted member 66701]

The main thing I would say is you need to improve the spatial relationships.

For example the articles listed down the left hand side – the gap between the thumbnail and the title text is the same as between the thumbnails and the edge of the page. This seems to indicate that the thumbnail and the title are not related. The titles also seem a bit too large, and don't align properly (in my browser at least) with the top of the thumbnail.

The vertical gaps between these articles is also about the same as some of the elements within the article, which means the articles don't clump together as well as they should.

The two narrow columns on the right hand side also feel out of whack – the grey header blocks have tons of padding, but the columns themselves have no gutter. Again vertical spacing is kinda wrong – elements within a block e.g. list elements need to have a stronger relationship with each other than with other blocks.

Also: The bezelled text at the top looks very dated, and the choice of serif font for heading text is a bit odd for the subject matter (though not bad in general terms).

Finally watch your contrast ratios, especially when you're playing a video under the page text.

Cool - thanks for the heads up

The spacing is as per the default theme, so I'll have a dig into the code to see where they are set - there certainly seems no way of altering them in the control panel.

Design is where I fall over - I'm definitely falling into the web developer arena rather than the web designer arena - I'm not very creative at all! I don't "see" the things you see - which is why I really appreciate everyone's feedback!

 

[Deleted member 66701]

It looks tacky.

OK

As that's a subjective comment, I'll choose to keep the logo unchanged, but thanks for taking the time to have look.

 

[Deleted member 66701]

It's been marked - 100%! <happy dance>

96% overall on the module - I only got 88% on the essay part.