QREATiv | Frequently Asked Questions covering the basics of making the most of CREATiv.


Search

Why... ?
Q. Why should I contribute articles to QREATiv when I have my own site, blog or forum?
A. I don’t know. Why do you participate in any online community? I don't see it as an either/or situation. All I can say is this: Using QREATiv (in addition to your own platform) might expose you, your work and your website to a broader audience. If that appeals to you, great.
Q. Most community sites allow visitors to ask questions or have threaded comments, why doesn’t QREATiv?
A. There are a few reasons, but mainly I want to keep the author’s article uncluttered and on-point. Q&A and threaded formats can indeed be very useful, but they can also be fractured and distract from the main article. There’s no shortage of threaded discussions if that’s what you prefer.
Security
Q. How do you ensure file attachments (e.g., demo/example files) are safe to download and open?
A. When a Member uploads a file to the QREATiv server using their personal file manager the file is by default sandboxed and scanned for malicious code before being made public. Flagged files are quarantined.

Reality check: No guarantee is given or implied that downloadable files will be safe 100% of the time. You, the end-user, are solely responsible for the decision to download and open files. If you have any concerns do not download attachments.
Q. Can Members attach (link to) downloadable files not hosted on the QREATiv server?
A. Yes. Potentially any file on the internet can be linked to. However, since QREATiv is unable to verify the safety of files not hosted on its own server you should always perform a local security scan of any downloaded file(s) before opening.
Q. What happens to Members who upload malicious files?
A. Their account will be terminated and any articles or uploaded media will become the property of QREATiv.
* Oh, and they will be forced to watch 24 non-stop hours of Justin Bieber and Taylor Swift videos.
Public Profile
Q. Is a Public Profile required to post articles?
A. No. The only required field is your “Member” (screen) name. The rest is optional.
Q. What’s the benefit of a Public Profile?
A. It’s an opportunity to promote your professional background, skills, website, work and social network(s). Think of it as free advertising.
Q. Can my readers contact me from the QREATiv website with questions or comments?
A. Indirectly, yes. Members can opt to publicly post links to their website, email or social networks. In the case of email it’s a mailto link which when clicked will open the visitor’s email application with a pre-addressed message.
Q. If I post my email address on my Public Profile will it be safe from spammers?
A. Yes and no. Your email address is converted into a mailto link which is then encoded on the server. As it applies to automated email harvesting (i.e. spambots) your email is reasonably safe, but Humans can still see it.

Reality check:  A mailto link is not a Web form, as such your address is publicly viewable to Humans (this is the nature of a mailto link) which means it could potentially be seen by anyone. No matter how careful you are, by virtue of simply using your email — anywhere — there are any number of ways for it to be exploited that are beyond your (and my) control. If you have concerns then do not post it on your Public Profile.
Q. Can registered Members contact each other from within their personal account?
A. Not currently. There is an internal messaging system but it's used by the QREATiv Admins to contact Members about news, system updates, maintenance etc.
Publishing Articles
Q. I created an article but it’s not publicly accessible. Why?
A. By default articles are unpublished unless you explicitly set the Online Status to ‘Published’. Your article will not be publicly viewable until that happens.
Q. Does QREATiv edit/modify submissions?
A. Only when necessary to move an article to a more appropriate category or correct spelling/punctuation issues. Of course this does not apply to questionable or offensive submissions which will be immediately deleted.
Q. After clicking the “Submit” button I was redirected to my newly-created article. I thought articles are unpublished by default?
A. They are. What you’re seeing is an internal preview of the finished article. If you did not explicitly Publish the article then it won’t be publicly viewable.
Q. Isn’t it risky to allow Members to publish articles themselves?
A. Yes, it is. But I prefer to trust Members. So don’t betray my trust! That being said, all articles are subject to moderation or removal at the discretion of the admin. Be respectful and it benefits all of us. Don’t, and I will delete your account.
Images: Responsive and High-Resolution
Q. What graphic file types can I use?
A. jpg, jpeg, png, gif, svg.
Q. Do “Responsive” and “High Resolution” refer to the same thing?
A. No. Responsive images scale to fit different screen sizes. High-resolution refers to a display’s pixel density or ppi (pixel-per-inch). For example, a Retina display has more pixels for a given screen size compared to a non-Retina display with the same physical dimensions .
Q. How do I make an image “responsive”?
A. Just embed the image in your article as normal and QREATiv will do the rest for you automatically.
Q. How do I ensure images look sharp on both standard and high-resolution displays (mobile and desktop)?
A. Easy. Here’s the recommended way:
For a high-resolution display the image should ideally be at least two (@2x)* times the so-called normal or low-res size. By “normal” I mean the maximum size you have determined you want the image to be on screen.

