如何建立自适应网站的“添加内容”页面

Question

Context: Ok so I am building a website for a friend. Hes a designer with a high need to daily include his projects (images and text).

Problem: Ok so I know pretty much how to code in html/css/javascript a front end responsive website, that is the easy part for me, the hard one is the content page. I've never done it so I don't know the best way. A page that he goes daily put a new project, new images, formatted text (A like a blog). But since he doesn't know anything about coding and front end, it has to be simple enough for him to understand.

Resources: I made several searches and found some websites that allow custom templates with content, one of them standing is wordPress (haven't used it for years). I am currently abusing tumblr for that matter, but their support is quite bad. Should I use one, should I buy a host like bluehost and create my self one, what you guys recommend? I tried google it but perhaps I am not doing it the right way since I am not finding any answer to my problem.

Answer 1

Look, you've come to a programming website, so the most common suggestion you'll get here, and the option I myself recommend is:

MAKE IT YOURSELF!

It really is a fun and very educational experience.

There are many, many ways to do this. In general you'll want to have a front end that communicates with a back end API.

For the front end, there are a lot of options. From templating engines like Jekyll , to MVC frameworks like Laravel , to full fledged high level abstractions like Angular and React , which are admitedly harder to learn but so, so robust, and useful once you've figured them out.

The selection of tools you can use to make the API that supports the website is just as rich. There is ASP.NET for C# (which some people use for the front end as well but I wouldn't), there is Node.JS for JavaScript, with a myriad of libraries and packages to get you started. Flask is a popular option for Python. The list goes on and on.

Oh and dont forget about Ruby on Rails .

As for the interface which your friend will use to add their work, turning all that complicated back end into a simple, easy to use interface is a fundamental part of UX design and, IMHO, quite satisfying once you get it right. Make it sleek and, most of all, intuitive . One shouldn't have to be taught how to use it. It should be apparent from the first time they open the page. You should always ask for their feedback as you are developing it. Some even opt to create mock ups of the interface, in order to get feedback on both its aesthetics and its intuitiveness before a single line of code has been written.

Now, regarding how you'll actually do it, the answer really depends on the tools you opt to use. In general, you'll want to read up on things like the MVC pattern , or React's component architecture . The former is something you'll come across on a wide variety of platforms. The latter is mostly React specific, but in my opinion, understanding how to properly build a website using component architecture means you're in the right mindset, something that will help you no matter how you choose to build it.

All that being said ...

Web development is complicated. Creating dynamic websites is a much larger undertaking that designing a static page, or even making an SPA . Though I do wholeheartedly recommend you do it at some point , starting with your friend's website might not be the best idea. Or, you may simply not have the time to sift through all your options, figure out which is best for you, begin the learning process etc.

In that case, there are plenty of publishing frameworks and tool sets to choose from. Wordpress has become very popular in the recent years, and templates and plugins for it are abundant. Alternatives like Medium and Ghost have also gained some traction.

There are plenty of commercial CMS type frameworks. One I have heard good things about is ExpressionEngine . However, I cannot speak for it with certainty.

If you are looking for a website builder, there are also plenty of options out there such as Weebly , Wix , as well as Squarespace . Google sites is a relative newcomer in that department, but seems promising.

So, in summary,

I wholeheartedly recommend building it from scratch. There are many, many languages, frameworks, and tools out there you can choose from, each with its own patterns, best practices and idiosyncrasies. If you lack the time, or simply don't feel like going through that process of building a dynamic website from scratch, you can use one of many tools available. However, that wouldn't be nearly as much fun, and would likely produce an inferior result.