Van tijd tot tijd ervaart een sector fundamentele veranderingen die het radicaal veranderen. Daarbij komt een explosie van kansen: kansen voor individuen om op te vallen, voor nieuwe producten te verschijnen en voor verschanste bedrijven om te worden vervangen. Nu is zo'n tijd in de webgemeenschap.
Zolang ik me kan herinneren, was de primaire focus in webontwikkeling het zorgen dat websites hetzelfde worden weergegeven in alle browsers. We hebben er alles aan gedaan om ervoor te zorgen dat de website van een klant er precies hetzelfde uitziet in alles, van oude versies van Internet Explorer tot de nieuwste Firefox, allemaal tegelijk.
In de afgelopen paar jaar hebben we steeds meer belangstelling getoond voor wat bekend staat als progressive enhancement, wat de techniek is om geavanceerde functies en stijlen aan te bieden aan moderne browsers, maar niet aan oudere, niet-ondersteunde browsers.
Deze benadering leek zich nooit over de hele linie te schikken. De meeste bureaus proberen nog steeds hun websites universeel te maken. En progressieve verbetering werd vaak beschouwd als een excuus om vervelende problemen te negeren. Het blijkt dat webmensen nogal geslepen zijn en tools hebben ontwikkeld die talloze browserproblemen overwinnen.
Sommige van deze ontwikkelingen hebben geleid tot het begrip 'responsief webdesign'. Als u niet bekend bent met de term, moet u de definitieve kennismaking met A List Apart .
Kort samengevat is de essentie dat u de weergave van een pagina aanpast aan het apparaat van de gebruiker. Voor een tijdje was dit eenvoudig te doen: als de gebruiker op een mobiel apparaat was, werden ze omgeleid naar een aparte minisite. Maar met smartphones en vooral tablets is de lijn vervaagd.
Responsief ontwerp is snel erkend als een ongelooflijk slimme manier om websites te bouwen. Hoe ver je gaat, is aan jou. Maar één ding is zeker: het verandert de branche radicaal en heeft invloed op talloze praktijken en hulpmiddelen die we al jaren gebruiken. Laten we eens kijken naar de impact van deze nieuwe aanpak op enkele van de basishulpmiddelen die we zijn gaan gebruiken en op webontwerp in het algemeen.
Bijna iedereen die op het web werkt, is ooit geconfronteerd met iemand die gelooft dat de tiener van hun vriend hun project aankan. Dit perspectief is altijd vervelend geweest, maar er is wat licht aan het einde van de tunnel. Met een responsief ontwerp werd het allemaal een stuk gecompliceerder. Er is nu een geweldige kans voor webprofessionals om op te vallen tussen de kudde.
Er zijn duizenden webontwerpers en -ontwikkelaars over de hele wereld en we zijn allemaal verbonden door het magische medium waarin we werken. Dit is zowel geweldig als problematisch. Gezien het aantal mensen dat beschikbaar is voor werk, kan opvallen moeilijk zijn.
Er is hier echt een fantastische kans. Als je agressief genoeg bent, kun je opvallen door je staart eraf te werken om snel responsief ontwerp en ontwikkeling te begrijpen. Duik erin en leer het, werk je persoonlijke website bij en praat over je resultaten. Ik garandeer je dat als je een nieuwe portfolio opzet die deze vaardigheden laat zien, mensen geïnteresseerd zijn om met je samen te werken. Maar het venster hiervoor is vrij kort, afhankelijk van hoe snel andere ontwerpers aan boord komen.
Begrotingen vormen een belangrijke hindernis voor deze aanpak. Met een responsief ontwerp moeten we voor elke lay-out maar liefst vier varianten maken, om smartphones, tablets, netbooks en desktops te targeten. Overweeg een standaardwebsite met slechts twee pagina's: een startpagina en een binnenpagina. Die twee indelingen worden acht variaties wanneer u ze implementeert voor vier apparaatgroottes.
Betekent dit dat we vier keer zoveel moeten vragen voor het werk? Dat lijkt nauwelijks waarschijnlijk. Vanzelfsprekend zullen de kosten incrementeel zijn, maar de tijd die nodig is om de lay-outs voor te bereiden en te coderen om correct te functioneren zal zeker toenemen.
Cliëntonderwijs zal een grote rol spelen. We moeten onze klanten helpen te begrijpen dat, terwijl iPads en iPhones cool zijn, deze apparaten de kosten van kwaliteitsontwikkeling opdrijven. Klanten laten begrijpen wat onze kosten zijn, is al moeilijk genoeg.
Als u een plons wilt maken in de community, maakt u een tool die budgetproblemen aanpakt. Velen hebben dit al gedaan, met tools zoals 320 en hoger en de Minder kader . Beide verminderen de tijd die het kost om producten te bouwen en ze helpen ontwikkelaars bij het inkorten van budgetten. Met name 320 en hoger is een perfect voorbeeld van hoe u van deze mogelijkheid kunt profiteren.
Met het veld nu wijd open, zal het introduceren van tools op de markt die het ontwikkelingsproces stroomlijnen ter ondersteuning van responsief ontwerp veel eenvoudiger zijn. We kunnen zelfs hulpmiddelen maken die bestaande repliceren, maar die zijn gericht op responsief ontwerp.
Een van de vele gebieden die ondersteboven gekeerd kunnen worden is de markt voor plug-ins die werken met populaire frameworks zoals jQuery. De markt is gevuld met prachtige plug-ins die een groot aantal dingen in de browser doen: diavoorstellingen, fotogalerijen, formulieren, pop-ups, de lijst gaat maar door.
De kans hier is krankzinnig. Neem een veelvoorkomende plug-in, zoals de gladde slideshow-tool Nivo Slider . Deze geweldige tool bevindt zich in de gereedschapsriemen van talloze ontwikkelaars. De markt is rijp voor iemand om een soortgelijk hulpmiddel te maken dat zichzelf aanpast om soepel te werken op verschillende apparaten met behulp van een responsieve benadering.
Hetzelfde geldt voor bijna elke plug-in. Als u op zoek bent naar een project dat vrijwel garant staat voor succes, kiest u een hot-plug-in en maakt u een responsieve versie die zich aanpast om op verschillende apparaten correct te functioneren.
Hoewel dit artikel meer over het ontwikkelingsproces gaat, laten we het testen van browsers overwegen. Dit is een fundamenteel onderdeel van het bouwen van websites. Iedereen met een knie in het bouwen van een website is waarschijnlijk bezig met het testen van dingen in meerdere browsers. En op een gegeven moment ondergaan de meeste websites een diepgaande test in verschillende browsers.
Maar hoe pakken we dit aan door responsief ontwerp? Moet het team alle populairste apparaten bezitten? Natuurlijk, er zijn emulators, maar de meeste zijn pijnlijk om te installeren en mee te werken. En niets is beter dan testen met het echte werk.
Het installeren van software op computers om schermafbeeldingen te maken op verschillende browsers en platforms is best moeilijk. Maar het instellen van systemen om automatisch screenshots van het steeds groter wordende aantal apparaten te maken, is echt moeilijk. De oplossingen die er zijn, zijn duur en ik moet hier nog een goede service voor vinden.
Dit is een van die situaties waarin complexiteit een voordeel is. Als iemand deze kat kan villen, zou het voor anderen moeilijk zijn om te volgen. Er zijn veel oplossingen voor het maken van geautomatiseerde screenshots in meerdere browsers, maar de eerste persoon die schermafbeeldingen voor apparaten biedt, heeft iets heel unieks om te verkopen. En de gemeenschap zal op een grote manier reageren.
De markt voor ready-to-go-thema's is enorm, maar responsief ontwerp is hier ook een monkey-moersleutel. Sjabloonaanbieders zullen hun ontwerpen waarschijnlijk niet aanpassen om aan deze nieuwe vereisten te voldoen. In plaats daarvan zullen ze waarschijnlijk snel reagerende functies toevoegen aan toekomstige releases. En daarin schuilt de mogelijkheid.
Oude sjablonen zijn niet onbruikbaar gemaakt; ze missen gewoon een belangrijk onderdeel. Hiermee wordt het speelveld een tijdje op niveau gehouden. Als je hebt overwogen om je eigen themavak te starten, is dit een goed moment om dit te doen. Gevestigde bedrijven zullen hun oude sjablonen moeten ondersteunen, en hoewel ze enkele voordelen genieten, is de toetredingsdrempel op de markt net iets lager.
De community is afhankelijk geworden van softwareservices voor zaken als wireframing en usability testing. Maar hoe gaan deze tools met meerdere apparaten om? Veel tools hebben betrekking op usability-testen en sommige nieuwe bieden zelfs mobiele tests aan (zoals YouEye Mobile ), maar ze lossen slechts een deel van het probleem op.
In de wireframing-niche is er een veelgebruikte manier om verschillende paginalay-outs af te handelen, maar ik moet nog een oplossing vinden die een enkele pagina-indeling voor verschillende apparaten verwerkt. De behoefte is zo eenvoudig, maar veel systemen breken gewoon af. Moeten we voor elk apparaat een nieuw draadframe maken? Het antwoord is niet duidelijk.
De markt is rijp voor tools die de huidige aanpak van mensen om online te werken ondersteunen, terwijl ze responsief ontwerp omarmen. Misschien kunt u klanten weg lokken van concurrenten door functies aan te bieden die deze moderne technieken omarmen.
Verandering kan zenuwslopend zijn, zelfs overweldigend. Het maakt niet uit hoeveel je leert, je hebt altijd het gevoel dat je achterblijft. Maar iedereen zit in dezelfde boot. In tijden van grote verandering kun je de kansen maximaliseren door in de eerste golf te duiken en te rijden.
Zie je andere mogelijkheden om te profiteren van de beweging naar responsief ontwerp?