In other words, an image displayed at full (100%) size will only appear sharp on a standard definition screen. But by using a larger image displayed at half or one third the original dimensions you are effectively making the image pixels smaller in order to compensate for the higher resolution screen. It’s nothing more than a mathematical sleight-of-hand.
* Even higher resolution displays are becoming the norm so you will have to adjust things accordingly depending on your target.

Here’s an example assuming a 3x display:

Screenshots/Photos
If you want the maximum on-screen dimensions to be 600x400 then use an image (.png or .jpg) that is 3x larger, or 1800 x 1200. Then in the “Insert/edit image” window of the Rich Text Editor explicitly define the dimensions as: Width: 600 Height: 400.

Graphics/Artwork
If possible use a Scalable Vector Graphic (.svg) at the intended dimension, then specify the dimensions as above. Of course you can still use .png or .jpg if you prefer, the process is the same as step 1.

Q. What if I don’t want to impose a width limit? What if I want the image to grow as wide as the browser window (up to it’s maximum dimension)?
A. This is the default behavior so all it requires is that you do not specify any dimensions.
Q. Ok, but doesn’t that mean a (potentially) large @3x image will also be used on slower mobile devices/networks?
A. Potentially, yes. But not in this case. QREATiv handles it differently with the help of Adaptive Images. Here’s an over-simplified explanation:

