When designing responsive sites for customers, it would be nice to see what others have done, what works and what is ill-advised. I'd love to be able to search for similar sites that are responsive, but can find very few, usually none. The only option I know of is to google and then visit every site, checking to see if they're responsive.
I read not too long ago that Google was going to start putting a tag next to mobile-friendly sites in their listings. Did that ever happen? I'm not seeing it. That would be VERY handy.
If I search for something like "responsive websites", I'll get compiled lists of the best responsive websites out there. These are either incredibly artistic, or technological marvels, neither of which I'm looking for. I'm interested in sites that are more run-of-the-mill. Completely functional and responsive, but not awe-inspiring.
have you checked this:
collection of pages and theems {simple and complex too}
Yes, the Mobile-friendly tag is implemented but you can only see it on mobile devices.
Alternatively you can open the dev tools in Chrome and simulate a mobile device, which will also make Google show the tag.
Related
I am currently creating a basic website for a small sports-association. It is simply used to display some basic information about training times, becoming a member, locations, history, etc...
However, we would also like the option to add news and upcoming special events. I am making the website in HTML, but this is much too complex for the other volunteers. I was wondering if I could embed some service into the website where they can easily add some small news articles without diving into html.
I myself was first thinking of using some simple blog-service (like notion.so, blogger.com) and embedding this using an IFrame. However, most websites have a protection against being used as a frame.
I would like at some point that they do not rely on me for basic updates. Is there a way to implement this option? Or should we fall back on something like google sites?
It really depends on the company. I suggest asking them if they would like to add content first, and if they say no, I think thats copyright.
I suggest not using google sites because the viewers of the website can always scroll dow and find out this is through Google Sites. In my opinion that doesn't seem as professional.
My answer is to teach them the basics. It isn't that hard to teach them that the text goes inside and a header is through
I now found out it is possible to embed a blogger.com page in an iFrame, so this is a solution for now.
I'd like to use HTML5 and CSS3 to make a magazine like asidemag.com but how can I enable the horizontal scrolling like that?
You may want to begin considering how people define the sideways swiping, an important first step in how these things get put together. Horizontal scrolling is not really something that is 'enabled', but an integral part of the magazine that is 'built'. You can contact them to find out how they did it, should you like.
Your steps are to read the touch events of the user, understand how they are working (direction) and then how the visible items on the web page are handled to integrate the swiping behaviour. This will depend on your proficiency with javascript, css and html5, and willingness to build the system itself.
I have been working on an engine for this, but the asidemag.com concept handles the data differently from mine. They use ajax to load each page as needed, which allows for a larger magazine, and mine just loaded an entire web page and 'built' it to read like a magazine. Theirs only works on the iPad, and mine works on most devices, including ie7.
How much effort do you want to invest in building a magazine? You can contact asidemag to find out how to do it on their system if you want it easier, or you can poke around on the net to find out how to do it yourself if you have more time to devote to it.
Check out treesaverjs.com it's a framework for creating magazine style web sites.
A design is a very important part of a web site. But making a layout cross browser compatible is very tough task.
What is the easiest way for this?
You may want to read about browser inconsistencies if you have a reason to be concerned. Other than that, I would not assume you have a problem unless you observe your pages being rendered differently across browsers. You should follow ANeves' advice and design in a browser other than IE and then test your pages as you develop.
You can use the tools located here in an article entitled "Cross-Browser Testing: A Detailed Review Of Tools And Services" to test that your pages in fact function correctly in different browsers.
The way I do it is by writing it and testing in Firefox, and each change I make I run it in IE. A lot of the times it will be different, but if you keep the changes small and isolate them then each one should be work-aroundable.
After it is completed, I check it in Safari and Chrome, and 99% of the time it's fine.
Also try to avoid tables if you can, learn to use CSS properly and it will save you a lot of time in the future.
I actually think it´s not that big of a problem. A very good starting point: CSS Mastery
Don't recrate the wheel. Try finding a website example that works in all browsers and check out it's code. It might help you out a lot.
For instance, if you want to develop just a layout (header, footer, sidebars, content, containers, menus and things like this)...I sincerely suggest you try different options available online.
For example:
http://matthewjamestaylor.com/blog/ultimate-3-column-holy-grail-pixels.htm
http://layouts.ironmyers.com/
You can find a lot of help for this online. That's only for a LAYOUT. I'm not sure about Visual Effects, I have to fight with each design every time I create a new one.
What works for me is to re-use the things that have worked for me in the past.
This question already has answers here:
Closed 13 years ago.
Possible Duplicate:
Does it make sense to use the <table> tag on a “modern” website?
Everywhere I go I see don't use table layout, it's evil, even Google says that, so why one of the most visited websites, Google and Twitter, use it for their homepage?
I don't think it is any kind of mistake, or any other stupid problem.
The only reason I can think of is, that they want the page to look similar even if client doesn't support CSS, like with Lynx.
So why everyone say it is so bad, if the biggest websites on the internet use it.
In my opinion, there are some cases, like those mentioned above, where it is vitaly important to have the same look everywhere, than it is OK to use tables.
edit: The same question goes about html elements like <center>, or formatting text with attribute align and other "html attributes and elements used to substitute CSS functionality"
Page load time is king for these guys, and bandwidth usage is extreme.
I'd have to say they use tables for raw data speed, since they are serving up so much bandwidth every day.
Also, notice that they use inline styles in the page header to reduce the number of HTTP requests to help speed up page load time.
Table layout gets more grief than it deserves. It's easy for developers to use, it's consistent across nearly every web browser, and it allows you to easily add rows/columns with little to no effort.
The only downside is that it goes against the mantra that your document should only contain content, and your design should be contained separately (in a CSS file).
Google doesn't have to care about ranking high in search engines... ;)
Yep, agreed. Sometimes, just sometimes tables are just fine. Not everyone is writing websites that are targeted at every possible browser, that needs to support text to speech etc. In general, try to learn and grow your skills and use CSS positioning etc, but nothing bad will happen if someone uses a table to position things on a webpage.
Maybe this question should be community wiki, though?
It's evil, it's a pain, but rendering is pretty much guaranteed to be consistent across different browsers.
Table layout is working on most browsers. Google and others want to reach all user, not some or only modern users. Having different layouts or layout technologies is hard to maintain and costly in delivering content.
Table layout is not tricky. Its straight forward. You dont have to look for css hacks, browser incompatibilities or others.
Table layouts are bad. Because thy mix layout and content.
Twitter works pretty well from phones in web mode. Some web browsers are truly gruesome, so I assume Twitter does what it has to.
Given how poorly so many web sites work on phones, I'm more concerned about mobile compatibility than with the concerns of CSS evangelicals.
Three main reasons:
Tables are mainly bad for search engine reasons (there's also the issue of them messing up the DOM a bit, but that's not too bad). People don't search for Google on search engines, and people don't search for Twitter posts on generally either.
Tables render consistently on nearly every browser, including smartphones (which is a big concern for Twitter especially).
Tables consume less bandwidth. Both sites have immense data loads and need every bit of speed they can get.
Browser Support - These guys need to have their websites render perfectly on ALL web browsers (New, Old and Obscure). No matter who's using their websites and what OS/Browser their using, these websites need to work.
Each web browser supports it's own implementation of CSS and this causes a similar issue to that of the JavaScript DOM support in various browsers.
Page Load Time - Also their pages are optimized for Page load times. If it takes a user too long to load the page they'll just go somewhere else. There are still plenty of users without broadband, even a lot of mobile devices don't have very fast connections depending on where you are.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
My website will be basically selling services; will my SEO ranking still be affected if I embed the Flash site in a blank html page? I am at that critical point where I am ready to upload the site but I am just having second thoughts about the ease of doing business with Flash.
Ignoring the SEO implications of an all-Flash site, unless you're building games, or I have an extremely strong desire to buy what you're selling, I will turn back immediately if I find a website built entirely out of Flash.
Nothing against your programming skill; I just have rarely seen such a site give me what I want. The name is often apropos.
Search engine crawlers can't crawl flash sites, so your SEO rankings will be based off the non-flash part (the blank html page). Personally, I also don't really like the user experience of a flash-only site.
Google and Yahoo! have added flash crawling functionality to their engines recently.
http://www.adobe.com/devnet/flashplayer/articles/swf_searchability.html
From a SEO perspective you're fine on that front. Still..your page will need a DOC TYPE, Page Title, etc to remain SEO compliant.
IF your target market is users browsing your site from a laptop or desktop you should be fine. You may want to include a flash-free option for users accessing your site on a mobile phone or with javascript/flash disabled.
For example, You can run a browser sniffer to redirect any user agents accessing the page on Safari via an iPhone OS.
Other than that Flash does offer some nice flair to a site. If you can give alternatives to users that don't like the application then I say do it.
It can certainly be done well. I've seen some pretty cool Flash-powered stuff being run by some pretty big-name companies, do a search for HP's Photosmart page for instance.
Look: there's a lot of information out there about Flash and SEO, and much of it is out of date. Google rolled out "official" flash support about a year ago, and they've been refining it ever since. Google will index your Flash site, but exactly what gets indexed is a bit of a black box so it always helps to have HTML alt-copy.
Never, ever build a full-flash website without using SWFObject for embeds and always try to use SWFAddress to enable Flash Deep-linking. There are ways to make this work and work well - a lot of people don't know that and have a deep-seated hatred of all things Flash because they were irritated by Splash pages in 2002. There's nothing to be done about them.
But if you want to use Flash, go for it - just do a lot of homework and test your work.
Whether or not it's business suicide depends on how much of your revenue is dependent on getting referrals from search engines. Your search engine ranking will certainly be affected if you have an HTML page in which you simply embed some flash.
Could you implement an alternative more static site, by scraping the main content from your flash?
all web applications should be made from the point of view of accessibility, no matter what the scripting language used at the time. If you use a nice script like SWFObject then you can populate your page with "alternative content" to the flash page which the search engines will crawl. this will also allow any browser that doesnt have flash to have a look at the website, even if you dont make the whole thing as "pretty" in HTML.
two birds as they say.
I don't know whether you've considered this or not, or whether it applies to your circumstances, but you might lose out on business from the visually impaired. Unless I'm mistaken, I don't think there are any screen readers that operate on Flash.
I think it depends on what kind of business we are talking about.
For most, I would say don't do it!
But there are ome kinds of sites where I think it is appropriate, if done very well. For example if you are in the business of art or design, or are showcasing a product/service where art or design is key.
As an example:
Volkswagon's GTI Project (a large part of what cars are about is design)
Flash has fallen out of favour the last few years with a lot of people. Initially it was because search engines didn't crawl it but these days it's mainly because 'flashy' effects can be done with javascript engines like jquery, scriptaculous or mootools.
Having said that I can tell you that nearly every business customer I go to still wants flash on their site and most casual web users don't give two hoots what a site is built like as long as it works, is fast (something kinda tricky to do with flash) and is what they want to look at.
I say go for it and see how the site does! I'm sure if you use analytics for a few weeks you will know whether your site is doing well or not.
Best of luck with it :)
For some reason Motorola made their new Droid site all in Flash.
This is a good article about how dreadful it is, and the drawbacks:
newmedia article
There are a ton of good reasons to use Flash sparingly. It's good for what it does well and dreadful for entire sites.
Ok so first of all, perspective, my primary domain is Flash and system architecture, I and the company that I work for at present are all about creating online 'digital experiences', engaging online content.
This is NOT applicable to selling services, e-commerce, and general information based sites, as much as it pains me to say that. There is current a massive backlash against flash due to the arrival of javascript effects and the canvas tag, I'm going to be bold here and say that anyone who thinks they can replace x years of plugin development and and media experience by giving html/javascript devs a div they can draw into are simply misguided (and you can show me all the chrome experiments you want but its still not going to be pixel bender or native 3D support).
So with that said, in this climate you've got to play to each formats strengths, you want slick, stylised SEO'd content that is accessible and concise, html with progressively enhanced javascript is a no brainer. You want a web app that people can use easily, search and build a micro-community around then googles GWT (other js frameworks are available) is the way to go. For everything in-between and beyond theres Flash.
I'm not giving Flash a kicking (it's my lively-hood after all), far from it, in fact I'm actively encouraging people to use Flash only for the kind a digital master-pieces it was made for, if you can do it in HTML, why would you do it in Flash? Sure in most cases it actually works out lighter than JS, and it's cross-browser compatible, but these are small issues that will only be ironed out in time, HTML was designed for the web, Flash was designed as a plugin.
In coming years we will see Flash on a multitude of devices with the open-screen project and the iphone-flash cross compiling, it is becoming a platform for multimedia development in general, where-as the web is becoming more service orientated platform, web apps running off searchable indexed content in the cloud. If your website is intended for the web, then make it for the web.
(Just realised that this was a bit of a rant, apologies)
If you created a web site with Flash, user will not be able to use basic browser functions and extensions such as searching, spell checking, sharing a particular page via Twitter, etc.... (And cannot access from iPhone.)
Depends on the site in question. If its just displaying marketing collateral or case-studies then a "flashy display" would be fine. Have seen couple of such websites in the past and the better ones have impressed me.
You should also consider how frequently content would change and how it impacts your design in Flash vs say design in html. The search engine ranking aspect also will matter.
You won't get any business from me.
Nothing says 'amateur' on the web like pointless Flash.