Deciding on frameworks and tools – Website redesign

As mentioned deciding on what tools and frame works to use can take some time in most cases too much time is focused on this aspect alone. Without spending too much time pondering the decisions which would ultimately set the course for this entire website, I have come up with the following choices for my website redesign:

Content Management System:


This decisions was relatively straightforward, I have been using WordPress for well over 5 years and have a strong understanding of the fundamentals. Having never built a theme from scratch for WordPress I wanted to close this ‘skill set loop’ and add this to my belt of WordPress projects. For me it does everything I need, with a community behind it that will help support my questions when they arise. What helped this decision was the knowledge in that both CSS-Tricks and Smashing Magazine using WordPress to deliver their content to their users.

Front-end UI framework:

Semantic UI (Bootstrap close second)

I know Bootstrap pretty much back and front, having used it on several large projects. However Semantic UI, a framework I have never used, will be my choice of UI framework! Semantic UI was pointed out to me by a friend of mine just recently and I’m very interested in using it in a project, what better way to learn it by using it now! For me the decision was based around trying something new and using a framework that is utilising some of the latest CSS features (Flex box etc). Bootstrap has a huge user base, thus they play it quite safe when implementing new technologies. For example there will be no flex box in bootstrap 4 (Mentioned by Mark Otto in his interview on Shop Talk Show ).

If I get stuck into the project and feel Semantic UI is too hard to integrate, missing features and browser support I may very well switch to Bootstrap.

CSS Preprocessor


This decision mostly comes down to what is supported by the front-end framework of choice. Semantic UI only supports Less with Bootstrap supporting Less by default with a port to SASS, its probably best to just go with LESS.

Further tools include:

  • NPM – Package manager
  • Photoshop CC – Designs mock-ups and Visual content authoring
  • MAMP/XAMPP – Local server for WordPress instance
  • GIT – Version control
  • Sublime Text 3 – Text editor
  • _S – WordPress theme example and structure
  • Prepros – Compiler and live browser refresh

As with every selection this list might not be the best but its what I have chosen. I didn’t want to spent too much time exploring other options and choosing everything for the sake of trying something new (other than Semantic UI which I wanted to learn). This list will grow and expand as the project evolves, I may end up with a completely different set of tools when the website is done and thats ok with me.

If there any tools you would recommend me to use please let me know 🙂