The full-size @3x (or @2x) image is rescaled on-the-fly thus generating an optimized image based on the screen size of the device it’s being viewed on. The scaled image is smaller in dimension and file size, which means faster downloads. Once created these images are stored on the server so they can be cached/served for the benefit of everyone. Plus, AI also detects Retina displays and will generate/serve the appropriate scaled high-res image.
Q. Do I still need to optimize images for Web use?
A. Absolutely yes. This is especially true for high-resolution images which require substantially larger dimensions.
Q. Just so I’m clear: As long as my image/photo is large enough QREATiv will automatically make it responsive and sharp on any device at any resolution on any screen size?
A. Yep. You’re welcome.
* Be sure to tip your waitress.
Video
Q. Can I embed video from Vimeo and YouTube?
A. Yes. This might be the simplest and quickest method. Make sure you explicitly set/change the width to 100% (so it scales nicely).
Q. Can I upload my videos (or audio-only files) to the QREATiv server and then embed them?
A. Yes. Allowed file formats are: mpeg, m4v, mp4, ogg, webm, aiff, wav.
Q. What size/dimension video should I use?
A. A width of ~800-960px is a good start which is similar to YouTube and Vimeo. If you want to go bigger then do so, the video will scale to fit smaller screens (assuming you change the fixed-width to 100%). The main thing to keep an eye on is file size.
Q. What file format offers the widest browser compatibility?
A. Most likely mp4. Also see “fallback”.
Q. What type of encoding is best?
A. Well, ‘best’ is relative but H.264 is a good option. Keep an eye on the file size, though. We want quality, not bloat.
Q. What is a video “fallback”?
A. It’s an alternate file for browsers that don’t support the primary format being used. E.g., it’s common to use mp4 as the primary and ogg or webm as a fallback for Firefox which — at the time of writing — doesn’t support mp4.
Q. Why should I use a “fallback”?
A. By not using a fallback your are effectively ignoring a potentially large section of your audience.
Q. How do I add a video fallback?
A. Easy. When you click the “Insert/edit video” button in the Rich Text Editor a window opens with 2 input fields: Source (for the primary video) and Alternate source (for the fallback).
Q. What is a video “Poster”?
A. A ‘poster frame’ is a static image — a preview — used in place of the video’s first frame.
Q. How do I add a “Poster”?
A. Easy. Just follow the fallback instructions above except in the Poster field select an image that is sufficiently large enough to fill the entire video at full-size.
Q. What if my “Poster” image is too small?
A. The Poster image will scale up/down to fit the video. Of course if the image is too small it will distort/pixelate and basically look like shit. So either find a larger image or don’t use a Poster.
Syntax Highlighting: Raw Code
Q. What’s “syntax highlighting”?
A. It’s when raw code is displayed using colors and styles to “highlight” the different parts and functions of a language, e.g., javascript. See how pretty it is...
$(document).ready(function()
Q. Why should I use it?
A. It’s easier to see the language structure, especially when dealing with large and/or complex blocks of code.
Q. What if I don’t want to use it?
A. Then don’t, you Big Baby. But it’s kind of boring.
$(document).ready(function()
Q. Do I have to color the code myself?
A. Nope. It’s done automatically.
Q. Ok, I’m convinced. How do I add syntax highlighting?
A. All it requires is adding a class to the correct HTML syntax. In practice this will only take a few seconds.
  1. Add the raw code (any language).
  2. Select (highlight) the code then in the Rich Text Editor apply the Pre tag: Toolbar > Format > Block > Pre.
  3. With the code still selected apply the Code tag: Toolbar > Format > Inline > Code. When viewed together the complete semantically-correct code structure will look like this:
  4. This is where the magic happens. You’ll manually add the appropriate language-xxxx class to the opening pre tag. In the Rich Text Editor go to: Toolbar > <>(Source) and find the opening tag. In this example I’m using javascript so the proper class name is language-javascript.
    Output
    $(document).ready(function()
  5. And if you want to include line-numbers in your code add the class line-numbers to the pre tag:
    Output:
    $(document).ready(function()
  6. Finally, when displaying html you must escape it by wrapping the code in a script tag: Output:
Q. What about different languages?
A. Easy. Use the appropriate language in the class name. For example:
CSS: language-css
HTML: language-markup
Ruby: language-ruby
Swift: language-swift and so on...
Get the idea? For more documentation visit Prism.
File Manager and Rich Text Editor
Q. What is a “File Manager”?
A. It’s a generic term for a feature-rich app that hooks into the Rich Text Editor you will use to create/edit your articles. As it applies to the QREATiv site the app has been heavily customized to automatically create a personal (private) media folder that allows you to upload, organize, edit and delete files used in your articles. It offers a convenient way for each Member to manage their own media.
Q. Why are some editor toolbar buttons (Insert Image, Insert Video and Source) missing on mobile devices?
A. Some buttons rely on modal (pop-up) windows which currently don’t work well on small screens, so instead of including partially functioning features I chose to remove them.
Q. Do you plan to add the buttons at some point?
A. Certain features become impractical and unwieldy on small screens. If the modal windows can be made to work the way I want then I will certainly consider including them, though I suspect the missing buttons won’t be an issue for most people.
Q. Why does the path to my embedded media contain a long string of alpha-numeric characters?
A. It's a security feature meant to protect the Member's account, not the embedded file. It has no bearing on your article.
Q. Why are all the image thumbnails blank in the file manager window?
A. Probably because you’re using some flavor of privacy browser extension/add-on like Ghostery, AdBlock, Incognito etc. Try white-listing the site or using a custom filter.
Browsers
Q. Why does the site not look and/or work well with older versions of Internet Explorer?
A. Because I never intended it to.
As far as Internet Explorer is concerned only versions 10+ were tested. I wanted to make use of what HTML5, CSS3 and javascript have to offer while avoiding (as much as possible) workarounds [coughs: hacks]. With so many modern and free browser options available for every major OS, I have neither the inclination or patience to support sub-standard browsers. I suspect most people who visit or join QREATiv are using relatively current versions of their preferred browser(s).
Q. Do you plan to support older IE versions at some point in the future?
A. Really?