13 Things Developers Forget When Launching Public Websites
14 likes1,516 views
The document outlines 13 essential aspects web developers often overlook when launching public-facing websites, including the use of Google Analytics for traffic tracking, meta tags for social sharing, and proper XML sitemaps for search engines. It emphasizes the importance of responsive design, HTTPS, and image optimization for better user experience and SEO. Additionally, tools like Google Tag Manager and Google Search Console are recommended for effective site management and optimization.
13 Things Developers Forget When Launching Public Websites
- 1. Ready for Launch 13 Things Web Developers Forget When Releasing Public-Facing Websites
- 2. Jeff Julian •Chief Marketing Officer, AJi •Reformed Developer •Founder of Geekswithblogs.net •Former Microsoft XML and SharePoint MVP •@jjulian
- 3. Out-of-the-Box •Not everything you need for delivering amazing experiences comes in the Default Template or your Content Management System •Digital Disruptions require us to be far more proactive in our web technology efforts
- 4. 1. Google Analytics •Yes I still have to mention this one •Website traffic analytics •Very flexible •Most of the time it requires customization beyond basic script embedding
- 6. 2. Google Tag Manager •Online Script Management Tool •No More Calls To Update Your Layouts! •Publish and versioning features •Triggers to add custom pattern responses
- 7. 2. Google Tag Manager •http://www.google.com/tagmanager/
- 8. 3. Social Meta Tags / Cards •Used by: Twitter, Pinterest, Facebook, Google+ •Enhances social sharing for the customer to provide more information and media •Fields: Title, Type, URL, Image, Description
- 9. 3. Social Meta Tags / Cards <title>Page Title Around 70 Characters</title> … <!-- Open Graph Facebook --> <!-- https://developers.facebook.com/docs/reference/opengraph --> <meta property=“og:title” content=“…” /> <meta property=“og:type” content=“article, profile, video.other, etc” /> <meta property=“og:url” content=“Primary URL” /> <meta property=“og:image” content=“URL for Representative Image” /> <meta property=“og:description” content=“Sharable Description” />
- 10. 3. Social Meta Tags / Cards <title>Page Title Around 70 Characters</title> … <!-- Twitter Card --> <!-- https://dev.twitter.com/cards --> <meta property=“twitter:card” content=“summary” /> <meta property=“twitter:title” content=“Page Title” /> <meta property=“twitter:site” content=“@Publisher” /> <meta property=“twitter:creator” content=“@Author” /> <meta property=“twitter:image” content=“URL for Sharable Image” /> <meta property=“twitter:description” content=“Sharable Description” />
- 11. 4. Meta Descriptions •Used by engine below the title to describe the page •You can define or let the engine decide… •Should be flexible for Content Developers to customize •Should be Unique on every page like the Title
- 12. 5. XML Sitemaps •Stop making the GoogleBot guess •An XML Feed of Every URL You would like to have crawled by an engine •URL, Last Updated Date, Change Frequency, and Priority •Typically hosted at: https://xyz.com/sitemap.xml
- 13. 5. XML Sitemap <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <url> <loc>https://ajisoftware.com</loc> <lastmod>2015-04-15T18:36:17+00:00</lastmod> <changefreq>weekly</changefreq> <priority>0.75</priority> </url> … </urlset>
- 14. 6. ROBOTS.txt •One of the oldest ways to communicate with search engines •Simple text file in the root directory •List of User-Agents that are acceptable •Pages/Directories ok to crawl or should ignore •New(ish) – List of sitemaps
- 15. 6. ROBOTS.txt User-agents: * Disallow: /admin Sitemap: https://xyz.com/sitemap.xml
- 16. 7. Responsive Websites •Make Sure It Looks Good on Mobile Platforms •Mobile Search continues to grow (> 25% Traffic) •Google Change Mobile Search Algorithm to Boost Sites that are Mobile-Ready!
- 17. 7. Responsive Websites •Responsive Frameworks •Bootstrap - http://getbootstrap.com •Foundation - http://foundation.zurb.com/ •Skeleton - http://www.getskeleton.com/ •… •Don’t Build Your Own
- 18. 8. Minified CSS/JavaScript •Seconds are Critical in Web Traffic •Minified (Remove Whitespaces, Comments, and Returns) assets will allow the browser to download and load quickly •ASP.NET Bundling and Minification
- 19. 9. Use of HTTPS as Primary •Google measures HTTPS as a ranking signal as of August 2014 •2048-bit key certificates •Consider a Wildcard Certificate •Update your Sitemap XML and Robots.txt
- 20. 10. Rel=“canonical” •Duplicate content can cause negative effects on Search Engine Optimization (SEO) •More than one path into your content can be seen as duplicate •This tag shows the search engines which URL is primary for the content.
- 21. 10. Rel=“canonical” <head> <title>Unique Page Title</title> … <link rel=“canonical” href=“Primary Url” /> … </head>
- 22. 11. Image Formats and Sizes •Do not publish large Hi-Res images unless you have to or have a specific application •Mobile devices have usage caps that cause higher cost or lower speeds
- 23. 11. Image Formats and Sizes •Rules to live by: •PNG for images with limited colors or transparency •JPG for photographs or a larger array of colors •GIF is you need animation •BMP if you are just a jerk •Consider loading smaller images for mobile resolutions
- 24. 12. Fully-Qualified URLs •Query strings are so 1990s •Using fully-qualified URLs over a single page with parameters will give you better link sharing and SEO opportunities •Ensure each page has a unique Page Title and Meta Description
- 25. 12. Fully-Qualified URLs •DON’T do this: http://xyz.com/search.aspx?c=cars •Page Title: “Corporate Search” •Meta Description: “Search Results Page” •DO this instead: http://xyz.com/search/cars •Page Title: “Car Search Specific Title with Keywords” •Meta Description: “Looking for a new car? …”
- 26. 13. Google Search Console •Formerly Google Webmaster Tools •Tools for Website Optimization and Review •Previous tips will be “green lighted” here •Use monthly to ensure your still following the best practices
- 27. 13. Google Search Console •Tools •Sitemap Tester •Mobile Usability •HTML Improvements •Site links •Search Queries!! •Crawl Errors and Stats •ROBOTS.txt Tester •Security Issues •Page Speed Test