- Joined
- Jan 1, 2001
- Messages
- 60,098
In the first week of August the community has been posting some great findings, and we want to go through a few of these with you. Just in case you’ve missed them. A glimpse of features and options that make XenForo stand out against competitors. It’s clear that typography, user interface, and user experience together with modern web technologies such as jQuery and semantic HTML, has been on the mind of the developers.
Semantic HTML
Talking about semantic HTML, XenForo has been built with it in mind, to oil the wheels of styling, improve support for screen reading software, and boost SEO. You can take a look at how XenForo looks by turning off rendering of CSS in the browser, you’ll find it is still fairly organized and fairly easy to read through (and usable).
As a side note we’ve also learned that turning off JavaScript will keep the site functional. It appears to be used mainly for the user interface, and not so much for functionality. Core features and functions will still work.
Together with no-css, no-js and with semantic HTML, falling back to support older browsers appears to be a possibility. Users with older systems and older browser versions are reporting it’s functional, looks good (enough), and they were impressed.
Taking semantic HTML and the UI/UX seriously, leads to speedy page loads.
More information:
http://xenforo.com/community/threads/semantic-html.892/
http://xenforo.com/community/threads/real-world-page-loading-speed.1215/
Discussions Navigation
Loading a discussion with messages, you will find users single or multi quoting each other. And on multiple pages easy to use navigation tools show up. But these options don’t just show up in the way you are perhaps used to.
Posting a message is as easy as typing in the text in the quick reply at the bottom, or after clicking on the post’s reply link (which will include the message as a quote).
And when you are quoting someone else, or they’re quoting you. The quote itself will have a little arrow. In page navigation is what this allows. Clicking it will jump up to the original message, in a visual appealing manner. Making it very smooth and easy to follow visually. And if the message is on another page it will update and jump to it. Following a threaded discussion inside a discussion has become a lot more convenient.
Before I mention multi-page navigation, I want to mention that you can also reply to multiple messages in a discussion at the same time; Also known as Multi-Quote.
Every message in a discussion has a reply link on the bottom right. Clicking it will act as expected, scrolling down to the bottom of the page, putting the original message into the quick reply box. At this point you could scroll back up again and click on reply of another message, which will put it in the quick reply too. Repeat this for the amount of posts you want to reply to.
When a discussion grows with enough messages it will span over multiple pages. If there are enough pages navigating through them would be annoying, page numbers would be missing. XenForo found a solution for this by introducing smart multi-page navigation.
With enough pages arrows appear. And clicking on the arrows will cycle through the page numbers in steps. Allowing you to quickly browse on a page (say #12) to a far away page (say #83) without having to leave the current page and jumping around.
More information:
http://xenforo.com/community/threads/multi-page-navigation-enhancement.116/
http://xenforo.com/community/threads/in-page-navigation.119/
http://xenforo.com/community/threads/quoting-multiple-posts.198/
Board Navigation
As with every forum solution, at the top of the page there’s a navigation area in the header. From here you can find your profile details, search the site for content, or navigation through the sections of the site.
However, XenForo has thought about logical navigation and put together a tab system that is logical, split with some elements on the right, and static content on the left. And when moving the mouse over an area it will be a direct link, or shows a drop down with a hover-quick-menu from where you can make a sub-selection. Saving unneeded page loads.
Additional to the header navigation the breadcrumbs (at the top and bottom) are helping you make an even quicker jump between sections, but specifically the forums.
A little arrow on the right will pop up an overlay from where you can jump to another forum.
More information:
http://xenforo.com/community/threads/header-navigation.658/
http://xenforo.com/community/threads/quick-navigation-menu.840/
Message Tweaks
Worth a separate mention in my eyes, the messages use relative timestamps, and they update while you idle on the page. This means that if you are on a page and a message you’re reading was published about a minute ago. It will actually say ‘about a minute ago‘, however, if you get up and make yourself some coffee and come back, a few minutes later. It will (without touching the computer, or reloading the page) actually say ‘four minutes ago‘.
But those are not the only tweaks to a message. Clicking on an avatar will pop up the user their member card. More about that in a minute. More direct to the content are the included images.
Normally on a forum if you include a message it breaks the design, and perhaps via a little trick they are resized. But you lose functionality. XenForo has solved this by using a smart resizer that adapts to the size of the browser. And clicking the mouse in a specific are will zooms in to the full size, focus on that area. Very nifty indeed.
More information:
http://xenforo.com/community/threads/relative-timestamps.228/
http://xenforo.com/community/threads/file-upload-and-image-placement-using-quick-reply.1510/
Additional Features
One of the most interesting feature in my opinion is the ability to have various ways to get new content, including the News Feed feature.
This is the global activity stream, containing everything that all the members do on the board. It’s great to just refresh the page every so often to find new things to read up on.
Earlier I mentioned that clicking on someone their name or their avatar will bring up a member card. This is another one of those gems that show how intuitive XenForo is with being social, displaying information, and using the content in a smart way.
An overlay pop up appears with a big avatar image, the name and status, their latest status message, and quick stats such as total messages, likes and trophies. Additional links include sending a personal message and viewing their full profile. What’s even more interesting perhaps (besides their latest status update) is the ability to directly follow that user.
More information:
http://xenforo.com/community/threads/everyones-news-feed.360/
http://xenforo.com/community/threads/pages.489/
http://xenforo.com/community/threads/member-card.889/
I hope all this information helps you get a better impression of how well XenForo is put together, while at the same time you learn a few tricks and tips.
Surely there are more hidden gems, great features and tips and tricks. But we will cover those in other topics and our forums, or our vimeo video page, in the (near) future.
Semantic HTML
Talking about semantic HTML, XenForo has been built with it in mind, to oil the wheels of styling, improve support for screen reading software, and boost SEO. You can take a look at how XenForo looks by turning off rendering of CSS in the browser, you’ll find it is still fairly organized and fairly easy to read through (and usable).
As a side note we’ve also learned that turning off JavaScript will keep the site functional. It appears to be used mainly for the user interface, and not so much for functionality. Core features and functions will still work.
Together with no-css, no-js and with semantic HTML, falling back to support older browsers appears to be a possibility. Users with older systems and older browser versions are reporting it’s functional, looks good (enough), and they were impressed.
Taking semantic HTML and the UI/UX seriously, leads to speedy page loads.
More information:
http://xenforo.com/community/threads/semantic-html.892/
http://xenforo.com/community/threads/real-world-page-loading-speed.1215/
Discussions Navigation
Loading a discussion with messages, you will find users single or multi quoting each other. And on multiple pages easy to use navigation tools show up. But these options don’t just show up in the way you are perhaps used to.
Posting a message is as easy as typing in the text in the quick reply at the bottom, or after clicking on the post’s reply link (which will include the message as a quote).
And when you are quoting someone else, or they’re quoting you. The quote itself will have a little arrow. In page navigation is what this allows. Clicking it will jump up to the original message, in a visual appealing manner. Making it very smooth and easy to follow visually. And if the message is on another page it will update and jump to it. Following a threaded discussion inside a discussion has become a lot more convenient.
Before I mention multi-page navigation, I want to mention that you can also reply to multiple messages in a discussion at the same time; Also known as Multi-Quote.
Every message in a discussion has a reply link on the bottom right. Clicking it will act as expected, scrolling down to the bottom of the page, putting the original message into the quick reply box. At this point you could scroll back up again and click on reply of another message, which will put it in the quick reply too. Repeat this for the amount of posts you want to reply to.
When a discussion grows with enough messages it will span over multiple pages. If there are enough pages navigating through them would be annoying, page numbers would be missing. XenForo found a solution for this by introducing smart multi-page navigation.
With enough pages arrows appear. And clicking on the arrows will cycle through the page numbers in steps. Allowing you to quickly browse on a page (say #12) to a far away page (say #83) without having to leave the current page and jumping around.
More information:
http://xenforo.com/community/threads/multi-page-navigation-enhancement.116/
http://xenforo.com/community/threads/in-page-navigation.119/
http://xenforo.com/community/threads/quoting-multiple-posts.198/
Board Navigation
As with every forum solution, at the top of the page there’s a navigation area in the header. From here you can find your profile details, search the site for content, or navigation through the sections of the site.
However, XenForo has thought about logical navigation and put together a tab system that is logical, split with some elements on the right, and static content on the left. And when moving the mouse over an area it will be a direct link, or shows a drop down with a hover-quick-menu from where you can make a sub-selection. Saving unneeded page loads.
Additional to the header navigation the breadcrumbs (at the top and bottom) are helping you make an even quicker jump between sections, but specifically the forums.
A little arrow on the right will pop up an overlay from where you can jump to another forum.
More information:
http://xenforo.com/community/threads/header-navigation.658/
http://xenforo.com/community/threads/quick-navigation-menu.840/
Message Tweaks
Worth a separate mention in my eyes, the messages use relative timestamps, and they update while you idle on the page. This means that if you are on a page and a message you’re reading was published about a minute ago. It will actually say ‘about a minute ago‘, however, if you get up and make yourself some coffee and come back, a few minutes later. It will (without touching the computer, or reloading the page) actually say ‘four minutes ago‘.
But those are not the only tweaks to a message. Clicking on an avatar will pop up the user their member card. More about that in a minute. More direct to the content are the included images.
Normally on a forum if you include a message it breaks the design, and perhaps via a little trick they are resized. But you lose functionality. XenForo has solved this by using a smart resizer that adapts to the size of the browser. And clicking the mouse in a specific are will zooms in to the full size, focus on that area. Very nifty indeed.
More information:
http://xenforo.com/community/threads/relative-timestamps.228/
http://xenforo.com/community/threads/file-upload-and-image-placement-using-quick-reply.1510/
Additional Features
One of the most interesting feature in my opinion is the ability to have various ways to get new content, including the News Feed feature.
This is the global activity stream, containing everything that all the members do on the board. It’s great to just refresh the page every so often to find new things to read up on.
Earlier I mentioned that clicking on someone their name or their avatar will bring up a member card. This is another one of those gems that show how intuitive XenForo is with being social, displaying information, and using the content in a smart way.
An overlay pop up appears with a big avatar image, the name and status, their latest status message, and quick stats such as total messages, likes and trophies. Additional links include sending a personal message and viewing their full profile. What’s even more interesting perhaps (besides their latest status update) is the ability to directly follow that user.
More information:
http://xenforo.com/community/threads/everyones-news-feed.360/
http://xenforo.com/community/threads/pages.489/
http://xenforo.com/community/threads/member-card.889/
I hope all this information helps you get a better impression of how well XenForo is put together, while at the same time you learn a few tricks and tips.
Surely there are more hidden gems, great features and tips and tricks. But we will cover those in other topics and our forums, or our vimeo video page, in the (near) future.