Web widget to allow users to tag faces in photos? - web

I've been developing a website for my high school class to generate interest in our 50th reunion in 2025. Yeah, I'm older, but hey I'm still in the game! More than half of our alumni hate Facebook, so sharing photos and info on classmates with them necessitates building a website that allows basically the same functionality.
I have a few sections of the website that are basically image sliders to pull "Back in the Day" photos from a MySQL database I setup with hundreds of collected photos and allow users to comment on them. I have been toying with the idea of giving the user the ability to tag faces in those old photos (like Facebook). I've done some preliminary searches for web widgets that allow people browsing the site to tag the photos and have not found anything yet that pans out. Even the ability for me to manually tag the photos and push those into the database would be great, as long as the browsing user can hover over a face in the photo and see the tag,
Anyone know of a website widget that gives the web developer or the web browsing user the ability to face tag photos? Thanks in advance for sharing!
Alan-Seattle

Related

How could I add my web browser game to Adsense?

I tried to add my recently published web browser game to adsense. However, they rejected it and replied with needs attention, your site doesn't have any content.
How can I make it approved by adsense? Because it is a web browser game, it is quite normal that there is no content like blogs
Is there any alternative way to make my site publish any advertising by adsense, or any alternative for adsense that can allow web browser games?
Hey AdSense is for Unique and Informative text content. In online game nothing unique or text. So I will suggest you to create app and use AdMob or try AdX.

Removed Thirtdparty webvitals issue

I checked the pageinsights of "http://www.briddles.com/riddle/9-bodmas?l=333"
Most of these are thirdparty. How can i sove it ?
I see 3 important groups there:
Youtube
Google Ads or analytics
Facebook
Here is what I would do:
I see the youtube player is hidden by default, I would reserve some space for the player (maybe with a lightweight placeholder) and only append the iframe when the user clicks "view answer". This lite-youtube web component is awesome and might help you out. Trust me.
Normally Google ads is not something you want to get rid of. I would just make sure to load these scripts with the async attribute at least.
For the facebook comments I imagine 3 approaches:
3.1. Render a placeholder with a button saying "See comments" or something like that and only fetch the scripts when the user press that button.
3.2. Use the Intersection Observer API so when comments section scroll into view, fetch de scripts and render. (You will have to reserve some space to avoid CLS).
3.3. Remove the comments section (if there is almost no usage) or use a different provider that is optimized for web vitals. I don't know which one, but it's still an option.
Extra recommendations:
The main image is too heavy for mobile users, try to use a responsive image, compress the image and choose a lighter format like webp for browsers that support it. More info about image optimization here.
Reduce the amount of fonts you use and, if possible, host it by yourself and use a CDN. Google fonts is practical but to host your fonts is better for performance.

Social sharing for specific assets

I am developing an analytical app using NodeJS and Express and I would like to give the user the option to share the currently filtered graph along with a title and a sample description. I would like to have an option to share to Facebook, Twitter and Google +. I have done some research and I have managed to find a few libraries that were supposed to suite me. One of which was social-share (https://www.npmjs.com/package/social-share). The problem with this library is that I was unable to upload images to Facebook or Twitter, as well as the missing Google+ option.
The other library I have found is twit (https://github.com/ttezel/twit) which I still have not tried but either way it is for Twitter only.
After some time of trying to find a trivial solution, I started looking into the "build my own" option. I registered my app in the Facebook Developers console. I followed all the steps there to setup the SDK and the smple share code. The problem there was that the URL I wanted to share (http://127.0.0.1:3000/ or localhost at my case) was not "in the allowed domains for the application". I have tried a number if solutions for this error but none seemed to work. I have creadet a "Test app" under the original app in Facebook Dev Console. I have also tried creating an entirely new application for purely development purposes. (Note: in both previously stated caces I have switched the app ids obviously). I also tried the settings options for "Add platform" with "localhost" as the site URL. I have tried adding it as allowed domains and other options but I could not seem to get it to work.
What I also tried was the "Add This" option to share, leveraging the meta og: tags for image. The content is dynamically generated so I figured I should update the contents of the meta tags dynamically as well (using jQuery in my case). The problem I see there is the following: Facebook scrapes the page periodically and therefore the dynamic content from the og: tags is not fetched. Also the share button always used the information scraped from the url that I tried to share.
So after all this my questions are: Is there a trivial way in which I can have simple share buttons which the user can share the currently visible content (Highcharts graph) along with a title and text (prefilled by the app)? Is this supported for Facebook, Twitter and Google +?
Thank you in advance!

How to create a Mobile Website

I'm working on a project for class. To create a website and a website for mobile users. The site is to recongize the type of device/browser accessing the page and send the appropiate form. So if I was to visit the site on IE8 it will direct me to the mainpage for IE8, if I was to access the site with a mobile device it will direct me to the mobile website main page automatically.
Also, I need to design the website for at least two different screen sizes.
I'm coding in HTML5, I do not know the type of server the site will be hosted on. The use of Javascript is extra credited. The project details are to "design a small mobile web site. The web site should be tested on one or more mobile devices. The iPod Touch device will be used as the base for testing."
I know how to do 8/10 of the requirements (except the two mentioned). I looked at W3C and didn't find anything.
Any help would be much appreciated. Thank you!
Do a Google for:
CSS Browser Detection
JavaScript Browser Detection
Also you should think twice about creating multiple sites - with basically the same content - or creating proper stylesheets that are referred from the same site.
Hope that get's you the other 2 requirements
NOTE: Since this is homework I won't post any links...
I suspect that ServerFault isn't the best place for this question...but aside from that, your question is a little vague. A google search for "designing a mobile website" turns up what looks to be several pages of relevant information. If you first try working with the information in those documents and then come back with specific questions (e.g., "I tried this and it behaved this way instead of the way I expected") you're apt to get better answers.

Google Earth Questions: Making Outside Pages Appear in Google Earth and A Button That Follows

Good morning, eveyrone
I'm working on an application using Google Earth and I had two questions.
The first question involves the pop up window. I want to get an external website to appear in this bubble. I can either hardcode the website into the description of the placemark or use an iFrame. Are there any other options I can use to get a website into Google Earth?
Second question: I want to ensure that the user, at all times while using my kml, has access to certain buttons. Is there a way without querying web application every few seconds to ensure that the button remains available to the user?
Thank you for your time.
The answer to you first question is no - other than loading the html directly or using an IFRAME there is no way to display markup in the content balloons.
I am not sure what you mean in you second question, are you developing a web-based application using the Google Earth Plugin - or a kml layer for use in the google earth application. Either way you should not have to query anything to make sure a button is visible.

Resources